@carbon/ibm-products 2.44.0-rc.0 → 2.44.0-rc.1

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 (64) hide show
  1. package/css/index-full-carbon.css +17 -0
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +12 -0
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +17 -0
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +1 -1
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +17 -0
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +1 -1
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/DataSpreadsheet/DataSpreadsheet.d.ts +12 -0
  18. package/es/components/DataSpreadsheet/DataSpreadsheet.js +22 -3
  19. package/es/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +12 -0
  20. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +22 -6
  21. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +3 -0
  22. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +1 -1
  23. package/es/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +53 -8
  24. package/es/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +10 -2
  25. package/es/components/Datagrid/useInlineEdit.js +1 -1
  26. package/es/components/EditTearsheet/EditTearsheet.d.ts +5 -1
  27. package/es/components/EditTearsheet/EditTearsheet.js +0 -1
  28. package/es/components/EditTearsheet/EditTearsheetForm.d.ts +45 -2
  29. package/es/components/EditTearsheet/EditTearsheetForm.js +3 -0
  30. package/es/components/HTTPErrors/HTTPError403/HTTPError403.js +6 -0
  31. package/es/components/HTTPErrors/HTTPError404/HTTPError404.js +6 -0
  32. package/es/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +6 -0
  33. package/es/components/RemoveModal/RemoveModal.d.ts +4 -0
  34. package/es/components/RemoveModal/RemoveModal.js +7 -1
  35. package/es/components/StatusIndicator/StatusIndicatorStep.js +87 -0
  36. package/es/components/Toolbar/ToolbarButton.js +1 -1
  37. package/es/components/index.d.ts +1 -1
  38. package/es/index.js +1 -0
  39. package/lib/components/DataSpreadsheet/DataSpreadsheet.d.ts +12 -0
  40. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +22 -3
  41. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +12 -0
  42. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +22 -6
  43. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +3 -0
  44. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditButton/InlineEditButton.js +1 -1
  45. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/InlineEditCell/InlineEditCell.js +52 -7
  46. package/lib/components/Datagrid/Datagrid/addons/InlineEdit/handleGridKeyPress.js +10 -2
  47. package/lib/components/Datagrid/useInlineEdit.js +1 -1
  48. package/lib/components/EditTearsheet/EditTearsheet.d.ts +5 -1
  49. package/lib/components/EditTearsheet/EditTearsheet.js +0 -1
  50. package/lib/components/EditTearsheet/EditTearsheetForm.d.ts +45 -2
  51. package/lib/components/EditTearsheet/EditTearsheetForm.js +3 -0
  52. package/lib/components/HTTPErrors/HTTPError403/HTTPError403.js +6 -0
  53. package/lib/components/HTTPErrors/HTTPError404/HTTPError404.js +6 -0
  54. package/lib/components/HTTPErrors/HTTPErrorOther/HTTPErrorOther.js +6 -0
  55. package/lib/components/RemoveModal/RemoveModal.d.ts +4 -0
  56. package/lib/components/RemoveModal/RemoveModal.js +7 -1
  57. package/lib/components/StatusIndicator/StatusIndicatorStep.js +94 -0
  58. package/lib/components/Toolbar/ToolbarButton.js +1 -1
  59. package/lib/components/index.d.ts +1 -1
  60. package/lib/index.js +5 -0
  61. package/package.json +5 -4
  62. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +7 -0
  63. package/scss/components/Datagrid/styles/_useInlineEdit.scss +13 -0
  64. package/telemetry.yml +7 -0
