@commercetools-uikit/data-table-manager 19.10.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.
- package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.cjs.dev.js +1 -2
- package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.cjs.prod.js +1 -2
- package/column-settings-manager/dist/commercetools-uikit-data-table-manager-column-settings-manager.esm.js +1 -2
- package/dist/{column-settings-manager-92b54563.cjs.dev.js → column-settings-manager-811cc2c0.cjs.dev.js} +11 -19
- package/dist/{column-settings-manager-b08669e8.cjs.prod.js → column-settings-manager-8c0da2ae.cjs.prod.js} +11 -19
- package/dist/{column-settings-manager-1430ee4f.esm.js → column-settings-manager-95b43d72.esm.js} +11 -18
- package/dist/commercetools-uikit-data-table-manager.cjs.dev.js +22 -29
- package/dist/commercetools-uikit-data-table-manager.cjs.prod.js +21 -28
- package/dist/commercetools-uikit-data-table-manager.esm.js +23 -30
- package/package.json +23 -23
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var columnSettingsManager = require('../../dist/column-settings-manager-
|
|
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
|
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
var columnSettingsManager = require('../../dist/column-settings-manager-
|
|
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
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { C as ColumnSettingsManager } from '../../dist/column-settings-manager-
|
|
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';
|
|
@@ -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
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
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
|
|
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,
|
|
@@ -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
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
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
|
|
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
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
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
|
|
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,
|
|
@@ -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-
|
|
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
|
|
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 && !
|
|
329
|
-
process.env.NODE_ENV !== "production" ? utils.warning(areDisplaySettingsEnabled || areColumnSettingsEnabled ? typeof props.onSettingsChange === 'function' : true,
|
|
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:
|
|
341
|
-
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
|
|
364
|
+
children: dropdownOptions?.map(option => jsxRuntime.jsx(DropdownMenu__default["default"].ListMenuItem, {
|
|
366
365
|
onClick: () => {
|
|
367
|
-
setOpenedPanelId(option
|
|
366
|
+
setOpenedPanelId(option?.value);
|
|
368
367
|
},
|
|
369
|
-
children: option
|
|
370
|
-
}, option
|
|
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:
|
|
373
|
+
title: props.displaySettings?.displaySettingsLabel,
|
|
375
374
|
onClose: handleSettingsPanelChange,
|
|
376
375
|
onDensityDisplayChange: event => {
|
|
377
|
-
|
|
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
|
-
|
|
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:
|
|
387
|
-
availableColumns:
|
|
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
|
-
|
|
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:
|
|
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
|
-
|
|
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
|
-
|
|
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
|
|
478
|
-
customColumnManager: customColumnManager
|
|
470
|
+
selectedColumns: selectedColumns ?? [],
|
|
471
|
+
customColumnManager: customColumnManager ?? undefined
|
|
479
472
|
}), props.children ? /*#__PURE__*/react.cloneElement(props.children, {
|
|
480
473
|
columns,
|
|
481
474
|
customColumns,
|
|
@@ -487,7 +480,7 @@ DataTableManager.displayName = 'DataTableManager';
|
|
|
487
480
|
var DataTableManager$1 = DataTableManager;
|
|
488
481
|
|
|
489
482
|
// NOTE: This string will be replaced on build time with the package version.
|
|
490
|
-
var version = "19.
|
|
483
|
+
var version = "19.11.0";
|
|
491
484
|
|
|
492
485
|
exports.ColumnSettingsManager = columnSettingsManager.ColumnSettingsManager;
|
|
493
486
|
Object.defineProperty(exports, 'useRowSelection', {
|
|
@@ -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-
|
|
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
|
|
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 && !
|
|
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:
|
|
315
|
-
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
|
|
338
|
+
children: dropdownOptions?.map(option => jsxRuntime.jsx(DropdownMenu__default["default"].ListMenuItem, {
|
|
340
339
|
onClick: () => {
|
|
341
|
-
setOpenedPanelId(option
|
|
340
|
+
setOpenedPanelId(option?.value);
|
|
342
341
|
},
|
|
343
|
-
children: option
|
|
344
|
-
}, option
|
|
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:
|
|
347
|
+
title: props.displaySettings?.displaySettingsLabel,
|
|
349
348
|
onClose: handleSettingsPanelChange,
|
|
350
349
|
onDensityDisplayChange: event => {
|
|
351
|
-
|
|
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
|
-
|
|
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:
|
|
361
|
-
availableColumns:
|
|
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
|
-
|
|
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:
|
|
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
|
-
|
|
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
|
-
|
|
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
|
|
452
|
-
customColumnManager: customColumnManager
|
|
444
|
+
selectedColumns: selectedColumns ?? [],
|
|
445
|
+
customColumnManager: customColumnManager ?? undefined
|
|
453
446
|
}), props.children ? /*#__PURE__*/react.cloneElement(props.children, {
|
|
454
447
|
columns,
|
|
455
448
|
customColumns,
|
|
@@ -461,7 +454,7 @@ DataTableManager.displayName = 'DataTableManager';
|
|
|
461
454
|
var DataTableManager$1 = DataTableManager;
|
|
462
455
|
|
|
463
456
|
// NOTE: This string will be replaced on build time with the package version.
|
|
464
|
-
var version = "19.
|
|
457
|
+
var version = "19.11.0";
|
|
465
458
|
|
|
466
459
|
exports.ColumnSettingsManager = columnSettingsManager.ColumnSettingsManager;
|
|
467
460
|
Object.defineProperty(exports, 'useRowSelection', {
|
|
@@ -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-
|
|
32
|
-
export { C as ColumnSettingsManager } from './column-settings-manager-
|
|
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
|
|
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 && !
|
|
302
|
-
process.env.NODE_ENV !== "production" ? warning(areDisplaySettingsEnabled || areColumnSettingsEnabled ? typeof props.onSettingsChange === 'function' : true,
|
|
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:
|
|
314
|
-
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
|
|
337
|
+
children: dropdownOptions?.map(option => jsx(DropdownMenu.ListMenuItem, {
|
|
339
338
|
onClick: () => {
|
|
340
|
-
setOpenedPanelId(option
|
|
339
|
+
setOpenedPanelId(option?.value);
|
|
341
340
|
},
|
|
342
|
-
children: option
|
|
343
|
-
}, option
|
|
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:
|
|
346
|
+
title: props.displaySettings?.displaySettingsLabel,
|
|
348
347
|
onClose: handleSettingsPanelChange,
|
|
349
348
|
onDensityDisplayChange: event => {
|
|
350
|
-
|
|
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
|
-
|
|
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:
|
|
360
|
-
availableColumns:
|
|
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
|
-
|
|
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:
|
|
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
|
-
|
|
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
|
-
|
|
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
|
|
451
|
-
customColumnManager: customColumnManager
|
|
443
|
+
selectedColumns: selectedColumns ?? [],
|
|
444
|
+
customColumnManager: customColumnManager ?? undefined
|
|
452
445
|
}), props.children ? /*#__PURE__*/cloneElement(props.children, {
|
|
453
446
|
columns,
|
|
454
447
|
customColumns,
|
|
@@ -460,6 +453,6 @@ DataTableManager.displayName = 'DataTableManager';
|
|
|
460
453
|
var DataTableManager$1 = DataTableManager;
|
|
461
454
|
|
|
462
455
|
// NOTE: This string will be replaced on build time with the package version.
|
|
463
|
-
var version = "19.
|
|
456
|
+
var version = "19.11.0";
|
|
464
457
|
|
|
465
458
|
export { UPDATE_ACTIONS, DataTableManager$1 as default, version };
|
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.
|
|
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.
|
|
32
|
-
"@commercetools-uikit/accessible-hidden": "19.
|
|
33
|
-
"@commercetools-uikit/async-select-input": "19.
|
|
34
|
-
"@commercetools-uikit/card": "19.
|
|
35
|
-
"@commercetools-uikit/collapsible-motion": "19.
|
|
36
|
-
"@commercetools-uikit/design-system": "19.
|
|
37
|
-
"@commercetools-uikit/dropdown-menu": "19.
|
|
38
|
-
"@commercetools-uikit/field-label": "19.
|
|
39
|
-
"@commercetools-uikit/grid": "19.
|
|
40
|
-
"@commercetools-uikit/hooks": "19.
|
|
41
|
-
"@commercetools-uikit/icon-button": "19.
|
|
42
|
-
"@commercetools-uikit/icons": "19.
|
|
43
|
-
"@commercetools-uikit/primary-button": "19.
|
|
44
|
-
"@commercetools-uikit/radio-input": "19.
|
|
45
|
-
"@commercetools-uikit/secondary-button": "19.
|
|
46
|
-
"@commercetools-uikit/secondary-icon-button": "19.
|
|
47
|
-
"@commercetools-uikit/select-input": "19.
|
|
48
|
-
"@commercetools-uikit/spacings": "19.
|
|
49
|
-
"@commercetools-uikit/tag": "19.
|
|
50
|
-
"@commercetools-uikit/text": "19.
|
|
51
|
-
"@commercetools-uikit/tooltip": "19.
|
|
52
|
-
"@commercetools-uikit/utils": "19.
|
|
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",
|