@elliemae/ds-shuttle 2.0.0-alpha.1 → 2.0.0-alpha.13
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/cjs/AnimationState.js +2 -1
- package/cjs/DSShuttle.js +85 -81
- package/cjs/SearchState.js +2 -1
- package/cjs/Shuttle.actions.js +29 -19
- package/cjs/ShuttleContainer.js +17 -10
- package/cjs/ShuttleImpl.js +30 -18
- package/cjs/ShuttleRenderer.js +11 -4
- package/cjs/ShuttleState.js +8 -3
- package/cjs/animation/animationConfig.js +10 -10
- package/cjs/classedComponents.js +33 -24
- package/cjs/components/LoadingIndicator.js +4 -4
- package/cjs/components/OverflowList.js +24 -13
- package/cjs/components/ShuttleBreadcrumb.js +23 -17
- package/cjs/components/ShuttleInfiniteScrollIndicator.js +22 -16
- package/cjs/components/ShuttleListItem/ActionButtons.js +12 -12
- package/cjs/components/ShuttleListItem/ShuttleListItem.js +26 -19
- package/cjs/components/ShuttleListItem/ShuttleSourceListItem.js +10 -4
- package/cjs/components/ShuttleListItem/ShuttleTargetListItem.js +9 -4
- package/cjs/components/ShuttleListPanel.js +9 -8
- package/cjs/components/ShuttleSearchBox.js +19 -19
- package/cjs/components/ShuttleSource.js +61 -55
- package/cjs/components/ShuttleTarget.js +37 -30
- package/cjs/components/VirtualizedItem.js +13 -7
- package/cjs/components/VirtualizedList.js +48 -36
- package/cjs/components/VirtualizedSortableList.js +7 -2
- package/cjs/helper.js +39 -19
- package/cjs/index.js +1 -1
- package/cjs/updateShuttleStateFromProps.js +17 -7
- package/cjs/utils.js +10 -7
- package/cjs/withProviders.js +7 -2
- package/esm/AnimationState.js +1 -0
- package/esm/DSShuttle.js +84 -80
- package/esm/SearchState.js +1 -0
- package/esm/Shuttle.actions.js +22 -12
- package/esm/ShuttleContainer.js +12 -5
- package/esm/ShuttleImpl.js +22 -10
- package/esm/ShuttleRenderer.js +9 -2
- package/esm/ShuttleState.js +7 -2
- package/esm/animation/animationConfig.js +10 -10
- package/esm/classedComponents.js +31 -22
- package/esm/components/LoadingIndicator.js +1 -1
- package/esm/components/OverflowList.js +23 -12
- package/esm/components/ShuttleBreadcrumb.js +21 -15
- package/esm/components/ShuttleInfiniteScrollIndicator.js +22 -16
- package/esm/components/ShuttleListItem/ActionButtons.js +7 -4
- package/esm/components/ShuttleListItem/ShuttleListItem.js +21 -13
- package/esm/components/ShuttleListItem/ShuttleSourceListItem.js +6 -0
- package/esm/components/ShuttleListItem/ShuttleTargetListItem.js +5 -0
- package/esm/components/ShuttleListPanel.js +7 -6
- package/esm/components/ShuttleSearchBox.js +16 -14
- package/esm/components/ShuttleSource.js +44 -36
- package/esm/components/ShuttleTarget.js +29 -22
- package/esm/components/VirtualizedItem.js +12 -6
- package/esm/components/VirtualizedList.js +47 -35
- package/esm/components/VirtualizedSortableList.js +5 -0
- package/esm/helper.js +33 -11
- package/esm/updateShuttleStateFromProps.js +11 -1
- package/esm/utils.js +6 -1
- package/esm/withProviders.js +5 -0
- package/package.json +27 -12
- package/types/DSShuttle.d.ts +259 -37
- package/types/components/ShuttleBreadcrumb.d.ts +1 -1
- package/cjs/package.json +0 -7
- package/esm/package.json +0 -7
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
|
-
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
5
4
|
var react = require('react');
|
|
6
5
|
var dsClassnames = require('@elliemae/ds-classnames');
|
|
7
|
-
var
|
|
8
|
-
var
|
|
6
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
7
|
+
var dsForm = require('@elliemae/ds-form');
|
|
9
8
|
|
|
10
9
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
10
|
|
|
12
11
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
13
|
-
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
14
|
-
var DSTextBox__default = /*#__PURE__*/_interopDefaultLegacy(DSTextBox);
|
|
15
12
|
|
|
16
13
|
const blockName = 'shuttle-search-box';
|
|
17
|
-
const SearchBoxContainer = dsClassnames.aggregatedClasses('div')(blockName, null,
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
14
|
+
const SearchBoxContainer = dsClassnames.aggregatedClasses('div')(blockName, null, _ref => {
|
|
15
|
+
let {
|
|
16
|
+
isOpen
|
|
17
|
+
} = _ref;
|
|
18
|
+
return {
|
|
19
|
+
opened: isOpen
|
|
20
|
+
};
|
|
21
|
+
});
|
|
22
|
+
const filterList = dsUtilities.debounce((term, onFilterCallback) => {
|
|
23
23
|
onFilterCallback(term);
|
|
24
24
|
}, 200);
|
|
25
25
|
class ShuttleSearchBox extends react.Component {
|
|
@@ -33,9 +33,10 @@ class ShuttleSearchBox extends react.Component {
|
|
|
33
33
|
this.handleKeyPress = this.handleKeyPress.bind(this);
|
|
34
34
|
}
|
|
35
35
|
|
|
36
|
-
static getDerivedStateFromProps(nextProps, {
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
static getDerivedStateFromProps(nextProps, _ref2) {
|
|
37
|
+
let {
|
|
38
|
+
prevProps
|
|
39
|
+
} = _ref2;
|
|
39
40
|
const {
|
|
40
41
|
value
|
|
41
42
|
} = nextProps;
|
|
@@ -84,11 +85,11 @@ class ShuttleSearchBox extends react.Component {
|
|
|
84
85
|
onClose,
|
|
85
86
|
placeholder
|
|
86
87
|
} = this.props;
|
|
87
|
-
return /*#__PURE__*/_jsx__default[
|
|
88
|
+
return /*#__PURE__*/_jsx__default["default"](SearchBoxContainer, {
|
|
88
89
|
classProps: {
|
|
89
90
|
isOpen
|
|
90
91
|
}
|
|
91
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
92
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSTextBox, {
|
|
92
93
|
autoFocus: true,
|
|
93
94
|
clearable: true,
|
|
94
95
|
onChange: this.handleChange,
|
|
@@ -100,11 +101,10 @@ class ShuttleSearchBox extends react.Component {
|
|
|
100
101
|
}
|
|
101
102
|
|
|
102
103
|
}
|
|
103
|
-
|
|
104
|
-
_defineProperty__default['default'](ShuttleSearchBox, "defaultProps", {
|
|
104
|
+
ShuttleSearchBox.defaultProps = {
|
|
105
105
|
filterOnKeyStroke: false,
|
|
106
106
|
onChange: () => null,
|
|
107
107
|
onFilter: () => null
|
|
108
|
-
}
|
|
108
|
+
};
|
|
109
109
|
|
|
110
110
|
module.exports = ShuttleSearchBox;
|
|
@@ -3,11 +3,17 @@
|
|
|
3
3
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
4
4
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
5
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.reduce.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.reduce.js');
|
|
9
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
11
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
12
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
6
13
|
var react = require('react');
|
|
7
|
-
var
|
|
8
|
-
var DSButton = require('@elliemae/ds-
|
|
9
|
-
var
|
|
10
|
-
var utils = require('@elliemae/ds-utilities/utils');
|
|
14
|
+
var dsIcons = require('@elliemae/ds-icons');
|
|
15
|
+
var DSButton = require('@elliemae/ds-button');
|
|
16
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
11
17
|
var ShuttleSearchBox = require('./ShuttleSearchBox.js');
|
|
12
18
|
var ShuttleInfiniteScrollIndicator = require('./ShuttleInfiniteScrollIndicator.js');
|
|
13
19
|
var ShuttleSourceListItem = require('./ShuttleListItem/ShuttleSourceListItem.js');
|
|
@@ -26,9 +32,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
|
|
|
26
32
|
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
27
33
|
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
28
34
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
29
|
-
var ArrowShortRight__default = /*#__PURE__*/_interopDefaultLegacy(ArrowShortRight);
|
|
30
35
|
var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
|
|
31
|
-
var Search__default = /*#__PURE__*/_interopDefaultLegacy(Search);
|
|
32
36
|
|
|
33
37
|
const _excluded = ["item"];
|
|
34
38
|
|
|
@@ -36,35 +40,36 @@ var _Search, _LoadingList, _ArrowShortRight, _ShuttleInfiniteScrol;
|
|
|
36
40
|
|
|
37
41
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
38
42
|
|
|
39
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default[
|
|
43
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
40
44
|
|
|
41
45
|
const noop = () => {};
|
|
42
46
|
|
|
43
|
-
function ShuttleSource({
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
47
|
+
function ShuttleSource(_ref) {
|
|
48
|
+
let {
|
|
49
|
+
items = [],
|
|
50
|
+
checkedItems = [],
|
|
51
|
+
// build Map() and memoize it for better performance
|
|
52
|
+
hierarchy = [],
|
|
53
|
+
onMoveItem = noop,
|
|
54
|
+
onCheckItem = noop,
|
|
55
|
+
onMoveCheckedItems = noop,
|
|
56
|
+
onNavigateTo = noop,
|
|
57
|
+
onClearCheckedItems = noop,
|
|
58
|
+
emptyMessage = 'No items found',
|
|
59
|
+
composeSourceItemProps = noop,
|
|
60
|
+
loading = false,
|
|
61
|
+
onSearch = noop,
|
|
62
|
+
onSearchClose = noop,
|
|
63
|
+
onSearchOpen = noop,
|
|
64
|
+
sourceSortable = false,
|
|
65
|
+
onSortEnd = noop,
|
|
66
|
+
sourceClearItemsText = 'CLEAR ALL',
|
|
67
|
+
searchPlaceholder,
|
|
68
|
+
renderSourceCounter = amount => "".concat(amount, " items"),
|
|
69
|
+
onGetMoreItems = () => {},
|
|
70
|
+
moreItemsLoading = false,
|
|
71
|
+
hasNextPage = false
|
|
72
|
+
} = _ref;
|
|
68
73
|
const {
|
|
69
74
|
state: {
|
|
70
75
|
isMovingBack = false,
|
|
@@ -85,7 +90,7 @@ function ShuttleSource({
|
|
|
85
90
|
}), {}), [checkedItems]);
|
|
86
91
|
const handleCloseSearch = react.useCallback(() => {
|
|
87
92
|
setSearchTerm('');
|
|
88
|
-
|
|
93
|
+
dsUtilities.runAll(resetSearch, onSearchClose)();
|
|
89
94
|
}, [searching]);
|
|
90
95
|
const handleToggleSearch = react.useCallback(() => {
|
|
91
96
|
toggleSearchBox(!searching);
|
|
@@ -98,10 +103,11 @@ function ShuttleSource({
|
|
|
98
103
|
}, [searching]);
|
|
99
104
|
const ComponentList = react.useMemo(() => sourceSortable ? VirtualizedSortableList : VirtualizedList, [sourceSortable]);
|
|
100
105
|
|
|
101
|
-
const handleSortEnd =
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
106
|
+
const handleSortEnd = _ref2 => {
|
|
107
|
+
let {
|
|
108
|
+
oldIndex,
|
|
109
|
+
newIndex
|
|
110
|
+
} = _ref2;
|
|
105
111
|
onSortEnd({
|
|
106
112
|
sourceItem: items[oldIndex],
|
|
107
113
|
targetItem: items[newIndex]
|
|
@@ -111,42 +117,42 @@ function ShuttleSource({
|
|
|
111
117
|
const isEmpty = !items.length;
|
|
112
118
|
const hasContent = !loading && !isEmpty;
|
|
113
119
|
const contentIsEmpty = !loading && isEmpty;
|
|
114
|
-
return /*#__PURE__*/_jsx__default[
|
|
120
|
+
return /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleWrapper, {}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleHeader, {}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleHeaderBreadcrumb, {
|
|
115
121
|
hierarchy: hierarchy,
|
|
116
122
|
onNavigateTo: onNavigateTo
|
|
117
|
-
}), /*#__PURE__*/_jsx__default[
|
|
123
|
+
}), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleHeaderSearchToggle, {
|
|
118
124
|
buttonType: "text",
|
|
119
|
-
icon: _Search || (_Search = /*#__PURE__*/_jsx__default[
|
|
125
|
+
icon: _Search || (_Search = /*#__PURE__*/_jsx__default["default"](dsIcons.Search, {})),
|
|
120
126
|
onClick: handleToggleSearch,
|
|
121
127
|
containerProps: {
|
|
122
128
|
'data-testid': 'shuttle-header-search-toggle'
|
|
123
129
|
}
|
|
124
|
-
})), /*#__PURE__*/_jsx__default[
|
|
130
|
+
})), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleList, {
|
|
125
131
|
classProps: {
|
|
126
132
|
showPulse: isMovingBack
|
|
127
133
|
},
|
|
128
134
|
style: {
|
|
129
135
|
pointerEvents: isMoving ? 'none' : null
|
|
130
136
|
}
|
|
131
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
137
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](ShuttleSearchBox, {
|
|
132
138
|
isOpen: searching,
|
|
133
|
-
onClose:
|
|
134
|
-
onFilter:
|
|
139
|
+
onClose: dsUtilities.runAll(() => toggleSearchBox(false), handleCloseSearch),
|
|
140
|
+
onFilter: dsUtilities.runAll(setSearchTerm, onSearch),
|
|
135
141
|
placeholder: searchPlaceholder,
|
|
136
142
|
value: searchTerm
|
|
137
|
-
}, searching), hasContent ? /*#__PURE__*/_jsx__default[
|
|
143
|
+
}, searching), hasContent ? /*#__PURE__*/_jsx__default["default"](classedComponents.Overflow, {
|
|
138
144
|
activeHierarchy: helper.getActiveIdFromHierarchy(hierarchy).id,
|
|
139
145
|
classProps: {
|
|
140
146
|
searching,
|
|
141
147
|
empty: isEmpty
|
|
142
148
|
}
|
|
143
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
149
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](ComponentList, {
|
|
144
150
|
helperClass: "drag-helper",
|
|
145
|
-
itemRenderer:
|
|
151
|
+
itemRenderer: _ref3 => {
|
|
146
152
|
let {
|
|
147
153
|
item
|
|
148
|
-
} =
|
|
149
|
-
rest = _objectWithoutProperties__default[
|
|
154
|
+
} = _ref3,
|
|
155
|
+
rest = _objectWithoutProperties__default["default"](_ref3, _excluded);
|
|
150
156
|
|
|
151
157
|
return /*#__PURE__*/jsxRuntime.jsx(ShuttleSourceListItem, _objectSpread(_objectSpread(_objectSpread({
|
|
152
158
|
"data-testid": "source-list-item"
|
|
@@ -163,20 +169,20 @@ function ShuttleSource({
|
|
|
163
169
|
onSortEnd: handleSortEnd,
|
|
164
170
|
getMoreItems: onGetMoreItems,
|
|
165
171
|
hasNextPage: hasNextPage
|
|
166
|
-
}, searchTerm)) : null, contentIsEmpty ? /*#__PURE__*/_jsx__default[
|
|
172
|
+
}, searchTerm)) : null, contentIsEmpty ? /*#__PURE__*/_jsx__default["default"](classedComponents.LoadingList, {
|
|
167
173
|
"data-testid": "shuttle__loading-list"
|
|
168
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
174
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.EmptyMessage, {}, void 0, emptyMessage)) : null, loading ? _LoadingList || (_LoadingList = /*#__PURE__*/_jsx__default["default"](classedComponents.LoadingList, {
|
|
169
175
|
"data-testid": "shuttle__loading-list"
|
|
170
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
176
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](LoadingIndicator, {}))) : null, /*#__PURE__*/_jsx__default["default"](ShuttleListPanel, {
|
|
171
177
|
onClick: onMoveCheckedItems,
|
|
172
178
|
open: checkedItems.length > 1
|
|
173
|
-
}, void 0, _ArrowShortRight || (_ArrowShortRight = /*#__PURE__*/_jsx__default[
|
|
179
|
+
}, void 0, _ArrowShortRight || (_ArrowShortRight = /*#__PURE__*/_jsx__default["default"](dsIcons.ArrowShortRight, {}))), moreItemsLoading ? _ShuttleInfiniteScrol || (_ShuttleInfiniteScrol = /*#__PURE__*/_jsx__default["default"](ShuttleInfiniteScrollIndicator, {
|
|
174
180
|
isOpen: true
|
|
175
|
-
})) : null), /*#__PURE__*/_jsx__default[
|
|
181
|
+
})) : null), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleFooter, {}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleFooterActions, {}, void 0, !!checkedItems.length && /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
|
|
176
182
|
buttonType: "link",
|
|
177
183
|
labelText: sourceClearItemsText,
|
|
178
184
|
onClick: onClearCheckedItems
|
|
179
|
-
})), /*#__PURE__*/_jsx__default[
|
|
185
|
+
})), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleFooterCounter, {}, void 0, renderSourceCounter(checkedItems.length))));
|
|
180
186
|
}
|
|
181
187
|
|
|
182
188
|
module.exports = ShuttleSource;
|
|
@@ -1,10 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
4
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
3
8
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
9
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
5
10
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
11
|
var react = require('react');
|
|
7
|
-
var DSButton = require('@elliemae/ds-
|
|
12
|
+
var DSButton = require('@elliemae/ds-button');
|
|
8
13
|
var classedComponents = require('../classedComponents.js');
|
|
9
14
|
var helper = require('../helper.js');
|
|
10
15
|
var AnimationState = require('../AnimationState.js');
|
|
@@ -27,61 +32,63 @@ var _LoadingIndicator;
|
|
|
27
32
|
|
|
28
33
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
29
34
|
|
|
30
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default[
|
|
35
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
31
36
|
|
|
32
37
|
const noop = () => {};
|
|
33
38
|
|
|
34
|
-
function ShuttleTarget({
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
39
|
+
function ShuttleTarget(_ref) {
|
|
40
|
+
let {
|
|
41
|
+
items = [],
|
|
42
|
+
hierarchy = [],
|
|
43
|
+
onNavigateTo = noop,
|
|
44
|
+
onMoveItem = noop,
|
|
45
|
+
onClearMovedItems = noop,
|
|
46
|
+
emptyMessage = 'No items selected',
|
|
47
|
+
composeTargetItemProps = () => ({}),
|
|
48
|
+
targetSortable = false,
|
|
49
|
+
onSortEnd = noop,
|
|
50
|
+
targetClearItemsText = 'CLEAR ALL',
|
|
51
|
+
renderTargetCounter = amount => "".concat(amount, " items"),
|
|
52
|
+
loading = false
|
|
53
|
+
} = _ref;
|
|
48
54
|
const {
|
|
49
55
|
state: {
|
|
50
56
|
isMoving = false
|
|
51
57
|
}
|
|
52
58
|
} = react.useContext(AnimationState.Context);
|
|
53
59
|
const isEmpty = !items.length;
|
|
54
|
-
const emptyContent = loading ? _LoadingIndicator || (_LoadingIndicator = /*#__PURE__*/_jsx__default[
|
|
60
|
+
const emptyContent = loading ? _LoadingIndicator || (_LoadingIndicator = /*#__PURE__*/_jsx__default["default"](LoadingIndicator, {})) : /*#__PURE__*/_jsx__default["default"](classedComponents.EmptyMessage, {}, void 0, emptyMessage);
|
|
55
61
|
const ComponentList = targetSortable ? VirtualizedSortableList : VirtualizedList;
|
|
56
62
|
|
|
57
|
-
const handleSortEnd =
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
63
|
+
const handleSortEnd = _ref2 => {
|
|
64
|
+
let {
|
|
65
|
+
oldIndex,
|
|
66
|
+
newIndex
|
|
67
|
+
} = _ref2;
|
|
61
68
|
onSortEnd({
|
|
62
69
|
sourceItem: items[oldIndex],
|
|
63
70
|
targetItem: items[newIndex]
|
|
64
71
|
});
|
|
65
72
|
};
|
|
66
73
|
|
|
67
|
-
return /*#__PURE__*/_jsx__default[
|
|
74
|
+
return /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleWrapper, {}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleHeader, {}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleHeaderBreadcrumb, {
|
|
68
75
|
hierarchy: hierarchy,
|
|
69
76
|
onNavigateTo: onNavigateTo
|
|
70
|
-
})), /*#__PURE__*/_jsx__default[
|
|
77
|
+
})), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleList, {
|
|
71
78
|
classProps: {
|
|
72
79
|
showPulse: isMoving
|
|
73
80
|
}
|
|
74
|
-
}, void 0, !loading && !isEmpty ? /*#__PURE__*/_jsx__default[
|
|
81
|
+
}, void 0, !loading && !isEmpty ? /*#__PURE__*/_jsx__default["default"](classedComponents.Overflow, {
|
|
75
82
|
activeHierarchy: helper.getActiveIdFromHierarchy(hierarchy).id,
|
|
76
83
|
classProps: {
|
|
77
84
|
empty: !items.length
|
|
78
85
|
}
|
|
79
|
-
}, void 0, /*#__PURE__*/_jsx__default[
|
|
80
|
-
itemRenderer:
|
|
86
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"](ComponentList, {
|
|
87
|
+
itemRenderer: _ref3 => {
|
|
81
88
|
let {
|
|
82
89
|
item
|
|
83
|
-
} =
|
|
84
|
-
rest = _objectWithoutProperties__default[
|
|
90
|
+
} = _ref3,
|
|
91
|
+
rest = _objectWithoutProperties__default["default"](_ref3, _excluded);
|
|
85
92
|
|
|
86
93
|
return /*#__PURE__*/jsxRuntime.jsx(ShuttleTargetListItem, _objectSpread(_objectSpread(_objectSpread({
|
|
87
94
|
"data-testid": "target-list-item"
|
|
@@ -96,14 +103,14 @@ function ShuttleTarget({
|
|
|
96
103
|
items: items,
|
|
97
104
|
onSortEnd: handleSortEnd,
|
|
98
105
|
target: true
|
|
99
|
-
})) : /*#__PURE__*/_jsx__default[
|
|
106
|
+
})) : /*#__PURE__*/_jsx__default["default"](classedComponents.LoadingList, {}, void 0, emptyContent)), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleFooter, {}, void 0, /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleFooterActions, {}, void 0, !!items.length && /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
|
|
100
107
|
containerProps: {
|
|
101
108
|
'data-testid': 'shuttle-clear-all-target'
|
|
102
109
|
},
|
|
103
110
|
buttonType: "link",
|
|
104
111
|
labelText: targetClearItemsText,
|
|
105
112
|
onClick: onClearMovedItems
|
|
106
|
-
})), /*#__PURE__*/_jsx__default[
|
|
113
|
+
})), /*#__PURE__*/_jsx__default["default"](classedComponents.ShuttleFooterCounter, {}, void 0, renderTargetCounter(items.length))));
|
|
107
114
|
}
|
|
108
115
|
|
|
109
116
|
module.exports = ShuttleTarget;
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
4
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
3
8
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
9
|
var react = require('react');
|
|
5
10
|
var reactWindow = require('react-window');
|
|
@@ -10,13 +15,14 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
|
|
|
10
15
|
|
|
11
16
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
12
17
|
|
|
13
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default[
|
|
14
|
-
const VirtualizedItem = /*#__PURE__*/react.memo(
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
18
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
19
|
+
const VirtualizedItem = /*#__PURE__*/react.memo(_ref => {
|
|
20
|
+
let {
|
|
21
|
+
data,
|
|
22
|
+
index,
|
|
23
|
+
style: virtualizedStyles,
|
|
24
|
+
showSortHandler = false
|
|
25
|
+
} = _ref;
|
|
20
26
|
const {
|
|
21
27
|
items,
|
|
22
28
|
itemRenderer,
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
4
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
3
8
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
4
9
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
5
10
|
var react = require('react');
|
|
@@ -21,18 +26,19 @@ var AutoSizer__default = /*#__PURE__*/_interopDefaultLegacy(AutoSizer);
|
|
|
21
26
|
|
|
22
27
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
23
28
|
|
|
24
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default[
|
|
29
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
25
30
|
|
|
26
|
-
function VirtualizedList({
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
31
|
+
function VirtualizedList(_ref) {
|
|
32
|
+
let {
|
|
33
|
+
items,
|
|
34
|
+
itemRenderer,
|
|
35
|
+
searching,
|
|
36
|
+
target = false,
|
|
37
|
+
innerRef,
|
|
38
|
+
children,
|
|
39
|
+
hasNextPage = true,
|
|
40
|
+
getMoreItems = () => {}
|
|
41
|
+
} = _ref;
|
|
36
42
|
const hasMounted = react.useRef(false);
|
|
37
43
|
const {
|
|
38
44
|
state: {
|
|
@@ -51,31 +57,37 @@ function VirtualizedList({
|
|
|
51
57
|
|
|
52
58
|
const isItemLoaded = index => !hasNextPage || index < items.length;
|
|
53
59
|
|
|
54
|
-
return /*#__PURE__*/_jsx__default[
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
60
|
+
return /*#__PURE__*/_jsx__default["default"](AutoSizer__default["default"], {}, void 0, _ref2 => {
|
|
61
|
+
let {
|
|
62
|
+
height,
|
|
63
|
+
width
|
|
64
|
+
} = _ref2;
|
|
65
|
+
return /*#__PURE__*/_jsx__default["default"](InfiniteLoader__default["default"], {
|
|
66
|
+
isItemLoaded: isItemLoaded,
|
|
67
|
+
itemCount: itemCount,
|
|
68
|
+
loadMoreItems: getMoreItems
|
|
69
|
+
}, void 0, _ref3 => {
|
|
70
|
+
let {
|
|
71
|
+
onItemsRendered,
|
|
72
|
+
ref
|
|
73
|
+
} = _ref3;
|
|
74
|
+
return /*#__PURE__*/jsxRuntime.jsx(reactWindow.FixedSizeList, {
|
|
75
|
+
height: searching ? 300 : height,
|
|
76
|
+
width: width,
|
|
77
|
+
innerRef: innerRef,
|
|
78
|
+
itemCount: transitions.length,
|
|
79
|
+
itemData: {
|
|
80
|
+
items: transitions,
|
|
81
|
+
itemRenderer,
|
|
82
|
+
isItemMoving: hasMounted.current && (isMoving || isMovingBack)
|
|
83
|
+
},
|
|
84
|
+
itemSize: 35,
|
|
85
|
+
onItemsRendered: onItemsRendered,
|
|
86
|
+
ref: ref,
|
|
87
|
+
children: children || VirtualizedItem
|
|
88
|
+
});
|
|
89
|
+
});
|
|
90
|
+
});
|
|
79
91
|
}
|
|
80
92
|
|
|
81
93
|
module.exports = VirtualizedList;
|
|
@@ -1,5 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
4
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
3
8
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
9
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
5
10
|
require('react');
|
|
@@ -17,14 +22,14 @@ const _excluded = ["items"];
|
|
|
17
22
|
|
|
18
23
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
|
|
19
24
|
|
|
20
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default[
|
|
25
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
|
|
21
26
|
const SortableList = reactSortableHoc.sortableContainer(VirtualizedList);
|
|
22
27
|
|
|
23
28
|
function VirtualizedSortableList(_ref) {
|
|
24
29
|
let {
|
|
25
30
|
items
|
|
26
31
|
} = _ref,
|
|
27
|
-
otherProps = _objectWithoutProperties__default[
|
|
32
|
+
otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
|
|
28
33
|
|
|
29
34
|
return /*#__PURE__*/jsxRuntime.jsx(SortableList, _objectSpread(_objectSpread({}, otherProps), {}, {
|
|
30
35
|
items: items,
|