@@ -0,0 +1,94 @@
1
+ /**
2
+ * Copyright IBM Corp. 2020, 2024
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
+ 'use strict';
9
+
10
+ Object.defineProperty(exports, '__esModule', { value: true });
11
+
12
+ var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
13
+ var React = require('react');
14
+ var index = require('../../node_modules/prop-types/index.js');
15
+ var cx = require('classnames');
16
+ var devtools = require('../../global/js/utils/devtools.js');
17
+ var settings = require('../../settings.js');
18
+ var react = require('@carbon/react');
19
+ var icons = require('@carbon/react/icons');
20
+
21
+ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
22
+
23
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
24
+ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
25
+
26
+ var _CircleStroke, _InlineLoading, _ErrorOutline, _CheckmarkOutline;
27
+ var _excluded = ["className", "description", "errorMessage", "status"];
28
+
29
+ // The block part of our conventional BEM class names (blockClass__E--M).
30
+ var blockClass = "".concat(settings.pkg.prefix, "--status-indicator-step");
31
+ var componentName = 'StatusIndicatorStep';
32
+ var defaults = {
33
+ status: 'inactive'
34
+ };
35
+
36
+ /**
37
+ * An icon/description pair that describes one step of the `StatusIndicator`.
38
+ */
39
+ exports.StatusIndicatorStep = /*#__PURE__*/React__default["default"].forwardRef(function (_ref, ref) {
40
+ var className = _ref.className,
41
+ description = _ref.description,
42
+ errorMessage = _ref.errorMessage,
43
+ _ref$status = _ref.status,
44
+ status = _ref$status === void 0 ? defaults.status : _ref$status,
45
+ rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
46
+ return /*#__PURE__*/React__default["default"].createElement("li", _rollupPluginBabelHelpers["extends"]({}, rest, {
47
+ className: cx__default["default"](blockClass, className, "".concat(blockClass, "--").concat(status)),
48
+ ref: ref
49
+ }, devtools.getDevtoolsProps(componentName)), /*#__PURE__*/React__default["default"].createElement("div", {
50
+ className: "".concat(blockClass, "__details")
51
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
52
+ className: "".concat(blockClass, "__icon")
53
+ }, status === 'inactive' && (_CircleStroke || (_CircleStroke = /*#__PURE__*/React__default["default"].createElement(icons.CircleStroke, {
54
+ size: 16,
55
+ viewBox: "1 1 14 14"
56
+ }))), status === 'active' && (_InlineLoading || (_InlineLoading = /*#__PURE__*/React__default["default"].createElement(react.InlineLoading, null))), status === 'error' && (_ErrorOutline || (_ErrorOutline = /*#__PURE__*/React__default["default"].createElement(icons.ErrorOutline, {
57
+ size: 16
58
+ }))), status === 'finished' && (_CheckmarkOutline || (_CheckmarkOutline = /*#__PURE__*/React__default["default"].createElement(icons.CheckmarkOutline, {
59
+ size: 16
60
+ })))), /*#__PURE__*/React__default["default"].createElement("div", {
61
+ className: "".concat(blockClass, "__text")
62
+ }, description)), status === 'error' && errorMessage && /*#__PURE__*/React__default["default"].createElement("div", {
63
+ className: "".concat(blockClass, "__error-message")
64
+ }, errorMessage));
65
+ });
66
+
67
+ // Return a placeholder if not released and not enabled by feature flag
68
+ exports.StatusIndicatorStep = settings.pkg.checkComponentEnabled(exports.StatusIndicatorStep, componentName);
69
+
70
+ // The display name of the component, used by React. Note that displayName
71
+ // is used in preference to relying on function.name.
72
+ exports.StatusIndicatorStep.displayName = componentName;
73
+
74
+ // The types and DocGen commentary for the component props,
75
+ // in alphabetical order (for consistency).
76
+ // See https://www.npmjs.com/package/prop-types#usage.
77
+ exports.StatusIndicatorStep.propTypes = {
78
+ /**
79
+ * Provide an optional class to be applied to the containing node.
80
+ */
81
+ className: index["default"].string,
82
+ /**
83
+ * The text associated with the icon.
84
+ */
85
+ description: index["default"].string.isRequired,
86
+ /**
87
+ * This message will appear below the description if the `status` is "error".
88
+ */
89
+ errorMessage: index["default"].string,
90
+ /**
91
+ * Each `status` represents a different icon..
92
+ */
93
+ status: index["default"].oneOf(['inactive', 'active', 'error', 'finished']).isRequired
94
+ };
@@ -37,7 +37,7 @@ exports.ToolbarButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
37
37
  rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
