@commercetools-uikit/data-table-manager 19.11.0 → 19.12.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 (10) hide show
  1. package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.cjs.dev.js +1 -2
  2. package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.cjs.prod.js +1 -2
  3. package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.esm.js +1 -2
  4. package/dist/{column-settings-manager-92b54563.cjs.dev.js → column-settings-manager-811cc2c0.cjs.dev.js} +11 -19
  5. package/dist/{column-settings-manager-b08669e8.cjs.prod.js → column-settings-manager-8c0da2ae.cjs.prod.js} +11 -19
  6. package/dist/{column-settings-manager-1430ee4f.esm.js → column-settings-manager-95b43d72.esm.js} +11 -18
  7. package/dist/commercetools-uikit-data-table-manager.cjs.dev.js +21 -28
  8. package/dist/commercetools-uikit-data-table-manager.cjs.prod.js +20 -27
  9. package/dist/commercetools-uikit-data-table-manager.esm.js +22 -29
  10. package/package.json +23 -23
package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.cjs.dev.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var columnSettingsManager = require('../../dist/column-settings-manager-92b54563.cjs.dev.js');
5
+ var columnSettingsManager = require('../../dist/column-settings-manager-811cc2c0.cjs.dev.js');
6
6
  require('@babel/runtime-corejs3/helpers/defineProperty');
7
7
  require('@babel/runtime-corejs3/helpers/slicedToArray');
8
8
  require('@emotion/styled/base');
@@ -35,7 +35,6 @@ require('@commercetools-uikit/collapsible-motion');
35
35
  require('@commercetools-uikit/card');
36
36
  require('@commercetools-uikit/text');
37
37
  require('@babel/runtime-corejs3/core-js-stable/instance/map');
38
- require('@babel/runtime-corejs3/core-js-stable/instance/concat');
39
38
  require('@commercetools-uikit/tag');
40
39
 
41
40
 
package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.cjs.prod.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var columnSettingsManager = require('../../dist/column-settings-manager-b08669e8.cjs.prod.js');
5
+ var columnSettingsManager = require('../../dist/column-settings-manager-8c0da2ae.cjs.prod.js');
6
6
  require('@babel/runtime-corejs3/helpers/defineProperty');
7
7
  require('@babel/runtime-corejs3/helpers/slicedToArray');
8
8
  require('@emotion/styled/base');
@@ -35,7 +35,6 @@ require('@commercetools-uikit/collapsible-motion');
35
35
  require('@commercetools-uikit/card');
36
36
  require('@commercetools-uikit/text');
37
37
  require('@babel/runtime-corejs3/core-js-stable/instance/map');
38
- require('@babel/runtime-corejs3/core-js-stable/instance/concat');
39
38
  require('@commercetools-uikit/tag');
40
39
 
41
40
 
package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.esm.js CHANGED
@@ -1,4 +1,4 @@
1
- export { C as ColumnSettingsManager } from '../../dist/column-settings-manager-1430ee4f.esm.js';
1
+ export { C as ColumnSettingsManager } from '../../dist/column-settings-manager-95b43d72.esm.js';
2
2
  import '@babel/runtime-corejs3/helpers/defineProperty';
3
3
  import '@babel/runtime-corejs3/helpers/slicedToArray';
4
4
  import '@emotion/styled/base';
@@ -31,5 +31,4 @@ import '@commercetools-uikit/collapsible-motion';
31
31
  import '@commercetools-uikit/card';
32
32
  import '@commercetools-uikit/text';
33
33
  import '@babel/runtime-corejs3/core-js-stable/instance/map';
34
- import '@babel/runtime-corejs3/core-js-stable/instance/concat';
35
34
  import '@commercetools-uikit/tag';
package/dist/{column-settings-manager-92b54563.cjs.dev.js → column-settings-manager-811cc2c0.cjs.dev.js} RENAMED
@@ -32,7 +32,6 @@ var CollapsibleMotion = require('@commercetools-uikit/collapsible-motion');
32
32
  var Card = require('@commercetools-uikit/card');
33
33
  var Text = require('@commercetools-uikit/text');
34
34
  var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
35
- var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
36
35
  var Tag = require('@commercetools-uikit/tag');
37
36
 
38
37
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -60,7 +59,6 @@ var CollapsibleMotion__default = /*#__PURE__*/_interopDefault(CollapsibleMotion)
60
59
  var Card__default = /*#__PURE__*/_interopDefault(Card);
61
60
  var Text__default = /*#__PURE__*/_interopDefault(Text);
62
61
  var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
63
- var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
64
62
  var Tag__default = /*#__PURE__*/_interopDefault(Tag);
65
63
 
66
64
  function _EMOTION_STRINGIFIED_CSS_ERROR__$1() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
@@ -189,10 +187,7 @@ const DraggableTagWrapper = /*#__PURE__*/_styled__default["default"]("div", proc
189
187
  label: "DraggableTagWrapper"
190
188
  })("padding:", designSystem.designTokens.spacing10, " 0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyYWdnYWJsZS10YWcudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1Cc0MiLCJmaWxlIjoiZHJhZ2dhYmxlLXRhZy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IERyYWdnYWJsZSB9IGZyb20gJ3JlYWN0LWJlYXV0aWZ1bC1kbmQnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgVGFnIGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L3RhZyc7XG5pbXBvcnQgRHJhZ2dpbmdDb250YWluZXIgZnJvbSAnLi9kcmFnZ2FibGUtdGFnLnN0eWxlcyc7XG5cbmV4cG9ydCB0eXBlIFRDb2x1bW5EYXRhID0ge1xuICBrZXk6IHN0cmluZztcbiAgbGFiZWw6IFJlYWN0Tm9kZTtcbn07XG5cbmV4cG9ydCB0eXBlIFREcmFnZ2FibGVUYWdQcm9wcyA9IHtcbiAgY29sdW1uOiBUQ29sdW1uRGF0YTtcbiAgaW5kZXg6IG51bWJlcjtcbiAgaXNEaXNhYmxlZD86IGJvb2xlYW47XG4gIG9uUmVtb3ZlPzogKGluZGV4OiBudW1iZXIpID0+IHZvaWQ7XG59O1xuXG5jb25zdCBEcmFnZ2FibGVUYWdXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgcGFkZGluZzogJHtkZXNpZ25Ub2tlbnMuc3BhY2luZzEwfSAwO1xuYDtcblxuY29uc3QgRHJhZ2dhYmxlVGFnID0gKHByb3BzOiBURHJhZ2dhYmxlVGFnUHJvcHMpID0+IHtcbiAgY29uc3QgaGFuZGxlUmVtb3ZlQ29sdW1uID0gKCkgPT4gcHJvcHMub25SZW1vdmU/Lihwcm9wcy5pbmRleCk7XG5cbiAgcmV0dXJuIChcbiAgICA8RHJhZ2dhYmxlXG4gICAgICBkcmFnZ2FibGVJZD17cHJvcHMuY29sdW1uLmtleX1cbiAgICAgIGluZGV4PXtwcm9wcy5pbmRleH1cbiAgICAgIGlzRHJhZ0Rpc2FibGVkPXtwcm9wcy5pc0Rpc2FibGVkfVxuICAgID5cbiAgICAgIHsocHJvdmlkZWQpID0+IHtcbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICA8RHJhZ2dhYmxlVGFnV3JhcHBlcj5cbiAgICAgICAgICAgIDxEcmFnZ2luZ0NvbnRhaW5lclxuICAgICAgICAgICAgICByZWY9e3Byb3ZpZGVkLmlubmVyUmVmfVxuICAgICAgICAgICAgICB7Li4ucHJvdmlkZWQuZHJhZ2dhYmxlUHJvcHN9XG4gICAgICAgICAgICAgIHsuLi5wcm92aWRlZC5kcmFnSGFuZGxlUHJvcHN9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIDxUYWdcbiAgICAgICAgICAgICAgICBvblJlbW92ZT17cHJvcHMub25SZW1vdmUgPyBoYW5kbGVSZW1vdmVDb2x1bW4gOiB1bmRlZmluZWR9XG4gICAgICAgICAgICAgICAgaXNEaXNhYmxlZD17cHJvcHMuaXNEaXNhYmxlZH1cbiAgICAgICAgICAgICAgICBpc0RyYWdnYWJsZVxuICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3Byb3BzLmNvbHVtbi5sYWJlbH1cbiAgICAgICAgICAgICAgPC9UYWc+XG4gICAgICAgICAgICA8L0RyYWdnaW5nQ29udGFpbmVyPlxuICAgICAgICAgIDwvRHJhZ2dhYmxlVGFnV3JhcHBlcj5cbiAgICAgICAgKTtcbiAgICAgIH19XG4gICAgPC9EcmFnZ2FibGU+XG4gICk7XG59O1xuXG5EcmFnZ2FibGVUYWcuZGlzcGxheU5hbWUgPSAnRHJhZ2dhYmxlVGFnJztcblxuZXhwb3J0IGRlZmF1bHQgRHJhZ2dhYmxlVGFnO1xuIl19 */"));
