@storybook/components 6.4.18 → 6.4.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (16) hide show
  1. package/dist/cjs/blocks/ArgsTable/ArgValue.js +1 -1
  2. package/dist/cjs/blocks/ArgsTable/SectionRow.js +1 -1
  3. package/dist/cjs/blocks/DocsPageExampleCaption.md +6 -6
  4. package/dist/cjs/blocks/DocsPageExampleCaption.mdx +6 -6
  5. package/dist/cjs/controls/Date.js +5 -1
  6. package/dist/esm/blocks/ArgsTable/ArgValue.js +1 -1
  7. package/dist/esm/blocks/ArgsTable/SectionRow.js +1 -1
  8. package/dist/esm/blocks/DocsPageExampleCaption.md +6 -6
  9. package/dist/esm/blocks/DocsPageExampleCaption.mdx +6 -6
  10. package/dist/esm/controls/Date.js +5 -1
  11. package/dist/modern/blocks/ArgsTable/ArgValue.js +1 -1
  12. package/dist/modern/blocks/ArgsTable/SectionRow.js +1 -1
  13. package/dist/modern/blocks/DocsPageExampleCaption.md +6 -6
  14. package/dist/modern/blocks/DocsPageExampleCaption.mdx +6 -6
  15. package/dist/modern/controls/Date.js +5 -1
  16. package/package.json +4 -4
