@carbon/ibm-products 1.36.0 → 1.37.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.
Files changed (35) hide show
  1. package/README.md +3 -3
  2. package/css/index-full-carbon.css +267 -262
  3. package/css/index-full-carbon.css.map +1 -1
  4. package/css/index-full-carbon.min.css +3 -3
  5. package/css/index-full-carbon.min.css.map +1 -1
  6. package/css/index-without-carbon-released-only.css +59 -65
  7. package/css/index-without-carbon-released-only.css.map +1 -1
  8. package/css/index-without-carbon-released-only.min.css +2 -2
  9. package/css/index-without-carbon-released-only.min.css.map +1 -1
  10. package/css/index-without-carbon.css +69 -67
  11. package/css/index-without-carbon.css.map +1 -1
  12. package/css/index-without-carbon.min.css +1 -1
  13. package/css/index-without-carbon.min.css.map +1 -1
  14. package/css/index.css +236 -234
  15. package/css/index.css.map +1 -1
  16. package/css/index.min.css +2 -2
  17. package/css/index.min.css.map +1 -1
  18. package/es/components/DataSpreadsheet/DataSpreadsheet.js +2 -1
  19. package/es/components/DataSpreadsheet/utils/handleCellDeletion.js +8 -1
  20. package/es/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +88 -0
  21. package/es/components/FilterSummary/FilterSummary.js +54 -0
  22. package/es/components/FilterSummary/index.js +7 -0
  23. package/es/components/PageHeader/PageHeaderTitle.js +2 -4
  24. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +2 -1
  25. package/lib/components/DataSpreadsheet/utils/handleCellDeletion.js +8 -1
  26. package/lib/components/Datagrid/Datagrid/addons/Filtering/FilterProvider.js +101 -0
  27. package/lib/components/FilterSummary/FilterSummary.js +63 -0
  28. package/lib/components/FilterSummary/index.js +13 -0
  29. package/lib/components/PageHeader/PageHeaderTitle.js +2 -4
  30. package/package.json +15 -15
  31. package/scss/components/FilterSummary/_filter-summary.scss +17 -0
  32. package/scss/components/FilterSummary/_index.scss +10 -0
  33. package/scss/components/FilterSummary/_storybook-styles.scss +14 -0
  34. package/scss/components/PageHeader/_page-header.scss +0 -4
  35. package/scss/components/_index.scss +1 -0
@@ -0,0 +1,54 @@
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 { Button } from 'carbon-components-react';
8
+ import React from 'react';
9
+ import PropTypes from 'prop-types';
10
+ import cx from 'classnames';
11
+ import { TagSet } from '../TagSet';
12
+ import { pkg } from '../../settings';
13
+ var blockClass = "".concat(pkg.prefix, "--filter-summary");
14
+ var FilterSummary = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
15
+ var _ref$className = _ref.className,
16
+ className = _ref$className === void 0 ? '' : _ref$className,
17
+ _ref$clearFiltersText = _ref.clearFiltersText,
18
+ clearFiltersText = _ref$clearFiltersText === void 0 ? 'Clear filters' : _ref$clearFiltersText,
19
+ _ref$clearFilters = _ref.clearFilters,
20
+ clearFilters = _ref$clearFilters === void 0 ? function () {} : _ref$clearFilters,
21
+ _ref$filters = _ref.filters,
22
+ filters = _ref$filters === void 0 ? [] : _ref$filters;
23
+ var tagFilters = filters.map(function (_ref2) {
24
+ var key = _ref2.key,
25
+ value = _ref2.value;
26
+ return {
27
+ type: 'gray',
28
+ label: "".concat(key, ": ").concat(value)
29
+ };
30
+ });
31
+ return /*#__PURE__*/React.createElement("div", {
32
+ ref: ref,
33
+ className: cx([blockClass, className])
34
+ }, /*#__PURE__*/React.createElement(TagSet, {
35
+ allTagsModalSearchLabel: "Search all tags",
36
+ allTagsModalSearchPlaceholderText: "Search all tags",
37
+ allTagsModalTitle: "All tags",
38
+ showAllTagsLabel: "View all tags",
39
+ tags: tagFilters
40
+ }), /*#__PURE__*/React.createElement(Button, {
41
+ kind: "ghost",
42
+ size: "sm",
43
+ onClick: clearFilters
44
+ }, clearFiltersText));
45
+ });
46
+ var componentName = 'FilterSummary';
47
+ FilterSummary.displayName = componentName;
48
+ FilterSummary.propTypes = {
49
+ className: PropTypes.string,
50
+ clearFilters: PropTypes.func.isRequired,
51
+ clearFiltersText: PropTypes.string,
52
+ filters: PropTypes.arrayOf(PropTypes.object).isRequired
53
+ };
54
+ export default FilterSummary;
@@ -0,0 +1,7 @@
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
+ export { default as FilterSummary } from './FilterSummary';
@@ -62,12 +62,10 @@ export var PageHeaderTitle = function PageHeaderTitle(_ref) {
62
62
  titleInnards = content;
63
63
  titleText = asText;
64
64
  }
