@carbon/ibm-products 1.7.0 → 1.10.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (179) hide show
  1. package/css/index-full-carbon.css +227 -5762
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +5 -5
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +46 -3426
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +3 -3
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +195 -4028
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +5 -5
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +195 -4029
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +5 -5
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/APIKeyModal/APIKeyModal.js +10 -13
  18. package/es/components/ActionBar/ActionBar.js +0 -3
  19. package/es/components/ActionBar/ActionBarItem.js +2 -6
  20. package/es/components/ActionSet/ActionSet.js +10 -12
  21. package/es/components/AddSelect/AddSelect.js +120 -25
  22. package/es/components/AddSelect/AddSelectBreadcrumbs.js +4 -4
  23. package/es/components/AddSelect/AddSelectColumn.js +58 -0
  24. package/es/components/AddSelect/AddSelectList.js +67 -8
  25. package/es/components/AddSelect/AddSelectSidebar.js +7 -1
  26. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +0 -3
  27. package/es/components/ButtonMenu/ButtonMenu.js +7 -5
  28. package/es/components/ButtonMenu/ButtonMenuItem.js +1 -2
  29. package/es/components/Card/Card.js +31 -21
  30. package/es/components/Card/CardFooter.js +14 -10
  31. package/es/components/Card/CardHeader.js +8 -6
  32. package/es/components/Cascade/Cascade.js +5 -4
  33. package/es/components/ComboButton/ComboButton.js +0 -4
  34. package/es/components/ComboButton/ComboButtonItem/index.js +0 -5
  35. package/es/components/CreateFullPage/CreateFullPageStep.js +15 -8
  36. package/es/components/CreateModal/CreateModal.js +1 -4
  37. package/es/components/CreateTearsheet/CreateTearsheet.js +10 -11
  38. package/es/components/CreateTearsheet/CreateTearsheetStep.js +18 -14
  39. package/es/components/DataSpreadsheet/DataSpreadsheet.js +563 -80
  40. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +366 -0
  41. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +81 -0
  42. package/es/components/DataSpreadsheet/checkActiveHeaderCell.js +34 -0
  43. package/es/components/DataSpreadsheet/createActiveCellFn.js +47 -0
  44. package/es/components/DataSpreadsheet/createCellSelectionArea.js +45 -0
  45. package/es/components/DataSpreadsheet/getCellSize.js +30 -0
  46. package/es/components/EditSidePanel/EditSidePanel.js +9 -10
  47. package/es/components/EmptyStates/EmptyState.js +7 -6
  48. package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +4 -8
  49. package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +4 -8
  50. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +4 -8
  51. package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +4 -8
  52. package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +4 -8
  53. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +4 -8
  54. package/es/components/ExampleComponent/ExampleComponent.js +12 -13
  55. package/es/components/ExportModal/ExportModal.js +13 -9
  56. package/es/components/ExpressiveCard/ExpressiveCard.js +0 -8
  57. package/es/components/ImportModal/ImportModal.js +7 -5
  58. package/es/components/InlineEdit/InlineEdit.js +44 -46
  59. package/es/components/LoadingBar/LoadingBar.js +13 -17
  60. package/es/components/ModifiedTabs/ModifiedTabLabelNew.js +0 -4
  61. package/es/components/ModifiedTabs/ModifiedTabLabelWithClose.js +0 -5
  62. package/es/components/ModifiedTabs/ModifiedTabs.js +24 -18
  63. package/es/components/NotificationsPanel/NotificationsPanel.js +109 -86
  64. package/es/components/OptionsTile/OptionsTile.js +17 -10
  65. package/es/components/PageHeader/PageHeader.js +58 -47
  66. package/es/components/PageHeader/PageHeaderUtils.js +3 -7
  67. package/es/components/ProductiveCard/ProductiveCard.js +23 -12
  68. package/es/components/RemoveModal/RemoveModal.js +0 -3
  69. package/es/components/SidePanel/SidePanel.js +22 -17
  70. package/es/components/TagSet/TagSet.js +25 -12
  71. package/es/components/TagSet/TagSetModal.js +16 -12
  72. package/es/components/TagSet/TagSetOverflow.js +21 -13
  73. package/es/components/Tearsheet/Tearsheet.js +27 -18
  74. package/es/components/Tearsheet/TearsheetNarrow.js +18 -15
  75. package/es/components/Toolbar/ToolbarButton.js +0 -3
  76. package/es/components/UserProfileImage/UserProfileImage.js +2 -1
  77. package/es/components/WebTerminal/WebTerminal.js +17 -18
  78. package/es/components/index.js +0 -1
  79. package/es/global/js/hooks/index.js +1 -0
  80. package/es/global/js/hooks/useActiveElement.js +27 -0
  81. package/es/global/js/utils/DisplayBox.js +31 -0
  82. package/es/global/js/utils/Wrap.js +7 -5
  83. package/es/global/js/utils/deepCloneObject.js +26 -0
  84. package/lib/components/APIKeyModal/APIKeyModal.js +10 -13
  85. package/lib/components/ActionBar/ActionBar.js +0 -3
  86. package/lib/components/ActionBar/ActionBarItem.js +2 -6
  87. package/lib/components/ActionSet/ActionSet.js +10 -12
  88. package/lib/components/AddSelect/AddSelect.js +118 -24
  89. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +2 -3
  90. package/lib/components/AddSelect/AddSelectColumn.js +79 -0
  91. package/lib/components/AddSelect/AddSelectList.js +65 -8
  92. package/lib/components/AddSelect/AddSelectSidebar.js +7 -1
  93. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +0 -3
  94. package/lib/components/ButtonMenu/ButtonMenu.js +7 -5
  95. package/lib/components/ButtonMenu/ButtonMenuItem.js +1 -2
  96. package/lib/components/Card/Card.js +31 -21
  97. package/lib/components/Card/CardFooter.js +14 -10
  98. package/lib/components/Card/CardHeader.js +8 -6
  99. package/lib/components/Cascade/Cascade.js +5 -4
  100. package/lib/components/ComboButton/ComboButton.js +0 -4
  101. package/lib/components/ComboButton/ComboButtonItem/index.js +0 -5
  102. package/lib/components/CreateFullPage/CreateFullPageStep.js +17 -14
  103. package/lib/components/CreateModal/CreateModal.js +1 -4
  104. package/lib/components/CreateTearsheet/CreateTearsheet.js +10 -11
  105. package/lib/components/CreateTearsheet/CreateTearsheetStep.js +20 -20
  106. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +567 -77
  107. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +391 -0
  108. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +99 -0
  109. package/lib/components/DataSpreadsheet/checkActiveHeaderCell.js +45 -0
  110. package/lib/components/DataSpreadsheet/createActiveCellFn.js +58 -0
  111. package/lib/components/DataSpreadsheet/createCellSelectionArea.js +56 -0
  112. package/lib/components/DataSpreadsheet/getCellSize.js +39 -0
  113. package/lib/components/EditSidePanel/EditSidePanel.js +9 -10
  114. package/lib/components/EmptyStates/EmptyState.js +9 -8
  115. package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +3 -7
  116. package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +3 -7
  117. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +3 -7
  118. package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +3 -7
  119. package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +3 -7
  120. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +3 -7
  121. package/lib/components/ExampleComponent/ExampleComponent.js +12 -13
  122. package/lib/components/ExportModal/ExportModal.js +13 -9
  123. package/lib/components/ExpressiveCard/ExpressiveCard.js +0 -8
  124. package/lib/components/ImportModal/ImportModal.js +7 -5
  125. package/lib/components/InlineEdit/InlineEdit.js +43 -45
  126. package/lib/components/LoadingBar/LoadingBar.js +13 -17
  127. package/lib/components/ModifiedTabs/ModifiedTabLabelNew.js +0 -4
  128. package/lib/components/ModifiedTabs/ModifiedTabLabelWithClose.js +0 -5
  129. package/lib/components/ModifiedTabs/ModifiedTabs.js +24 -18
  130. package/lib/components/NotificationsPanel/NotificationsPanel.js +109 -86
  131. package/lib/components/OptionsTile/OptionsTile.js +17 -10
  132. package/lib/components/PageHeader/PageHeader.js +56 -46
  133. package/lib/components/PageHeader/PageHeaderUtils.js +3 -7
  134. package/lib/components/ProductiveCard/ProductiveCard.js +24 -18
  135. package/lib/components/RemoveModal/RemoveModal.js +0 -3
  136. package/lib/components/SidePanel/SidePanel.js +22 -17
  137. package/lib/components/TagSet/TagSet.js +26 -12
  138. package/lib/components/TagSet/TagSetModal.js +17 -13
  139. package/lib/components/TagSet/TagSetOverflow.js +24 -19
  140. package/lib/components/Tearsheet/Tearsheet.js +26 -17
  141. package/lib/components/Tearsheet/TearsheetNarrow.js +18 -15
  142. package/lib/components/Toolbar/ToolbarButton.js +0 -3
  143. package/lib/components/UserProfileImage/UserProfileImage.js +2 -1
  144. package/lib/components/WebTerminal/WebTerminal.js +17 -18
  145. package/lib/components/index.js +0 -8
  146. package/lib/global/js/hooks/index.js +8 -0
  147. package/lib/global/js/hooks/useActiveElement.js +39 -0
  148. package/lib/global/js/utils/DisplayBox.js +46 -0
  149. package/lib/global/js/utils/Wrap.js +7 -5
  150. package/lib/global/js/utils/deepCloneObject.js +37 -0
  151. package/package.json +18 -18
  152. package/scss/components/{CancelableTextEdit/_index.scss → ActionBar/_storybook-styles.scss} +2 -2
  153. package/scss/components/ActionSet/_storybook-styles.scss +1 -3
  154. package/scss/components/AddSelect/_add-select.scss +83 -14
  155. package/scss/components/{CancelableTextEdit → BreadcrumbWithOverflow}/_storybook-styles.scss +2 -2
  156. package/scss/components/ButtonSetWithOverflow/_storybook-styles.scss +8 -0
  157. package/scss/components/CreateInfluencer/_create-influencer.scss +2 -0
  158. package/scss/components/CreateModal/_create-modal.scss +1 -0
  159. package/scss/components/CreateTearsheet/_create-tearsheet.scss +1 -0
  160. package/scss/components/CreateTearsheetNarrow/_create-tearsheet-narrow.scss +1 -0
  161. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +53 -7
  162. package/scss/components/InlineEdit/_inline-edit.scss +36 -15
  163. package/scss/components/InlineEdit/_storybook-styles.scss +2 -0
  164. package/scss/components/LoadingBar/_loading-bar.scss +13 -0
  165. package/scss/components/NotificationsPanel/_notifications-panel.scss +3 -0
  166. package/scss/components/PageHeader/_page-header.scss +2 -0
  167. package/scss/components/SidePanel/_side-panel.scss +11 -4
  168. package/scss/components/StatusIcon/_status-icon.scss +1 -0
  169. package/scss/components/TagSet/_storybook-styles.scss +8 -0
  170. package/scss/components/Tearsheet/_tearsheet.scss +1 -2
  171. package/scss/components/UserProfileImage/_user-profile-image.scss +9 -0
  172. package/scss/components/WebTerminal/_web-terminal.scss +2 -0
  173. package/scss/components/_index.scss +0 -1
  174. package/scss/global/styles/_display-box.scss +62 -0
  175. package/es/components/CancelableTextEdit/CancelableTextEdit.js +0 -245
  176. package/es/components/CancelableTextEdit/index.js +0 -7
  177. package/lib/components/CancelableTextEdit/CancelableTextEdit.js +0 -265
  178. package/lib/components/CancelableTextEdit/index.js +0 -13
  179. package/scss/components/CancelableTextEdit/_cancelable-text-edit.scss +0 -212
