@carbon/ibm-products 1.5.0 → 1.8.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (187) hide show
  1. package/css/index-full-carbon.css +389 -139
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +9 -3
  4. package/css/index-full-carbon.min.css.map +1 -0
  5. package/css/index-without-carbon-released-only.css +33 -27
  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 -0
  9. package/css/index-without-carbon.css +330 -133
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +9 -3
  12. package/css/index-without-carbon.min.css.map +1 -0
  13. package/css/index.css +332 -135
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +9 -3
  16. package/css/index.min.css.map +1 -0
  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 +11 -13
  21. package/es/components/AddSelect/AddSelect.js +122 -72
  22. package/es/components/AddSelect/AddSelectBreadcrumbs.js +56 -0
  23. package/es/components/AddSelect/AddSelectList.js +94 -0
  24. package/es/components/AddSelect/AddSelectSidebar.js +110 -0
  25. package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +5 -5
  26. package/es/components/ButtonMenu/ButtonMenu.js +6 -4
  27. package/es/components/ButtonMenu/ButtonMenuItem.js +1 -2
  28. package/es/components/Card/Card.js +37 -25
  29. package/es/components/Card/CardFooter.js +14 -10
  30. package/es/components/Card/CardHeader.js +8 -6
  31. package/es/components/Cascade/Cascade.js +5 -4
  32. package/es/components/ComboButton/ComboButton.js +0 -4
  33. package/es/components/ComboButton/ComboButtonItem/index.js +0 -5
  34. package/es/components/CreateFullPage/CreateFullPageStep.js +15 -8
  35. package/es/components/CreateModal/CreateModal.js +1 -4
  36. package/es/components/CreateTearsheet/CreateTearsheet.js +10 -11
  37. package/es/components/CreateTearsheet/CreateTearsheetStep.js +18 -14
  38. package/es/components/DataSpreadsheet/DataSpreadsheet.js +414 -0
  39. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +138 -0
  40. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +64 -0
  41. package/es/components/DataSpreadsheet/createActiveCellFn.js +45 -0
  42. package/es/components/DataSpreadsheet/generateData.js +47 -0
  43. package/es/components/DataSpreadsheet/getCellSize.js +30 -0
  44. package/es/components/{CancelableTextEdit → DataSpreadsheet}/index.js +2 -2
  45. package/es/components/EditSidePanel/EditSidePanel.js +9 -10
  46. package/es/components/EmptyStates/EmptyState.js +8 -7
  47. package/es/components/EmptyStates/EmptyStateContent.js +2 -2
  48. package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +5 -9
  49. package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +5 -9
  50. package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +5 -9
  51. package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +5 -9
  52. package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +5 -9
  53. package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +5 -9
  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 +256 -88
  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 +125 -89
  64. package/es/components/OptionsTile/OptionsTile.js +6 -9
  65. package/es/components/PageHeader/PageHeader.js +19 -13
  66. package/es/components/PageHeader/PageHeaderTitle.js +10 -6
  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 +54 -32
  70. package/es/components/TagSet/TagSet.js +13 -9
  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/Tearsheet/TearsheetShell.js +3 -4
  76. package/es/components/Toolbar/ToolbarButton.js +0 -3
  77. package/es/components/WebTerminal/WebTerminal.js +18 -19
  78. package/es/components/index.js +2 -2
  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/package-settings.js +2 -1
  82. package/es/global/js/utils/Wrap.js +7 -5
  83. package/es/global/js/utils/getScrollbarWidth.js +14 -0
  84. package/es/settings.js +0 -5
  85. package/lib/components/APIKeyModal/APIKeyModal.js +10 -13
  86. package/lib/components/ActionBar/ActionBar.js +0 -3
  87. package/lib/components/ActionBar/ActionBarItem.js +2 -6
  88. package/lib/components/ActionSet/ActionSet.js +11 -13
  89. package/lib/components/AddSelect/AddSelect.js +126 -72
  90. package/lib/components/AddSelect/AddSelectBreadcrumbs.js +71 -0
  91. package/lib/components/AddSelect/AddSelectList.js +112 -0
  92. package/lib/components/AddSelect/AddSelectSidebar.js +122 -0
  93. package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +5 -5
  94. package/lib/components/ButtonMenu/ButtonMenu.js +6 -4
  95. package/lib/components/ButtonMenu/ButtonMenuItem.js +1 -2
  96. package/lib/components/Card/Card.js +37 -25
  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 +438 -0
  107. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +161 -0
  108. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +80 -0
  109. package/lib/components/DataSpreadsheet/createActiveCellFn.js +56 -0
  110. package/lib/components/DataSpreadsheet/generateData.js +58 -0
  111. package/lib/components/DataSpreadsheet/getCellSize.js +39 -0
  112. package/lib/components/DataSpreadsheet/index.js +13 -0
  113. package/lib/components/EditSidePanel/EditSidePanel.js +9 -10
  114. package/lib/components/EmptyStates/EmptyState.js +10 -9
  115. package/lib/components/EmptyStates/EmptyStateContent.js +2 -2
  116. package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +4 -8
  117. package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +4 -8
  118. package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +4 -8
  119. package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +4 -8
  120. package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +4 -8
  121. package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +4 -8
  122. package/lib/components/ExampleComponent/ExampleComponent.js +12 -13
  123. package/lib/components/ExportModal/ExportModal.js +13 -9
  124. package/lib/components/ExpressiveCard/ExpressiveCard.js +0 -8
  125. package/lib/components/ImportModal/ImportModal.js +7 -5
  126. package/lib/components/InlineEdit/InlineEdit.js +253 -87
  127. package/lib/components/LoadingBar/LoadingBar.js +13 -17
  128. package/lib/components/ModifiedTabs/ModifiedTabLabelNew.js +0 -4
  129. package/lib/components/ModifiedTabs/ModifiedTabLabelWithClose.js +0 -5
  130. package/lib/components/ModifiedTabs/ModifiedTabs.js +24 -18
  131. package/lib/components/NotificationsPanel/NotificationsPanel.js +122 -87
  132. package/lib/components/OptionsTile/OptionsTile.js +6 -9
  133. package/lib/components/PageHeader/PageHeader.js +18 -12
  134. package/lib/components/PageHeader/PageHeaderTitle.js +10 -6
  135. package/lib/components/ProductiveCard/ProductiveCard.js +24 -18
  136. package/lib/components/RemoveModal/RemoveModal.js +0 -3
  137. package/lib/components/SidePanel/SidePanel.js +54 -32
  138. package/lib/components/TagSet/TagSet.js +13 -9
  139. package/lib/components/TagSet/TagSetModal.js +17 -13
  140. package/lib/components/TagSet/TagSetOverflow.js +24 -19
  141. package/lib/components/Tearsheet/Tearsheet.js +26 -17
  142. package/lib/components/Tearsheet/TearsheetNarrow.js +18 -15
  143. package/lib/components/Tearsheet/TearsheetShell.js +2 -3
  144. package/lib/components/Toolbar/ToolbarButton.js +0 -3
  145. package/lib/components/WebTerminal/WebTerminal.js +18 -19
  146. package/lib/components/index.js +8 -8
  147. package/lib/global/js/hooks/index.js +8 -0
  148. package/lib/global/js/hooks/useActiveElement.js +39 -0
  149. package/lib/global/js/package-settings.js +2 -1
  150. package/lib/global/js/utils/Wrap.js +7 -5
  151. package/lib/global/js/utils/getScrollbarWidth.js +23 -0
  152. package/lib/settings.js +0 -6
  153. package/package.json +25 -23
  154. package/scss/components/AddSelect/_add-select.scss +59 -5
  155. package/scss/components/BreadcrumbWithOverflow/_index.scss +1 -1
  156. package/scss/components/CreateInfluencer/_create-influencer.scss +4 -4
  157. package/scss/components/CreateTearsheet/_create-tearsheet.scss +2 -2
  158. package/scss/components/CreateTearsheetNarrow/_storybook-styles.scss +0 -6
  159. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +102 -0
  160. package/scss/components/{CancelableTextEdit → DataSpreadsheet}/_index.scss +2 -2
  161. package/scss/components/DataSpreadsheet/_storybook-styles.scss +6 -0
  162. package/scss/components/EditSidePanel/_storybook-styles.scss +0 -8
  163. package/scss/components/InlineEdit/_inline-edit.scss +293 -10
  164. package/scss/components/InlineEdit/_storybook-styles.scss +12 -6
  165. package/scss/components/LoadingBar/_storybook-styles.scss +0 -5
  166. package/scss/components/NotificationsPanel/_notifications-panel.scss +2 -2
  167. package/scss/components/OptionsTile/_storybook-styles.scss +0 -7
  168. package/scss/components/PageHeader/_index.scss +1 -1
  169. package/scss/components/PageHeader/_page-header.scss +4 -1
  170. package/scss/components/ProductiveCard/_productive-card.scss +0 -4
  171. package/scss/components/SidePanel/_side-panel.scss +15 -6
  172. package/scss/components/StatusIcon/_index.scss +1 -1
  173. package/scss/components/StatusIcon/_status-icon.scss +4 -4
  174. package/scss/components/TagSet/_index.scss +1 -1
  175. package/scss/components/UserProfileImage/_index.scss +1 -1
  176. package/scss/components/UserProfileImage/_user-profile-image.scss +2 -2
  177. package/scss/components/WebTerminal/_web-terminal.scss +2 -2
  178. package/scss/components/_index.scss +1 -1
  179. package/scss/global/styles/_project-settings.scss +5 -1
  180. package/es/components/CancelableTextEdit/CancelableTextEdit.js +0 -245
  181. package/es/generated/feature-flags/feature-flags.js +0 -15
  182. package/lib/components/CancelableTextEdit/CancelableTextEdit.js +0 -265
  183. package/lib/components/CancelableTextEdit/index.js +0 -13
  184. package/lib/generated/feature-flags/feature-flags.js +0 -22
  185. package/scss/components/CancelableTextEdit/_cancelable-text-edit.scss +0 -211
  186. package/scss/components/CancelableTextEdit/_storybook-styles.scss +0 -15
  187. package/scss/generated/feature-flags/_feature-flags.scss +0 -19
