@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
package/cjs/AnimationState.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
3
4
|
var react = require('react');
|
|
4
5
|
var createContainer = require('constate');
|
|
5
6
|
|
|
@@ -42,6 +43,6 @@ function useShuttleAnimationState() {
|
|
|
42
43
|
};
|
|
43
44
|
}
|
|
44
45
|
|
|
45
|
-
var AnimationContext = createContainer__default[
|
|
46
|
+
var AnimationContext = createContainer__default["default"](useShuttleAnimationState, value => [value.state]);
|
|
46
47
|
|
|
47
48
|
module.exports = AnimationContext;
|
package/cjs/DSShuttle.js
CHANGED
|
@@ -3,10 +3,11 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
6
7
|
require('react');
|
|
7
8
|
var lodash = require('lodash');
|
|
8
9
|
var reactDesc = require('react-desc');
|
|
9
|
-
var
|
|
10
|
+
var dsTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
|
|
10
11
|
var ShuttleImpl = require('./ShuttleImpl.js');
|
|
11
12
|
var utils = require('./utils.js');
|
|
12
13
|
|
|
@@ -16,85 +17,88 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
|
16
17
|
|
|
17
18
|
const noop = () => {};
|
|
18
19
|
|
|
19
|
-
const DSShuttle =
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
20
|
+
const DSShuttle = _ref => {
|
|
21
|
+
let {
|
|
22
|
+
containerProps = {},
|
|
23
|
+
idField = 'id',
|
|
24
|
+
parentIdField = 'parent',
|
|
25
|
+
showIcons = true,
|
|
26
|
+
items = [],
|
|
27
|
+
selectedItems = undefined,
|
|
28
|
+
// if defined it becomes controlled (v1)
|
|
29
|
+
// TODO make `nonSelectedItems` the default controlled behavior (v2)
|
|
30
|
+
nonSelectedItems = undefined,
|
|
31
|
+
onSearch = noop,
|
|
32
|
+
onSearchOpen = noop,
|
|
33
|
+
onSearchClose = noop,
|
|
34
|
+
onDrillDown = noop,
|
|
35
|
+
onDrillDownTarget = noop,
|
|
36
|
+
onTargetSortEnd = noop,
|
|
37
|
+
setGetStatus = noop,
|
|
38
|
+
targetSortable = true,
|
|
39
|
+
sourceEmptyMessage = 'No Items Found',
|
|
40
|
+
sourceRootTitle = 'Category',
|
|
41
|
+
targetEmptyMessage = 'No Items Selected',
|
|
42
|
+
targetRootTitle = 'Selected Items',
|
|
43
|
+
composeSourceItemProps = () => ({}),
|
|
44
|
+
composeTargetItemProps = () => ({}),
|
|
45
|
+
onAddToTarget = noop,
|
|
46
|
+
onAddCheckedItems = noop,
|
|
47
|
+
onRemoveFromTarget = noop,
|
|
48
|
+
onRemoveAllFromTarget = noop,
|
|
49
|
+
onChange = noop,
|
|
50
|
+
renderSourceCounter = noop,
|
|
51
|
+
renderTargetCounter = noop,
|
|
52
|
+
sourceClearItemsText = 'CLEAR ALL',
|
|
53
|
+
targetClearItemsText = 'CLEAR ALL',
|
|
54
|
+
searchPlaceholder = 'Search field ID, name, etc.',
|
|
55
|
+
loadingSource = false,
|
|
56
|
+
loadingTarget = false,
|
|
57
|
+
onGetMoreItems = () => null,
|
|
58
|
+
hasNextPage = false,
|
|
59
|
+
moreItemsLoading
|
|
60
|
+
} = _ref;
|
|
61
|
+
return /*#__PURE__*/_jsx__default["default"](dsTruncatedTooltipText.TooltipTextProvider, {}, void 0, /*#__PURE__*/_jsx__default["default"](ShuttleImpl, {
|
|
62
|
+
composeSourceItemProps: composeSourceItemProps,
|
|
63
|
+
composeTargetItemProps: composeTargetItemProps,
|
|
64
|
+
containerProps: containerProps,
|
|
65
|
+
idField: idField,
|
|
66
|
+
items: items,
|
|
67
|
+
onAddCheckedItems: onAddCheckedItems,
|
|
68
|
+
onAddToTarget: onAddToTarget,
|
|
69
|
+
onChange: onChange,
|
|
70
|
+
onDrillDown: onDrillDown,
|
|
71
|
+
nonSelectedItems: nonSelectedItems,
|
|
72
|
+
onDrillDownTarget: onDrillDownTarget,
|
|
73
|
+
onRemoveAllFromTarget: onRemoveAllFromTarget,
|
|
74
|
+
onRemoveFromTarget: onRemoveFromTarget,
|
|
75
|
+
onSearch: onSearch,
|
|
76
|
+
onSearchClose: onSearchClose,
|
|
77
|
+
onSearchOpen: onSearchOpen,
|
|
78
|
+
onTargetSortEnd: onTargetSortEnd,
|
|
79
|
+
parentIdField: parentIdField,
|
|
80
|
+
renderSourceCounter: renderSourceCounter,
|
|
81
|
+
renderTargetCounter: renderTargetCounter,
|
|
82
|
+
searchPlaceholder: searchPlaceholder,
|
|
83
|
+
selectedItems: selectedItems,
|
|
84
|
+
setGetStatus: setGetStatus,
|
|
85
|
+
showIcons: showIcons,
|
|
86
|
+
sourceClearItemsText: sourceClearItemsText,
|
|
87
|
+
sourceEmptyMessage: sourceEmptyMessage,
|
|
88
|
+
sourceRootTitle: sourceRootTitle,
|
|
89
|
+
targetClearItemsText: targetClearItemsText,
|
|
90
|
+
targetEmptyMessage: targetEmptyMessage,
|
|
91
|
+
targetRootTitle: targetRootTitle,
|
|
92
|
+
targetSortable: targetSortable,
|
|
93
|
+
loadingSource: loadingSource,
|
|
94
|
+
loadingTarget: loadingTarget,
|
|
95
|
+
onGetMoreItems: lodash.debounce(function () {
|
|
96
|
+
onGetMoreItems(...arguments);
|
|
97
|
+
}, 500),
|
|
98
|
+
moreItemsLoading: moreItemsLoading,
|
|
99
|
+
hasNextPage: hasNextPage
|
|
100
|
+
}));
|
|
101
|
+
};
|
|
98
102
|
|
|
99
103
|
const props = {
|
|
100
104
|
/** inject props to shuttle wrapper */
|
|
@@ -216,4 +220,4 @@ DSShuttleWithSchema.propTypes = props;
|
|
|
216
220
|
|
|
217
221
|
exports.utils = utils;
|
|
218
222
|
exports.DSShuttleWithSchema = DSShuttleWithSchema;
|
|
219
|
-
exports[
|
|
223
|
+
exports["default"] = DSShuttle;
|
package/cjs/SearchState.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
3
4
|
var react = require('react');
|
|
4
5
|
var createContainer = require('constate');
|
|
5
6
|
|
|
@@ -35,6 +36,6 @@ function useSearchState() {
|
|
|
35
36
|
};
|
|
36
37
|
}
|
|
37
38
|
|
|
38
|
-
var SearchState = createContainer__default[
|
|
39
|
+
var SearchState = createContainer__default["default"](useSearchState, value => [value.state]);
|
|
39
40
|
|
|
40
41
|
module.exports = SearchState;
|
package/cjs/Shuttle.actions.js
CHANGED
|
@@ -3,9 +3,15 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
6
|
-
|
|
6
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
7
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
10
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
11
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
12
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
7
13
|
var helper = require('./helper.js');
|
|
8
|
-
var utils
|
|
14
|
+
var utils = require('./utils.js');
|
|
9
15
|
|
|
10
16
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
11
17
|
|
|
@@ -13,10 +19,10 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
|
|
|
13
19
|
|
|
14
20
|
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; }
|
|
15
21
|
|
|
16
|
-
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[
|
|
22
|
+
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; }
|
|
17
23
|
function toggleItemSelection(itemId) {
|
|
18
24
|
return state => _objectSpread(_objectSpread({}, state), {}, {
|
|
19
|
-
checkedItems:
|
|
25
|
+
checkedItems: dsUtilities.addOrRemove(state.checkedItems, itemId)
|
|
20
26
|
});
|
|
21
27
|
}
|
|
22
28
|
function navigateTo(item, dest) {
|
|
@@ -43,11 +49,13 @@ const defaultOptions = {
|
|
|
43
49
|
op: hasMoved => !hasMoved
|
|
44
50
|
}; // todo: optimize this
|
|
45
51
|
|
|
46
|
-
function getItemDeep({
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
52
|
+
function getItemDeep(_ref) {
|
|
53
|
+
let {
|
|
54
|
+
collection,
|
|
55
|
+
id,
|
|
56
|
+
options
|
|
57
|
+
} = _ref;
|
|
58
|
+
|
|
51
59
|
const {
|
|
52
60
|
idField
|
|
53
61
|
} = _objectSpread(_objectSpread({}, defaultOptions), options);
|
|
@@ -55,7 +63,7 @@ function getItemDeep({
|
|
|
55
63
|
const itemIndex = collection.findIndex(fItem => fItem[idField] === id); // get item with nested children
|
|
56
64
|
|
|
57
65
|
const item = collection[itemIndex];
|
|
58
|
-
const children = item !== null && item !== void 0 && item.hasChildren ?
|
|
66
|
+
const children = item !== null && item !== void 0 && item.hasChildren ? dsUtilities.compose(utils.getChildren({
|
|
59
67
|
index: itemIndex
|
|
60
68
|
}))(collection) || [] : [];
|
|
61
69
|
return {
|
|
@@ -65,9 +73,10 @@ function getItemDeep({
|
|
|
65
73
|
}
|
|
66
74
|
|
|
67
75
|
function addToTarget(itemToAdd, collection) {
|
|
68
|
-
return (state, {
|
|
69
|
-
|
|
70
|
-
|
|
76
|
+
return (state, _ref2) => {
|
|
77
|
+
let {
|
|
78
|
+
idField
|
|
79
|
+
} = _ref2;
|
|
71
80
|
const items = collection || state.preparedItems;
|
|
72
81
|
const {
|
|
73
82
|
item,
|
|
@@ -84,19 +93,20 @@ function addToTarget(itemToAdd, collection) {
|
|
|
84
93
|
} // todo: optimize this
|
|
85
94
|
|
|
86
95
|
function removeFromTarget(itemToRemove) {
|
|
87
|
-
return (state, {
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
96
|
+
return (state, _ref3) => {
|
|
97
|
+
let {
|
|
98
|
+
idField
|
|
99
|
+
} = _ref3;
|
|
100
|
+
let targetItems = dsUtilities.cloneDeep(state.targetItems);
|
|
91
101
|
const itemIndex = targetItems.findIndex(fItem => fItem.id === itemToRemove.id);
|
|
92
102
|
const item = targetItems[itemIndex];
|
|
93
|
-
const children = item !== null && item !== void 0 && item.hasChildren ?
|
|
103
|
+
const children = item !== null && item !== void 0 && item.hasChildren ? dsUtilities.compose(helper.filterMovedItems(state.movedItems), utils.getChildren({
|
|
94
104
|
index: itemIndex
|
|
95
105
|
}))(targetItems) || [] : [];
|
|
96
106
|
targetItems.splice(itemIndex, 1);
|
|
97
107
|
|
|
98
108
|
if (item !== null && item !== void 0 && item.hasChildren && children.length) {
|
|
99
|
-
const childrenHash =
|
|
109
|
+
const childrenHash = dsUtilities.hashArray(children, 'id');
|
|
100
110
|
targetItems = targetItems.filter(i => !childrenHash[i.id]);
|
|
101
111
|
}
|
|
102
112
|
|
package/cjs/ShuttleContainer.js
CHANGED
|
@@ -2,8 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
4
|
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
10
|
var react = require('react');
|
|
6
|
-
var
|
|
11
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
7
12
|
var withProviders = require('./withProviders.js');
|
|
8
13
|
var helper = require('./helper.js');
|
|
9
14
|
var SearchState = require('./SearchState.js');
|
|
@@ -18,21 +23,23 @@ const _excluded = ["state"];
|
|
|
18
23
|
|
|
19
24
|
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; }
|
|
20
25
|
|
|
21
|
-
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[
|
|
26
|
+
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; }
|
|
22
27
|
|
|
23
28
|
function filterItemsByTerm(items, term) {
|
|
24
29
|
return items.filter(item => item.name.toLowerCase().indexOf(String(term).toLowerCase()) !== -1 || String(item.id).indexOf(String(term).toLowerCase()) !== -1);
|
|
25
30
|
}
|
|
26
31
|
|
|
27
|
-
function ShuttleContainer({
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
32
|
+
function ShuttleContainer(_ref) {
|
|
33
|
+
let {
|
|
34
|
+
items = [],
|
|
35
|
+
children
|
|
36
|
+
} = _ref;
|
|
37
|
+
|
|
31
38
|
const _useContext = react.useContext(ShuttleState.Context),
|
|
32
39
|
{
|
|
33
40
|
state: shuttleState
|
|
34
41
|
} = _useContext,
|
|
35
|
-
handlers = _objectWithoutProperties__default[
|
|
42
|
+
handlers = _objectWithoutProperties__default["default"](_useContext, _excluded);
|
|
36
43
|
|
|
37
44
|
const {
|
|
38
45
|
state: searchState
|
|
@@ -53,12 +60,12 @@ function ShuttleContainer({
|
|
|
53
60
|
navigate
|
|
54
61
|
} = _objectSpread(_objectSpread(_objectSpread({}, shuttleState), searchState), handlers);
|
|
55
62
|
|
|
56
|
-
const sourceItems = react.useMemo(() =>
|
|
63
|
+
const sourceItems = react.useMemo(() => dsUtilities.compose(items => items.filter(item => !movedItems[item.id]), items => searchTerm && searching ? filterItemsByTerm(items, searchTerm) : items, items => helper.filterItemsByHierarchy(items, helper.getActiveIdFromHierarchy(hierarchy).id), items => helper.prepareItems(items))(items), [items, searchTerm, searching, hierarchy, movedItems]);
|
|
57
64
|
const targetItems = react.useMemo(() => {
|
|
58
65
|
const hierarchyId = helper.getActiveIdFromHierarchy(hierarchyDest).id;
|
|
59
|
-
return
|
|
66
|
+
return dsUtilities.compose(items => dsUtilities.sortBy(items, ['name']), items => hierarchyId ? helper.filterItemsByHierarchy(items, hierarchyId).filter(item => !movedItems[item.id]) : dsUtilities.uniqBy(dsUtilities.values(movedItems), 'id'))(items);
|
|
60
67
|
}, [items, searching, hierarchyDest, movedItems]);
|
|
61
|
-
return
|
|
68
|
+
return dsUtilities.isFunction(children) && children({
|
|
62
69
|
checkedItems,
|
|
63
70
|
hierarchy,
|
|
64
71
|
hierarchyDest,
|
package/cjs/ShuttleImpl.js
CHANGED
|
@@ -1,9 +1,21 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
4
3
|
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
4
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
5
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.some.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.some.js');
|
|
10
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
11
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
12
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
13
|
+
require('core-js/modules/esnext.async-iterator.find.js');
|
|
14
|
+
require('core-js/modules/esnext.iterator.find.js');
|
|
15
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
16
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
5
17
|
var react = require('react');
|
|
6
|
-
var
|
|
18
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
7
19
|
var withProviders = require('./withProviders.js');
|
|
8
20
|
var Shuttle_actions = require('./Shuttle.actions.js');
|
|
9
21
|
var helper = require('./helper.js');
|
|
@@ -14,25 +26,25 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
14
26
|
|
|
15
27
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
16
28
|
|
|
17
|
-
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
18
29
|
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
30
|
+
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
19
31
|
|
|
20
32
|
const _excluded = ["idField", "nonSelectedItems", "moreItemsLoading"];
|
|
21
33
|
|
|
22
34
|
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
35
|
|
|
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[
|
|
36
|
+
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
37
|
|
|
26
38
|
class ShuttleImpl extends react.Component {
|
|
27
39
|
constructor(props) {
|
|
28
40
|
super(props);
|
|
29
41
|
|
|
30
|
-
|
|
42
|
+
this.getState = () => {
|
|
31
43
|
const {
|
|
32
44
|
movedItems
|
|
33
45
|
} = this.state;
|
|
34
46
|
return Object.keys(movedItems);
|
|
35
|
-
}
|
|
47
|
+
};
|
|
36
48
|
|
|
37
49
|
this.state = {
|
|
38
50
|
prevProps: {},
|
|
@@ -173,10 +185,11 @@ class ShuttleImpl extends react.Component {
|
|
|
173
185
|
onAddCheckedItems(items);
|
|
174
186
|
}
|
|
175
187
|
|
|
176
|
-
handleTargetSortEnd({
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
188
|
+
handleTargetSortEnd(_ref) {
|
|
189
|
+
let {
|
|
190
|
+
sourceItem,
|
|
191
|
+
targetItem
|
|
192
|
+
} = _ref;
|
|
180
193
|
const {
|
|
181
194
|
idField,
|
|
182
195
|
onTargetSortEnd
|
|
@@ -190,8 +203,8 @@ class ShuttleImpl extends react.Component {
|
|
|
190
203
|
const collection = !hierarchyId ? movedItems : targetItems;
|
|
191
204
|
const oldIndex = collection.findIndex(tItem => tItem[idField] === sourceItem[idField]);
|
|
192
205
|
const newIndex = collection.findIndex(tItem => tItem[idField] === targetItem[idField]);
|
|
193
|
-
const sortedMovedItems = !hierarchyId ?
|
|
194
|
-
const sortedItems = hierarchyId ?
|
|
206
|
+
const sortedMovedItems = !hierarchyId ? dsUtilities.arrayMove(movedItems, oldIndex, newIndex) : movedItems;
|
|
207
|
+
const sortedItems = hierarchyId ? dsUtilities.arrayMove(targetItems, oldIndex, newIndex) : targetItems;
|
|
195
208
|
this.setState({
|
|
196
209
|
targetItems: sortedItems,
|
|
197
210
|
movedItems: sortedMovedItems
|
|
@@ -209,7 +222,7 @@ class ShuttleImpl extends react.Component {
|
|
|
209
222
|
nonSelectedItems,
|
|
210
223
|
moreItemsLoading
|
|
211
224
|
} = _this$props,
|
|
212
|
-
rest = _objectWithoutProperties__default[
|
|
225
|
+
rest = _objectWithoutProperties__default["default"](_this$props, _excluded);
|
|
213
226
|
|
|
214
227
|
const {
|
|
215
228
|
hierarchy,
|
|
@@ -243,7 +256,7 @@ class ShuttleImpl extends react.Component {
|
|
|
243
256
|
if (nonSelectedItems) {
|
|
244
257
|
composedSourceItems = handleControlledSourceItms();
|
|
245
258
|
} else {
|
|
246
|
-
composedSourceItems =
|
|
259
|
+
composedSourceItems = dsUtilities.compose(helper.filterBySearch(searchTerm, searching), helper.filterMovedItems(movedItems), helper.getChildrenFromParent(helper.getActiveIdFromHierarchy(hierarchy).id))(items);
|
|
247
260
|
}
|
|
248
261
|
|
|
249
262
|
const handleControlledTargetItms = () => {
|
|
@@ -263,9 +276,9 @@ class ShuttleImpl extends react.Component {
|
|
|
263
276
|
if (nonSelectedItems) {
|
|
264
277
|
composedTargetItems = handleControlledTargetItms();
|
|
265
278
|
} else {
|
|
266
|
-
composedTargetItems =
|
|
279
|
+
composedTargetItems = dsUtilities.compose(tItems => {
|
|
267
280
|
const hierarchyId = helper.getActiveIdFromHierarchy(hierarchyDest).id;
|
|
268
|
-
return hierarchyId ?
|
|
281
|
+
return hierarchyId ? dsUtilities.compose(helper.filterMovedItems(movedItems), helper.getChildrenFromParent(hierarchyId))(tItems) : movedItems;
|
|
269
282
|
})(targetItems);
|
|
270
283
|
}
|
|
271
284
|
|
|
@@ -292,8 +305,7 @@ class ShuttleImpl extends react.Component {
|
|
|
292
305
|
|
|
293
306
|
}
|
|
294
307
|
|
|
295
|
-
|
|
296
|
-
|
|
308
|
+
ShuttleImpl.contextType = SearchState.Context;
|
|
297
309
|
var ShuttleImpl$1 = withProviders(ShuttleImpl);
|
|
298
310
|
|
|
299
311
|
module.exports = ShuttleImpl$1;
|
package/cjs/ShuttleRenderer.js
CHANGED
|
@@ -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
|
var react = require('react');
|
|
@@ -18,7 +23,7 @@ const _excluded = ["containerProps", "onNavigateOnTargetTo", "onNavigateOnSource
|
|
|
18
23
|
|
|
19
24
|
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; }
|
|
20
25
|
|
|
21
|
-
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[
|
|
26
|
+
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; }
|
|
22
27
|
|
|
23
28
|
const noop = () => {};
|
|
24
29
|
|
|
@@ -57,7 +62,7 @@ function ShuttleRenderer(_ref) {
|
|
|
57
62
|
moreItemsLoading = false,
|
|
58
63
|
hasNextPage = false
|
|
59
64
|
} = _ref,
|
|
60
|
-
otherProps = _objectWithoutProperties__default[
|
|
65
|
+
otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
|
|
61
66
|
|
|
62
67
|
const {
|
|
63
68
|
setIsMoving,
|
|
@@ -86,7 +91,8 @@ function ShuttleRenderer(_ref) {
|
|
|
86
91
|
onMoveItemToTarget(item);
|
|
87
92
|
removeAnimationState();
|
|
88
93
|
},
|
|
89
|
-
onNavigateTo: (item
|
|
94
|
+
onNavigateTo: function (item) {
|
|
95
|
+
let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'down';
|
|
90
96
|
const indexInHierarchy = hierarchy.findIndex(hItem => hItem.id === item.id);
|
|
91
97
|
setIsDrillingDown(indexInHierarchy === -1);
|
|
92
98
|
onNavigateOnSourceTo(item, direction);
|
|
@@ -117,7 +123,8 @@ function ShuttleRenderer(_ref) {
|
|
|
117
123
|
removeAnimationState();
|
|
118
124
|
onMoveItemToSource(item);
|
|
119
125
|
},
|
|
120
|
-
onNavigateTo: (item
|
|
126
|
+
onNavigateTo: function (item) {
|
|
127
|
+
let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'down';
|
|
121
128
|
const indexInHierarchy = hierarchyDest.findIndex(hItem => hItem.id === item.id);
|
|
122
129
|
setIsDrillingDown(indexInHierarchy === -1);
|
|
123
130
|
onNavigateOnTargetTo(item, direction);
|
package/cjs/ShuttleState.js
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
4
|
+
require('core-js/modules/esnext.async-iterator.map.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.map.js');
|
|
3
6
|
var react = require('react');
|
|
4
7
|
var createContainer = require('constate');
|
|
5
8
|
var helper = require('./helper.js');
|
|
@@ -25,7 +28,9 @@ function useShuttleState() {
|
|
|
25
28
|
|
|
26
29
|
const setState = state => setShuttleState(state(shuttleState));
|
|
27
30
|
|
|
28
|
-
function setMovedItems(
|
|
31
|
+
function setMovedItems() {
|
|
32
|
+
let itemsIds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
33
|
+
let items = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
|
|
29
34
|
const itemsToMove = helper.getItemsById(itemsIds, items);
|
|
30
35
|
const pipeActions = itemsToMove.map(item => Shuttle_actions.moveItem(item));
|
|
31
36
|
setState(helper.pipe([Shuttle_actions.resetMovedItems(), ...pipeActions]));
|
|
@@ -53,7 +58,7 @@ function useShuttleState() {
|
|
|
53
58
|
setState(Shuttle_actions.toggleItemSelection(item.id));
|
|
54
59
|
}
|
|
55
60
|
|
|
56
|
-
function moveCheckedItems(items
|
|
61
|
+
function moveCheckedItems(items) {
|
|
57
62
|
const pipeActions = items.map(item => moveItem(item));
|
|
58
63
|
setState(helper.pipe([...pipeActions, resetCheckedItems()]));
|
|
59
64
|
}
|
|
@@ -70,6 +75,6 @@ function useShuttleState() {
|
|
|
70
75
|
};
|
|
71
76
|
}
|
|
72
77
|
|
|
73
|
-
var useShuttleState$1 = createContainer__default[
|
|
78
|
+
var useShuttleState$1 = createContainer__default["default"](useShuttleState, value => [value.state]);
|
|
74
79
|
|
|
75
80
|
module.exports = useShuttleState$1;
|