@@ -25,14 +25,19 @@ import { pkg } from '../../settings';
25
25
  import { EmptyStateContent } from './EmptyStateContent'; // The block part of our conventional BEM class names (blockClass__E--M).
26
26
 
27
27
  var blockClass = "".concat(pkg.prefix, "--empty-state");
28
- var componentName = 'EmptyState';
28
+ var componentName = 'EmptyState'; // Default values for props
29
+
30
+ export var defaults = {
31
+ size: 'lg'
32
+ };
29
33
  export var EmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
30
34
  var action = _ref.action,
31
35
  className = _ref.className,
32
36
  illustration = _ref.illustration,
33
37
  illustrationDescription = _ref.illustrationDescription,
34
38
  link = _ref.link,
35
- size = _ref.size,
39
+ _ref$size = _ref.size,
40
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
41
  subtitle = _ref.subtitle,
37
42
  title = _ref.title,
38
43
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -58,9 +63,6 @@ export var EmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
58
63
  }); // Return a placeholder if not released and not enabled by feature flag
59
64
 
60
65
  EmptyState = pkg.checkComponentEnabled(EmptyState, componentName);
61
- export var EmptyStateDefaultProps = {
62
- size: 'lg'
63
- };
64
66
  EmptyState.propTypes = {
65
67
  /**
66
68
  * Empty state action button
@@ -114,5 +116,4 @@ EmptyState.propTypes = {
114
116
  */
115
117
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
116
118
  };