@@ -0,0 +1,64 @@
1
+ import _extends from "@babel/runtime/helpers/extends";
2
+
3
+ /**
4
+ * Copyright IBM Corp. 2022, 2022
5
+ *
6
+ * This source code is licensed under the Apache-2.0 license found in the
7
+ * LICENSE file in the root directory of this source tree.
8
+ */
9
+ import React from 'react';
10
+ import PropTypes from 'prop-types';
11
+ import cx from 'classnames';
12
+ import { pkg } from '../../settings';
13
+ var blockClass = "".concat(pkg.prefix, "--data-spreadsheet");
14
+ export var DataSpreadsheetHeader = function DataSpreadsheetHeader(_ref) {
15
+ var defaultColumn = _ref.defaultColumn,
16
+ headerGroups = _ref.headerGroups;
17
+ return /*#__PURE__*/React.createElement("div", {
18
+ className: cx("".concat(blockClass, "__header--container"))
19
+ }, headerGroups.map(function (headerGroup, index) {
20
+ return /*#__PURE__*/React.createElement("div", _extends({
21
+ key: "header_".concat(index)
22
+ }, headerGroup.getHeaderGroupProps(), {
23
+ className: "".concat(blockClass, "__tr")
24
+ }), /*#__PURE__*/React.createElement("button", {
25
+ "data-row-index": "header",
26
+ "data-column-index": "header",
27
+ type: "button",
28
+ tabIndex: -1,
29
+ className: cx("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element")),
30
+ style: {
31
+ width: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeaderWidth,
32
+ height: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeight
33
+ }
34
+ }, "\xA0"), headerGroup.headers.map(function (column, index) {
35
+ return /*#__PURE__*/React.createElement("button", _extends({
36
+ key: "column_".concat(index),
37
+ "data-row-index": "header",
38
+ "data-column-index": index,
39
+ tabIndex: -1,
40
+ style: {
41
+ height: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeight
42
+ }
43
+ }, column.getHeaderProps(), {
44
+ className: cx("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element")),
45
+ type: "button"
46
+ }), column.render('Header'));
47
+ }));
48
+ }));
49
+ };
50
+ DataSpreadsheetHeader.propTypes = {
51
+ /**
52
+ * Default spreadsheet sizing values
53
+ */
54
+ defaultColumn: PropTypes.shape({
55
+ rowHeight: PropTypes.number,
56
+ rowHeaderWidth: PropTypes.number,
57
+ width: PropTypes.number
58
+ }),
59
+
60
+ /**
61
+ * Headers provided from useTable hook
62
+ */
63
+ headerGroups: PropTypes.arrayOf(PropTypes.object)
64
+ };
@@ -0,0 +1,45 @@
1
+ /**
2
+ * Copyright IBM Corp. 2022, 2022
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import { px } from '@carbon/layout';
8
+ import { pkg } from '../../settings';
9
+ export var createActiveCellFn = function createActiveCellFn(_ref) {
10
+ var placementElement = _ref.placementElement,
11
+ coords = _ref.coords,
12
+ _ref$addToHeader = _ref.addToHeader,
13
+ addToHeader = _ref$addToHeader === void 0 ? false : _ref$addToHeader,
14
+ contextRef = _ref.contextRef,
15
+ _ref$blockClass = _ref.blockClass,
16
+ blockClass = _ref$blockClass === void 0 ? "".concat(pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
17
+ onActiveCellChange = _ref.onActiveCellChange,
18
+ activeCellValue = _ref.activeCellValue;
19
+
20
+ if (!coords) {
21
+ return;
22
+ } // If the active cell is in the column header row (very first), we need to append this element
23
+ // to `.${blockClass}__header--container`, otherwise it should be appended to `.${blockClass}__listContainer` firstElementChild
24
+
25
+
26
+ var activeElementContainer = addToHeader ? contextRef === null || contextRef === void 0 ? void 0 : contextRef.current.querySelector(".".concat(blockClass, "__header--container")) : contextRef === null || contextRef === void 0 ? void 0 : contextRef.current.querySelector(".".concat(blockClass, "__list--container")).firstElementChild;
27
+ var relativePosition = {
28
+ top: placementElement.getBoundingClientRect().top - activeElementContainer.getBoundingClientRect().top,
29
+ left: placementElement.getBoundingClientRect().left - activeElementContainer.getBoundingClientRect().left
30
+ };
31
+ var activeCellButton = (contextRef === null || contextRef === void 0 ? void 0 : contextRef.current.querySelector(".".concat(blockClass, "__active-cell--highlight"))) || document.createElement('button');
32
+ activeCellButton.classList.add("".concat(blockClass, "__active-cell--highlight"), "".concat(blockClass, "--interactive-cell-element"));
33
+ activeCellButton.style.width = px(placementElement === null || placementElement === void 0 ? void 0 : placementElement.offsetWidth);
34
+ activeCellButton.style.height = px(placementElement === null || placementElement === void 0 ? void 0 : placementElement.offsetHeight);
35
+ activeCellButton.style.left = px(relativePosition.left);
36
+ activeCellButton.style.top = px(relativePosition.top);
37
+ activeCellButton.setAttribute('data-active-row-index', typeof (coords === null || coords === void 0 ? void 0 : coords.row) === 'number' ? coords.row : 'header');
38
+ activeCellButton.setAttribute('data-active-column-index', typeof (coords === null || coords === void 0 ? void 0 : coords.column) === 'number' ? coords.column : 'header');
39
+ activeElementContainer.appendChild(activeCellButton);
40
+ activeCellButton.focus();
41
+
42
+ if (typeof (coords === null || coords === void 0 ? void 0 : coords.column) === 'number' && typeof (coords === null || coords === void 0 ? void 0 : coords.row) === 'number') {
43
+ onActiveCellChange(activeCellValue);
44
+ }
45
+ };
@@ -0,0 +1,47 @@
1
+ import _defineProperty from "@babel/runtime/helpers/defineProperty";
2
+
3
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
4
+
5
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
6
+
7
+ // cspell:disable
8
+ var pets = ['dog', 'cat', 'bird', 'lizard', 'frog', 'hamster', 'fish', 'rabbit', 'snake'];
9
+ var petNames = ['Bruno', 'Willow', 'Kona', 'Heidi', 'Rusty', 'Bonnie', 'Cash', 'Gucci', 'Brody', 'Emma', 'Loki', 'Angel', 'Astro', 'Sherman', 'Layla', 'Peanut', 'Grace', 'Mickey', 'Sasha', 'Finn', 'Tucker', 'Bear', 'Mocha', 'Roscoe']; // cspell:enable
10
+
11
+ var range = function range(len) {
12
+ var arr = [];
13
+
14
+ for (var i = 0; i < len; i++) {
15
+ arr.push(i);
16
+ }
17
+
18
+ return arr;
19
+ };
20
+
21
+ var newPet = function newPet() {
22
+ return {
23
+ petType: pets[Math.floor(Math.random() * pets.length)],
24
+ firstName: petNames[Math.floor(Math.random() * petNames.length)],
25
+ age: Math.floor(Math.random() * 30),
26
+ visits: Math.floor(Math.random() * 40),
27
+ health: Math.floor(Math.random() * 100)
28
+ };
29
+ };
30
+
31
+ export var generateData = function generateData() {
32
+ for (var _len = arguments.length, lens = new Array(_len), _key = 0; _key < _len; _key++) {
33
+ lens[_key] = arguments[_key];
34
+ }
35
+
36
+ var makeDataLevel = function makeDataLevel() {
37
+ var depth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
38
+ var len = lens[depth];
39
+ return range(len).map(function () {
40
+ return _objectSpread(_objectSpread({}, newPet()), {}, {
41
+ subRows: lens[depth + 1] ? makeDataLevel(depth + 1) : undefined
42
+ });
43
+ });
44
+ };
45
+
46
+ return makeDataLevel();
47
+ };
@@ -0,0 +1,30 @@
1
+ /**
2
+ * Copyright IBM Corp. 2022, 2022
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import { baseFontSize, sizeXSmall as compact, sizeSmall as standard, sizeMedium as medium, sizeLarge as large } from '@carbon/layout';
8
+
9
+ var getSizeInPixels = function getSizeInPixels(carbonSize) {
10
+ return Number(carbonSize.replace('rem', '') * baseFontSize);
11
+ };
12
+
13
+ export var getCellSize = function getCellSize(cellSize) {
14
+ switch (cellSize) {
15
+ case 'compact':
16
+ return getSizeInPixels(compact);
17
+
18
+ case 'standard':
19
+ return getSizeInPixels(standard);
20
+
21
+ case 'medium':
22
+ return getSizeInPixels(medium);
23
+
24
+ case 'large':
25
+ return getSizeInPixels(large);
26
+
27
+ default:
28
+ return getSizeInPixels(standard);
29
+ }
30
+ };
@@ -1,7 +1,7 @@
1
1
  /**
2
- * Copyright IBM Corp. 2021, 2021
2
+ * Copyright IBM Corp. 2022, 2022
3
3
  *
4
4
  * This source code is licensed under the Apache-2.0 license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- export { CancelableTextEdit } from './CancelableTextEdit';
7
+ export { DataSpreadsheet } from './DataSpreadsheet';
@@ -31,7 +31,12 @@ import '../../global/js/utils/props-helper'; // The block part of our convention
31
31
  var blockClass = "".concat(pkg.prefix, "--edit-side-panel");
32
32
  var sidePanelBlockClass = "".concat(pkg.prefix, "--side-panel");
33
33
  var componentName = 'EditSidePanel'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
34
+ // Default values for props
34
35
 
36
+ var defaults = {
37
+ placement: 'right',
38
+ size: 'md'
39
+ };
35
40
  /**
36
41
  * TODO: A description of the component.
37
42
  */