38
38
  var Icon = renderIcon;
39
39
  return /*#__PURE__*/React__default["default"].createElement(react.IconButton, _rollupPluginBabelHelpers["extends"]({
40
- align: ((_useContext = React.useContext(Toolbar.ToolbarContext)) === null || _useContext === void 0 ? void 0 : _useContext.vertical) && 'right'
40
+ align: (_useContext = React.useContext(Toolbar.ToolbarContext)) !== null && _useContext !== void 0 && _useContext.vertical ? 'right' : 'top'
41
41
  }, rest, {
42
42
  label: iconDescription,
43
43
  ref: ref,
@@ -50,7 +50,6 @@ export { Nav } from "./Nav";
50
50
  export { StringFormatter } from "./StringFormatter";
51
51
  export { UserAvatar } from "./UserAvatar";
52
52
  export { ScrollGradient } from "./ScrollGradient";
53
- export { StatusIndicator } from "./StatusIndicator";
54
53
  export { TagOverflow } from "./TagOverflow";
55
54
  export { ActionBar } from "./ActionBar";
56
55
  export { ConditionBuilder } from "./ConditionBuilder";
@@ -68,5 +67,6 @@ export { EditTearsheet, EditTearsheetForm } from "./EditTearsheet";
68
67
  export { Guidebanner, GuidebannerElement, GuidebannerElementButton, GuidebannerElementLink } from "./Guidebanner";
69
68
  export { InlineTip, InlineTipButton, InlineTipLink } from "./InlineTip";
70
69
  export { DescriptionList, DescriptionListBody, DescriptionListCell, DescriptionListRow } from "./DescriptionList";
70
+ export { StatusIndicator, StatusIndicatorStep } from "./StatusIndicator";
71
71
  export { FilterPanel, FilterPanelAccordion, FilterPanelAccordionItem, FilterPanelCheckbox, FilterPanelCheckboxWithOverflow, FilterPanelGroup, FilterPanelLabel, FilterPanelSearch } from "./FilterPanel";
72
72
  export { FeatureFlags as unstable_FeatureFlags, useFeatureFlag as unstable_useFeatureFlag, useFeatureFlags as unstable_useFeatureFlags } from "./FeatureFlags";
package/lib/index.js CHANGED
@@ -126,6 +126,7 @@ var StringFormatter = require('./components/StringFormatter/StringFormatter.js')
126
126
  var UserAvatar = require('./components/UserAvatar/UserAvatar.js');
127
127
  var ScrollGradient = require('./components/ScrollGradient/ScrollGradient.js');
128
128
  var StatusIndicator = require('./components/StatusIndicator/StatusIndicator.js');
129
+ var StatusIndicatorStep = require('./components/StatusIndicator/StatusIndicatorStep.js');
129
130
  var TagOverflow = require('./components/TagOverflow/TagOverflow.js');
130
131
  var ActionBar = require('./components/ActionBar/ActionBar.js');
131
132
  var FilterPanel = require('./components/FilterPanel/FilterPanel.js');
@@ -535,6 +536,10 @@ Object.defineProperty(exports, 'StatusIndicator', {
535
536
  enumerable: true,
536
537
  get: function () { return StatusIndicator.StatusIndicator; }
537
538
  });
539
+ Object.defineProperty(exports, 'StatusIndicatorStep', {
540
+ enumerable: true,
541
+ get: function () { return StatusIndicatorStep.StatusIndicatorStep; }
542
+ });
538
543
  Object.defineProperty(exports, 'TagOverflow', {
539
544
  enumerable: true,
540
545
  get: function () { return TagOverflow.TagOverflow; }
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": "2.44.0-rc.0",
4
+ "version": "2.44.0-rc.1",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -26,7 +26,8 @@
26
26
  "lib",
27
27
  "scss",
28
28
  "flags.js",
29
- "telemetry.yml"
29
+ "telemetry.yml",
30
+ ".playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json"
30
31
  ],
31
32
  "keywords": [
32
33
  "carbon",
@@ -95,7 +96,7 @@
95
96
  "dependencies": {
96
97
  "@babel/runtime": "^7.23.9",
97
98
  "@carbon/feature-flags": "^0.20.0",
98
- "@carbon/ibm-products-styles": "^2.40.0-rc.0",
99
+ "@carbon/ibm-products-styles": "^2.40.0-rc.1",
99
100
  "@carbon/telemetry": "^0.1.0",
100
101
  "@dnd-kit/core": "^6.0.8",
101
102
  "@dnd-kit/modifiers": "^7.0.0",
@@ -119,5 +120,5 @@
119
120
  "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
120
121
  "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
121
122
  },
122
- "gitHead": "9546245eaa127386e9dc198845505396ca31298d"
123
+ "gitHead": "e080b44f87ff3170280f8f3149dd9af1eaa2748d"
123
124
  }
@@ -201,6 +201,13 @@ $header-cell-background: $layer-accent-01;
201
201
  outline: 0;
202
202
  }
203
203
  }
204
+
205
+ .#{$block-class}__td-th.#{$block-class}__td_custom {
206
+ align-items: center;
207
+ justify-content: center;
208
+ gap: $spacing-03;
209
+ }
210
+
204
211
  .#{$block-class}__selection-area--element {
205
212
  position: absolute;
206
213
  z-index: 2;
@@ -80,6 +80,19 @@ $row-heights: (
80
80
  align-items: center;
81
81
  }
82
82
 
83
+ .#{variables.$block-class}__inline-edit--outer-cell-checkbox-focus
84
+ .cds--checkbox-label::before {
85
+ outline: $spacing-01 solid $focus;
86
+ outline-offset: 1px;
87
+ }
88
+
89
+ .#{variables.$block-class}__inline-edit--outer-cell-checkbox {
90
+ display: flex;
91
+ height: -webkit-fill-available;
92
+ justify-content: center;
93
+ padding-inline: $spacing-05;
94
+ }
95
+
83
96
  .#{variables.$block-class}__static--outer-cell {