117
- EmptyState.defaultProps = EmptyStateDefaultProps;
118
119
  EmptyState.displayName = componentName;
@@ -23,7 +23,7 @@ import { getDevtoolsProps } from '../../../global/js/utils/devtools';
23
23
  import { pkg } from '../../../settings';
24
24
  import { EmptyStateContent } from '../EmptyStateContent';
25
25
  import { ErrorIllustration } from '../assets/ErrorIllustration';
26
- import { EmptyStateDefaultProps } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
26
+ import { defaults } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
27
27
 
28
28
  var blockClass = "".concat(pkg.prefix, "--empty-state");
29
29
  var componentName = 'ErrorEmptyState';
@@ -32,7 +32,8 @@ export var ErrorEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref)
32
32
  className = _ref.className,
33
33
  illustrationTheme = _ref.illustrationTheme,
34
34
  link = _ref.link,
35
- size = _ref.size,
35
+ _ref$size = _ref.size,
36
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
37
  subtitle = _ref.subtitle,
37
38
  title = _ref.title,
38
39
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -105,9 +106,4 @@ ErrorEmptyState.propTypes = {
105
106
  * Empty state title
106
107
  */
107
108
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
108
- }; // Default values for component props. Default values are not required for
109
- // props that are required, nor for props where the component can apply
110
- // 'undefined' values reasonably. Default values should be provided when the
111
- // component needs to make a choice or assumption when a prop is not supplied.
112
-
113
- ErrorEmptyState.defaultProps = EmptyStateDefaultProps;
109
+ };
@@ -23,7 +23,7 @@ import { getDevtoolsProps } from '../../../global/js/utils/devtools';
23
23
  import { pkg } from '../../../settings';
24
24
  import { EmptyStateContent } from '../EmptyStateContent';
25
25
  import { NoDataIllustration } from '../assets/NoDataIllustration';
26
- import { EmptyStateDefaultProps } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
26
+ import { defaults } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
27
27
 
28
28
  var blockClass = "".concat(pkg.prefix, "--empty-state");
29
29
  var componentName = 'NoDataEmptyState';
@@ -32,7 +32,8 @@ export var NoDataEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref)
32
32
  className = _ref.className,
33
33
  illustrationTheme = _ref.illustrationTheme,
34
34
  link = _ref.link,
35
- size = _ref.size,
35
+ _ref$size = _ref.size,
36
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
37
  subtitle = _ref.subtitle,
37
38
  title = _ref.title,
38
39
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -105,9 +106,4 @@ NoDataEmptyState.propTypes = {
105
106
  * Empty state title
106
107
  */
107
108
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
108
- }; // Default values for component props. Default values are not required for
109
- // props that are required, nor for props where the component can apply
110
- // 'undefined' values reasonably. Default values should be provided when the
111
- // component needs to make a choice or assumption when a prop is not supplied.
112
-
113
- NoDataEmptyState.defaultProps = EmptyStateDefaultProps;
109
+ };
@@ -23,7 +23,7 @@ import { getDevtoolsProps } from '../../../global/js/utils/devtools';
23
23
  import { pkg } from '../../../settings';