65
- return /*#__PURE__*/React.createElement("div", {
65
+ return /*#__PURE__*/React.createElement("h1", {
66
66
  className: cx("".concat(blockClass, "__title"), _defineProperty({}, "".concat(blockClass, "__title--editable"), isEditable), _defineProperty({}, "".concat(blockClass, "__title--fades"), hasBreadcrumbRow)),
67
67
  title: titleText
68
- }, /*#__PURE__*/React.createElement("h1", {
69
- className: "".concat(blockClass, "__title-wrapper")
70
- }, titleInnards));
68
+ }, titleInnards);
71
69
  };
72
70
  export var inlineEditRequired = function inlineEditRequired(_ref2) {
73
71
  var onSave = _ref2.onSave;
@@ -355,7 +355,8 @@ var DataSpreadsheet = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
355
355
  currentMatcher: currentMatcher,
356
356
  rows: rows,
357
357
  setActiveCellContent: setActiveCellContent,
358
- updateData: updateData
358
+ updateData: updateData,
359
+ activeCellCoordinates: activeCellCoordinates
359
360
  };
360
361
  // Allow arrow key navigation if there are less than two activeKeys OR
361
362
  // if one of the activeCellCoordinates is in a header position
@@ -14,11 +14,18 @@ var _rangeWithCallback = require("../../../global/js/utils/rangeWithCallback");
14
14
  */
15
15
 