package/dist/cjs/blocks/ArgsTable/ArgValue.js CHANGED
@@ -156,7 +156,7 @@ var Detail = _theming.styled.div(function (_ref5) {
156
156
  minWidth: 200,
157
157
  maxWidth: 800,
158
158
  padding: 15,
159
- // Dont remove the mono fontFamily here even if it seem useless, this is used by the browser to calculate the length of a "ch" unit.
159
+ // Don't remove the mono fontFamily here even if it seems useless, this is used by the browser to calculate the length of a "ch" unit.
160
160
  fontFamily: theme.typography.fonts.mono,
161
161
  fontSize: theme.typography.size.s1,
162
162
  // Most custom stylesheet will reset the box-sizing to "border-box" and will break the tooltip.
package/dist/cjs/blocks/ArgsTable/SectionRow.js CHANGED
@@ -167,7 +167,7 @@ var SectionRow = function SectionRow(_ref7) {
167
167
  var itemCount = (children === null || children === void 0 ? void 0 : children.length) || 0;
168
168
  var caption = level === 'subsection' ? "".concat(itemCount, " item").concat(itemCount !== 1 ? 's' : '') : '';
169
169
  var icon = expanded ? 'arrowdown' : 'arrowright';
170
- var helperText = "".concat(expanded ? 'Hide' : 'Side', " ").concat(level === 'subsection' ? itemCount : label, " item").concat(itemCount !== 1 ? 's' : '');
170
+ var helperText = "".concat(expanded ? 'Hide' : 'Show', " ").concat(level === 'subsection' ? itemCount : label, " item").concat(itemCount !== 1 ? 's' : '');
171
171
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(StyledTr, {
172
172
  title: helperText
173
173
  }, /*#__PURE__*/_react.default.createElement(Level, {
package/dist/cjs/blocks/DocsPageExampleCaption.md CHANGED
@@ -76,12 +76,12 @@ A basic table:
76
76
 
77
77
  Let's throw in a crazy table, because why not?
78
78
 
79
- | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [Mithril](app/mithril) | [HTML](app/html) | [Marko](app/marko) | [Svelte](app/svelte) | [Riot](app/riot) | [Ember](app/ember) | [Preact](app/preact) |
80
- | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------------: | :--------------: | :----------------: | :------------------: | :--------------: | :----------------: | :------------------: |
81
- | [a11y](addons/a11y) | + | | + | + | + | + | + | | | + | + |
82
- | [actions](addons/actions) | + | + | + | + | + | + | + | + | + | + | + |
83
- | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + | + | + | + |
84
- | [centered](addons/centered) | + | | + | + | + | + | | + | | + | + |
79
+ | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [HTML](app/html) | [Svelte](app/svelte) | [Ember](app/ember) | [Preact](app/preact) |
80
+ | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------: | :------------------: | :----------------: | :------------------: |
81
+ | [a11y](addons/a11y) | + | | + | + | + | | + | + |
82
+ | [actions](addons/actions) | + | + | + | + | + | + | + | + |
83
+ | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + |
84
+ | [centered](addons/centered) | + | | + | + | + | + | + | + |
85
85
 
86
86
  ## Code
87
87
 
package/dist/cjs/blocks/DocsPageExampleCaption.mdx CHANGED
@@ -76,12 +76,12 @@ A basic table:
76
76
 
77
77
  Let's throw in a crazy table, because why not?
78
78
 
79
- | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [Mithril](app/mithril) | [HTML](app/html) | [Marko](app/marko) | [Svelte](app/svelte) | [Riot](app/riot) | [Ember](app/ember) | [Preact](app/preact) |
80
- | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------------: | :--------------: | :----------------: | :------------------: | :--------------: | :----------------: | :------------------: |
81
- | [a11y](addons/a11y) | + | | + | + | + | + | + | | | + | + |
82
- | [actions](addons/actions) | + | + | + | + | + | + | + | + | + | + | + |
83
- | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + | + | + | + |
84
- | [centered](addons/centered) | + | | + | + | + | + | | + | | + | + |
79
+ | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [HTML](app/html) | [Svelte](app/svelte) | [Ember](app/ember) | [Preact](app/preact) |
80
+ | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------: | :------------------: | :----------------: | :------------------: |
81
+ | [a11y](addons/a11y) | + | | + | + | + | | + | + |
82
+ | [actions](addons/actions) | + | + | + | + | + | + | + | + |
83
+ | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + |
84
+ | [centered](addons/centered) | + | | + | + | + | + | + | + |
85
85
 
86
86
  ## Code
87
87
 
package/dist/cjs/controls/Date.js CHANGED
@@ -117,7 +117,11 @@ var FlexSpaced = _theming.styled.div(function (_ref) {
117
117
  }
118
118
  },
119
119
  'input:first-of-type': {
120
- marginLeft: 0
120
+ marginLeft: 0,
121
+ flexGrow: 4
122
+ },
123
+ 'input:last-of-type': {
124
+ flexGrow: 3
121
125
  }
122
126
  };
123
127
  });
package/dist/esm/blocks/ArgsTable/ArgValue.js CHANGED
@@ -108,7 +108,7 @@ var Detail = styled.div(function (_ref5) {
108
108
  minWidth: 200,
109
109
  maxWidth: 800,
110
110
  padding: 15,
111
- // Dont remove the mono fontFamily here even if it seem useless, this is used by the browser to calculate the length of a "ch" unit.
111
+ // Don't remove the mono fontFamily here even if it seems useless, this is used by the browser to calculate the length of a "ch" unit.
112
112
  fontFamily: theme.typography.fonts.mono,
113
113
  fontSize: theme.typography.size.s1,
114
114
  // Most custom stylesheet will reset the box-sizing to "border-box" and will break the tooltip.
package/dist/esm/blocks/ArgsTable/SectionRow.js CHANGED
@@ -127,7 +127,7 @@ export var SectionRow = function SectionRow(_ref7) {
127
127
  var itemCount = (children === null || children === void 0 ? void 0 : children.length) || 0;
128
128
  var caption = level === 'subsection' ? "".concat(itemCount, " item").concat(itemCount !== 1 ? 's' : '') : '';
129
129
  var icon = expanded ? 'arrowdown' : 'arrowright';
130
- var helperText = "".concat(expanded ? 'Hide' : 'Side', " ").concat(level === 'subsection' ? itemCount : label, " item").concat(itemCount !== 1 ? 's' : '');
130
+ var helperText = "".concat(expanded ? 'Hide' : 'Show', " ").concat(level === 'subsection' ? itemCount : label, " item").concat(itemCount !== 1 ? 's' : '');
131
131
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledTr, {
132
132
  title: helperText
133
133
  }, /*#__PURE__*/React.createElement(Level, {
package/dist/esm/blocks/DocsPageExampleCaption.md CHANGED
@@ -76,12 +76,12 @@ A basic table:
76
76
 
77
77
  Let's throw in a crazy table, because why not?
78
78
 
79
- | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [Mithril](app/mithril) | [HTML](app/html) | [Marko](app/marko) | [Svelte](app/svelte) | [Riot](app/riot) | [Ember](app/ember) | [Preact](app/preact) |
80
- | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------------: | :--------------: | :----------------: | :------------------: | :--------------: | :----------------: | :------------------: |
81
- | [a11y](addons/a11y) | + | | + | + | + | + | + | | | + | + |
82
- | [actions](addons/actions) | + | + | + | + | + | + | + | + | + | + | + |
83
- | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + | + | + | + |
84
- | [centered](addons/centered) | + | | + | + | + | + | | + | | + | + |
79
+ | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [HTML](app/html) | [Svelte](app/svelte) | [Ember](app/ember) | [Preact](app/preact) |
80
+ | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------: | :------------------: | :----------------: | :------------------: |
81
+ | [a11y](addons/a11y) | + | | + | + | + | | + | + |
82
+ | [actions](addons/actions) | + | + | + | + | + | + | + | + |
83
+ | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + |
84
+ | [centered](addons/centered) | + | | + | + | + | + | + | + |
85
85
 
86
86
  ## Code
87
87
 
package/dist/esm/blocks/DocsPageExampleCaption.mdx CHANGED
@@ -76,12 +76,12 @@ A basic table:
76
76
 
77
77
  Let's throw in a crazy table, because why not?
78
78
 
79
- | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [Mithril](app/mithril) | [HTML](app/html) | [Marko](app/marko) | [Svelte](app/svelte) | [Riot](app/riot) | [Ember](app/ember) | [Preact](app/preact) |
80
- | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------------: | :--------------: | :----------------: | :------------------: | :--------------: | :----------------: | :------------------: |
81
- | [a11y](addons/a11y) | + | | + | + | + | + | + | | | + | + |
82
- | [actions](addons/actions) | + | + | + | + | + | + | + | + | + | + | + |
83
- | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + | + | + | + |
84
- | [centered](addons/centered) | + | | + | + | + | + | | + | | + | + |
79
+ | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [HTML](app/html) | [Svelte](app/svelte) | [Ember](app/ember) | [Preact](app/preact) |
80
+ | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------: | :------------------: | :----------------: | :------------------: |
81
+ | [a11y](addons/a11y) | + | | + | + | + | | + | + |
82
+ | [actions](addons/actions) | + | + | + | + | + | + | + | + |
83
+ | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + |
84
+ | [centered](addons/centered) | + | | + | + | + | + | + | + |
85
85
 
86
86
  ## Code
87
87
 
package/dist/esm/controls/Date.js CHANGED
@@ -85,7 +85,11 @@ var FlexSpaced = styled.div(function (_ref) {
85
85
  }
86
86
  },
87
87
  'input:first-of-type': {
88
- marginLeft: 0
88
+ marginLeft: 0,
89
+ flexGrow: 4
90
+ },
91
+ 'input:last-of-type': {
92
+ flexGrow: 3
89
93
  }
90
94
  };
91
95
  });
package/dist/modern/blocks/ArgsTable/ArgValue.js CHANGED
@@ -67,7 +67,7 @@ const Detail = styled.div(({
67
67
  minWidth: 200,
68
68
  maxWidth: 800,
69
69
  padding: 15,
70
- // Dont remove the mono fontFamily here even if it seem useless, this is used by the browser to calculate the length of a "ch" unit.
70
+ // Don't remove the mono fontFamily here even if it seems useless, this is used by the browser to calculate the length of a "ch" unit.
71
71
  fontFamily: theme.typography.fonts.mono,
72
72
  fontSize: theme.typography.size.s1,
73
73
  // Most custom stylesheet will reset the box-sizing to "border-box" and will break the tooltip.
package/dist/modern/blocks/ArgsTable/SectionRow.js CHANGED
@@ -88,7 +88,7 @@ export const SectionRow = ({
88
88
  const itemCount = (children === null || children === void 0 ? void 0 : children.length) || 0;
89
89
  const caption = level === 'subsection' ? `${itemCount} item${itemCount !== 1 ? 's' : ''}` : '';
90
90
  const icon = expanded ? 'arrowdown' : 'arrowright';
91
- const helperText = `${expanded ? 'Hide' : 'Side'} ${level === 'subsection' ? itemCount : label} item${itemCount !== 1 ? 's' : ''}`;
91
+ const helperText = `${expanded ? 'Hide' : 'Show'} ${level === 'subsection' ? itemCount : label} item${itemCount !== 1 ? 's' : ''}`;
92
92
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledTr, {
93
93
  title: helperText
94
94
  }, /*#__PURE__*/React.createElement(Level, {
package/dist/modern/blocks/DocsPageExampleCaption.md CHANGED
@@ -76,12 +76,12 @@ A basic table:
76
76
 
77
77
  Let's throw in a crazy table, because why not?
78
78
 
79
- | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [Mithril](app/mithril) | [HTML](app/html) | [Marko](app/marko) | [Svelte](app/svelte) | [Riot](app/riot) | [Ember](app/ember) | [Preact](app/preact) |
80
- | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------------: | :--------------: | :----------------: | :------------------: | :--------------: | :----------------: | :------------------: |
81
- | [a11y](addons/a11y) | + | | + | + | + | + | + | | | + | + |
82
- | [actions](addons/actions) | + | + | + | + | + | + | + | + | + | + | + |
83
- | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + | + | + | + |
84
- | [centered](addons/centered) | + | | + | + | + | + | | + | | + | + |
79
+ | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [HTML](app/html) | [Svelte](app/svelte) | [Ember](app/ember) | [Preact](app/preact) |
80
+ | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------: | :------------------: | :----------------: | :------------------: |
81
+ | [a11y](addons/a11y) | + | | + | + | + | | + | + |
82
+ | [actions](addons/actions) | + | + | + | + | + | + | + | + |
83
+ | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + |
84
+ | [centered](addons/centered) | + | | + | + | + | + | + | + |
85
85
 
86
86
  ## Code
87
87
 
package/dist/modern/blocks/DocsPageExampleCaption.mdx CHANGED
@@ -76,12 +76,12 @@ A basic table:
76
76
 
77
77
  Let's throw in a crazy table, because why not?
78
78
 
79
- | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [Mithril](app/mithril) | [HTML](app/html) | [Marko](app/marko) | [Svelte](app/svelte) | [Riot](app/riot) | [Ember](app/ember) | [Preact](app/preact) |
80
- | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------------: | :--------------: | :----------------: | :------------------: | :--------------: | :----------------: | :------------------: |
81
- | [a11y](addons/a11y) | + | | + | + | + | + | + | | | + | + |
82
- | [actions](addons/actions) | + | + | + | + | + | + | + | + | + | + | + |
83
- | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + | + | + | + |
84
- | [centered](addons/centered) | + | | + | + | + | + | | + | | + | + |
79
+ | | [React](app/react) | [React Native](app/react-native) | [Vue](app/vue) | [Angular](app/angular) | [HTML](app/html) | [Svelte](app/svelte) | [Ember](app/ember) | [Preact](app/preact) |
80
+ | --------------------------------- | :----------------: | :------------------------------: | :------------: | :--------------------: | :--------------: | :------------------: | :----------------: | :------------------: |
81
+ | [a11y](addons/a11y) | + | | + | + | + | | + | + |
82
+ | [actions](addons/actions) | + | + | + | + | + | + | + | + |
83
+ | [backgrounds](addons/backgrounds) | + | \* | + | + | + | + | + | + |
84
+ | [centered](addons/centered) | + | | + | + | + | + | + | + |
85
85
 
86
86
  ## Code
87
87
 
package/dist/modern/controls/Date.js CHANGED
@@ -50,7 +50,11 @@ const FlexSpaced = styled.div(({
50
50
  }
51
51
  },
52
52
  'input:first-of-type': {
53
- marginLeft: 0
53
+ marginLeft: 0,
54
+ flexGrow: 4
55
+ },
56
+ 'input:last-of-type': {
57
+ flexGrow: 3
54
58
  }
55
59
  }));
56
60
  export const DateControl = ({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@storybook/components",
3
- "version": "6.4.18",
3
+ "version": "6.4.21",
4
4
  "description": "Core Storybook Components",
5
5
  "keywords": [
6
6
  "storybook"
@@ -41,9 +41,9 @@
41
41
  },
42
42
  "dependencies": {
43
43
  "@popperjs/core": "^2.6.0",
44
- "@storybook/client-logger": "6.4.18",
44
+ "@storybook/client-logger": "6.4.21",
45
45
  "@storybook/csf": "0.0.2--canary.87bc651.0",
46
- "@storybook/theming": "6.4.18",
46
+ "@storybook/theming": "6.4.21",
47
47
  "@types/color-convert": "^2.0.0",
48
48
  "@types/overlayscrollbars": "^1.12.0",
49
49
  "@types/react-syntax-highlighter": "11.0.5",
@@ -76,6 +76,6 @@
76
76
  "publishConfig": {
77
77
  "access": "public"
78
78
  },
79
- "gitHead": "2c57c56209263201a5d3dcef473e2f6b337b931b",
79
+ "gitHead": "c35ea5aa79312b8346f0f3cd15a1545db676b105",
80
80
  "sbmodern": "dist/modern/index.js"
81
81
  }