24
24
  import { EmptyStateContent } from '../EmptyStateContent';
25
25
  import { NoTagsIllustration } from '../assets/NoTagsIllustration';
26
- import { EmptyStateDefaultProps } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
26
+ import { defaults } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
27
27
 
28
28
  var blockClass = "".concat(pkg.prefix, "--empty-state");
29
29
  var componentName = 'NoTagsEmptyState';
@@ -32,7 +32,8 @@ export var NoTagsEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, ref)
32
32
  className = _ref.className,
33
33
  illustrationTheme = _ref.illustrationTheme,
34
34
  link = _ref.link,
35
- size = _ref.size,
35
+ _ref$size = _ref.size,
36
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
37
  subtitle = _ref.subtitle,
37
38
  title = _ref.title,
38
39
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -105,9 +106,4 @@ NoTagsEmptyState.propTypes = {
105
106
  * Empty state title
106
107
  */
107
108
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
108
- }; // Default values for component props. Default values are not required for
109
- // props that are required, nor for props where the component can apply
110
- // 'undefined' values reasonably. Default values should be provided when the
111
- // component needs to make a choice or assumption when a prop is not supplied.
112
-
113
- NoTagsEmptyState.defaultProps = EmptyStateDefaultProps;
109
+ };
@@ -23,7 +23,7 @@ import { getDevtoolsProps } from '../../../global/js/utils/devtools';
23
23
  import { pkg } from '../../../settings';
24
24
  import { EmptyStateContent } from '../EmptyStateContent';
25
25
  import { NotFoundIllustration } from '../assets/NotFoundIllustration';
26
- import { EmptyStateDefaultProps } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
26
+ import { defaults } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
27
27
 
28
28
  var blockClass = "".concat(pkg.prefix, "--empty-state");
29
29
  var componentName = 'NotFoundEmptyState';