16
16
  var handleCellDeletion = function handleCellDeletion(_ref) {
17
- var selectionAreas = _ref.selectionAreas,
17
+ var activeCellCoordinates = _ref.activeCellCoordinates,
18
+ selectionAreas = _ref.selectionAreas,
18
19
  currentMatcher = _ref.currentMatcher,
19
20
  rows = _ref.rows,
20
21
  setActiveCellContent = _ref.setActiveCellContent,
21
22
  updateData = _ref.updateData;
23
+ // This means that the delete key has been pressed when the active cell is in a header,
24
+ // not within the spreadsheet body. To delete an entire row/column, it must first be
25
+ // selected, and then can be deleted.
26
+ if ((activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' || (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header') {
27
+ return;
28
+ }
22
29
  var selectionAreaClone = (0, _deepCloneObject.deepCloneObject)(selectionAreas);
23
30
  var indexOfCurrentSelectionArea = selectionAreaClone.findIndex(function (item) {
24
31
  return item.matcher === currentMatcher;
@@ -0,0 +1,101 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ var _typeof = require("@babel/runtime/helpers/typeof");
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.FilterProvider = exports.FilterContext = void 0;
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
10
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
11
+ var _react = _interopRequireWildcard(require("react"));
12
+ var _propTypes = _interopRequireDefault(require("prop-types"));
13
+ var _constants = require("./constants");
14
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
+ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
16
+ /**
17
+ * Copyright IBM Corp. 2022, 2022
18
+ *
19
+ * This source code is licensed under the Apache-2.0 license found in the
20
+ * LICENSE file in the root directory of this source tree.
21
+ */
22
+
23
+ var FilterContext = /*#__PURE__*/(0, _react.createContext)();
24
+ exports.FilterContext = FilterContext;
25
+ var prepareFiltersForTags = function prepareFiltersForTags(filters) {
26
+ var tags = [];
27
+ filters.forEach(function (_ref) {
28
+ var id = _ref.id,
29
+ type = _ref.type,
30
+ value = _ref.value;
31
+ if (type === _constants.DROPDOWN || type === _constants.RADIO || type === _constants.NUMBER) {
32
+ tags.push((0, _defineProperty2.default)({}, id, value));
33
+ } else if (type === _constants.DATE) {
34
+ var _value = (0, _slicedToArray2.default)(value, 2),
35
+ startDate = _value[0],
36
+ endDate = _value[1];
37
+ tags.push((0, _defineProperty2.default)({}, id, "".concat(startDate.toLocaleString(), " - ").concat(endDate.toLocaleString())));
38
+ } else if (type === _constants.CHECKBOX) {
39
+ value.forEach(function (checkbox) {
40
+ tags.push((0, _defineProperty2.default)({}, id, checkbox.value));
41
+ });
42
+ }
43
+ });
44
+ return tags;
45
+ };
46
+ var FilterProvider = function FilterProvider(_ref2) {
47
+ var children = _ref2.children,
48
+ filters = _ref2.filters;
49
+ console.log(filters);
50
+ var filterTags = prepareFiltersForTags(filters);
51
+ console.log({
52
+ filterTags: filterTags
53
+ });
54
+ var value = {
55
+ filterTags: filterTags
56
+ };
57
+ return /*#__PURE__*/_react.default.createElement(FilterContext.Provider, {
58
+ value: value
59
+ }, children);
60
+ };
61
+ exports.FilterProvider = FilterProvider;
62
+ FilterProvider.propTypes = {
63
+ children: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.node), _propTypes.default.node]).isRequired,
64
+ filters: _propTypes.default.arrayOf(_propTypes.default.object).isRequired
65
+ };
66
+ [{
67
+ id: 'joined',
68
+ value: ['2022-10-02T04:00:00.000Z', '2022-10-26T04:00:00.000Z'],
69
+ type: 'date'
70
+ }, {
71
+ id: 'visits',
72
+ value: '1',
73
+ type: 'number'
74
+ }, {
75
+ id: 'passwordStrength',
76
+ value: [{
77
+ id: 'normal',
78
+ labelText: 'Normal',
79
+ value: 'normal',
80
+ selected: true
81
+ }, {
82
+ id: 'minor-warning',
83
+ labelText: 'Minor warning',
84
+ value: 'minor-warning',
85
+ selected: true
86
+ }, {
87
+ id: 'critical',
88
+ labelText: 'Critical',
89
+ value: 'critical',
90
+ selected: false
91
+ }],
92
+ type: 'checkbox'
93
+ }, {
94
+ id: 'role',
95
+ value: 'developer',
96
+ type: 'radio'
97
+ }, {
98
+ id: 'status',
99
+ value: 'complicated',
100
+ type: 'dropdown'
101
+ }];
@@ -0,0 +1,63 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _carbonComponentsReact = require("carbon-components-react");
9
+ var _react = _interopRequireDefault(require("react"));
10
+ var _propTypes = _interopRequireDefault(require("prop-types"));
11
+ var _classnames = _interopRequireDefault(require("classnames"));
12
+ var _TagSet = require("../TagSet");
13
+ var _settings = require("../../settings");
14
+ /**
15
+ * Copyright IBM Corp. 2022, 2022
16
+ *
17
+ * This source code is licensed under the Apache-2.0 license found in the
18
+ * LICENSE file in the root directory of this source tree.
19
+ */
20
+
21
+ var blockClass = "".concat(_settings.pkg.prefix, "--filter-summary");
22
+ var FilterSummary = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
23
+ var _ref$className = _ref.className,
24
+ className = _ref$className === void 0 ? '' : _ref$className,
25
+ _ref$clearFiltersText = _ref.clearFiltersText,
26
+ clearFiltersText = _ref$clearFiltersText === void 0 ? 'Clear filters' : _ref$clearFiltersText,
27
+ _ref$clearFilters = _ref.clearFilters,
28
+ clearFilters = _ref$clearFilters === void 0 ? function () {} : _ref$clearFilters,
29
+ _ref$filters = _ref.filters,
30
+ filters = _ref$filters === void 0 ? [] : _ref$filters;
31
+ var tagFilters = filters.map(function (_ref2) {
32
+ var key = _ref2.key,
33
+ value = _ref2.value;
34
+ return {
35
+ type: 'gray',
36
+ label: "".concat(key, ": ").concat(value)
37
+ };
38
+ });
39
+ return /*#__PURE__*/_react.default.createElement("div", {
40
+ ref: ref,
41
+ className: (0, _classnames.default)([blockClass, className])
42
+ }, /*#__PURE__*/_react.default.createElement(_TagSet.TagSet, {
43
+ allTagsModalSearchLabel: "Search all tags",
44
+ allTagsModalSearchPlaceholderText: "Search all tags",
45
+ allTagsModalTitle: "All tags",
46
+ showAllTagsLabel: "View all tags",
47
+ tags: tagFilters
48
+ }), /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Button, {
49
+ kind: "ghost",
50
+ size: "sm",
51
+ onClick: clearFilters
52
+ }, clearFiltersText));
53
+ });
54
+ var componentName = 'FilterSummary';
55
+ FilterSummary.displayName = componentName;
56
+ FilterSummary.propTypes = {
57
+ className: _propTypes.default.string,
58
+ clearFilters: _propTypes.default.func.isRequired,
59
+ clearFiltersText: _propTypes.default.string,
60
+ filters: _propTypes.default.arrayOf(_propTypes.default.object).isRequired
61
+ };
62
+ var _default = FilterSummary;
63
+ exports.default = _default;
@@ -0,0 +1,13 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ Object.defineProperty(exports, "FilterSummary", {
8
+ enumerable: true,
9
+ get: function get() {
10
+ return _FilterSummary.default;
11
+ }
12
+ });
13
+ var _FilterSummary = _interopRequireDefault(require("./FilterSummary"));
@@ -68,12 +68,10 @@ var PageHeaderTitle = function PageHeaderTitle(_ref) {
68
68
  titleInnards = content;
69
69
  titleText = asText;
70
70
  }