@@ -45,12 +50,14 @@ export var EditSidePanel = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
45
50
  onRequestClose = _ref.onRequestClose,
46
51
  onRequestSubmit = _ref.onRequestSubmit,
47
52
  open = _ref.open,
48
- placement = _ref.placement,
53
+ _ref$placement = _ref.placement,
54
+ placement = _ref$placement === void 0 ? defaults.placement : _ref$placement,
49
55
  primaryButtonText = _ref.primaryButtonText,
50
56
  secondaryButtonText = _ref.secondaryButtonText,
51
57
  selectorPrimaryFocus = _ref.selectorPrimaryFocus,
52
58
  selectorPageContent = _ref.selectorPageContent,
53
- size = _ref.size,
59
+ _ref$size = _ref.size,
60
+ size = _ref$size === void 0 ? defaults.size : _ref$size,
54
61
  slideIn = _ref.slideIn,
55
62
  subtitle = _ref.subtitle,
56
63
  title = _ref.title,
@@ -198,12 +205,4 @@ EditSidePanel.propTypes = {
198
205
  * The title of the CreateSidePanel is usually the product or service name.
199
206
  */
200
207
  title: PropTypes.node.isRequired
201
- }; // Default values for component props. Default values are not required for
202
- // props that are required, nor for props where the component can apply
203
- // 'undefined' values reasonably. Default values should be provided when the
204
- // component needs to make a choice or assumption when a prop is not supplied.
205
-
206
- EditSidePanel.defaultProps = {
207
- placement: 'right',
208
- size: 'md'
209
208
  };
