Skip to content

Commit

Permalink
[7.x] Bump storybook dependencies (#50752) (#50853)
Browse files Browse the repository at this point in the history
  • Loading branch information
@patrykkopycinski
patrykkopycinski authored Nov 19, 2019
1 parent 6b4fa1b commit 8d58185
Show file tree
Hide file tree
Showing 8 changed files with 778 additions and 516 deletions.
1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -323,6 +323,7 @@
"@types/pngjs": "^3.3.2",
"@types/podium": "^1.0.0",
"@types/prop-types": "^15.5.3",
"@types/reach__router": "^1.2.6",
"@types/react": "^16.8.0",
"@types/react-dom": "^16.8.0",
"@types/react-redux": "^6.0.6",
Expand Down
1 change: 0 additions & 1 deletion x-pack/legacy/plugins/canvas/.storybook/addons.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@
* you may not use this file except in compliance with the Elastic License.
*/

import '@storybook/addon-options/register';
import '@storybook/addon-actions/register';
import '@storybook/addon-knobs/register';
import '@storybook/addon-console';
2 changes: 0 additions & 2 deletions x-pack/legacy/plugins/canvas/.storybook/webpack.dll.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,6 @@ module.exports = {
'@storybook/addon-knobs',
'@storybook/addon-knobs/react',
'@storybook/addon-knobs/register',
'@storybook/addon-options',
'@storybook/addon-options/register',
'@storybook/core',
'@storybook/core/dist/server/common/polyfills.js',
'@storybook/react',
Expand Down
70 changes: 38 additions & 32 deletions x-pack/legacy/plugins/canvas/public/components/color_dot/__examples__/color_dot.examples.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,35 +10,41 @@ import { ColorDot } from '../color_dot';

storiesOf('components/Color/ColorDot', module)
.addParameters({ info: { propTablesExclude: [EuiIcon] } })
.add('color dots', () => [
<ColorDot key="1" value="white" />,
<ColorDot key="2" value="#000" />,
<ColorDot key="3" value="#abcd" />,
<ColorDot key="4" value="#aabbcc" />,
<ColorDot key="5" value="#aabbccdd" />,
<ColorDot key="6" value="rgb(100, 150, 250)" />,
<ColorDot key="7" value="rgba(100, 150, 250, .5)" />,
])
.add('invalid dots', () => [
<ColorDot key="1" value="elastic" />,
<ColorDot key="2" value="#xyz" />,
<ColorDot key="3" value="#ghij" />,
<ColorDot key="4" value="#canvas" />,
<ColorDot key="5" value="#12345xyz" />,
<ColorDot key="6" value="rgb(a,b,c)" />,
<ColorDot key="7" value="rgba(w,x,y,z)" />,
])
.add('color dots with children', () => [
<ColorDot key="1" value="#FFF">
<EuiIcon type="plusInCircle" color="#000" />
</ColorDot>,
<ColorDot key="2" value="#666">
<EuiIcon type="minusInCircle" color="#fff" />
</ColorDot>,
<ColorDot key="3" value="rgba(100, 150, 250, .5)">
<EuiIcon type="alert" color="#fff" />
</ColorDot>,
<ColorDot key="4" value="#000">
<EuiIcon type="check" color="#fff" />
</ColorDot>,
]);
.add('color dots', () => (
<>
<ColorDot key="1" value="white" />
<ColorDot key="2" value="#000" />
<ColorDot key="3" value="#abcd" />
<ColorDot key="4" value="#aabbcc" />
<ColorDot key="5" value="#aabbccdd" />
<ColorDot key="6" value="rgb(100, 150, 250)" />
<ColorDot key="7" value="rgba(100, 150, 250, .5)" />
</>
))
.add('invalid dots', () => (
<>
<ColorDot key="1" value="elastic" />
<ColorDot key="2" value="#xyz" />
<ColorDot key="3" value="#ghij" />
<ColorDot key="4" value="#canvas" />
<ColorDot key="5" value="#12345xyz" />
<ColorDot key="6" value="rgb(a,b,c)" />
<ColorDot key="7" value="rgba(w,x,y,z)" />
</>
))
.add('color dots with children', () => (
<>
<ColorDot key="1" value="#FFF">
<EuiIcon type="plusInCircle" color="#000" />
</ColorDot>
<ColorDot key="2" value="#666">
<EuiIcon type="minusInCircle" color="#fff" />
</ColorDot>
<ColorDot key="3" value="rgba(100, 150, 250, .5)">
<EuiIcon type="alert" color="#fff" />
</ColorDot>
<ColorDot key="4" value="#000">
<EuiIcon type="check" color="#fff" />
</ColorDot>
</>
));
90 changes: 48 additions & 42 deletions ...cy/plugins/canvas/public/components/color_manager/__examples__/color_manager.examples.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,48 +57,54 @@ storiesOf('components/Color/ColorManager', module)
},
},
})
.add('default', () => [
<ColorManager key="1" onChange={action('onChange')} value="blue" />,
<ColorManager key="2" onChange={action('onChange')} value="#abc" />,
<ColorManager key="3" onChange={action('onChange')} value="#abcd" />,
<ColorManager key="4" onChange={action('onChange')} value="#abcdef" />,
<ColorManager key="5" onChange={action('onChange')} value="#aabbccdd" />,
<ColorManager key="6" onChange={action('onChange')} value="rgb(50, 100, 150)" />,
<ColorManager key="7" onChange={action('onChange')} value="rgba(50, 100, 150, .5)" />,
])
.add('invalid colors', () => [
<ColorManager key="1" onChange={action('onChange')} value="elastic" />,
<ColorManager key="2" onChange={action('onChange')} value="#xyz" />,
<ColorManager key="3" onChange={action('onChange')} value="#ghij" />,
<ColorManager key="4" onChange={action('onChange')} value="#canvas" />,
<ColorManager key="5" onChange={action('onChange')} value="#12345xyz" />,
<ColorManager key="6" onChange={action('onChange')} value="rgb(a,b,c)" />,
<ColorManager key="7" onChange={action('onChange')} value="rgba(w,x,y,z)" />,
])
.add('with buttons', () => [
<ColorManager
hasButtons={true}
key="1"
onAddColor={action('onAddColor')}
onChange={action('onChange')}
value="#abcdef"
/>,
<ColorManager
hasButtons={true}
key="2"
onChange={action('onChange')}
onRemoveColor={action('onRemoveColor')}
value="#abcdef"
/>,
<ColorManager
hasButtons={true}
key="3"
onAddColor={action('onAddColor')}
onChange={action('onChange')}
onRemoveColor={action('onRemoveColor')}
value="#abcdef"
/>,
])
.add('default', () => (
<>
<ColorManager key="1" onChange={action('onChange')} value="blue" />
<ColorManager key="2" onChange={action('onChange')} value="#abc" />
<ColorManager key="3" onChange={action('onChange')} value="#abcd" />
<ColorManager key="4" onChange={action('onChange')} value="#abcdef" />
<ColorManager key="5" onChange={action('onChange')} value="#aabbccdd" />
<ColorManager key="6" onChange={action('onChange')} value="rgb(50, 100, 150)" />
<ColorManager key="7" onChange={action('onChange')} value="rgba(50, 100, 150, .5)" />
</>
))
.add('invalid colors', () => (
<>
<ColorManager key="1" onChange={action('onChange')} value="elastic" />
<ColorManager key="2" onChange={action('onChange')} value="#xyz" />
<ColorManager key="3" onChange={action('onChange')} value="#ghij" />
<ColorManager key="4" onChange={action('onChange')} value="#canvas" />
<ColorManager key="5" onChange={action('onChange')} value="#12345xyz" />
<ColorManager key="6" onChange={action('onChange')} value="rgb(a,b,c)" />
<ColorManager key="7" onChange={action('onChange')} value="rgba(w,x,y,z)" />
</>
))
.add('with buttons', () => (
<>
<ColorManager
hasButtons={true}
key="1"
onAddColor={action('onAddColor')}
onChange={action('onChange')}
value="#abcdef"
/>
<ColorManager
hasButtons={true}
key="2"
onChange={action('onChange')}
onRemoveColor={action('onRemoveColor')}
value="#abcdef"
/>
<ColorManager
hasButtons={true}
key="3"
onAddColor={action('onAddColor')}
onChange={action('onChange')}
onRemoveColor={action('onRemoveColor')}
value="#abcdef"
/>
</>
))
.add('interactive', () => <Interactive />, {
info: {
inline: true,
Expand Down
20 changes: 12 additions & 8 deletions ...cy/plugins/canvas/public/components/color_palette/__examples__/color_palette.examples.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,14 +29,18 @@ class Interactive extends React.Component<{}, { value: string }> {
}

storiesOf('components/Color/ColorPalette', module)
.add('three colors', () => [
<ColorPalette key="1" onChange={action('onChange')} colors={THREE_COLORS} />,
<ColorPalette key="2" value="#fff" onChange={action('onChange')} colors={THREE_COLORS} />,
])
.add('six colors', () => [
<ColorPalette key="1" onChange={action('onChange')} colors={SIX_COLORS} />,
<ColorPalette key="2" value="#fff" onChange={action('onChange')} colors={SIX_COLORS} />,
])
.add('three colors', () => (
<>
<ColorPalette key="1" onChange={action('onChange')} colors={THREE_COLORS} />
<ColorPalette key="2" value="#fff" onChange={action('onChange')} colors={THREE_COLORS} />
</>
))
.add('six colors', () => (
<>
<ColorPalette key="1" onChange={action('onChange')} colors={SIX_COLORS} />
<ColorPalette key="2" value="#fff" onChange={action('onChange')} colors={SIX_COLORS} />
</>
))
.add('six colors, wrap at 4', () => (
<ColorPalette value="#fff" onChange={action('onChange')} colors={SIX_COLORS} colorsPerRow={4} />
))
Expand Down
19 changes: 7 additions & 12 deletions x-pack/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,15 +35,14 @@
"@kbn/pm": "1.0.0",
"@kbn/test": "1.0.0",
"@kbn/utility-types": "1.0.0",
"@mattapperson/slapshot": "1.2.3",
"@storybook/addon-actions": "^5.1.11",
"@mattapperson/slapshot": "1.4.0",
"@storybook/addon-actions": "^5.2.6",
"@storybook/addon-console": "^1.2.1",
"@storybook/addon-info": "^5.1.11",
"@storybook/addon-knobs": "^5.1.11",
"@storybook/addon-options": "^5.1.11",
"@storybook/addon-storyshots": "^5.1.11",
"@storybook/react": "^5.1.11",
"@storybook/theming": "^5.1.11",
"@storybook/addon-info": "^5.2.6",
"@storybook/addon-knobs": "^5.2.6",
"@storybook/addon-storyshots": "^5.2.6",
"@storybook/react": "^5.2.6",
"@storybook/theming": "^5.2.6",
"@types/angular": "^1.6.56",
"@types/archiver": "^3.0.0",
"@types/base64-js": "^1.2.5",
Expand Down Expand Up @@ -99,10 +98,6 @@
"@types/reduce-reducers": "^0.3.0",
"@types/redux-actions": "^2.2.1",
"@types/sinon": "^7.0.13",
"@types/storybook__addon-actions": "^3.4.3",
"@types/storybook__addon-info": "^4.1.2",
"@types/storybook__addon-knobs": "^5.0.3",
"@types/storybook__react": "^4.0.2",
"@types/styled-components": "^3.0.2",
"@types/supertest": "^2.0.5",
"@types/tar-fs": "^1.16.1",
Expand Down
Loading

0 comments on commit 8d58185

Please sign in to comment.