71
- return /*#__PURE__*/_react.default.createElement("div", {
71
+ return /*#__PURE__*/_react.default.createElement("h1", {
72
72
  className: (0, _classnames.default)("".concat(blockClass, "__title"), (0, _defineProperty2.default)({}, "".concat(blockClass, "__title--editable"), isEditable), (0, _defineProperty2.default)({}, "".concat(blockClass, "__title--fades"), hasBreadcrumbRow)),
73
73
  title: titleText
74
- }, /*#__PURE__*/_react.default.createElement("h1", {
75
- className: "".concat(blockClass, "__title-wrapper")
76
- }, titleInnards));
74
+ }, titleInnards);
77
75
  };
78
76
  exports.PageHeaderTitle = PageHeaderTitle;
79
77
  var inlineEditRequired = function inlineEditRequired(_ref2) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/ibm-products",
3
3
  "description": "Carbon for IBM Products",
4
- "version": "1.36.0",
4
+ "version": "1.37.0",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -52,26 +52,26 @@
52
52
  },
53
53
  "devDependencies": {
54
54
  "@babel/cli": "^7.19.3",
55
- "@babel/core": "^7.19.6",
56
- "babel-preset-ibm-cloud-cognitive": "^0.14.23",
55
+ "@babel/core": "^7.20.2",
56
+ "babel-preset-ibm-cloud-cognitive": "^0.14.24",
57
57
  "chalk": "^4.1.2",
58
58
  "change-case": "^4.1.2",
59
59
  "copyfiles": "^2.4.1",
60
60
  "cross-env": "^7.0.3",
61
61
  "fs-extra": "^10.1.0",
62
62
  "glob": "^8.0.3",
63
- "jest": "^29.2.2",
64
- "jest-config-ibm-cloud-cognitive": "^0.24.9",
65
- "jest-environment-jsdom": "^29.2.2",
63
+ "jest": "^29.3.1",
64
+ "jest-config-ibm-cloud-cognitive": "^0.24.10",
65
+ "jest-environment-jsdom": "^29.3.1",
66
66
  "namor": "^1.1.2",
67
- "npm-check-updates": "^16.3.16",
67
+ "npm-check-updates": "^16.4.1",
68
68
  "npm-run-all": "^4.1.5",
69
69
  "rimraf": "^3.0.2",
70
- "sass": "^1.55.0",
71
- "yargs": "^17.6.0"
70
+ "sass": "^1.56.1",
71
+ "yargs": "^17.6.2"
72
72
  },
