@carbon/ibm-products 1.6.1 → 1.9.0
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.
- package/css/index-full-carbon.css +224 -143
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +3 -3
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +1 -2
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +178 -142
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +3 -3
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +178 -142
- package/css/index.css.map +1 -1
- package/css/index.min.css +3 -3
- package/css/index.min.css.map +1 -1
- package/es/components/APIKeyModal/APIKeyModal.js +10 -13
- package/es/components/ActionBar/ActionBar.js +0 -3
- package/es/components/ActionBar/ActionBarItem.js +2 -6
- package/es/components/ActionSet/ActionSet.js +11 -13
- package/es/components/AddSelect/AddSelect.js +121 -25
- package/es/components/AddSelect/AddSelectBreadcrumbs.js +5 -5
- package/es/components/AddSelect/AddSelectColumn.js +21 -0
- package/es/components/AddSelect/AddSelectList.js +68 -9
- package/es/components/AddSelect/AddSelectSidebar.js +43 -5
- package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +0 -3
- package/es/components/ButtonMenu/ButtonMenu.js +6 -4
- package/es/components/ButtonMenu/ButtonMenuItem.js +1 -2
- package/es/components/Card/Card.js +31 -21
- package/es/components/Card/CardFooter.js +14 -10
- package/es/components/Card/CardHeader.js +8 -6
- package/es/components/Cascade/Cascade.js +5 -4
- package/es/components/ComboButton/ComboButton.js +0 -4
- package/es/components/ComboButton/ComboButtonItem/index.js +0 -5
- package/es/components/CreateFullPage/CreateFullPageStep.js +15 -8
- package/es/components/CreateModal/CreateModal.js +1 -4
- package/es/components/CreateTearsheet/CreateTearsheet.js +10 -11
- package/es/components/CreateTearsheet/CreateTearsheetStep.js +18 -14
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +454 -0
- package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +322 -0
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +64 -0
- package/es/components/DataSpreadsheet/createActiveCellFn.js +45 -0
- package/es/components/DataSpreadsheet/createCellSelectionArea.js +45 -0
- package/es/components/DataSpreadsheet/generateData.js +47 -0
- package/es/components/DataSpreadsheet/getCellSize.js +30 -0
- package/es/components/{CancelableTextEdit → DataSpreadsheet}/index.js +2 -2
- package/es/components/EditSidePanel/EditSidePanel.js +9 -10
- package/es/components/EmptyStates/EmptyState.js +7 -6
- package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +4 -8
- package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +4 -8
- package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +4 -8
- package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +4 -8
- package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +4 -8
- package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +4 -8
- package/es/components/ExampleComponent/ExampleComponent.js +12 -13
- package/es/components/ExportModal/ExportModal.js +13 -9
- package/es/components/ExpressiveCard/ExpressiveCard.js +0 -8
- package/es/components/ImportModal/ImportModal.js +7 -5
- package/es/components/InlineEdit/InlineEdit.js +51 -46
- package/es/components/LoadingBar/LoadingBar.js +13 -17
- package/es/components/ModifiedTabs/ModifiedTabLabelNew.js +0 -4
- package/es/components/ModifiedTabs/ModifiedTabLabelWithClose.js +0 -5
- package/es/components/ModifiedTabs/ModifiedTabs.js +24 -18
- package/es/components/NotificationsPanel/NotificationsPanel.js +109 -86
- package/es/components/OptionsTile/OptionsTile.js +6 -9
- package/es/components/PageHeader/PageHeader.js +10 -7
- package/es/components/ProductiveCard/ProductiveCard.js +23 -12
- package/es/components/RemoveModal/RemoveModal.js +0 -3
- package/es/components/SidePanel/SidePanel.js +22 -17
- package/es/components/TagSet/TagSet.js +13 -9
- package/es/components/TagSet/TagSetModal.js +16 -12
- package/es/components/TagSet/TagSetOverflow.js +21 -13
- package/es/components/Tearsheet/Tearsheet.js +27 -18
- package/es/components/Tearsheet/TearsheetNarrow.js +18 -15
- package/es/components/Tearsheet/TearsheetShell.js +3 -4
- package/es/components/Toolbar/ToolbarButton.js +0 -3
- package/es/components/WebTerminal/WebTerminal.js +17 -18
- package/es/components/index.js +2 -2
- package/es/global/js/hooks/index.js +1 -0
- package/es/global/js/hooks/useActiveElement.js +27 -0
- package/es/global/js/package-settings.js +2 -1
- package/es/global/js/utils/DisplayBox.js +31 -0
- package/es/global/js/utils/Wrap.js +7 -5
- package/es/global/js/utils/deepCloneObject.js +26 -0
- package/es/global/js/utils/getScrollbarWidth.js +14 -0
- package/lib/components/APIKeyModal/APIKeyModal.js +10 -13
- package/lib/components/ActionBar/ActionBar.js +0 -3
- package/lib/components/ActionBar/ActionBarItem.js +2 -6
- package/lib/components/ActionSet/ActionSet.js +11 -13
- package/lib/components/AddSelect/AddSelect.js +119 -24
- package/lib/components/AddSelect/AddSelectBreadcrumbs.js +3 -4
- package/lib/components/AddSelect/AddSelectColumn.js +37 -0
- package/lib/components/AddSelect/AddSelectList.js +66 -9
- package/lib/components/AddSelect/AddSelectSidebar.js +43 -4
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +0 -3
- package/lib/components/ButtonMenu/ButtonMenu.js +6 -4
- package/lib/components/ButtonMenu/ButtonMenuItem.js +1 -2
- package/lib/components/Card/Card.js +31 -21
- package/lib/components/Card/CardFooter.js +14 -10
- package/lib/components/Card/CardHeader.js +8 -6
- package/lib/components/Cascade/Cascade.js +5 -4
- package/lib/components/ComboButton/ComboButton.js +0 -4
- package/lib/components/ComboButton/ComboButtonItem/index.js +0 -5
- package/lib/components/CreateFullPage/CreateFullPageStep.js +17 -14
- package/lib/components/CreateModal/CreateModal.js +1 -4
- package/lib/components/CreateTearsheet/CreateTearsheet.js +10 -11
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +20 -20
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +478 -0
- package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +349 -0
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +80 -0
- package/lib/components/DataSpreadsheet/createActiveCellFn.js +56 -0
- package/lib/components/DataSpreadsheet/createCellSelectionArea.js +56 -0
- package/lib/components/DataSpreadsheet/generateData.js +58 -0
- package/lib/components/DataSpreadsheet/getCellSize.js +39 -0
- package/lib/components/DataSpreadsheet/index.js +13 -0
- package/lib/components/EditSidePanel/EditSidePanel.js +9 -10
- package/lib/components/EmptyStates/EmptyState.js +9 -8
- package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +3 -7
- package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +3 -7
- package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +3 -7
- package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +3 -7
- package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +3 -7
- package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +3 -7
- package/lib/components/ExampleComponent/ExampleComponent.js +12 -13
- package/lib/components/ExportModal/ExportModal.js +13 -9
- package/lib/components/ExpressiveCard/ExpressiveCard.js +0 -8
- package/lib/components/ImportModal/ImportModal.js +7 -5
- package/lib/components/InlineEdit/InlineEdit.js +51 -46
- package/lib/components/LoadingBar/LoadingBar.js +13 -17
- package/lib/components/ModifiedTabs/ModifiedTabLabelNew.js +0 -4
- package/lib/components/ModifiedTabs/ModifiedTabLabelWithClose.js +0 -5
- package/lib/components/ModifiedTabs/ModifiedTabs.js +24 -18
- package/lib/components/NotificationsPanel/NotificationsPanel.js +109 -86
- package/lib/components/OptionsTile/OptionsTile.js +6 -9
- package/lib/components/PageHeader/PageHeader.js +9 -6
- package/lib/components/ProductiveCard/ProductiveCard.js +24 -18
- package/lib/components/RemoveModal/RemoveModal.js +0 -3
- package/lib/components/SidePanel/SidePanel.js +22 -17
- package/lib/components/TagSet/TagSet.js +13 -9
- package/lib/components/TagSet/TagSetModal.js +17 -13
- package/lib/components/TagSet/TagSetOverflow.js +24 -19
- package/lib/components/Tearsheet/Tearsheet.js +26 -17
- package/lib/components/Tearsheet/TearsheetNarrow.js +18 -15
- package/lib/components/Tearsheet/TearsheetShell.js +2 -3
- package/lib/components/Toolbar/ToolbarButton.js +0 -3
- package/lib/components/WebTerminal/WebTerminal.js +17 -18
- package/lib/components/index.js +8 -8
- package/lib/global/js/hooks/index.js +8 -0
- package/lib/global/js/hooks/useActiveElement.js +39 -0
- package/lib/global/js/package-settings.js +2 -1
- package/lib/global/js/utils/DisplayBox.js +46 -0
- package/lib/global/js/utils/Wrap.js +7 -5
- package/lib/global/js/utils/deepCloneObject.js +37 -0
- package/lib/global/js/utils/getScrollbarWidth.js +23 -0
- package/package.json +18 -16
- package/scss/components/{CancelableTextEdit → ActionBar}/_storybook-styles.scss +2 -2
- package/scss/components/ActionSet/_storybook-styles.scss +1 -3
- package/scss/components/AddSelect/_add-select.scss +77 -1
- package/scss/components/BreadcrumbWithOverflow/_storybook-styles.scss +8 -0
- package/scss/components/ButtonSetWithOverflow/_storybook-styles.scss +8 -0
- package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +120 -0
- package/scss/components/{CancelableTextEdit → DataSpreadsheet}/_index.scss +2 -2
- package/scss/components/DataSpreadsheet/_storybook-styles.scss +6 -0
- package/scss/components/InlineEdit/_inline-edit.scss +22 -8
- package/scss/components/InlineEdit/_storybook-styles.scss +1 -0
- package/scss/components/TagSet/_storybook-styles.scss +8 -0
- package/scss/components/Tearsheet/_tearsheet.scss +1 -2
- package/scss/components/_index.scss +1 -1
- package/scss/global/styles/_display-box.scss +62 -0
- package/es/components/CancelableTextEdit/CancelableTextEdit.js +0 -245
- package/lib/components/CancelableTextEdit/CancelableTextEdit.js +0 -265
- package/lib/components/CancelableTextEdit/index.js +0 -13
- package/scss/components/CancelableTextEdit/_cancelable-text-edit.scss +0 -212
|
@@ -2,14 +2,20 @@ 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 = ["className", "description", "influencerTitle", "inputPlaceholder", "items", "itemsLabel", "multi", "noResultsDescription", "noResultsTitle", "noSelectionDescription", "noSelectionTitle", "onClose", "onCloseButtonText", "onSearchFilter", "onSubmit", "onSubmitButtonText", "open", "title"]
|
|
5
|
+
var _excluded = ["className", "description", "influencerTitle", "inputPlaceholder", "items", "itemsLabel", "multi", "noResultsDescription", "noResultsTitle", "noSelectionDescription", "noSelectionTitle", "onClose", "onCloseButtonText", "onSearchFilter", "onSubmit", "onSubmitButtonText", "open", "removeIconDescription", "textInputLabel", "title"],
|
|
6
|
+
_excluded2 = ["children"];
|
|
7
|
+
|
|
8
|
+
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; }
|
|
9
|
+
|
|
10
|
+
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; }
|
|
11
|
+
|
|
6
12
|
//
|
|
7
13
|
// Copyright IBM Corp. 2022
|
|
8
14
|
//
|
|
9
15
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
10
16
|
// LICENSE file in the root directory of this source tree.
|
|
11
17
|
//
|
|
12
|
-
import React, { forwardRef, useState } from 'react';
|
|
18
|
+
import React, { forwardRef, useState, useEffect } from 'react';
|
|
13
19
|
import PropTypes from 'prop-types';
|
|
14
20
|
import cx from 'classnames';
|
|
15
21
|
import { TextInput, Tag } from 'carbon-components-react';
|
|
@@ -19,7 +25,12 @@ import { pkg } from '../../settings';
|
|
|
19
25
|
import { AddSelectSidebar } from './AddSelectSidebar';
|
|
20
26
|
import { AddSelectBreadcrumbs } from './AddSelectBreadcrumbs';
|
|
21
27
|
import { AddSelectList } from './AddSelectList';
|
|
22
|
-
|
|
28
|
+
import { AddSelectColumn } from './AddSelectColumn';
|
|
29
|
+
var componentName = 'AddSelect'; // Default values for props
|
|
30
|
+
|
|
31
|
+
var defaults = {
|
|
32
|
+
items: Object.freeze([])
|
|
33
|
+
};
|
|
23
34
|
export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
24
35
|
var _cx;
|
|
25
36
|
|
|
@@ -27,7 +38,8 @@ export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
27
38
|
description = _ref.description,
|
|
28
39
|
influencerTitle = _ref.influencerTitle,
|
|
29
40
|
inputPlaceholder = _ref.inputPlaceholder,
|
|
30
|
-
items = _ref.items,
|
|
41
|
+
_ref$items = _ref.items,
|
|
42
|
+
items = _ref$items === void 0 ? defaults.items : _ref$items,
|
|
31
43
|
itemsLabel = _ref.itemsLabel,
|
|
32
44
|
multi = _ref.multi,
|
|
33
45
|
noResultsDescription = _ref.noResultsDescription,
|
|
@@ -40,6 +52,8 @@ export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
40
52
|
onSubmit = _ref.onSubmit,
|
|
41
53
|
onSubmitButtonText = _ref.onSubmitButtonText,
|
|
42
54
|
open = _ref.open,
|
|
55
|
+
removeIconDescription = _ref.removeIconDescription,
|
|
56
|
+
textInputLabel = _ref.textInputLabel,
|
|
43
57
|
title = _ref.title,
|
|
44
58
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
45
59
|
|
|
@@ -63,7 +77,79 @@ export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
63
77
|
var _useState7 = useState(''),
|
|
64
78
|
_useState8 = _slicedToArray(_useState7, 2),
|
|
65
79
|
searchTerm = _useState8[0],
|
|
66
|
-
setSearchTerm = _useState8[1];
|
|
80
|
+
setSearchTerm = _useState8[1];
|
|
81
|
+
|
|
82
|
+
var _useState9 = useState({}),
|
|
83
|
+
_useState10 = _slicedToArray(_useState9, 2),
|
|
84
|
+
normalizedItems = _useState10[0],
|
|
85
|
+
setNormalizedItems = _useState10[1];
|
|
86
|
+
|
|
87
|
+
var _useState11 = useState(false),
|
|
88
|
+
_useState12 = _slicedToArray(_useState11, 2),
|
|
89
|
+
useNormalizedItems = _useState12[0],
|
|
90
|
+
setUsedNormalizedItems = _useState12[1];
|
|
91
|
+
|
|
92
|
+
useEffect(function () {
|
|
93
|
+
var normalize = function normalize(arr, parentId) {
|
|
94
|
+
return arr.reduce(function (acc, cur) {
|
|
95
|
+
var children = cur.children,
|
|
96
|
+
item = _objectWithoutProperties(cur, _excluded2);
|
|
97
|
+
|
|
98
|
+
acc[cur.id] = _objectSpread({}, item);
|
|
99
|
+
|
|
100
|
+
if (parentId) {
|
|
101
|
+
acc[cur.id].parent = parentId;
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
if (children) {
|
|
105
|
+
acc[cur.id].children = children.map(function (child) {
|
|
106
|
+
return child.id;
|
|
107
|
+
});
|
|
108
|
+
var child = normalize(children, cur.id);
|
|
109
|
+
return _objectSpread(_objectSpread({}, acc), child);
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
return acc;
|
|
113
|
+
}, {});
|
|
114
|
+
};
|
|
115
|
+
|
|
116
|
+
if (multi && items.find(function (item) {
|
|
117
|
+
return item.children;
|
|
118
|
+
})) {
|
|
119
|
+
var newItems = normalize(items);
|
|
120
|
+
setNormalizedItems(newItems);
|
|
121
|
+
setUsedNormalizedItems(true);
|
|
122
|
+
}
|
|
123
|
+
}, [items, multi]);
|
|
124
|
+
|
|
125
|
+
var getPages = function getPages() {
|
|
126
|
+
var results = [];
|
|
127
|
+
var itemIds = Object.keys(normalizedItems);
|
|
128
|
+
var topLevelItems = [];
|
|
129
|
+
itemIds.forEach(function (itemId) {
|
|
130
|
+
if (!normalizedItems[itemId].parent) {
|
|
131
|
+
topLevelItems.push(normalizedItems[itemId]);
|
|
132
|
+
}
|
|
133
|
+
});
|
|
134
|
+
results.push(topLevelItems);
|
|
135
|
+
|
|
136
|
+
if (path.length) {
|
|
137
|
+
var pathIds = path.map(function (p) {
|
|
138
|
+
return p.id;
|
|
139
|
+
});
|
|
140
|
+
pathIds.forEach(function (pathId) {
|
|
141
|
+
var childItems = [];
|
|
142
|
+
itemIds.forEach(function (itemId) {
|
|
143
|
+
if (normalizedItems[itemId].parent === pathId) {
|
|
144
|
+
childItems.push(normalizedItems[itemId]);
|
|
145
|
+
}
|
|
146
|
+
});
|
|
147
|
+
results.push(childItems);
|
|
148
|
+
});
|
|
149
|
+
}
|
|
150
|
+
|
|
151
|
+
return results;
|
|
152
|
+
}; // handlers
|
|
67
153
|
|
|
68
154
|
|
|
69
155
|
var handleSearch = function handleSearch(e) {
|
|
@@ -95,18 +181,27 @@ export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
95
181
|
} // otherwise use the default label filter
|
|
96
182
|
|
|
97
183
|
|
|
98
|
-
return item.
|
|
184
|
+
return item.title.toLowerCase().includes(searchTerm);
|
|
99
185
|
});
|
|
100
186
|
return results;
|
|
101
187
|
};
|
|
102
188
|
|
|
103
|
-
var
|
|
189
|
+
var itemsToDisplay = useNormalizedItems ? getPages() : getFilteredItems();
|
|
190
|
+
var commonListProps = {
|
|
191
|
+
multi: multi,
|
|
192
|
+
multiSelection: multiSelection,
|
|
193
|
+
path: path,
|
|
194
|
+
setMultiSelection: setMultiSelection,
|
|
195
|
+
setPath: setPath,
|
|
196
|
+
setSingleSelection: setSingleSelection,
|
|
197
|
+
singleSelection: singleSelection
|
|
198
|
+
}; // main content
|
|
104
199
|
|
|
105
200
|
var body = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
|
|
106
201
|
className: "".concat(blockClass, "__header")
|
|
107
202
|
}, /*#__PURE__*/React.createElement(TextInput, {
|
|
108
203
|
id: "temp-id",
|
|
109
|
-
labelText:
|
|
204
|
+
labelText: textInputLabel,
|
|
110
205
|
placeholder: inputPlaceholder,
|
|
111
206
|
value: searchTerm,
|
|
112
207
|
onChange: handleSearch
|
|
@@ -118,25 +213,25 @@ export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
118
213
|
setPath: setPath
|
|
119
214
|
}) : /*#__PURE__*/React.createElement("p", {
|
|
120
215
|
className: "".concat(blockClass, "__items-label")
|
|
121
|
-
}, itemsLabel), /*#__PURE__*/React.createElement(Tag, {
|
|
216
|
+
}, itemsLabel), !useNormalizedItems && /*#__PURE__*/React.createElement(Tag, {
|
|
122
217
|
type: "gray",
|
|
123
218
|
size: "sm",
|
|
124
219
|
className: "".concat(blockClass, "__items-label-tag")
|
|
125
|
-
},
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
}) : /*#__PURE__*/React.createElement("div", {
|
|
220
|
+
}, itemsToDisplay.length))), useNormalizedItems ? /*#__PURE__*/React.createElement("div", {
|
|
221
|
+
className: "".concat(blockClass, "__columns")
|
|
222
|
+
}, itemsToDisplay.map(function (page, idx) {
|
|
223
|
+
return /*#__PURE__*/React.createElement(AddSelectColumn, _extends({}, commonListProps, {
|
|
224
|
+
key: idx,
|
|
225
|
+
filteredItems: page
|
|
226
|
+
}));
|
|
227
|
+
})) : /*#__PURE__*/React.createElement("div", null, itemsToDisplay.length > 0 ? /*#__PURE__*/React.createElement(AddSelectList, _extends({}, commonListProps, {
|
|
228
|
+
filteredItems: itemsToDisplay
|
|
229
|
+
})) : /*#__PURE__*/React.createElement("div", {
|
|
135
230
|
className: "".concat(blockClass, "__body")
|
|
136
231
|
}, /*#__PURE__*/React.createElement(NoDataEmptyState, {
|
|
137
232
|
subtitle: noResultsDescription,
|
|
138
233
|
title: noResultsTitle
|
|
139
|
-
})));
|
|
234
|
+
}))));
|
|
140
235
|
var commonTearsheetProps = {
|
|
141
236
|
open: open,
|
|
142
237
|
title: title,
|
|
@@ -158,7 +253,9 @@ export var AddSelect = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
158
253
|
items: items,
|
|
159
254
|
multiSelection: multiSelection,
|
|
160
255
|
noSelectionDescription: noSelectionDescription,
|
|
161
|
-
noSelectionTitle: noSelectionTitle
|
|
256
|
+
noSelectionTitle: noSelectionTitle,
|
|
257
|
+
removeIconDescription: removeIconDescription,
|
|
258
|
+
setMultiSelection: setMultiSelection
|
|
162
259
|
};
|
|
163
260
|
var classNames = cx(className, blockClass, (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__single"), !multi), _defineProperty(_cx, "".concat(blockClass, "__multi"), multi), _cx));
|
|
164
261
|
return /*#__PURE__*/React.createElement("div", _extends({
|
|
@@ -176,7 +273,7 @@ AddSelect.propTypes = {
|
|
|
176
273
|
inputPlaceholder: PropTypes.string,
|
|
177
274
|
items: PropTypes.arrayOf(PropTypes.shape({
|
|
178
275
|
id: PropTypes.string.isRequired,
|
|
179
|
-
|
|
276
|
+
title: PropTypes.string.isRequired,
|
|
180
277
|
value: PropTypes.string.isRequired
|
|
181
278
|
})),
|
|
182
279
|
itemsLabel: PropTypes.string,
|
|
@@ -191,9 +288,8 @@ AddSelect.propTypes = {
|
|
|
191
288
|
onSubmit: PropTypes.func,
|
|
192
289
|
onSubmitButtonText: PropTypes.string,
|
|
193
290
|
open: PropTypes.bool,
|
|
291
|
+
removeIconDescription: PropTypes.string,
|
|
292
|
+
textInputLabel: PropTypes.string,
|
|
194
293
|
title: PropTypes.string
|
|
195
294
|
};
|
|
196
|
-
AddSelect.defaultProps = {
|
|
197
|
-
items: []
|
|
198
|
-
};
|
|
199
295
|
AddSelect.displayName = componentName;
|
|
@@ -15,12 +15,12 @@ export var AddSelectBreadcrumbs = function AddSelectBreadcrumbs(_ref) {
|
|
|
15
15
|
setPath = _ref.setPath;
|
|
16
16
|
|
|
17
17
|
var clickHandler = function clickHandler(id) {
|
|
18
|
-
var
|
|
19
|
-
|
|
20
|
-
var pathIdx = newPath.findIndex(function (entry) {
|
|
18
|
+
var pathIdx = path.findIndex(function (entry) {
|
|
21
19
|
return entry.id === id;
|
|
22
20
|
});
|
|
23
|
-
|
|
21
|
+
|
|
22
|
+
var finalPath = _toConsumableArray(path).splice(0, pathIdx + 1);
|
|
23
|
+
|
|
24
24
|
setPath(finalPath);
|
|
25
25
|
};
|
|
26
26
|
|
|
@@ -45,7 +45,7 @@ export var AddSelectBreadcrumbs = function AddSelectBreadcrumbs(_ref) {
|
|
|
45
45
|
key: entry.id,
|
|
46
46
|
isCurrentPage: isCurrentPage,
|
|
47
47
|
onClick: crumbHandler
|
|
48
|
-
}, entry.
|
|
48
|
+
}, entry.title);
|
|
49
49
|
}));
|
|
50
50
|
};
|
|
51
51
|
AddSelectBreadcrumbs.propTypes = {
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import _extends from "@babel/runtime/helpers/extends";
|
|
2
|
+
//
|
|
3
|
+
// Copyright IBM Corp. 2022
|
|
4
|
+
//
|
|
5
|
+
// This source code is licensed under the Apache-2.0 license found in the
|
|
6
|
+
// LICENSE file in the root directory of this source tree.
|
|
7
|
+
//
|
|
8
|
+
import React from 'react'; // import PropTypes from 'prop-types';
|
|
9
|
+
|
|
10
|
+
import { pkg } from '../../settings';
|
|
11
|
+
import { AddSelectList } from './AddSelectList';
|
|
12
|
+
var componentName = 'AddSelect';
|
|
13
|
+
export var AddSelectColumn = function AddSelectColumn(props) {
|
|
14
|
+
var blockClass = "".concat(pkg.prefix, "--add-select__col");
|
|
15
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
16
|
+
className: blockClass
|
|
17
|
+
}, /*#__PURE__*/React.createElement(AddSelectList, _extends({}, props, {
|
|
18
|
+
inColumn: true
|
|
19
|
+
})));
|
|
20
|
+
};
|
|
21
|
+
AddSelectColumn.displayName = componentName;
|
|
@@ -13,6 +13,7 @@ import { pkg } from '../../settings';
|
|
|
13
13
|
var componentName = 'AddSelectList';
|
|
14
14
|
export var AddSelectList = function AddSelectList(_ref) {
|
|
15
15
|
var filteredItems = _ref.filteredItems,
|
|
16
|
+
inColumn = _ref.inColumn,
|
|
16
17
|
multi = _ref.multi,
|
|
17
18
|
multiSelection = _ref.multiSelection,
|
|
18
19
|
path = _ref.path,
|
|
@@ -41,11 +42,61 @@ export var AddSelectList = function AddSelectList(_ref) {
|
|
|
41
42
|
|
|
42
43
|
var onNavigateItem = function onNavigateItem(_ref2) {
|
|
43
44
|
var id = _ref2.id,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
45
|
+
title = _ref2.title,
|
|
46
|
+
parent = _ref2.parent;
|
|
47
|
+
|
|
48
|
+
// if multi select
|
|
49
|
+
if (multi) {
|
|
50
|
+
// if top level reset the path
|
|
51
|
+
if (!parent) {
|
|
52
|
+
setPath([{
|
|
53
|
+
id: id,
|
|
54
|
+
title: title
|
|
55
|
+
}]);
|
|
56
|
+
} else {
|
|
57
|
+
var pathIds = path.map(function (p) {
|
|
58
|
+
return p.id;
|
|
59
|
+
}); // if item is already selected somewhere go back to that item
|
|
60
|
+
|
|
61
|
+
if (pathIds.includes(id)) {
|
|
62
|
+
var pathIdx = pathIds.findIndex(function (pathId) {
|
|
63
|
+
return pathId === id;
|
|
64
|
+
});
|
|
65
|
+
|
|
66
|
+
var newPath = _toConsumableArray(path).splice(0, pathIdx + 1);
|
|
67
|
+
|
|
68
|
+
setPath(_toConsumableArray(newPath));
|
|
69
|
+
} else {
|
|
70
|
+
// if the item is on the same level as another selected item start from the parent level
|
|
71
|
+
if (path.find(function (p) {
|
|
72
|
+
return p.parent === parent;
|
|
73
|
+
})) {
|
|
74
|
+
var parentIdx = path.findIndex(function (p) {
|
|
75
|
+
return p.id === parent;
|
|
76
|
+
});
|
|
77
|
+
|
|
78
|
+
var _newPath = _toConsumableArray(path).splice(0, parentIdx + 1);
|
|
79
|
+
|
|
80
|
+
setPath([].concat(_toConsumableArray(_newPath), [{
|
|
81
|
+
id: id,
|
|
82
|
+
title: title,
|
|
83
|
+
parent: parent
|
|
84
|
+
}]));
|
|
85
|
+
} else {
|
|
86
|
+
setPath([].concat(_toConsumableArray(path), [{
|
|
87
|
+
id: id,
|
|
88
|
+
title: title,
|
|
89
|
+
parent: parent
|
|
90
|
+
}]));
|
|
91
|
+
}
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
} else {
|
|
95
|
+
setPath([].concat(_toConsumableArray(path), [{
|
|
96
|
+
id: id,
|
|
97
|
+
title: title
|
|
98
|
+
}]));
|
|
99
|
+
}
|
|
49
100
|
};
|
|
50
101
|
|
|
51
102
|
return /*#__PURE__*/React.createElement("div", {
|
|
@@ -55,15 +106,22 @@ export var AddSelectList = function AddSelectList(_ref) {
|
|
|
55
106
|
className: "".concat(blockClass)
|
|
56
107
|
}, /*#__PURE__*/React.createElement(StructuredListBody, null, filteredItems.map(function (item) {
|
|
57
108
|
return /*#__PURE__*/React.createElement(StructuredListRow, {
|
|
58
|
-
key: item.id
|
|
59
|
-
|
|
109
|
+
key: item.id,
|
|
110
|
+
className: "".concat(blockClass, "-row")
|
|
111
|
+
}, /*#__PURE__*/React.createElement(StructuredListCell, {
|
|
112
|
+
className: "".concat(blockClass, "-cell")
|
|
113
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
60
114
|
className: "".concat(blockClass, "-cell-wrapper")
|
|
61
115
|
}, multi ? /*#__PURE__*/React.createElement(Checkbox, {
|
|
62
116
|
className: "".concat(blockClass, "-checkbox"),
|
|
63
117
|
onChange: function onChange(value) {
|
|
64
118
|
return handleMultiSelection(item.id, value);
|
|
65
119
|
},
|
|
66
|
-
labelText:
|
|
120
|
+
labelText: !inColumn ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
|
|
121
|
+
className: "".concat(blockClass, "-cell-title")
|
|
122
|
+
}, item.title), /*#__PURE__*/React.createElement("span", {
|
|
123
|
+
className: "".concat(blockClass, "-cell-subtitle")
|
|
124
|
+
}, item.subtitle)) : item.title,
|
|
67
125
|
id: item.id,
|
|
68
126
|
checked: multiSelection.includes(item.id)
|
|
69
127
|
}) : /*#__PURE__*/React.createElement(RadioButton, {
|
|
@@ -71,7 +129,7 @@ export var AddSelectList = function AddSelectList(_ref) {
|
|
|
71
129
|
name: "add-select-selections",
|
|
72
130
|
id: item.id,
|
|
73
131
|
value: item.value,
|
|
74
|
-
labelText: item.
|
|
132
|
+
labelText: item.title,
|
|
75
133
|
onChange: handleSingleSelection,
|
|
76
134
|
selected: item.value === singleSelection
|
|
77
135
|
}), item.children && /*#__PURE__*/React.createElement(ChevronRight16, {
|
|
@@ -83,6 +141,7 @@ export var AddSelectList = function AddSelectList(_ref) {
|
|
|
83
141
|
};
|
|
84
142
|
AddSelectList.propTypes = {
|
|
85
143
|
filteredItems: PropTypes.array,
|
|
144
|
+
inColumn: PropTypes.bool,
|
|
86
145
|
multi: PropTypes.bool,
|
|
87
146
|
multiSelection: PropTypes.array,
|
|
88
147
|
path: PropTypes.array,
|
|
@@ -7,7 +7,8 @@ var _excluded = ["children"];
|
|
|
7
7
|
// LICENSE file in the root directory of this source tree.
|
|
8
8
|
//
|
|
9
9
|
import React from 'react';
|
|
10
|
-
import { Tag, Accordion, AccordionItem } from 'carbon-components-react';
|
|
10
|
+
import { Tag, Accordion, AccordionItem, Button } from 'carbon-components-react';
|
|
11
|
+
import { SubtractAlt32 } from '@carbon/icons-react';
|
|
11
12
|
import PropTypes from 'prop-types';
|
|
12
13
|
import { NoDataEmptyState } from '../../components/EmptyStates/NoDataEmptyState';
|
|
13
14
|
import { pkg } from '../../settings';
|
|
@@ -17,8 +18,18 @@ export var AddSelectSidebar = function AddSelectSidebar(_ref) {
|
|
|
17
18
|
items = _ref.items,
|
|
18
19
|
multiSelection = _ref.multiSelection,
|
|
19
20
|
noSelectionDescription = _ref.noSelectionDescription,
|
|
20
|
-
noSelectionTitle = _ref.noSelectionTitle
|
|
21
|
-
|
|
21
|
+
noSelectionTitle = _ref.noSelectionTitle,
|
|
22
|
+
removeIconDescription = _ref.removeIconDescription,
|
|
23
|
+
setMultiSelection = _ref.setMultiSelection;
|
|
24
|
+
var blockClass = "".concat(pkg.prefix, "--add-select__sidebar");
|
|
25
|
+
|
|
26
|
+
var handleItemRemove = function handleItemRemove(id) {
|
|
27
|
+
var newSelections = multiSelection.filter(function (v) {
|
|
28
|
+
return v !== id;
|
|
29
|
+
});
|
|
30
|
+
setMultiSelection(newSelections);
|
|
31
|
+
}; // utility to flatten the list of items and their children into a single searchable array
|
|
32
|
+
|
|
22
33
|
|
|
23
34
|
var flattenItems = function flattenItems(arr) {
|
|
24
35
|
return arr.reduce(function (prev, cur) {
|
|
@@ -35,6 +46,31 @@ export var AddSelectSidebar = function AddSelectSidebar(_ref) {
|
|
|
35
46
|
return item.id === selectedId;
|
|
36
47
|
});
|
|
37
48
|
});
|
|
49
|
+
|
|
50
|
+
var getTitle = function getTitle(_ref2) {
|
|
51
|
+
var title = _ref2.title,
|
|
52
|
+
subtitle = _ref2.subtitle,
|
|
53
|
+
id = _ref2.id;
|
|
54
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
55
|
+
className: "".concat(blockClass, "-accordion-title")
|
|
56
|
+
}, /*#__PURE__*/React.createElement("div", {
|
|
57
|
+
className: "".concat(blockClass, "-selected-item")
|
|
58
|
+
}, /*#__PURE__*/React.createElement("p", {
|
|
59
|
+
className: "".concat(blockClass, "-selected-item-title")
|
|
60
|
+
}, title), /*#__PURE__*/React.createElement("p", {
|
|
61
|
+
className: "".concat(blockClass, "-selected-item-subtitle")
|
|
62
|
+
}, subtitle)), /*#__PURE__*/React.createElement(Button, {
|
|
63
|
+
renderIcon: SubtractAlt32,
|
|
64
|
+
iconDescription: removeIconDescription,
|
|
65
|
+
hasIconOnly: true,
|
|
66
|
+
onClick: function onClick() {
|
|
67
|
+
return handleItemRemove(id);
|
|
68
|
+
},
|
|
69
|
+
kind: "ghost",
|
|
70
|
+
className: "".concat(blockClass, "-item-remove-button")
|
|
71
|
+
}));
|
|
72
|
+
};
|
|
73
|
+
|
|
38
74
|
return /*#__PURE__*/React.createElement("div", {
|
|
39
75
|
className: blockClass
|
|
40
76
|
}, /*#__PURE__*/React.createElement("div", {
|
|
@@ -48,7 +84,7 @@ export var AddSelectSidebar = function AddSelectSidebar(_ref) {
|
|
|
48
84
|
align: "start"
|
|
49
85
|
}, sidebarItems.map(function (item) {
|
|
50
86
|
return /*#__PURE__*/React.createElement(AccordionItem, {
|
|
51
|
-
title: item
|
|
87
|
+
title: getTitle(item),
|
|
52
88
|
key: item.id
|
|
53
89
|
}, Object.keys(item).map(function (key) {
|
|
54
90
|
return /*#__PURE__*/React.createElement("div", {
|
|
@@ -73,6 +109,8 @@ AddSelectSidebar.propTypes = {
|
|
|
73
109
|
items: PropTypes.array,
|
|
74
110
|
multiSelection: PropTypes.array,
|
|
75
111
|
noSelectionDescription: PropTypes.string,
|
|
76
|
-
noSelectionTitle: PropTypes.string
|
|
112
|
+
noSelectionTitle: PropTypes.string,
|
|
113
|
+
removeIconDescription: PropTypes.string,
|
|
114
|
+
setMultiSelection: PropTypes.func
|
|
77
115
|
};
|
|
78
116
|
AddSelectSidebar.displayName = componentName;
|
|
@@ -19,7 +19,11 @@ import { Button, OverflowMenu } from 'carbon-components-react'; // The block par
|
|
|
19
19
|
|
|
20
20
|
var blockClass = "".concat(pkg.prefix, "--button-menu");
|
|
21
21
|
var componentName = 'ButtonMenu'; // NOTE: the component SCSS is not imported here: it is rolled up separately.
|
|
22
|
+
// Default values for props
|
|
22
23
|
|
|
24
|
+
var defaults = {
|
|
25
|
+
size: 'default'
|
|
26
|
+
};
|
|
23
27
|
/**
|
|
24
28
|
* Combining a standard button with an overflow menu, this component appears
|
|
25
29
|
* as a button and has all the usual carbon Button props and rendering, but
|
|
@@ -35,7 +39,8 @@ export var ButtonMenu = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
35
39
|
label = _ref.label,
|
|
36
40
|
menuOptionsClass = _ref.menuOptionsClass,
|
|
37
41
|
Icon = _ref.renderIcon,
|
|
38
|
-
size = _ref.size,
|
|
42
|
+
_ref$size = _ref.size,
|
|
43
|
+
size = _ref$size === void 0 ? defaults.size : _ref$size,
|
|
39
44
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
40
45
|
|
|
41
46
|
return /*#__PURE__*/React.createElement(OverflowMenu, _extends({}, rest, {
|
|
@@ -102,7 +107,4 @@ ButtonMenu.propTypes = {
|
|
|
102
107
|
* value for the carbon Button component 'size' prop.
|
|
103
108
|
*/
|
|
104
109
|
size: Button.propTypes.size
|
|
105
|
-
};
|
|
106
|
-
ButtonMenu.defaultProps = {
|
|
107
|
-
size: Button.defaultProps.size
|
|
108
110
|
};
|
|
@@ -26,5 +26,4 @@ export var ButtonMenuItem = /*#__PURE__*/React.forwardRef(function (props, ref)
|
|
|
26
26
|
}); // Return a placeholder if not released and not enabled by feature flag
|
|
27
27
|
|
|
28
28
|
ButtonMenuItem = pkg.checkComponentEnabled(ButtonMenuItem, componentName);
|
|
29
|
-
ButtonMenuItem.propTypes = OverflowMenuItem.propTypes;
|
|
30
|
-
ButtonMenuItem.defaultProps = OverflowMenuItem.defaultProps;
|
|
29
|
+
ButtonMenuItem.propTypes = OverflowMenuItem.propTypes;
|
|
@@ -22,34 +22,55 @@ import PropTypes from 'prop-types';
|
|
|
22
22
|
import { CardHeader } from './CardHeader';
|
|
23
23
|
import { CardFooter } from './CardFooter';
|
|
24
24
|
import { pkg } from '../../settings';
|
|
25
|
-
var componentName = 'Card';
|
|
25
|
+
var componentName = 'Card'; // Default values for props
|
|
26
|
+
|
|
27
|
+
var defaults = {
|
|
28
|
+
actionIcons: Object.freeze([]),
|
|
29
|
+
actionsPlacement: 'bottom',
|
|
30
|
+
clickZone: 'one',
|
|
31
|
+
mediaPosition: 'top',
|
|
32
|
+
overflowActions: Object.freeze([]),
|
|
33
|
+
primaryButtonKind: 'primary',
|
|
34
|
+
productive: false,
|
|
35
|
+
secondaryButtonKind: 'secondary',
|
|
36
|
+
titleSize: 'default'
|
|
37
|
+
};
|
|
26
38
|
export var Card = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
27
|
-
var actionIcons = _ref.actionIcons,
|
|
28
|
-
|
|
39
|
+
var _ref$actionIcons = _ref.actionIcons,
|
|
40
|
+
actionIcons = _ref$actionIcons === void 0 ? defaults.actionIcons : _ref$actionIcons,
|
|
41
|
+
_ref$actionsPlacement = _ref.actionsPlacement,
|
|
42
|
+
actionsPlacement = _ref$actionsPlacement === void 0 ? defaults.actionsPlacement : _ref$actionsPlacement,
|
|
29
43
|
children = _ref.children,
|
|
30
44
|
className = _ref.className,
|
|
31
|
-
clickZone = _ref.clickZone,
|
|
45
|
+
_ref$clickZone = _ref.clickZone,
|
|
46
|
+
clickZone = _ref$clickZone === void 0 ? defaults.clickZone : _ref$clickZone,
|
|
32
47
|
description = _ref.description,
|
|
33
48
|
label = _ref.label,
|
|
34
49
|
media = _ref.media,
|
|
35
|
-
mediaPosition = _ref.mediaPosition,
|
|
50
|
+
_ref$mediaPosition = _ref.mediaPosition,
|
|
51
|
+
mediaPosition = _ref$mediaPosition === void 0 ? defaults.mediaPosition : _ref$mediaPosition,
|
|
36
52
|
onClick = _ref.onClick,
|
|
37
53
|
onKeyDown = _ref.onKeyDown,
|
|
38
54
|
onPrimaryButtonClick = _ref.onPrimaryButtonClick,
|
|
39
|
-
overflowActions = _ref.overflowActions,
|
|
55
|
+
_ref$overflowActions = _ref.overflowActions,
|
|
56
|
+
overflowActions = _ref$overflowActions === void 0 ? defaults.overflowActions : _ref$overflowActions,
|
|
40
57
|
onSecondaryButtonClick = _ref.onSecondaryButtonClick,
|
|
41
58
|
Pictogram = _ref.pictogram,
|
|
42
59
|
primaryButtonHref = _ref.primaryButtonHref,
|
|
43
60
|
primaryButtonIcon = _ref.primaryButtonIcon,
|
|
44
|
-
|
|
61
|
+
_ref$primaryButtonKin = _ref.primaryButtonKind,
|
|
62
|
+
primaryButtonKind = _ref$primaryButtonKin === void 0 ? defaults.primaryButtonKind : _ref$primaryButtonKin,
|
|
45
63
|
primaryButtonText = _ref.primaryButtonText,
|
|
46
|
-
productive = _ref.productive,
|
|
64
|
+
_ref$productive = _ref.productive,
|
|
65
|
+
productive = _ref$productive === void 0 ? defaults.productive : _ref$productive,
|
|
47
66
|
secondaryButtonHref = _ref.secondaryButtonHref,
|
|
48
67
|
secondaryButtonIcon = _ref.secondaryButtonIcon,
|
|
49
|
-
|
|
68
|
+
_ref$secondaryButtonK = _ref.secondaryButtonKind,
|
|
69
|
+
secondaryButtonKind = _ref$secondaryButtonK === void 0 ? defaults.secondaryButtonKind : _ref$secondaryButtonK,
|
|
50
70
|
secondaryButtonText = _ref.secondaryButtonText,
|
|
51
71
|
title = _ref.title,
|
|
52
|
-
titleSize = _ref.titleSize,
|
|
72
|
+
_ref$titleSize = _ref.titleSize,
|
|
73
|
+
titleSize = _ref$titleSize === void 0 ? defaults.titleSize : _ref$titleSize,
|
|
53
74
|
rest = _objectWithoutProperties(_ref, _excluded);
|
|
54
75
|
|
|
55
76
|
var blockClass = "".concat(pkg.prefix, "--card");
|
|
@@ -244,15 +265,4 @@ Card.propTypes = {
|
|
|
244
265
|
title: PropTypes.string,
|
|
245
266
|
titleSize: PropTypes.oneOf(['default', 'large'])
|
|
246
267
|
};
|
|
247
|
-
Card.defaultProps = {
|
|
248
|
-
actionIcons: [],
|
|
249
|
-
actionsPlacement: 'bottom',
|
|
250
|
-
clickZone: 'one',
|
|
251
|
-
mediaPosition: 'top',
|
|
252
|
-
overflowActions: [],
|
|
253
|
-
primaryButtonKind: 'primary',
|
|
254
|
-
productive: false,
|
|
255
|
-
secondaryButtonKind: 'secondary',
|
|
256
|
-
titleSize: 'default'
|
|
257
|
-
};
|
|
258
268
|
Card.displayName = componentName;
|
|
@@ -11,20 +11,30 @@ import { Button } from 'carbon-components-react';
|
|
|
11
11
|
import PropTypes from 'prop-types';
|
|
12
12
|
import { pkg } from '../../settings';
|
|
13
13
|
var componentName = 'CardFooter';
|
|
14
|
+
var defaults = {
|
|
15
|
+
actions: Object.freeze([]),
|
|
16
|
+
primaryButtonKind: 'primary',
|
|
17
|
+
productive: false,
|
|
18
|
+
secondaryButtonKind: 'secondary'
|
|
19
|
+
};
|
|
14
20
|
export var CardFooter = function CardFooter(_ref) {
|
|
15
|
-
var actions = _ref.actions,
|
|
21
|
+
var _ref$actions = _ref.actions,
|
|
22
|
+
actions = _ref$actions === void 0 ? defaults.actions : _ref$actions,
|
|
16
23
|
hasActions = _ref.hasActions,
|
|
17
24
|
hasButton = _ref.hasButton,
|
|
18
25
|
onPrimaryButtonClick = _ref.onPrimaryButtonClick,
|
|
19
26
|
onSecondaryButtonClick = _ref.onSecondaryButtonClick,
|
|
20
27
|
primaryButtonHref = _ref.primaryButtonHref,
|
|
21
28
|
primaryButtonIcon = _ref.primaryButtonIcon,
|
|
22
|
-
|
|
29
|
+
_ref$primaryButtonKin = _ref.primaryButtonKind,
|
|
30
|
+
primaryButtonKind = _ref$primaryButtonKin === void 0 ? defaults.primaryButtonKind : _ref$primaryButtonKin,
|
|
23
31
|
primaryButtonText = _ref.primaryButtonText,
|
|
24
|
-
productive = _ref.productive,
|
|
32
|
+
_ref$productive = _ref.productive,
|
|
33
|
+
productive = _ref$productive === void 0 ? defaults.productive : _ref$productive,
|
|
25
34
|
secondaryButtonHref = _ref.secondaryButtonHref,
|
|
26
35
|
secondaryButtonIcon = _ref.secondaryButtonIcon,
|
|
27
|
-
|
|
36
|
+
_ref$secondaryButtonK = _ref.secondaryButtonKind,
|
|
37
|
+
secondaryButtonKind = _ref$secondaryButtonK === void 0 ? defaults.secondaryButtonKind : _ref$secondaryButtonK,
|
|
28
38
|
secondaryButtonText = _ref.secondaryButtonText;
|
|
29
39
|
var blockClass = "".concat(pkg.prefix, "--card");
|
|
30
40
|
var footerClass = "".concat(pkg.prefix, "--card__footer");
|
|
@@ -63,10 +73,4 @@ CardFooter.propTypes = {
|
|
|
63
73
|
secondaryButtonKind: PropTypes.oneOf(['secondary', 'ghost']),
|
|
64
74
|
secondaryButtonText: PropTypes.string
|
|
65
75
|
};
|
|
66
|
-
CardFooter.defaultProps = {
|
|
67
|
-
actions: [],
|
|
68
|
-
primaryButtonKind: 'primary',
|
|
69
|
-
productive: false,
|
|
70
|
-
secondaryButtonKind: 'secondary'
|
|
71
|
-
};
|
|
72
76
|
CardFooter.displayName = componentName;
|