@@ -32,7 +32,8 @@ export var NotFoundEmptyState = /*#__PURE__*/React.forwardRef(function (_ref, re
32
32
  className = _ref.className,
33
33
  illustrationTheme = _ref.illustrationTheme,
34
34
  link = _ref.link,
35
- size = _ref.size,
35
+ _ref$size = _ref.size,
36
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
37
  subtitle = _ref.subtitle,
37
38
  title = _ref.title,
38
39
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -105,9 +106,4 @@ NotFoundEmptyState.propTypes = {
105
106
  * Empty state title
106
107
  */
107
108
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
108
- }; // Default values for component props. Default values are not required for
109
- // props that are required, nor for props where the component can apply
110
- // 'undefined' values reasonably. Default values should be provided when the
111
- // component needs to make a choice or assumption when a prop is not supplied.
112
-
113
- NotFoundEmptyState.defaultProps = EmptyStateDefaultProps;
109
+ };
@@ -23,7 +23,7 @@ import { getDevtoolsProps } from '../../../global/js/utils/devtools';
23
23
  import { pkg } from '../../../settings';
24
24
  import { EmptyStateContent } from '../EmptyStateContent';
25
25
  import { NotificationsIllustration } from '../assets/NotificationsIllustration';
26
- import { EmptyStateDefaultProps } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
26
+ import { defaults } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
27
27
 
28
28
  var blockClass = "".concat(pkg.prefix, "--empty-state");
29
29
  var componentName = 'NotificationsEmptyState';
@@ -32,7 +32,8 @@ export var NotificationsEmptyState = /*#__PURE__*/React.forwardRef(function (_re
32
32
  className = _ref.className,
33
33
  illustrationTheme = _ref.illustrationTheme,
34
34
  link = _ref.link,
35
- size = _ref.size,
35
+ _ref$size = _ref.size,
36
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
37
  subtitle = _ref.subtitle,
37
38
  title = _ref.title,
38
39
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -105,9 +106,4 @@ NotificationsEmptyState.propTypes = {
105
106
  * Empty state title
106
107
  */
107
108
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
108
- }; // Default values for component props. Default values are not required for
109
- // props that are required, nor for props where the component can apply
110
- // 'undefined' values reasonably. Default values should be provided when the
111
- // component needs to make a choice or assumption when a prop is not supplied.
112
-
113
- NotificationsEmptyState.defaultProps = EmptyStateDefaultProps;
109
+ };
@@ -23,7 +23,7 @@ import { getDevtoolsProps } from '../../../global/js/utils/devtools';
23
23
  import { pkg } from '../../../settings';
24
24
  import { EmptyStateContent } from '../EmptyStateContent';
25
25
  import { UnauthorizedIllustration } from '../assets/UnauthorizedIllustration';
26
- import { EmptyStateDefaultProps } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
26
+ import { defaults } from '../EmptyState'; // The block part of our conventional BEM class names (blockClass__E--M).
27
27
 
28
28
  var blockClass = "".concat(pkg.prefix, "--empty-state");
29
29
  var componentName = 'UnauthorizedEmptyState';
@@ -32,7 +32,8 @@ export var UnauthorizedEmptyState = /*#__PURE__*/React.forwardRef(function (_ref
32
32
  className = _ref.className,
33
33
  illustrationTheme = _ref.illustrationTheme,
34
34
  link = _ref.link,
35
- size = _ref.size,
35
+ _ref$size = _ref.size,
36
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
36
37
  subtitle = _ref.subtitle,
37
38
  title = _ref.title,
38
39
  rest = _objectWithoutProperties(_ref, _excluded);
@@ -105,9 +106,4 @@ UnauthorizedEmptyState.propTypes = {
105
106
  * Empty state title
106
107
  */
107
108
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
108
- }; // Default values for component props. Default values are not required for
109
- // props that are required, nor for props where the component can apply
110
- // 'undefined' values reasonably. Default values should be provided when the
111
- // component needs to make a choice or assumption when a prop is not supplied.
112
-
113
- UnauthorizedEmptyState.defaultProps = EmptyStateDefaultProps;
109
+ };
@@ -24,7 +24,13 @@ import { Button, ButtonSet } from 'carbon-components-react'; // The block part o
24
24
 
25
25
  var blockClass = "".concat(pkg.prefix, "--example-component");
26
26
  var componentName = 'ExampleComponent'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
27
+ // Default values for props
27
28
 
29
+ var defaults = {
30
+ primaryKind: 'primary',
31
+ secondaryKind: 'secondary',
32
+ size: 'default'
33
+ };
28
34
  /**
29
35
  * This is an example component to show relevant conventions and usage.
30
36
  */
@@ -37,10 +43,13 @@ export var ExampleComponent = /*#__PURE__*/React.forwardRef(function (_ref, ref)
37
43
  onPrimaryClick = _ref.onPrimaryClick,
38
44
  onSecondaryClick = _ref.onSecondaryClick,
39
45
  primaryButtonLabel = _ref.primaryButtonLabel,
40
- primaryKind = _ref.primaryKind,
46
+ _ref$primaryKind = _ref.primaryKind,
47
+ primaryKind = _ref$primaryKind === void 0 ? defaults.primaryKind : _ref$primaryKind,
41
48
  secondaryButtonLabel = _ref.secondaryButtonLabel,
42
- secondaryKind = _ref.secondaryKind,
43
- size = _ref.size,
49
+ _ref$secondaryKind = _ref.secondaryKind,
50
+ secondaryKind = _ref$secondaryKind === void 0 ? defaults.secondaryKind : _ref$secondaryKind,
51
+ _ref$size = _ref.size,
52
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
44
53
  style = _ref.style,
45
54
  rest = _objectWithoutProperties(_ref, _excluded);
46
55
 
@@ -147,14 +156,4 @@ ExampleComponent.propTypes = {
147
156
  * Optional style settings for the containing node.
148
157
  */
149
158
  style: PropTypes.object
150
- }; // Default values for component props. Default values are not required for
151
- // props that are required, nor for props where the component can apply
152
- // 'undefined' values reasonably. Default values should be provided when the
153
- // component needs to make a choice or assumption when a prop is not supplied.
154
-
155
- ExampleComponent.defaultProps = {
156
- boxedBorder: false,
157
- primaryKind: 'primary',
158
- secondaryKind: 'secondary',
159
- size: 'default'
160
159
  };
@@ -22,7 +22,13 @@ import PropTypes from 'prop-types';
22
22
  import { getDevtoolsProps } from '../../global/js/utils/devtools';
23
23
  import uuidv4 from '../../global/js/utils/uuidv4';
24
24
  import { pkg } from '../../settings';
25
- var componentName = 'ExportModal';
25
+ var componentName = 'ExportModal'; // Default values for props
26
+
27
+ var defaults = {
28
+ inputType: 'text',
29
+ preformattedExtensions: Object.freeze([]),
30
+ validExtensions: Object.freeze([])
31
+ };
26
32
  export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
27
33
  var _preformattedExtensio;
28
34
 
@@ -33,14 +39,16 @@ export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
33
39
  filename = _ref.filename,
34
40
  hidePasswordLabel = _ref.hidePasswordLabel,
35
41
  inputLabel = _ref.inputLabel,
36
- inputType = _ref.inputType,
42
+ _ref$inputType = _ref.inputType,
43
+ inputType = _ref$inputType === void 0 ? defaults.inputType : _ref$inputType,
37
44
  invalidInputText = _ref.invalidInputText,
38
45
  loading = _ref.loading,
39
46
  loadingMessage = _ref.loadingMessage,
40
47
  onClose = _ref.onClose,
41
48
  onRequestSubmit = _ref.onRequestSubmit,
42
49
  open = _ref.open,
43
- preformattedExtensions = _ref.preformattedExtensions,
50
+ _ref$preformattedExte = _ref.preformattedExtensions,
51
+ preformattedExtensions = _ref$preformattedExte === void 0 ? defaults.preformattedExtensions : _ref$preformattedExte,
44
52
  preformattedExtensionsLabel = _ref.preformattedExtensionsLabel,
45
53
  primaryButtonText = _ref.primaryButtonText,
46
54
  secondaryButtonText = _ref.secondaryButtonText,
@@ -48,7 +56,8 @@ export var ExportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
48
56
  successMessage = _ref.successMessage,
49
57
  successful = _ref.successful,
50
58
  title = _ref.title,
51
- validExtensions = _ref.validExtensions,
59
+ _ref$validExtensions = _ref.validExtensions,
60
+ validExtensions = _ref$validExtensions === void 0 ? defaults.validExtensions : _ref$validExtensions,
52
61
  rest = _objectWithoutProperties(_ref, _excluded);
53
62
 
54
63
  var _useState = useState(filename),
@@ -297,9 +306,4 @@ ExportModal.propTypes = {
297
306
  */
298
307
  validExtensions: PropTypes.array
299
308
  };
300
- ExportModal.defaultProps = {
301
- inputType: 'text',
302
- preformattedExtensions: [],
303
- validExtensions: []
304
- };
305
309
  ExportModal.displayName = componentName;
@@ -128,12 +128,4 @@ ExpressiveCard.propTypes = {
128
128
  */
129
129
  title: PropTypes.string
130
130
  };
131
- ExpressiveCard.defaultProps = {
132
- actionIcons: [],
133
- actionIconsPosition: 'bottom',
134
- mediaPosition: 'top',
135
- overflowActions: [],
136
- primaryButtonKind: 'primary',
137
- secondaryButtonKind: 'secondary'
138
- };
139
131
  ExpressiveCard.displayName = componentName;
@@ -24,9 +24,14 @@ import PropTypes from 'prop-types';
24
24
  import { getDevtoolsProps } from '../../global/js/utils/devtools';
25
25
  import uuidv4 from '../../global/js/utils/uuidv4';
26
26
  import { pkg } from '../../settings';
27
- var componentName = 'ImportModal';
27
+ var componentName = 'ImportModal'; // Default values for props
28
+
29
+ var defaults = {
30
+ accept: Object.freeze([])
31
+ };
28
32
  export var ImportModal = /*#__PURE__*/forwardRef(function (_ref, ref) {
29
- var accept = _ref.accept,
33
+ var _ref$accept = _ref.accept,
34
+ accept = _ref$accept === void 0 ? defaults.accept : _ref$accept,
30
35
  className = _ref.className,
31
36
  defaultErrorBody = _ref.defaultErrorBody,
32
37
  defaultErrorHeader = _ref.defaultErrorHeader,
@@ -416,7 +421,4 @@ ImportModal.propTypes = {
416
421
  */
417
422
  title: PropTypes.string.isRequired
418
423
  };
419
- ImportModal.defaultProps = {
420
- accept: []
421
- };
422
424
  ImportModal.displayName = componentName;
@@ -2,7 +2,7 @@ import _extends from "@babel/runtime/helpers/extends";
2
2
  import _defineProperty from "@babel/runtime/helpers/defineProperty";
3
3
  import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
4
4
  import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
5
- var _excluded = ["cancelDescription", "className", "disabled", "editDescription", "editVisibleOnHoverOnly", "id", "invalid", "invalidText", "labelText", "light", "onCancel", "onSave", "onChange", "placeholder", "saveDescription", "size", "value", "warn", "warnText"];
5
+ var _excluded = ["cancelDescription", "className", "disabled", "editAlwaysVisible", "editDescription", "id", "invalid", "invalidText", "labelText", "light", "onCancel", "onSave", "onChange", "placeholder", "saveDescription", "size", "value"];
6
6
 
7
7
  /**
8
8
  * Copyright IBM Corp. 2022, 2022
@@ -21,37 +21,42 @@ import { pkg, carbon } from '../../settings'; // Carbon and package components w
21
21
  /* TODO: @import(s) of carbon components and other package components. */
22
22
 
23
23
  import { Button } from 'carbon-components-react';
24
- import { Close16, Edit16, EditOff16, Checkmark16, WarningFilled16, WarningAltFilled16 } from '@carbon/icons-react'; // The block part of our conventional BEM class names (blockClass__E--M).
24
+ import { Close16, Edit16, EditOff16, Checkmark16, WarningFilled16 } from '@carbon/icons-react'; // The block part of our conventional BEM class names (blockClass__E--M).
25
25
 
26
26
  var blockClass = "".concat(pkg.prefix, "--inline-edit");
27
27
  var componentName = 'InlineEdit'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
28
28
 
29
+ var defaults = {
30
+ light: true,
31
+ // defaults to true to reflect design
32
+ size: 'md'
33
+ };
29
34
  /**
30
35
  * TODO: A description of the component.
31
36
  */
32
37
 
33
38
  export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
34
- var _cx, _cx3;
39
+ var _cx, _refInput$current, _refInput$current$inn, _cx3;
35
40
 
36
41
  var cancelDescription = _ref.cancelDescription,
37
42
  className = _ref.className,
38
43
  disabled = _ref.disabled,
44
+ editAlwaysVisible = _ref.editAlwaysVisible,
39
45
  editDescription = _ref.editDescription,
40
- editVisibleOnHoverOnly = _ref.editVisibleOnHoverOnly,
41
46
  id = _ref.id,
42
47
  invalid = _ref.invalid,
43
48
  invalidText = _ref.invalidText,
44
49
  labelText = _ref.labelText,
45
- light = _ref.light,
50
+ _ref$light = _ref.light,
51
+ light = _ref$light === void 0 ? defaults.light : _ref$light,
46
52
  onCancel = _ref.onCancel,
47
53
  onSave = _ref.onSave,
48
54
  onChange = _ref.onChange,
49
55
  placeholder = _ref.placeholder,
50
56
  saveDescription = _ref.saveDescription,
51
- size = _ref.size,
57
+ _ref$size = _ref.size,
58
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
52
59
  value = _ref.value,
53
- warn = _ref.warn,
54
- warnText = _ref.warnText,
55
60
  rest = _objectWithoutProperties(_ref, _excluded);
56
61
 
57
62
  var refInput = useRef(null);
@@ -68,9 +73,11 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
68
73
  internalValue = _useState4[0],
69
74
  setInternalValue = _useState4[1];
70
75
 
71
- var showValidation = invalid || warn;
72
- var validationText = invalidText || warnText;
73
- var validationIcon = showValidation ? invalid ? /*#__PURE__*/React.createElement(WarningFilled16, null) : /*#__PURE__*/React.createElement(WarningAltFilled16, null) : null;
76
+ var showValidation = invalid; // || warn;
77
+
78
+ var validationText = invalidText; // || warnText;
79
+
80
+ var validationIcon = showValidation ? /*#__PURE__*/React.createElement(WarningFilled16, null) : null;
74
81
 
75
82
  var doSetEditing = function doSetEditing(value) {
76
83
  if (value === false) {
@@ -82,6 +89,7 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
82
89
  };
83
90
 
84
91
  var handleEdit = function handleEdit(ev) {
92
+ /* istanbul ignore else */
85
93
  if (!disabled) {
86
94
  var rightOfInput = ev.currentTarget.classList.contains("".concat(blockClass, "__edit")) || ev.target.classList.contains("".concat(blockClass, "__after-input-elements"));
87
95
  var leftOfInput = ev.currentTarget = ev.target.classList.contains("".concat(blockClass)); // clicking on the content editable element should not set either of these to true
@@ -128,9 +136,12 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
128
136
  if (onChange) {
129
137
  onChange(refInput.current.innerText);
130
138
  }
131
- };
139
+ }; // pasting into contentEditable not supported by userEvent
132
140
 
133
- var handlePaste = function handlePaste(ev) {
141
+
142
+ var handlePaste =
143
+ /* istanbul ignore next */
144
+ function handlePaste(ev) {
134
145
  ev.preventDefault(); // Get clipboard as plain text
135
146
 
136
147
  var text = (ev.clipboardData || window.clipboardData).getData('text/plain'); // remove \n
@@ -175,9 +186,16 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
175
186
  };
176
187
 
177
188
  var handleKeyDown = function handleKeyDown(ev) {
178
- if (ev.key === 'Enter') {
179
- ev.preventDefault();
180
- refInput.current.blur(); // will cause save
189
+ switch (ev.key) {
190
+ case 'Enter':
191
+ ev.preventDefault();
192
+ refInput.current.blur(); // will cause save
193
+
194
+ break;
195
+
196
+ case 'Escape':
197
+ handleCancel();
198
+ break;
181
199
  }
182
200
  };
183
201
  /*
@@ -211,7 +229,7 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
211
229
  React.createElement("div", {
212
230
  className: cx(blockClass, // Apply the block class to the main HTML element
213
231
  className, // Apply any supplied class names to the main HTML element.
214
- "".concat(blockClass, "--").concat(size), (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "--disabled"), disabled), _defineProperty(_cx, "".concat(blockClass, "--editing"), editing), _defineProperty(_cx, "".concat(blockClass, "--invalid"), invalid), _defineProperty(_cx, "".concat(blockClass, "--warn"), warn), _defineProperty(_cx, "".concat(blockClass, "--light"), light), _defineProperty(_cx, "".concat(blockClass, "--overflows"), refInput.current && refInput.current.scrollWidth > refInput.current.offsetWidth), _cx)),
232
+ "".concat(blockClass, "--").concat(size), (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "--disabled"), disabled), _defineProperty(_cx, "".concat(blockClass, "--editing"), editing), _defineProperty(_cx, "".concat(blockClass, "--invalid"), invalid), _defineProperty(_cx, "".concat(blockClass, "--light"), light), _defineProperty(_cx, "".concat(blockClass, "--overflows"), refInput.current && refInput.current.scrollWidth > refInput.current.offsetWidth), _cx)),
215
233
  onClick: handleEdit // disabled eslint for click handler
216
234
  ,
217
235
  onBlur: handleBlur,
@@ -219,7 +237,7 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
219
237
  }, /*#__PURE__*/React.createElement("div", _extends({}, rest, getDevtoolsProps(componentName), {
220
238
  id: id,
221
239
  size: size,
222
- className: cx("".concat(blockClass, "__input"), _defineProperty({}, "".concat(blockClass, "__input--empty"), refInput.current && refInput.current.innerText.length === 0)),
240
+ className: cx("".concat(blockClass, "__input"), _defineProperty({}, "".concat(blockClass, "__input--empty"), ((_refInput$current = refInput.current) === null || _refInput$current === void 0 ? void 0 : (_refInput$current$inn = _refInput$current.innerText) === null || _refInput$current$inn === void 0 ? void 0 : _refInput$current$inn.length) === 0)),
223
241
  contentEditable: true,
224
242
  "aria-label": labelText,
225
243
  role: "textbox",
@@ -259,7 +277,7 @@ export var InlineEdit = /*#__PURE__*/React.forwardRef(function (_ref, refIn) {
259
277
  disabled: value === internalValue
260
278
  })) : /*#__PURE__*/React.createElement(Button, {
261
279
  "aria-hidden": "true",
262
- className: cx("".concat(blockClass, "__edit"), _defineProperty({}, "".concat(blockClass, "__edit--hover-visible"), editVisibleOnHoverOnly)),
280
+ className: cx("".concat(blockClass, "__edit"), _defineProperty({}, "".concat(blockClass, "__edit--always-visible"), editAlwaysVisible)),
263
281
  kind: "ghost",
264
282
  hasIconOnly: true,
265
283
  iconDescription: editDescription,
@@ -299,15 +317,14 @@ InlineEdit.propTypes = {
299
317
  disabled: PropTypes.bool,
300
318
 
301
319
  /**
302
- * Label for the edit button
320
+ * By default the edit icon is shown on hover only.
303
321
  */
304
- editDescription: PropTypes.string.isRequired,
322
+ editAlwaysVisible: PropTypes.bool,
305
323
 
306
324
  /**
307
- * In some scenarios the edit icon only needs to be shown on hover. These cases are where continual visibility of
308
- * the edit icon is redundant. E.g. a spreadsheet a property panel.
325
+ * Label for the edit button
309
326
  */
310
- editVisibleOnHoverOnly: PropTypes.bool,
327
+ editDescription: PropTypes.string.isRequired,
311
328
 
312
329
  /**
313
330
  * ID for inline edit
@@ -342,14 +359,14 @@ InlineEdit.propTypes = {
342
359
  /**
343
360
  * method called on input event (it's a React thing onChange behaves like on input).
344
361
  *
345
- * NOTE: caller to handle invalid/warn states and associated text
362
+ * NOTE: caller to handle invalid states and associated text
346
363
  */
347
364
  onChange: PropTypes.func,
348
365
 
349
366
  /**
350
367
  * method called on change event
351
368
  *
352
- * NOTE: caller to handle invalid/warn states and associated text
369
+ * NOTE: caller to handle invalid states and associated text
353
370
  */
354
371
  onSave: PropTypes.func,
355
372
 
@@ -371,24 +388,5 @@ InlineEdit.propTypes = {
371
388
  /**
372
389
  * initial/unedited value
373
390
  */
374
- value: PropTypes.string,
375
-
376
- /**
377
- * set warn state for input
378
- */
379
- warn: PropTypes.bool,
380
-
381
- /**
382
- * text shown when warn true
383
- */
384
- warnText: PropTypes.string
385
- }; // Default values for component props. Default values are not required for
386
- // props that are required, nor for props where the component can apply
387
- // 'undefined' values reasonably. Default values should be provided when the
388
- // component needs to make a choice or assumption when a prop is not supplied.
389
-
390
- InlineEdit.defaultProps = {
391
- light: true,
392
- // defaults to true to reflect design
393
- size: 'md'
391
+ value: PropTypes.string
394
392
  };
@@ -23,7 +23,13 @@ import { pkg
23
23
 
24
24
  var blockClass = "".concat(pkg.prefix, "--loading-bar");
25
25
  var componentName = 'LoadingBar'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
26
+ // Default values for props
26
27
 
28
+ var defaults = {
29
+ active: true,
30
+ percentage: undefined,
31
+ ariaLabel: 'Active loading indicator'
32
+ };
27
33
  /**
28
34
  * The LoadingBar component provides a way to communicate the loading state to users.
29
35
  * It is intended to fill the space of where it's used, and should persist until the
@@ -40,11 +46,14 @@ var componentName = 'LoadingBar'; // NOTE: the component SCSS is not imported he
40
46
  export var LoadingBar = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
41
47
  var _cx2, _cx3;
42
48
 
43
- var active = _ref.active,
44
- ariaLabel = _ref.ariaLabel,
49
+ var _ref$active = _ref.active,
50
+ active = _ref$active === void 0 ? defaults.active : _ref$active,
51
+ _ref$ariaLabel = _ref.ariaLabel,
52
+ ariaLabel = _ref$ariaLabel === void 0 ? defaults.ariaLabel : _ref$ariaLabel,
45
53
  className = _ref.className,
46
54
  id = _ref.id,
47
- percentage = _ref.percentage,
55
+ _ref$percentage = _ref.percentage,
56
+ percentage = _ref$percentage === void 0 ? defaults.percentage : _ref$percentage,
48
57
  percentageIndicatorText = _ref.percentageIndicatorText,
49
58
  showPercentageIndicator = _ref.showPercentageIndicator,
50
59
  small = _ref.small,
@@ -108,7 +117,7 @@ LoadingBar.propTypes = {
108
117
  /**
109
118
  * Specify whether you want the loading bar indicator to be active or not
110
119
  */
111
- active: PropTypes.bool.isRequired,
120
+ active: PropTypes.bool,
112
121
 
113
122
  /**
114
123
  * Specify a ariaLabel that would be used to best describe the active loading state
@@ -144,17 +153,4 @@ LoadingBar.propTypes = {
144
153
  * Specify whether you would like the small variant of this component
145
154
  */
146
155
  small: PropTypes.bool
147
- }; // Default values for component props. Default values are not required for
148
- // props that are required, nor for props where the component can apply
149
- // 'undefined' values reasonably. Default values should be provided when the
150
- // component needs to make a choice or assumption when a prop is not supplied.
151
-
152
- LoadingBar.defaultProps = {
153
- /* add defaults for relevant props. */
154
- active: true,
155
- small: false,
156
- percentage: undefined,
157
- showPercentageIndicator: false,
158
- percentageIndicatorText: undefined,
159
- ariaLabel: 'Active loading indicator'
160
156
  };
@@ -27,8 +27,4 @@ ModifiedTabLabelNew.propTypes = {
27
27
  * Optional onClick handler
28
28
  */
29
29
  onClick: PropTypes.func
30
- };
31
- ModifiedTabLabelNew.defaultProps = {
32
- label: '',
33
- onClick: undefined
34
30
  };
@@ -46,9 +46,4 @@ ModifiedTabLabelWithClose.propTypes = {
46
46
  * unsavedContent indicates tab contents have not been saved
47
47
  */
48
48
  unsavedContent: PropTypes.bool
49
- };
50
- ModifiedTabLabelWithClose.defaultProps = {
51
- unsavedContent: false,
52
- label: '',
53
- onClose: undefined
54
49
  };