@carbon/ibm-products 2.43.2-canary.15 → 2.43.2-canary.3

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 (61) hide show
  1. package/css/index-full-carbon.css +2 -3
  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.map +1 -1
  6. package/css/index-without-carbon-released-only.min.css.map +1 -1
  7. package/css/index-without-carbon.css +2 -3
  8. package/css/index-without-carbon.css.map +1 -1
  9. package/css/index-without-carbon.min.css +1 -1
  10. package/css/index-without-carbon.min.css.map +1 -1
  11. package/css/index.css +2 -3
  12. package/css/index.css.map +1 -1
  13. package/css/index.min.css +1 -1
  14. package/css/index.min.css.map +1 -1
  15. package/es/components/DataSpreadsheet/DataSpreadsheet.js +16 -29
  16. package/es/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +1 -9
  17. package/es/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -18
  18. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +0 -8
  19. package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +6 -17
  20. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +1 -4
  21. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +1 -3
  22. package/es/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +3 -15
  23. package/es/components/DataSpreadsheet/types/index.d.ts +1 -1
  24. package/es/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +2 -34
  25. package/es/components/Datagrid/types/index.d.ts +4 -18
  26. package/es/components/Datagrid/useActionsColumn.d.ts +1 -8
  27. package/es/components/Datagrid/useActionsColumn.js +6 -7
  28. package/es/components/Datagrid/useColumnRightAlign.d.ts +1 -8
  29. package/es/components/Datagrid/useColumnRightAlign.js +3 -4
  30. package/es/components/Datagrid/useNestedRows.js +9 -27
  31. package/es/components/Decorator/Decorator.js +1 -2
  32. package/es/components/DecoratorBase/DecoratorBase.js +5 -3
  33. package/es/components/DecoratorDualButton/DecoratorDualButton.js +1 -2
  34. package/es/components/DecoratorLink/DecoratorLink.js +1 -2
  35. package/es/components/DecoratorSingleButton/DecoratorSingleButton.js +1 -2
  36. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +16 -29
  37. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.d.ts +1 -9
  38. package/lib/components/DataSpreadsheet/DataSpreadsheetBody.js +2 -18
  39. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.d.ts +0 -8
  40. package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +6 -17
  41. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js +1 -4
  42. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.d.ts +1 -3
  43. package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js +3 -15
  44. package/lib/components/DataSpreadsheet/types/index.d.ts +1 -1
  45. package/lib/components/DataSpreadsheet/utils/moveColumnIndicatorLine.js +2 -34
  46. package/lib/components/Datagrid/types/index.d.ts +4 -18
  47. package/lib/components/Datagrid/useActionsColumn.d.ts +1 -8
  48. package/lib/components/Datagrid/useActionsColumn.js +6 -7
  49. package/lib/components/Datagrid/useColumnRightAlign.d.ts +1 -8
  50. package/lib/components/Datagrid/useColumnRightAlign.js +3 -4
  51. package/lib/components/Datagrid/useNestedRows.js +9 -27
  52. package/lib/components/Decorator/Decorator.js +1 -2
  53. package/lib/components/DecoratorBase/DecoratorBase.js +5 -3
  54. package/lib/components/DecoratorDualButton/DecoratorDualButton.js +1 -2
  55. package/lib/components/DecoratorLink/DecoratorLink.js +1 -2
  56. package/lib/components/DecoratorSingleButton/DecoratorSingleButton.js +1 -2
  57. package/package.json +3 -3
  58. package/scss/components/DataSpreadsheet/_data-spreadsheet.scss +0 -1
  59. package/scss/components/StatusIcon/_status-icon.scss +4 -4
  60. package/scss/components/StringFormatter/_string-formatter.scss +2 -2
  61. package/scss/components/UserProfileImage/_user-profile-image.scss +2 -6