73
73
  "dependencies": {
74
- "@babel/runtime": "^7.20.0",
74
+ "@babel/runtime": "^7.20.1",
75
75
  "@carbon/telemetry": "^0.1.0",
76
76
  "framer-motion": "^6.5.1",
77
77
  "immutability-helper": "^3.1.1",
@@ -87,13 +87,13 @@
87
87
  "@carbon/import-once": "^10.7.0",
88
88
  "@carbon/layout": "^10.37.1",
89
89
  "@carbon/motion": "^10.29.0",
90
- "@carbon/themes": "^10.55.0",
91
- "@carbon/type": "^10.45.0",
92
- "carbon-components": "^10.58.4",
93
- "carbon-components-react": "^7.59.4",
90
+ "@carbon/themes": "^10.55.1",
91
+ "@carbon/type": "^10.45.1",
92
+ "carbon-components": "^10.58.5",
93
+ "carbon-components-react": "^7.59.5",
94
94
  "carbon-icons": "^7.0.7",
95
95
  "react": "^16.8.6 || ^17.0.1",
96
96
  "react-dom": "^16.8.6 || ^17.0.1"
97
97
  },
98
- "gitHead": "5d3cd5d3456d537a654f4d5ad010137bf567ca3a"
98
+ "gitHead": "ca62a989688c857c323564d91b01d6828eb369fa"
99
99
  }
@@ -0,0 +1,17 @@
1
+ //
2
+ // Copyright IBM Corp. 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 '../../global/styles/project-settings';
8
+
9
+ $block-class: #{$pkg-prefix}--filter-summary;
10
+
11
+ .#{$block-class} {
12
+ display: flex;
13
+ width: 100%;
14
+ align-items: center;
15
+ padding: $spacing-03;
16
+ background: $ui-01;
17
+ }
@@ -0,0 +1,10 @@
1
+ //
2
+ // Copyright IBM Corp. 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
+
8
+ // An index file is most useful when you have multiple components
9
+
10
+ @import './filter-summary';
@@ -0,0 +1,14 @@
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
+ #root {
8
+ width: 100%;
9
+ }
10
+
11
+ .preview-position-fix {
12
+ max-width: 700px;
13
+ margin: 0 auto;
14
+ }
@@ -471,10 +471,6 @@ $right-section-alt-width: 100% - $left-section-alt-width;
471
471
  vertical-align: middle;
472
472
  }
473
473
 
474
- .#{$block-class}__title-wrapper {
475
- @include carbon--type-style('productive-heading-04');
476
- }
477
-
478
474
  .#{$block-class}__page-actions {
479
475
  flex: 0 0 100%;
480
476
  margin-top: $spacing-05;
@@ -23,6 +23,7 @@
23
23
  @import './EmptyStates/index';
24
24
  @import './ExportModal/index';
25
25
  @import './ExpressiveCard/index';
26
+ @import './FilterSummary/index';
26
27
  @import './HTTPErrors/index';
27
28
  @import './ImportModal/index';
28
29
  @import './ModifiedTabs/index';