@@ -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
@@ -107,12 +109,11 @@ EmptyState.propTypes = {
107
109
  /**
108
110
  * Empty state subtext
109
111
  */
110
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
112
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
111
113
 
112
114
  /**
113
115
  * Empty state heading
114
116
  */
115
117
  title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired
116
118
  };
117
- EmptyState.defaultProps = EmptyStateDefaultProps;
118
119
  EmptyState.displayName = componentName;
@@ -30,7 +30,7 @@ export var EmptyStateContent = function EmptyStateContent(_ref) {
30
30
  title = _ref.title;
31
31
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("h3", {
32
32
  className: cx("".concat(blockClass, "__header"), _defineProperty({}, "".concat(blockClass, "__header--small"), size === 'sm'))
33
- }, title), /*#__PURE__*/React.createElement("p", {
33
+ }, title), subtitle && /*#__PURE__*/React.createElement("p", {
34
34
  className: cx("".concat(blockClass, "__subtitle"), _defineProperty({}, "".concat(blockClass, "__subtitle--small"), size === 'sm'))
35
35
  }, subtitle), (action === null || action === void 0 ? void 0 : action.text) && (action === null || action === void 0 ? void 0 : action.onClick) && /*#__PURE__*/React.createElement(Button, _extends({}, action, {
36
36
  className: "".concat(blockClass, "__action-button"),
@@ -76,7 +76,7 @@ EmptyStateContent.propTypes = {
76
76
  /**
77
77
  * Empty state subtitle
78
78
  */
79
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
79
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
80
80
 
81
81
  /**
82
82
  * Empty state title
@@ -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);
@@ -99,15 +100,10 @@ ErrorEmptyState.propTypes = {
99
100
  /**
100
101
  * Empty state subtitle
101
102
  */
102
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
103
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
103
104
 
104
105
  /**
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);
@@ -99,15 +100,10 @@ NoDataEmptyState.propTypes = {
99
100
  /**
100
101
  * Empty state subtitle
101
102
  */
102
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
103
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
103
104
 
104
105
  /**
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);
@@ -99,15 +100,10 @@ NoTagsEmptyState.propTypes = {
99
100
  /**
100
101
  * Empty state subtitle
101
102
  */
102
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
103
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
103
104
 
104
105
  /**
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);
@@ -99,15 +100,10 @@ NotFoundEmptyState.propTypes = {
99
100
  /**
100
101
  * Empty state subtitle
101
102
  */
102
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
103
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
103
104
 
104
105
  /**
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);
@@ -99,15 +100,10 @@ NotificationsEmptyState.propTypes = {
99
100
  /**
100
101
  * Empty state subtitle
101
102
  */
102
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
103
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
103
104
 
104
105
  /**
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);
@@ -99,15 +100,10 @@ UnauthorizedEmptyState.propTypes = {
99
100
  /**
100
101
  * Empty state subtitle
101
102
  */
102
- subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
103
+ subtitle: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
103
104
 
104
105
  /**
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;