@@ -23,30 +23,12 @@ var blockClass = "".concat(settings.pkg.prefix, "--datagrid");
23
23
  var useNestedRows = function useNestedRows(hooks) {
24
24
  useNestedRowExpander["default"](hooks);
25
25
  var useInstance = function useInstance(instance) {
26
- React.useEffect(function () {
27
- var _ref = instance,
28
- rows = _ref.rows;
29
- var defaultExpandedRows = rows.filter(function (row) {
30
- var _row$original;
31
- return row === null || row === void 0 || (_row$original = row.original) === null || _row$original === void 0 ? void 0 : _row$original.defaultExpanded;
32
- });
33
- if (defaultExpandedRows !== null && defaultExpandedRows !== void 0 && defaultExpandedRows.length) {
34
- defaultExpandedRows.map(function (defaultExpandedRow) {
35
- if (!(defaultExpandedRow !== null && defaultExpandedRow !== void 0 && defaultExpandedRow.isExpanded) && !(defaultExpandedRow !== null && defaultExpandedRow !== void 0 && defaultExpandedRow.hasExpanded)) {
36
- var _defaultExpandedRow$t;
37
- defaultExpandedRow === null || defaultExpandedRow === void 0 || (_defaultExpandedRow$t = defaultExpandedRow.toggleRowExpanded) === null || _defaultExpandedRow$t === void 0 || _defaultExpandedRow$t.call(defaultExpandedRow);
38
- defaultExpandedRow.hasExpanded = true;
39
- return;
40
- }
41
- });
42
- }
43
- }, [instance, instance.rows]);
44
26
  // This useEffect will expand rows if they exist in the initialState obj
45
27
  React.useEffect(function () {
46
28
  var rows = instance.rows,
47
29
  initialState = instance.initialState;
48
- var _ref2 = initialState,
49
- expandedRowIds = _ref2.expandedRowIds;
30
+ var _ref = initialState,
31
+ expandedRowIds = _ref.expandedRowIds;
50
32
  if (expandedRowIds) {
51
33
  Object.keys(expandedRowIds).forEach(function (key) {
52
34
  var row = rows.filter(function (r) {
@@ -60,14 +42,14 @@ var useNestedRows = function useNestedRows(hooks) {
60
42
  }
61
43
  }, [instance]);
62
44
  var marginLeft = 24;
63
- var getRowProps = function getRowProps(props, _ref3) {
64
- var row = _ref3.row;
45
+ var getRowProps = function getRowProps(props, _ref2) {
46
+ var row = _ref2.row;
65
47
  return [props, {
66
48
  className: cx__default["default"](_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__carbon-nested-row"), row.depth > 0), "".concat(blockClass, "__carbon-row-expanded"), row.isExpanded))
67
49
  }];
68
50
  };
69
- var getRowStyles = function getRowStyles(props, _ref4) {
70
- var row = _ref4.row;
51
+ var getRowStyles = function getRowStyles(props, _ref3) {
52
+ var row = _ref3.row;
71
53
  return [props, {
72
54
  style: {
73
55
  paddingLeft: "".concat(row.depth > 1 ? marginLeft * 2 + (row.depth - 1) * (marginLeft + marginLeft / 3) : row.depth === 1 ? marginLeft * 2 : 0, "px")
@@ -77,9 +59,9 @@ var useNestedRows = function useNestedRows(hooks) {
77
59
  var getIndentation = function getIndentation(depth) {
78
60
  return 32 * depth + 16;
79
61
  }; // row indentation padding
80
- var getCellProps = function getCellProps(props, _ref5) {
81
- var cell = _ref5.cell,
82
- instance = _ref5.instance;
62
+ var getCellProps = function getCellProps(props, _ref4) {
63
+ var cell = _ref4.cell,
64
+ instance = _ref4.instance;
83
65
  // we add a dynamic -ve margin right only if the cell is resized below minimum width i.e 50px, else we set the width based on indentation at different levels
84
66
  var isFirstCell = instance.columns.findIndex(function (c) {
85
67
  return c.id === cell.column.id;
@@ -95,8 +95,7 @@ exports.Decorator.propTypes = {
95
95
  */
96
96
  small: index["default"].bool,
97
97
  /**
98
- * Override the default theme of the component.
99
- * Useful if you want "invert" the component's theme.
98
+ * Determines the theme of the component.
100
99
  */
101
100
  theme: index["default"].oneOf(['light', 'dark']),
102
101
  /**
@@ -32,7 +32,8 @@ var defaults = {
32
32
  onContextMenu: function onContextMenu() {},
33
33
  onContextMenuLabel: function onContextMenuLabel() {},
34
34
  onContextMenuValue: function onContextMenuValue() {},
35
- scoreThresholds: [0, 4, 7, 10]
35
+ scoreThresholds: [0, 4, 7, 10],
36
+ theme: 'light'
36
37
  };
37
38
 
38
39
  /**
@@ -64,7 +65,8 @@ var DecoratorBase = /*#__PURE__*/React__default["default"].forwardRef(function (
64
65
  _ref$scoreThresholds = _ref.scoreThresholds,
65
66
  scoreThresholds = _ref$scoreThresholds === void 0 ? defaults.scoreThresholds : _ref$scoreThresholds,
66
67
  small = _ref.small,
67
- theme = _ref.theme,
68
+ _ref$theme = _ref.theme,
69
+ theme = _ref$theme === void 0 ? defaults.theme : _ref$theme,
68
70
  truncateValue = _ref.truncateValue,
69
71
  value = _ref.value,
70
72
  valueTitle = _ref.valueTitle,
@@ -74,7 +76,7 @@ var DecoratorBase = /*#__PURE__*/React__default["default"].forwardRef(function (
74
76
  var _value = utils.truncate(value, truncateValue);
75
77
 
76
78
  // These class names apply to all types of DecoratorBase.
77
- var classNames = cx__default["default"](blockClass, className, _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--").concat(theme), theme), "".concat(blockClass, "--sm"), small), "".concat(blockClass, "--truncate-end"), truncateValue === 'end'), "".concat(blockClass, "--truncate-start"), truncateValue === 'start'), "".concat(blockClass, "--truncate-midline"), truncateValue === null || truncateValue === void 0 ? void 0 : truncateValue.maxLength));
79
+ var classNames = cx__default["default"](blockClass, className, "".concat(blockClass, "--").concat(theme), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "--sm"), small), "".concat(blockClass, "--truncate-end"), truncateValue === 'end'), "".concat(blockClass, "--truncate-start"), truncateValue === 'start'), "".concat(blockClass, "--truncate-midline"), truncateValue === null || truncateValue === void 0 ? void 0 : truncateValue.maxLength));
78
80
 
79
81
  // These properties apply to all <DecoratorIcons>.
80
82
  var decoratorIconsProps = {
@@ -119,8 +119,7 @@ exports.DecoratorDualButton.propTypes = {
119
119
  */
120
120
  small: index["default"].bool,
121
121
  /**
122
- * Override the default theme of the component.
123
- * Useful if you want "invert" the component's theme.
122
+ * Determines the theme of the component.
124
123
  */
125
124
  theme: index["default"].oneOf(['light', 'dark']),
126
125
  /**
@@ -109,8 +109,7 @@ exports.DecoratorLink.propTypes = {
109
109
  */
110
110
  small: index["default"].bool,
111
111
  /**
112
- * Override the default theme of the component.
113
- * Useful if you want "invert" the component's theme.
112
+ * Determines the theme of the component.
114
113
  */
115
114
  theme: index["default"].oneOf(['light', 'dark']),
116
115
  /**
@@ -109,8 +109,7 @@ exports.DecoratorSingleButton.propTypes = {
109
109
  */
110
110
  small: index["default"].bool,
111
111
  /**
112
- * Override the default theme of the component.
113
- * Useful if you want "invert" the component's theme.
112
+ * Determines the theme of the component.
114
113
  */
115
114
  theme: index["default"].oneOf(['light', 'dark']),
116
115
  /**
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.43.2-canary.15+d38593707",
4
+ "version": "2.43.2-canary.3+0bc2c3d22",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -88,7 +88,7 @@
88
88
  "rimraf": "^5.0.5",
89
89
  "rollup": "^2.79.1",
90
90
  "rollup-plugin-strip-banner": "^3.0.0",
91
- "sass": "^1.77.2",
91
+ "sass": "^1.70.0",
92
92
  "typescript-config-carbon": "^0.2.1",
93
93
  "yargs": "^17.7.2"
94
94
  },
@@ -119,5 +119,5 @@
119
119
  "react": "^16.8.6 || ^17.0.1 || ^18.2.0",
120
120
  "react-dom": "^16.8.6 || ^17.0.1 || ^18.2.0"
121
121
  },
122
- "gitHead": "d38593707b174e14377e467257a4864dc78c8513"
122
+ "gitHead": "0bc2c3d226a8de3254a66789b1694154aea54dee"
123
123
  }
@@ -98,7 +98,6 @@ $header-cell-background: $layer-accent-01;
98
98
  position: sticky;
99
99
  z-index: 4;
100
100
  left: 0;
101
- background-color: $background;
102
101
  }
103
102
  .#{$block-class}__td-th.#{$block-class}__td {
104
103
  @include font-family.font-weight('semibold');
@@ -73,7 +73,7 @@ $themes: ('light', 'dark');
73
73
 
74
74
  $block-class: #{$pkg-prefix}--status-icon;
75
75
 
76
- @function carbon-clr($name, $theme: light) {
76
+ @function --clr($name, $theme: light) {
77
77
  // stylelint-disable-next-line carbon/theme-token-use
78
78
  $color: map-get(map-get($colors, $name), $theme);
79
79
  @return $color;
@@ -125,13 +125,13 @@ $block-class: #{$pkg-prefix}--status-icon;
125
125
  // stylelint-disable-next-line carbon/motion-duration-use, carbon/motion-easing-use
126
126
  animation: rotating 8000ms infinite linear;
127
127
  // stylelint-disable-next-line carbon/theme-token-use
128
- fill: carbon-clr($icon, $theme);
128
+ fill: --clr($icon, $theme);
129
129
  } @else if $icon == running {
130
130
  // stylelint-disable-next-line carbon/theme-token-use
131
- fill: carbon-clr($icon, $theme);
131
+ fill: --clr($icon, $theme);
132
132
  } @else {
133
133
  // stylelint-disable-next-line carbon/theme-token-use
134
- fill: carbon-clr($icon, $theme);
134
+ fill: --clr($icon, $theme);
135
135
  @media (prefers-reduced-motion) {
136
136
  .#{$block-class}--#{$theme}.#{$block-class}--#{$theme-key}-in-progress {
137
137
  animation: none;
@@ -79,7 +79,7 @@ $popover-block-class: #{c4p-settings.$carbon-prefix}--popover;
79
79
  .#{$block-class}
80
80
  .#{$popover-block-class}--top-right
81
81
  .#{$popover-block-class}-caret {
82
- /* stylelint-disable-next-line */
82
+ /* stylelint-disable-next-line declaration-no-important */
83
83
  inset-block-start: -1px !important;
84
84
  }
85
85
 
@@ -92,6 +92,6 @@ $popover-block-class: #{c4p-settings.$carbon-prefix}--popover;
92
92
  .#{$block-class}
93
93
  .#{$popover-block-class}--bottom-right
94
94
  .#{$popover-block-class}-caret {
95
- /* stylelint-disable-next-line */
95
+ /* stylelint-disable-next-line declaration-no-important */
96
96
  inset-block-end: -1px !important;
97
97
  }
@@ -44,7 +44,7 @@ $themes: (
44
44
 
45
45
  $theme-keys: map-keys($themes);
46
46
 
47
- @function carbon-get-background-color($color, $key, $contrast-key) {
47
+ @function --get-background-color($color, $key, $contrast-key) {
48
48
  @return map-get(
49
49
  $carbon-colors,
50
50
  #{$color}#{map-get(map-get($themes, $key), #{$contrast-key}-contrast)}
@@ -59,11 +59,7 @@ $theme-keys: map-keys($themes);
59
59
  @each $contrast-key in $theme-keys {
60
60
  .#{$block-class}--#{$key}.#{$block-class}--#{$contrast-key}-#{$color} {
61
61
  // stylelint-disable-next-line carbon/theme-token-use
62
- background-color: carbon-get-background-color(
63
- $color,
64
- $key,
65
- $contrast-key
66
- );
62
+ background-color: --get-background-color($color, $key, $contrast-key);
67
63
  }
68
64
  }
69
65
  }