84
97
  display: flex;
85
98
  height: -webkit-fill-available;
package/telemetry.yml CHANGED
@@ -123,6 +123,7 @@ collect:
123
123
  - handleResize
124
124
  - hasActions
125
125
  - hasCloseIcon
126
+ - hasCustomRowHeader
126
127
  - hasFieldset
127
128
  - headerGroups
128
129
  - HeaderRow
@@ -264,6 +265,8 @@ collect:
264
265
  - radio
265
266
  - reactTableFiltersState
266
267
  - renderIcon
268
+ - renderRowHeader
269
+ - renderRowHeaderDirection
267
270
  - resetToDefaultLabel
268
271
  - resizerAriaLabel
269
272
  - rightAlign
@@ -784,6 +787,7 @@ collect:
784
787
  - inputInvalidText
785
788
  - inputLabelText
786
789
  - inputPlaceholderText
790
+ - primaryDangerDescription
787
791
  - resourceName
788
792
  - textConfirmation
789
793
  # RowSizeDropdown
@@ -1015,6 +1019,9 @@ collect:
1015
1019
  # General - primaryButtonPlacement
1016
1020
  - bottom
1017
1021
  - top
1022
+ # General - renderRowHeaderDirection
1023
+ - left
1024
+ - right
1018
1025
  # General - rowSize
1019
1026
  - lg
1020
1027
  - md