191
189
  const DraggableTag = props => {
192
- const handleRemoveColumn = () => {
193
- var _props$onRemove;
194
- return (_props$onRemove = props.onRemove) === null || _props$onRemove === void 0 ? void 0 : _props$onRemove.call(props, props.index);
195
- };
190
+ const handleRemoveColumn = () => props.onRemove?.(props.index);
196
191
  return jsxRuntime.jsx(reactBeautifulDnd.Draggable, {
197
192
  draggableId: props.column.key,
198
193
  index: props.index,
@@ -256,18 +251,15 @@ const DroppablePanel = props => {
256
251
  children: props.noColumnsText
257
252
  })
258
253
  }) : jsxRuntime.jsxs(jsxRuntime.Fragment, {
259
- children: [_mapInstanceProperty__default["default"](_context = props.columns).call(_context, (column, index) => {
260
- var _context2;
261
- return jsxRuntime.jsx(DraggableTag$1, {
262
- column: column,
263
- index: index,
264
- onRemove: props.onRemove ? () => {
265
- var _context3, _context4;
266
- return props.onRemove([..._sliceInstanceProperty__default["default"](_context3 = props.columns).call(_context3, 0, index), ..._sliceInstanceProperty__default["default"](_context4 = props.columns).call(_context4, index + 1)]);
267
- } : undefined,
268
- isDisabled: props.isDisabled
269
- }, _concatInstanceProperty__default["default"](_context2 = "".concat(column.key, "-")).call(_context2, index));
270
- }), props.isSearchable && jsxRuntime.jsx(Spacings__default["default"].Inset, {
254
+ children: [_mapInstanceProperty__default["default"](_context = props.columns).call(_context, (column, index) => jsxRuntime.jsx(DraggableTag$1, {
255
+ column: column,
256
+ index: index,
257
+ onRemove: props.onRemove ? () => {
258
+ var _context2, _context3;
259
+ return props.onRemove([..._sliceInstanceProperty__default["default"](_context2 = props.columns).call(_context2, 0, index), ..._sliceInstanceProperty__default["default"](_context3 = props.columns).call(_context3, index + 1)]);
260
+ } : undefined,
261
+ isDisabled: props.isDisabled
262
+ }, `${column.key}-${index}`)), props.isSearchable && jsxRuntime.jsx(Spacings__default["default"].Inset, {
271
263
  scale: "xs",
272
264
  children: jsxRuntime.jsx(Text__default["default"].Detail, {
273
265
  tone: "secondary",
@@ -394,7 +386,7 @@ const ColumnSettingsManager = props => {
394
386
  };
395
387
  const hiddenColumns = react.useMemo(() => differenceWith__default["default"](props.availableColumns, props.selectedColumns, (a, b) => a.key === b.key), [props.availableColumns, props.selectedColumns]);
396
388
  const handleDragEnd = react.useCallback(dragResult => handleColumnsUpdate(dragResult, props.onUpdateColumns, props.selectedColumns, props.availableColumns, setIsDragging), [props.onUpdateColumns, props.selectedColumns, props.availableColumns]);
397
- const debouncedSearchHiddenColumns = react.useMemo(() => debounce__default["default"](searchHiddenColumns !== null && searchHiddenColumns !== void 0 ? searchHiddenColumns : noSearch, 300), [searchHiddenColumns]);
389
+ const debouncedSearchHiddenColumns = react.useMemo(() => debounce__default["default"](searchHiddenColumns ?? noSearch, 300), [searchHiddenColumns]);
398
390
  const handleInputChange = react.useCallback(inputValue => debouncedSearchHiddenColumns(inputValue), [debouncedSearchHiddenColumns]);
399
391
  return jsxRuntime.jsx(SettingsContainer$1, {
400
392
  customSettingsTitle: props.title,
package/dist/{column-settings-manager-b08669e8.cjs.prod.js → column-settings-manager-8c0da2ae.cjs.prod.js} RENAMED
@@ -32,7 +32,6 @@ var CollapsibleMotion = require('@commercetools-uikit/collapsible-motion');
32
32
  var Card = require('@commercetools-uikit/card');
33
33
  var Text = require('@commercetools-uikit/text');
34
34
  var _mapInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/map');
35
- var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
36
35
  var Tag = require('@commercetools-uikit/tag');
37
36
 
38
37
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -59,7 +58,6 @@ var CollapsibleMotion__default = /*#__PURE__*/_interopDefault(CollapsibleMotion)
59
58
  var Card__default = /*#__PURE__*/_interopDefault(Card);
60
59
  var Text__default = /*#__PURE__*/_interopDefault(Text);
61
60
  var _mapInstanceProperty__default = /*#__PURE__*/_interopDefault(_mapInstanceProperty);
62
- var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
63
61
  var Tag__default = /*#__PURE__*/_interopDefault(Tag);
64
62
 
65
63
  const HeaderContainer = /*#__PURE__*/_styled__default["default"]("div", {
@@ -146,10 +144,7 @@ const DraggableTagWrapper = /*#__PURE__*/_styled__default["default"]("div", {
146
144
  target: "emzjy4n0"
147
145
  } )("padding:", designSystem.designTokens.spacing10, " 0;" + ("" ));
148
146
  const DraggableTag = props => {
149
- const handleRemoveColumn = () => {
150
- var _props$onRemove;
151
- return (_props$onRemove = props.onRemove) === null || _props$onRemove === void 0 ? void 0 : _props$onRemove.call(props, props.index);
152
- };
147
+ const handleRemoveColumn = () => props.onRemove?.(props.index);
153
148
  return jsxRuntime.jsx(reactBeautifulDnd.Draggable, {
154
149
  draggableId: props.column.key,
155
150
  index: props.index,
@@ -202,18 +197,15 @@ const DroppablePanel = props => {
202
197
  children: props.noColumnsText
203
198
  })
204
199
  }) : jsxRuntime.jsxs(jsxRuntime.Fragment, {
205
- children: [_mapInstanceProperty__default["default"](_context = props.columns).call(_context, (column, index) => {
206
- var _context2;
207
- return jsxRuntime.jsx(DraggableTag$1, {
208
- column: column,
209
- index: index,
210
- onRemove: props.onRemove ? () => {
211
- var _context3, _context4;
212
- return props.onRemove([..._sliceInstanceProperty__default["default"](_context3 = props.columns).call(_context3, 0, index), ..._sliceInstanceProperty__default["default"](_context4 = props.columns).call(_context4, index + 1)]);
213
- } : undefined,
214
- isDisabled: props.isDisabled
215
- }, _concatInstanceProperty__default["default"](_context2 = "".concat(column.key, "-")).call(_context2, index));
216
- }), props.isSearchable && jsxRuntime.jsx(Spacings__default["default"].Inset, {
200
+ children: [_mapInstanceProperty__default["default"](_context = props.columns).call(_context, (column, index) => jsxRuntime.jsx(DraggableTag$1, {
201
+ column: column,
202
+ index: index,
203
+ onRemove: props.onRemove ? () => {
204
+ var _context2, _context3;
205
+ return props.onRemove([..._sliceInstanceProperty__default["default"](_context2 = props.columns).call(_context2, 0, index), ..._sliceInstanceProperty__default["default"](_context3 = props.columns).call(_context3, index + 1)]);
206
+ } : undefined,
207
+ isDisabled: props.isDisabled
208
+ }, `${column.key}-${index}`)), props.isSearchable && jsxRuntime.jsx(Spacings__default["default"].Inset, {
217
209
  scale: "xs",
218
210
  children: jsxRuntime.jsx(Text__default["default"].Detail, {
219
211
  tone: "secondary",
@@ -325,7 +317,7 @@ const ColumnSettingsManager = props => {
325
317
  };
326
318
  const hiddenColumns = react.useMemo(() => differenceWith__default["default"](props.availableColumns, props.selectedColumns, (a, b) => a.key === b.key), [props.availableColumns, props.selectedColumns]);
327
319
  const handleDragEnd = react.useCallback(dragResult => handleColumnsUpdate(dragResult, props.onUpdateColumns, props.selectedColumns, props.availableColumns, setIsDragging), [props.onUpdateColumns, props.selectedColumns, props.availableColumns]);
328
- const debouncedSearchHiddenColumns = react.useMemo(() => debounce__default["default"](searchHiddenColumns !== null && searchHiddenColumns !== void 0 ? searchHiddenColumns : noSearch, 300), [searchHiddenColumns]);
320
+ const debouncedSearchHiddenColumns = react.useMemo(() => debounce__default["default"](searchHiddenColumns ?? noSearch, 300), [searchHiddenColumns]);
329
321
  const handleInputChange = react.useCallback(inputValue => debouncedSearchHiddenColumns(inputValue), [debouncedSearchHiddenColumns]);
330
322
  return jsxRuntime.jsx(SettingsContainer$1, {
331
323
  customSettingsTitle: props.title,
package/dist/{column-settings-manager-1430ee4f.esm.js → column-settings-manager-95b43d72.esm.js} RENAMED
@@ -30,7 +30,6 @@ import CollapsibleMotion from '@commercetools-uikit/collapsible-motion';
30
30
  import Card from '@commercetools-uikit/card';
31
31
  import Text from '@commercetools-uikit/text';
32
32
  import _mapInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/map';
33
- import _concatInstanceProperty from '@babel/runtime-corejs3/core-js-stable/instance/concat';
34
33
  import Tag from '@commercetools-uikit/tag';
35
34
 
36
35
  function _EMOTION_STRINGIFIED_CSS_ERROR__$1() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
@@ -159,10 +158,7 @@ const DraggableTagWrapper = /*#__PURE__*/_styled("div", process.env.NODE_ENV ===
159
158
  label: "DraggableTagWrapper"
160
159
  })("padding:", designTokens.spacing10, " 0;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImRyYWdnYWJsZS10YWcudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW1Cc0MiLCJmaWxlIjoiZHJhZ2dhYmxlLXRhZy50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IFJlYWN0Tm9kZSB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCB7IERyYWdnYWJsZSB9IGZyb20gJ3JlYWN0LWJlYXV0aWZ1bC1kbmQnO1xuaW1wb3J0IHsgZGVzaWduVG9rZW5zIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQgVGFnIGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L3RhZyc7XG5pbXBvcnQgRHJhZ2dpbmdDb250YWluZXIgZnJvbSAnLi9kcmFnZ2FibGUtdGFnLnN0eWxlcyc7XG5cbmV4cG9ydCB0eXBlIFRDb2x1bW5EYXRhID0ge1xuICBrZXk6IHN0cmluZztcbiAgbGFiZWw6IFJlYWN0Tm9kZTtcbn07XG5cbmV4cG9ydCB0eXBlIFREcmFnZ2FibGVUYWdQcm9wcyA9IHtcbiAgY29sdW1uOiBUQ29sdW1uRGF0YTtcbiAgaW5kZXg6IG51bWJlcjtcbiAgaXNEaXNhYmxlZD86IGJvb2xlYW47XG4gIG9uUmVtb3ZlPzogKGluZGV4OiBudW1iZXIpID0+IHZvaWQ7XG59O1xuXG5jb25zdCBEcmFnZ2FibGVUYWdXcmFwcGVyID0gc3R5bGVkLmRpdmBcbiAgcGFkZGluZzogJHtkZXNpZ25Ub2tlbnMuc3BhY2luZzEwfSAwO1xuYDtcblxuY29uc3QgRHJhZ2dhYmxlVGFnID0gKHByb3BzOiBURHJhZ2dhYmxlVGFnUHJvcHMpID0+IHtcbiAgY29uc3QgaGFuZGxlUmVtb3ZlQ29sdW1uID0gKCkgPT4gcHJvcHMub25SZW1vdmU/Lihwcm9wcy5pbmRleCk7XG5cbiAgcmV0dXJuIChcbiAgICA8RHJhZ2dhYmxlXG4gICAgICBkcmFnZ2FibGVJZD17cHJvcHMuY29sdW1uLmtleX1cbiAgICAgIGluZGV4PXtwcm9wcy5pbmRleH1cbiAgICAgIGlzRHJhZ0Rpc2FibGVkPXtwcm9wcy5pc0Rpc2FibGVkfVxuICAgID5cbiAgICAgIHsocHJvdmlkZWQpID0+IHtcbiAgICAgICAgcmV0dXJuIChcbiAgICAgICAgICA8RHJhZ2dhYmxlVGFnV3JhcHBlcj5cbiAgICAgICAgICAgIDxEcmFnZ2luZ0NvbnRhaW5lclxuICAgICAgICAgICAgICByZWY9e3Byb3ZpZGVkLmlubmVyUmVmfVxuICAgICAgICAgICAgICB7Li4ucHJvdmlkZWQuZHJhZ2dhYmxlUHJvcHN9XG4gICAgICAgICAgICAgIHsuLi5wcm92aWRlZC5kcmFnSGFuZGxlUHJvcHN9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgIDxUYWdcbiAgICAgICAgICAgICAgICBvblJlbW92ZT17cHJvcHMub25SZW1vdmUgPyBoYW5kbGVSZW1vdmVDb2x1bW4gOiB1bmRlZmluZWR9XG4gICAgICAgICAgICAgICAgaXNEaXNhYmxlZD17cHJvcHMuaXNEaXNhYmxlZH1cbiAgICAgICAgICAgICAgICBpc0RyYWdnYWJsZVxuICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge3Byb3BzLmNvbHVtbi5sYWJlbH1cbiAgICAgICAgICAgICAgPC9UYWc+XG4gICAgICAgICAgICA8L0RyYWdnaW5nQ29udGFpbmVyPlxuICAgICAgICAgIDwvRHJhZ2dhYmxlVGFnV3JhcHBlcj5cbiAgICAgICAgKTtcbiAgICAgIH19XG4gICAgPC9EcmFnZ2FibGU+XG4gICk7XG59O1xuXG5EcmFnZ2FibGVUYWcuZGlzcGxheU5hbWUgPSAnRHJhZ2dhYmxlVGFnJztcblxuZXhwb3J0IGRlZmF1bHQgRHJhZ2dhYmxlVGFnO1xuIl19 */"));
161
160
  const DraggableTag = props => {
162
- const handleRemoveColumn = () => {
163
- var _props$onRemove;
164
- return (_props$onRemove = props.onRemove) === null || _props$onRemove === void 0 ? void 0 : _props$onRemove.call(props, props.index);
165
- };
161
+ const handleRemoveColumn = () => props.onRemove?.(props.index);
166
162
  return jsx(Draggable, {
167
163
  draggableId: props.column.key,
168
164
  index: props.index,
@@ -226,18 +222,15 @@ const DroppablePanel = props => {
226
222
  children: props.noColumnsText
227
223
  })
228
224
  }) : jsxs(Fragment, {
229
- children: [_mapInstanceProperty(_context = props.columns).call(_context, (column, index) => {
230
- var _context2;
231
- return jsx(DraggableTag$1, {
232
- column: column,
233
- index: index,
234
- onRemove: props.onRemove ? () => {
235
- var _context3, _context4;
236
- return props.onRemove([..._sliceInstanceProperty(_context3 = props.columns).call(_context3, 0, index), ..._sliceInstanceProperty(_context4 = props.columns).call(_context4, index + 1)]);
237
- } : undefined,
238
- isDisabled: props.isDisabled
239
- }, _concatInstanceProperty(_context2 = "".concat(column.key, "-")).call(_context2, index));
240
- }), props.isSearchable && jsx(Spacings.Inset, {
225
+ children: [_mapInstanceProperty(_context = props.columns).call(_context, (column, index) => jsx(DraggableTag$1, {
226
+ column: column,
227
+ index: index,
228
+ onRemove: props.onRemove ? () => {
229
+ var _context2, _context3;
230
+ return props.onRemove([..._sliceInstanceProperty(_context2 = props.columns).call(_context2, 0, index), ..._sliceInstanceProperty(_context3 = props.columns).call(_context3, index + 1)]);
231
+ } : undefined,
232
+ isDisabled: props.isDisabled
233
+ }, `${column.key}-${index}`)), props.isSearchable && jsx(Spacings.Inset, {
241
234
  scale: "xs",
242
235
  children: jsx(Text.Detail, {
243
236
  tone: "secondary",
@@ -364,7 +357,7 @@ const ColumnSettingsManager = props => {
364
357
  };
365
358
  const hiddenColumns = useMemo(() => differenceWith(props.availableColumns, props.selectedColumns, (a, b) => a.key === b.key), [props.availableColumns, props.selectedColumns]);
366
359
  const handleDragEnd = useCallback(dragResult => handleColumnsUpdate(dragResult, props.onUpdateColumns, props.selectedColumns, props.availableColumns, setIsDragging), [props.onUpdateColumns, props.selectedColumns, props.availableColumns]);
367
- const debouncedSearchHiddenColumns = useMemo(() => debounce(searchHiddenColumns !== null && searchHiddenColumns !== void 0 ? searchHiddenColumns : noSearch, 300), [searchHiddenColumns]);
360
+ const debouncedSearchHiddenColumns = useMemo(() => debounce(searchHiddenColumns ?? noSearch, 300), [searchHiddenColumns]);
368
361
  const handleInputChange = useCallback(inputValue => debouncedSearchHiddenColumns(inputValue), [debouncedSearchHiddenColumns]);
369
362
  return jsx(SettingsContainer$1, {
370
363
  customSettingsTitle: props.title,
package/dist/commercetools-uikit-data-table-manager.cjs.dev.js CHANGED
@@ -32,7 +32,7 @@ var Grid = require('@commercetools-uikit/grid');
32
32
  var RadioInput = require('@commercetools-uikit/radio-input');
33
33
  var AccessibleHidden = require('@commercetools-uikit/accessible-hidden');
34
34
  var designSystem = require('@commercetools-uikit/design-system');
35
- var columnSettingsManager = require('./column-settings-manager-92b54563.cjs.dev.js');
35
+ var columnSettingsManager = require('./column-settings-manager-811cc2c0.cjs.dev.js');
36
36
  var hooks = require('@commercetools-uikit/hooks');
37
37
  var dataTableManagerProvider = require('./data-table-manager-provider-fc238633.cjs.dev.js');
38
38
  require('@babel/runtime-corejs3/core-js-stable/promise');
@@ -46,7 +46,6 @@ require('@commercetools-uikit/accessible-button');
46
46
  require('@commercetools-uikit/collapsible-motion');
47
47
  require('@commercetools-uikit/card');
48
48
  require('@commercetools-uikit/text');
49
- require('@babel/runtime-corejs3/core-js-stable/instance/concat');
50
49
  require('@commercetools-uikit/tag');
51
50
 
52
51
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -322,11 +321,11 @@ const getSelectedColumns = function (mappedColumns) {
322
321
  return _mapInstanceProperty__default["default"](visibleColumnsKeys).call(visibleColumnsKeys, columnKey => mappedColumns[columnKey]);
323
322
  };
324
323
  const DataTableSettings = props => {
325
- var _props$customColumnMa, _props$columnManager, _props$displaySetting, _props$displaySetting2, _props$columnManager2, _props$columnManager$, _props$columnManager3, _context3;
324
+ var _context3;
326
325
  const areDisplaySettingsEnabled = Boolean(props.displaySettings && !props.displaySettings.disableDisplaySettings);
327
326
  const areColumnSettingsEnabled = Boolean(props.columnManager && !props.columnManager.disableColumnManager);
328
- const areCustomColumnSettingsEnabled = Boolean(props.customColumnManager && !((_props$customColumnMa = props.customColumnManager) !== null && _props$customColumnMa !== void 0 && _props$customColumnMa.disableCustomColumnManager));
329
- process.env.NODE_ENV !== "production" ? utils.warning(areDisplaySettingsEnabled || areColumnSettingsEnabled ? typeof props.onSettingsChange === 'function' : true, "ui-kit/DataTableManager: the prop \"onSettingsChange\" is required when either the display settings or the column settings are enabled.") : void 0;
327
+ const areCustomColumnSettingsEnabled = Boolean(props.customColumnManager && !props.customColumnManager?.disableCustomColumnManager);
328
+ process.env.NODE_ENV !== "production" ? utils.warning(areDisplaySettingsEnabled || areColumnSettingsEnabled ? typeof props.onSettingsChange === 'function' : true, `ui-kit/DataTableManager: the prop "onSettingsChange" is required when either the display settings or the column settings are enabled.`) : void 0;
330
329
  const intl = reactIntl.useIntl();
331
330
  const _useState = react.useState(null),
332
331
  _useState2 = _slicedToArray(_useState, 2),
@@ -337,8 +336,8 @@ const DataTableSettings = props => {
337
336
  areDisplaySettingsEnabled,
338
337
  areColumnSettingsEnabled,
339
338
  customSettings: props.customSettings,
340
- columnManagerLabel: (_props$columnManager = props.columnManager) === null || _props$columnManager === void 0 ? void 0 : _props$columnManager.columnManagerLabel,
341
- displaySettingsLabel: (_props$displaySetting = props.displaySettings) === null || _props$displaySetting === void 0 ? void 0 : _props$displaySetting.displaySettingsLabel,
339
+ columnManagerLabel: props.columnManager?.columnManagerLabel,
340
+ displaySettingsLabel: props.displaySettings?.displaySettingsLabel,
342
341
  formatMessage: intl.formatMessage
343
342
  });
344
343
  const mappedColumns = getMappedColumns(areColumnSettingsEnabled ? props.columnManager.hideableColumns : undefined);
@@ -362,39 +361,35 @@ const DataTableSettings = props => {
362
361
  menuHorizontalConstraint: 'auto',
363
362
  menuPosition: "right",
364
363
  menuType: "list",
365
- children: dropdownOptions === null || dropdownOptions === void 0 ? void 0 : _mapInstanceProperty__default["default"](dropdownOptions).call(dropdownOptions, option => jsxRuntime.jsx(DropdownMenu__default["default"].ListMenuItem, {
364
+ children: dropdownOptions?.map(option => jsxRuntime.jsx(DropdownMenu__default["default"].ListMenuItem, {
366
365
  onClick: () => {
367
- setOpenedPanelId(option === null || option === void 0 ? void 0 : option.value);
366
+ setOpenedPanelId(option?.value);
368
367
  },
369
- children: option === null || option === void 0 ? void 0 : option.label
370
- }, option === null || option === void 0 ? void 0 : option.label))
368
+ children: option?.label
369
+ }, option?.label))
371
370
  })
372
371
  })]
373
372
  }), openedPanelId === DISPLAY_SETTINGS && jsxRuntime.jsx(DisplaySettingsManager, _objectSpread$1(_objectSpread$1({}, props.displaySettings || {}), {}, {
374
- title: (_props$displaySetting2 = props.displaySettings) === null || _props$displaySetting2 === void 0 ? void 0 : _props$displaySetting2.displaySettingsLabel,
373
+ title: props.displaySettings?.displaySettingsLabel,
375
374
  onClose: handleSettingsPanelChange,
376
375
  onDensityDisplayChange: event => {
377
- var _props$onSettingsChan;
378
- (_props$onSettingsChan = props.onSettingsChange) === null || _props$onSettingsChan === void 0 || _props$onSettingsChan.call(props, UPDATE_ACTIONS.IS_TABLE_CONDENSED_UPDATE, event.target.value === DENSITY_COMPACT);
376
+ props.onSettingsChange?.(UPDATE_ACTIONS.IS_TABLE_CONDENSED_UPDATE, event.target.value === DENSITY_COMPACT);
379
377
  },
380
378
  onTextWrappingChange: event => {
381
- var _props$onSettingsChan2;
382
- (_props$onSettingsChan2 = props.onSettingsChange) === null || _props$onSettingsChan2 === void 0 || _props$onSettingsChan2.call(props, UPDATE_ACTIONS.IS_TABLE_WRAPPING_TEXT_UPDATE, event.target.value === SHOW_HIDE_ON_DEMAND);
379
+ props.onSettingsChange?.(UPDATE_ACTIONS.IS_TABLE_WRAPPING_TEXT_UPDATE, event.target.value === SHOW_HIDE_ON_DEMAND);
383
380
  },
384
381
  managerTheme: props.managerTheme
385
382
  })), openedPanelId === COLUMN_MANAGER && jsxRuntime.jsx(columnSettingsManager.ColumnSettingsManager, _objectSpread$1(_objectSpread$1({}, props.columnManager || {}), {}, {
386
- title: (_props$columnManager2 = props.columnManager) === null || _props$columnManager2 === void 0 ? void 0 : _props$columnManager2.columnManagerLabel,
387
- availableColumns: (_props$columnManager$ = (_props$columnManager3 = props.columnManager) === null || _props$columnManager3 === void 0 ? void 0 : _props$columnManager3.hideableColumns) !== null && _props$columnManager$ !== void 0 ? _props$columnManager$ : [],
383
+ title: props.columnManager?.columnManagerLabel,
384
+ availableColumns: props.columnManager?.hideableColumns ?? [],
388
385
  selectedColumns: selectedColumns,
389
386
  onClose: handleSettingsPanelChange,
390
387
  onUpdateColumns: nextVisibleColumns => {
391
- var _props$onSettingsChan3;
392
388
  const keysOfVisibleColumns = _mapInstanceProperty__default["default"](nextVisibleColumns).call(nextVisibleColumns, visibleColumn => visibleColumn.key);
393
- (_props$onSettingsChan3 = props.onSettingsChange) === null || _props$onSettingsChan3 === void 0 || _props$onSettingsChan3.call(props, UPDATE_ACTIONS.COLUMNS_UPDATE, keysOfVisibleColumns);
389
+ props.onSettingsChange?.(UPDATE_ACTIONS.COLUMNS_UPDATE, keysOfVisibleColumns);
394
390
  },
395
391
  managerTheme: props.managerTheme
396
392
  })), props.customSettings && _mapInstanceProperty__default["default"](_context3 = _Object$entries__default["default"](props.customSettings)).call(_context3, _ref4 => {
397
- var _props$customColumnMa2;
398
393
  let _ref5 = _slicedToArray(_ref4, 2),
399
394
  key = _ref5[0],
400
395
  customSetting = _ref5[1];
@@ -408,19 +403,17 @@ const DataTableSettings = props => {
408
403
  onClose: handleSettingsPanelChange,
409
404
  managerTheme: props.managerTheme,
410
405
  selectedColumns: props.selectedColumns,
411
- availableColumns: (_props$customColumnMa2 = props.customColumnManager) !== null && _props$customColumnMa2 !== void 0 ? _props$customColumnMa2 : undefined,
406
+ availableColumns: props.customColumnManager ?? undefined,
412
407
  onUpdateColumns: (nextVisibleColumns, key) => {
413
- var _props$onSettingsChan4;
414
408
  const keysOfVisibleColumns = _mapInstanceProperty__default["default"](nextVisibleColumns).call(nextVisibleColumns, visibleColumn => visibleColumn.key);
415
- (_props$onSettingsChan4 = props.onSettingsChange) === null || _props$onSettingsChan4 === void 0 || _props$onSettingsChan4.call(props, UPDATE_ACTIONS.CUSTOM_COLUMNS_UPDATE, keysOfVisibleColumns, key);
409
+ props.onSettingsChange?.(UPDATE_ACTIONS.CUSTOM_COLUMNS_UPDATE, keysOfVisibleColumns, key);
416
410
  }
417
411
  })) : jsxRuntime.jsx(CustomSettingsManager$1, _objectSpread$1(_objectSpread$1({}, customSetting || {}), {}, {
418
412
  onClose: handleSettingsPanelChange,
419
413
  managerTheme: props.managerTheme,
420
414
  children: CustomComponent && jsxRuntime.jsx(CustomComponent, {
421
415
  updateCustomSettings: settings => {
422
- var _props$onSettingsChan5;
423
- (_props$onSettingsChan5 = props.onSettingsChange) === null || _props$onSettingsChan5 === void 0 || _props$onSettingsChan5.call(props, UPDATE_ACTIONS.CUSTOM_SETTINGS_UPDATE, settings);
416
+ props.onSettingsChange?.(UPDATE_ACTIONS.CUSTOM_SETTINGS_UPDATE, settings);
424
417
  },
425
418
  additionalSettings: _objectSpread$1(_objectSpread$1({}, customSetting), props.additionalSettings)
426
419
  })
@@ -474,8 +467,8 @@ const DataTableManager = props => {
474
467
  managerTheme: "light",
475
468
  additionalSettings: additionalCustomSetting,
476
469
  updateCustomSettings: settings => updateCustomSettings(settings),
477
- selectedColumns: selectedColumns !== null && selectedColumns !== void 0 ? selectedColumns : [],
478
- customColumnManager: customColumnManager !== null && customColumnManager !== void 0 ? customColumnManager : undefined
470
+ selectedColumns: selectedColumns ?? [],
471
+ customColumnManager: customColumnManager ?? undefined
479
472
  }), props.children ? /*#__PURE__*/react.cloneElement(props.children, {
480
473
  columns,
481
474
  customColumns,
package/dist/commercetools-uikit-data-table-manager.cjs.prod.js CHANGED
@@ -32,7 +32,7 @@ var Grid = require('@commercetools-uikit/grid');
32
32
  var RadioInput = require('@commercetools-uikit/radio-input');
33
33
  var AccessibleHidden = require('@commercetools-uikit/accessible-hidden');
34
34
  var designSystem = require('@commercetools-uikit/design-system');
35
- var columnSettingsManager = require('./column-settings-manager-b08669e8.cjs.prod.js');
35
+ var columnSettingsManager = require('./column-settings-manager-8c0da2ae.cjs.prod.js');
36
36
  var hooks = require('@commercetools-uikit/hooks');
37
37
  var dataTableManagerProvider = require('./data-table-manager-provider-c64c81aa.cjs.prod.js');
38
38
  require('@babel/runtime-corejs3/core-js-stable/promise');
@@ -46,7 +46,6 @@ require('@commercetools-uikit/accessible-button');
46
46
  require('@commercetools-uikit/collapsible-motion');
47
47
  require('@commercetools-uikit/card');
48
48
  require('@commercetools-uikit/text');
49
- require('@babel/runtime-corejs3/core-js-stable/instance/concat');
50
49
  require('@commercetools-uikit/tag');
51
50
 
52
51
  function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
@@ -297,10 +296,10 @@ const getSelectedColumns = function (mappedColumns) {
297
296
  return _mapInstanceProperty__default["default"](visibleColumnsKeys).call(visibleColumnsKeys, columnKey => mappedColumns[columnKey]);
298
297
  };
299
298
  const DataTableSettings = props => {
300
- var _props$customColumnMa, _props$columnManager, _props$displaySetting, _props$displaySetting2, _props$columnManager2, _props$columnManager$, _props$columnManager3, _context3;
299
+ var _context3;
301
300
  const areDisplaySettingsEnabled = Boolean(props.displaySettings && !props.displaySettings.disableDisplaySettings);
302
301
  const areColumnSettingsEnabled = Boolean(props.columnManager && !props.columnManager.disableColumnManager);
303
- const areCustomColumnSettingsEnabled = Boolean(props.customColumnManager && !((_props$customColumnMa = props.customColumnManager) !== null && _props$customColumnMa !== void 0 && _props$customColumnMa.disableCustomColumnManager));
302
+ const areCustomColumnSettingsEnabled = Boolean(props.customColumnManager && !props.customColumnManager?.disableCustomColumnManager);
304
303
  const intl = reactIntl.useIntl();
305
304
  const _useState = react.useState(null),
306
305
  _useState2 = _slicedToArray(_useState, 2),
@@ -311,8 +310,8 @@ const DataTableSettings = props => {
311
310
  areDisplaySettingsEnabled,
312
311
  areColumnSettingsEnabled,
313
312
  customSettings: props.customSettings,
314
- columnManagerLabel: (_props$columnManager = props.columnManager) === null || _props$columnManager === void 0 ? void 0 : _props$columnManager.columnManagerLabel,
315
- displaySettingsLabel: (_props$displaySetting = props.displaySettings) === null || _props$displaySetting === void 0 ? void 0 : _props$displaySetting.displaySettingsLabel,
313
+ columnManagerLabel: props.columnManager?.columnManagerLabel,
314
+ displaySettingsLabel: props.displaySettings?.displaySettingsLabel,
316
315
  formatMessage: intl.formatMessage
317
316
  });
318
317
  const mappedColumns = getMappedColumns(areColumnSettingsEnabled ? props.columnManager.hideableColumns : undefined);
@@ -336,39 +335,35 @@ const DataTableSettings = props => {
336
335
  menuHorizontalConstraint: 'auto',
337
336
  menuPosition: "right",
338
337
  menuType: "list",
339
- children: dropdownOptions === null || dropdownOptions === void 0 ? void 0 : _mapInstanceProperty__default["default"](dropdownOptions).call(dropdownOptions, option => jsxRuntime.jsx(DropdownMenu__default["default"].ListMenuItem, {
338
+ children: dropdownOptions?.map(option => jsxRuntime.jsx(DropdownMenu__default["default"].ListMenuItem, {
340
339
  onClick: () => {
341
- setOpenedPanelId(option === null || option === void 0 ? void 0 : option.value);
340
+ setOpenedPanelId(option?.value);
342
341
  },
343
- children: option === null || option === void 0 ? void 0 : option.label
344
- }, option === null || option === void 0 ? void 0 : option.label))
342
+ children: option?.label
343
+ }, option?.label))
345
344
  })
346
345
  })]
347
346
  }), openedPanelId === DISPLAY_SETTINGS && jsxRuntime.jsx(DisplaySettingsManager, _objectSpread$1(_objectSpread$1({}, props.displaySettings || {}), {}, {
348
- title: (_props$displaySetting2 = props.displaySettings) === null || _props$displaySetting2 === void 0 ? void 0 : _props$displaySetting2.displaySettingsLabel,
347
+ title: props.displaySettings?.displaySettingsLabel,
349
348
  onClose: handleSettingsPanelChange,
350
349
  onDensityDisplayChange: event => {
351
- var _props$onSettingsChan;
352
- (_props$onSettingsChan = props.onSettingsChange) === null || _props$onSettingsChan === void 0 || _props$onSettingsChan.call(props, UPDATE_ACTIONS.IS_TABLE_CONDENSED_UPDATE, event.target.value === DENSITY_COMPACT);
350
+ props.onSettingsChange?.(UPDATE_ACTIONS.IS_TABLE_CONDENSED_UPDATE, event.target.value === DENSITY_COMPACT);
353
351
  },
354
352
  onTextWrappingChange: event => {
355
- var _props$onSettingsChan2;
356
- (_props$onSettingsChan2 = props.onSettingsChange) === null || _props$onSettingsChan2 === void 0 || _props$onSettingsChan2.call(props, UPDATE_ACTIONS.IS_TABLE_WRAPPING_TEXT_UPDATE, event.target.value === SHOW_HIDE_ON_DEMAND);
353
+ props.onSettingsChange?.(UPDATE_ACTIONS.IS_TABLE_WRAPPING_TEXT_UPDATE, event.target.value === SHOW_HIDE_ON_DEMAND);
357
354
  },
358
355
  managerTheme: props.managerTheme
359
356
  })), openedPanelId === COLUMN_MANAGER && jsxRuntime.jsx(columnSettingsManager.ColumnSettingsManager, _objectSpread$1(_objectSpread$1({}, props.columnManager || {}), {}, {
360
- title: (_props$columnManager2 = props.columnManager) === null || _props$columnManager2 === void 0 ? void 0 : _props$columnManager2.columnManagerLabel,
361
- availableColumns: (_props$columnManager$ = (_props$columnManager3 = props.columnManager) === null || _props$columnManager3 === void 0 ? void 0 : _props$columnManager3.hideableColumns) !== null && _props$columnManager$ !== void 0 ? _props$columnManager$ : [],
357
+ title: props.columnManager?.columnManagerLabel,
358
+ availableColumns: props.columnManager?.hideableColumns ?? [],
362
359
  selectedColumns: selectedColumns,
363
360
  onClose: handleSettingsPanelChange,
364
361
  onUpdateColumns: nextVisibleColumns => {
365
- var _props$onSettingsChan3;
366
362
  const keysOfVisibleColumns = _mapInstanceProperty__default["default"](nextVisibleColumns).call(nextVisibleColumns, visibleColumn => visibleColumn.key);
367
- (_props$onSettingsChan3 = props.onSettingsChange) === null || _props$onSettingsChan3 === void 0 || _props$onSettingsChan3.call(props, UPDATE_ACTIONS.COLUMNS_UPDATE, keysOfVisibleColumns);
363
+ props.onSettingsChange?.(UPDATE_ACTIONS.COLUMNS_UPDATE, keysOfVisibleColumns);
368
364
  },
369
365
  managerTheme: props.managerTheme
370
366
  })), props.customSettings && _mapInstanceProperty__default["default"](_context3 = _Object$entries__default["default"](props.customSettings)).call(_context3, _ref4 => {
371
- var _props$customColumnMa2;
372
367
  let _ref5 = _slicedToArray(_ref4, 2),
373
368
  key = _ref5[0],
374
369
  customSetting = _ref5[1];
@@ -382,19 +377,17 @@ const DataTableSettings = props => {
382
377
  onClose: handleSettingsPanelChange,
383
378
  managerTheme: props.managerTheme,
384
379
  selectedColumns: props.selectedColumns,
385
- availableColumns: (_props$customColumnMa2 = props.customColumnManager) !== null && _props$customColumnMa2 !== void 0 ? _props$customColumnMa2 : undefined,
380
+ availableColumns: props.customColumnManager ?? undefined,
386
381
  onUpdateColumns: (nextVisibleColumns, key) => {
387
- var _props$onSettingsChan4;
388
382
  const keysOfVisibleColumns = _mapInstanceProperty__default["default"](nextVisibleColumns).call(nextVisibleColumns, visibleColumn => visibleColumn.key);
389
- (_props$onSettingsChan4 = props.onSettingsChange) === null || _props$onSettingsChan4 === void 0 || _props$onSettingsChan4.call(props, UPDATE_ACTIONS.CUSTOM_COLUMNS_UPDATE, keysOfVisibleColumns, key);
383
+ props.onSettingsChange?.(UPDATE_ACTIONS.CUSTOM_COLUMNS_UPDATE, keysOfVisibleColumns, key);
390
384
  }
391
385
  })) : jsxRuntime.jsx(CustomSettingsManager$1, _objectSpread$1(_objectSpread$1({}, customSetting || {}), {}, {
392
386
  onClose: handleSettingsPanelChange,
393
387
  managerTheme: props.managerTheme,
394
388
  children: CustomComponent && jsxRuntime.jsx(CustomComponent, {
395
389
  updateCustomSettings: settings => {
396
- var _props$onSettingsChan5;
397
- (_props$onSettingsChan5 = props.onSettingsChange) === null || _props$onSettingsChan5 === void 0 || _props$onSettingsChan5.call(props, UPDATE_ACTIONS.CUSTOM_SETTINGS_UPDATE, settings);
390
+ props.onSettingsChange?.(UPDATE_ACTIONS.CUSTOM_SETTINGS_UPDATE, settings);
398
391
  },
399
392
  additionalSettings: _objectSpread$1(_objectSpread$1({}, customSetting), props.additionalSettings)
400
393
  })
@@ -448,8 +441,8 @@ const DataTableManager = props => {
448
441
  managerTheme: "light",
449
442
  additionalSettings: additionalCustomSetting,
450
443
  updateCustomSettings: settings => updateCustomSettings(settings),
451
- selectedColumns: selectedColumns !== null && selectedColumns !== void 0 ? selectedColumns : [],
452
- customColumnManager: customColumnManager !== null && customColumnManager !== void 0 ? customColumnManager : undefined
444
+ selectedColumns: selectedColumns ?? [],
445
+ customColumnManager: customColumnManager ?? undefined
453
446
  }), props.children ? /*#__PURE__*/react.cloneElement(props.children, {
454
447
  columns,
455
448
  customColumns,
package/dist/commercetools-uikit-data-table-manager.esm.js CHANGED
@@ -28,8 +28,8 @@ import Grid from '@commercetools-uikit/grid';
28
28
  import RadioInput from '@commercetools-uikit/radio-input';
29
29
  import AccessibleHidden from '@commercetools-uikit/accessible-hidden';
30
30
  import { designTokens } from '@commercetools-uikit/design-system';
31
- import { S as SettingsContainer, C as ColumnSettingsManager } from './column-settings-manager-1430ee4f.esm.js';
32
- export { C as ColumnSettingsManager } from './column-settings-manager-1430ee4f.esm.js';
31
+ import { S as SettingsContainer, C as ColumnSettingsManager } from './column-settings-manager-95b43d72.esm.js';
32
+ export { C as ColumnSettingsManager } from './column-settings-manager-95b43d72.esm.js';
33
33
  export { useRowSelection, useSorting } from '@commercetools-uikit/hooks';
34
34
  export { D as DataTableManagerProvider, u as useDataTableManagerContext } from './data-table-manager-provider-32eb58dd.esm.js';
35
35
  import '@babel/runtime-corejs3/core-js-stable/promise';
@@ -43,7 +43,6 @@ import '@commercetools-uikit/accessible-button';
43
43
  import '@commercetools-uikit/collapsible-motion';
44
44
  import '@commercetools-uikit/card';
45
45
  import '@commercetools-uikit/text';
46
- import '@babel/runtime-corejs3/core-js-stable/instance/concat';
47
46
  import '@commercetools-uikit/tag';
48
47
 
49
48
  const UPDATE_ACTIONS = {
@@ -295,11 +294,11 @@ const getSelectedColumns = function (mappedColumns) {
295
294
  return _mapInstanceProperty(visibleColumnsKeys).call(visibleColumnsKeys, columnKey => mappedColumns[columnKey]);
296
295
  };
297
296
  const DataTableSettings = props => {
298
- var _props$customColumnMa, _props$columnManager, _props$displaySetting, _props$displaySetting2, _props$columnManager2, _props$columnManager$, _props$columnManager3, _context3;
297
+ var _context3;
299
298
  const areDisplaySettingsEnabled = Boolean(props.displaySettings && !props.displaySettings.disableDisplaySettings);
300
299
  const areColumnSettingsEnabled = Boolean(props.columnManager && !props.columnManager.disableColumnManager);
301
- const areCustomColumnSettingsEnabled = Boolean(props.customColumnManager && !((_props$customColumnMa = props.customColumnManager) !== null && _props$customColumnMa !== void 0 && _props$customColumnMa.disableCustomColumnManager));
302
- process.env.NODE_ENV !== "production" ? warning(areDisplaySettingsEnabled || areColumnSettingsEnabled ? typeof props.onSettingsChange === 'function' : true, "ui-kit/DataTableManager: the prop \"onSettingsChange\" is required when either the display settings or the column settings are enabled.") : void 0;
300
+ const areCustomColumnSettingsEnabled = Boolean(props.customColumnManager && !props.customColumnManager?.disableCustomColumnManager);
301
+ process.env.NODE_ENV !== "production" ? warning(areDisplaySettingsEnabled || areColumnSettingsEnabled ? typeof props.onSettingsChange === 'function' : true, `ui-kit/DataTableManager: the prop "onSettingsChange" is required when either the display settings or the column settings are enabled.`) : void 0;
303
302
  const intl = useIntl();
304
303
  const _useState = useState(null),
305
304
  _useState2 = _slicedToArray(_useState, 2),
@@ -310,8 +309,8 @@ const DataTableSettings = props => {
310
309
  areDisplaySettingsEnabled,
311
310
  areColumnSettingsEnabled,
312
311
  customSettings: props.customSettings,
313
- columnManagerLabel: (_props$columnManager = props.columnManager) === null || _props$columnManager === void 0 ? void 0 : _props$columnManager.columnManagerLabel,
314
- displaySettingsLabel: (_props$displaySetting = props.displaySettings) === null || _props$displaySetting === void 0 ? void 0 : _props$displaySetting.displaySettingsLabel,
312
+ columnManagerLabel: props.columnManager?.columnManagerLabel,
313
+ displaySettingsLabel: props.displaySettings?.displaySettingsLabel,
315
314
  formatMessage: intl.formatMessage
316
315
  });
317
316
  const mappedColumns = getMappedColumns(areColumnSettingsEnabled ? props.columnManager.hideableColumns : undefined);
@@ -335,39 +334,35 @@ const DataTableSettings = props => {
335
334
  menuHorizontalConstraint: 'auto',
336
335
  menuPosition: "right",
337
336
  menuType: "list",
338
- children: dropdownOptions === null || dropdownOptions === void 0 ? void 0 : _mapInstanceProperty(dropdownOptions).call(dropdownOptions, option => jsx(DropdownMenu.ListMenuItem, {
337
+ children: dropdownOptions?.map(option => jsx(DropdownMenu.ListMenuItem, {
339
338
  onClick: () => {
340
- setOpenedPanelId(option === null || option === void 0 ? void 0 : option.value);
339
+ setOpenedPanelId(option?.value);
341
340
  },
342
- children: option === null || option === void 0 ? void 0 : option.label
343
- }, option === null || option === void 0 ? void 0 : option.label))
341
+ children: option?.label
342
+ }, option?.label))
344
343
  })
345
344
  })]
346
345
  }), openedPanelId === DISPLAY_SETTINGS && jsx(DisplaySettingsManager, _objectSpread$1(_objectSpread$1({}, props.displaySettings || {}), {}, {
347
- title: (_props$displaySetting2 = props.displaySettings) === null || _props$displaySetting2 === void 0 ? void 0 : _props$displaySetting2.displaySettingsLabel,
346
+ title: props.displaySettings?.displaySettingsLabel,
348
347
  onClose: handleSettingsPanelChange,
349
348
  onDensityDisplayChange: event => {
350
- var _props$onSettingsChan;
351
- (_props$onSettingsChan = props.onSettingsChange) === null || _props$onSettingsChan === void 0 || _props$onSettingsChan.call(props, UPDATE_ACTIONS.IS_TABLE_CONDENSED_UPDATE, event.target.value === DENSITY_COMPACT);
349
+ props.onSettingsChange?.(UPDATE_ACTIONS.IS_TABLE_CONDENSED_UPDATE, event.target.value === DENSITY_COMPACT);
352
350
  },
353
351
  onTextWrappingChange: event => {
354
- var _props$onSettingsChan2;
355
- (_props$onSettingsChan2 = props.onSettingsChange) === null || _props$onSettingsChan2 === void 0 || _props$onSettingsChan2.call(props, UPDATE_ACTIONS.IS_TABLE_WRAPPING_TEXT_UPDATE, event.target.value === SHOW_HIDE_ON_DEMAND);
352
+ props.onSettingsChange?.(UPDATE_ACTIONS.IS_TABLE_WRAPPING_TEXT_UPDATE, event.target.value === SHOW_HIDE_ON_DEMAND);
356
353
  },
357
354
  managerTheme: props.managerTheme
358
355
  })), openedPanelId === COLUMN_MANAGER && jsx(ColumnSettingsManager, _objectSpread$1(_objectSpread$1({}, props.columnManager || {}), {}, {
359
- title: (_props$columnManager2 = props.columnManager) === null || _props$columnManager2 === void 0 ? void 0 : _props$columnManager2.columnManagerLabel,
360
- availableColumns: (_props$columnManager$ = (_props$columnManager3 = props.columnManager) === null || _props$columnManager3 === void 0 ? void 0 : _props$columnManager3.hideableColumns) !== null && _props$columnManager$ !== void 0 ? _props$columnManager$ : [],
356
+ title: props.columnManager?.columnManagerLabel,
357
+ availableColumns: props.columnManager?.hideableColumns ?? [],
361
358
  selectedColumns: selectedColumns,
362
359
  onClose: handleSettingsPanelChange,
363
360
  onUpdateColumns: nextVisibleColumns => {
364
- var _props$onSettingsChan3;
365
361
  const keysOfVisibleColumns = _mapInstanceProperty(nextVisibleColumns).call(nextVisibleColumns, visibleColumn => visibleColumn.key);
366
- (_props$onSettingsChan3 = props.onSettingsChange) === null || _props$onSettingsChan3 === void 0 || _props$onSettingsChan3.call(props, UPDATE_ACTIONS.COLUMNS_UPDATE, keysOfVisibleColumns);
362
+ props.onSettingsChange?.(UPDATE_ACTIONS.COLUMNS_UPDATE, keysOfVisibleColumns);
367
363
  },
368
364
  managerTheme: props.managerTheme
369
365
  })), props.customSettings && _mapInstanceProperty(_context3 = _Object$entries(props.customSettings)).call(_context3, _ref4 => {
370
- var _props$customColumnMa2;
371
366
  let _ref5 = _slicedToArray(_ref4, 2),
372
367
  key = _ref5[0],
373
368
  customSetting = _ref5[1];
@@ -381,19 +376,17 @@ const DataTableSettings = props => {
381
376
  onClose: handleSettingsPanelChange,
382
377
  managerTheme: props.managerTheme,
383
378
  selectedColumns: props.selectedColumns,
384
- availableColumns: (_props$customColumnMa2 = props.customColumnManager) !== null && _props$customColumnMa2 !== void 0 ? _props$customColumnMa2 : undefined,
379
+ availableColumns: props.customColumnManager ?? undefined,
385
380
  onUpdateColumns: (nextVisibleColumns, key) => {
386
- var _props$onSettingsChan4;
387
381
  const keysOfVisibleColumns = _mapInstanceProperty(nextVisibleColumns).call(nextVisibleColumns, visibleColumn => visibleColumn.key);
388
- (_props$onSettingsChan4 = props.onSettingsChange) === null || _props$onSettingsChan4 === void 0 || _props$onSettingsChan4.call(props, UPDATE_ACTIONS.CUSTOM_COLUMNS_UPDATE, keysOfVisibleColumns, key);
382
+ props.onSettingsChange?.(UPDATE_ACTIONS.CUSTOM_COLUMNS_UPDATE, keysOfVisibleColumns, key);
389
383
  }
390
384
  })) : jsx(CustomSettingsManager$1, _objectSpread$1(_objectSpread$1({}, customSetting || {}), {}, {
391
385
  onClose: handleSettingsPanelChange,
392
386
  managerTheme: props.managerTheme,
393
387
  children: CustomComponent && jsx(CustomComponent, {
394
388
  updateCustomSettings: settings => {
395
- var _props$onSettingsChan5;
396
- (_props$onSettingsChan5 = props.onSettingsChange) === null || _props$onSettingsChan5 === void 0 || _props$onSettingsChan5.call(props, UPDATE_ACTIONS.CUSTOM_SETTINGS_UPDATE, settings);
389
+ props.onSettingsChange?.(UPDATE_ACTIONS.CUSTOM_SETTINGS_UPDATE, settings);
397
390
  },
398
391
  additionalSettings: _objectSpread$1(_objectSpread$1({}, customSetting), props.additionalSettings)
399
392
  })
@@ -447,8 +440,8 @@ const DataTableManager = props => {
447
440
  managerTheme: "light",
448
441
  additionalSettings: additionalCustomSetting,
449
442
  updateCustomSettings: settings => updateCustomSettings(settings),
450
- selectedColumns: selectedColumns !== null && selectedColumns !== void 0 ? selectedColumns : [],
451
- customColumnManager: customColumnManager !== null && customColumnManager !== void 0 ? customColumnManager : undefined
443
+ selectedColumns: selectedColumns ?? [],
444
+ customColumnManager: customColumnManager ?? undefined
452
445
  }), props.children ? /*#__PURE__*/cloneElement(props.children, {
453
446
  columns,
454
447
  customColumns,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/data-table-manager",
3
3
  "description": "This component enhances the DataTable component and additionally provides a UI and state management to handle configuration of the table such as column manager.",
4
- "version": "19.11.0",
4
+ "version": "19.12.0",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -28,28 +28,28 @@
28
28
  "dependencies": {
29
29
  "@babel/runtime": "^7.20.13",
30
30
  "@babel/runtime-corejs3": "^7.20.13",
31
- "@commercetools-uikit/accessible-button": "19.11.0",
32
- "@commercetools-uikit/accessible-hidden": "19.11.0",
33
- "@commercetools-uikit/async-select-input": "19.11.0",
34
- "@commercetools-uikit/card": "19.11.0",
35
- "@commercetools-uikit/collapsible-motion": "19.11.0",
36
- "@commercetools-uikit/design-system": "19.11.0",
37
- "@commercetools-uikit/dropdown-menu": "19.11.0",
38
- "@commercetools-uikit/field-label": "19.11.0",
39
- "@commercetools-uikit/grid": "19.11.0",
40
- "@commercetools-uikit/hooks": "19.11.0",
41
- "@commercetools-uikit/icon-button": "19.11.0",
42
- "@commercetools-uikit/icons": "19.11.0",
43
- "@commercetools-uikit/primary-button": "19.11.0",
44
- "@commercetools-uikit/radio-input": "19.11.0",
45
- "@commercetools-uikit/secondary-button": "19.11.0",
46
- "@commercetools-uikit/secondary-icon-button": "19.11.0",
47
- "@commercetools-uikit/select-input": "19.11.0",
48
- "@commercetools-uikit/spacings": "19.11.0",
49
- "@commercetools-uikit/tag": "19.11.0",
50
- "@commercetools-uikit/text": "19.11.0",
51
- "@commercetools-uikit/tooltip": "19.11.0",
52
- "@commercetools-uikit/utils": "19.11.0",
31
+ "@commercetools-uikit/accessible-button": "19.12.0",
32
+ "@commercetools-uikit/accessible-hidden": "19.12.0",
33
+ "@commercetools-uikit/async-select-input": "19.12.0",
34
+ "@commercetools-uikit/card": "19.12.0",
35
+ "@commercetools-uikit/collapsible-motion": "19.12.0",
36
+ "@commercetools-uikit/design-system": "19.12.0",
37
+ "@commercetools-uikit/dropdown-menu": "19.12.0",
38
+ "@commercetools-uikit/field-label": "19.12.0",
39
+ "@commercetools-uikit/grid": "19.12.0",
40
+ "@commercetools-uikit/hooks": "19.12.0",
41
+ "@commercetools-uikit/icon-button": "19.12.0",
42
+ "@commercetools-uikit/icons": "19.12.0",
43
+ "@commercetools-uikit/primary-button": "19.12.0",
44
+ "@commercetools-uikit/radio-input": "19.12.0",
45
+ "@commercetools-uikit/secondary-button": "19.12.0",
46
+ "@commercetools-uikit/secondary-icon-button": "19.12.0",
47
+ "@commercetools-uikit/select-input": "19.12.0",
48
+ "@commercetools-uikit/spacings": "19.12.0",
49
+ "@commercetools-uikit/tag": "19.12.0",
50
+ "@commercetools-uikit/text": "19.12.0",
51
+ "@commercetools-uikit/tooltip": "19.12.0",
52
+ "@commercetools-uikit/utils": "19.12.0",
53
53
  "@emotion/react": "^11.10.5",
54
54
  "@emotion/styled": "^11.10.5",
55
55
  "debounce-promise": "^3.1.2",