@elliemae/ds-shuttle 3.0.0-next.14 → 3.0.0-next.18
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/dist/cjs/ShuttleImpl.js +77 -79
- package/dist/cjs/ShuttleImpl.js.map +2 -2
- package/dist/esm/ShuttleImpl.js +77 -79
- package/dist/esm/ShuttleImpl.js.map +2 -2
- package/package.json +11 -11
package/dist/cjs/ShuttleImpl.js
CHANGED
|
@@ -75,6 +75,83 @@ class ShuttleImpl extends import_react.Component {
|
|
|
75
75
|
const { movedItems } = this.state;
|
|
76
76
|
return Object.keys(movedItems);
|
|
77
77
|
};
|
|
78
|
+
this.handleChange = () => {
|
|
79
|
+
const { onChange } = this.props;
|
|
80
|
+
const { movedItems } = this.state;
|
|
81
|
+
onChange(Object.keys(movedItems));
|
|
82
|
+
};
|
|
83
|
+
this.navigate = (item, dest, direction) => {
|
|
84
|
+
const { onDrillDown, onDrillDownTarget } = this.props;
|
|
85
|
+
if (!dest)
|
|
86
|
+
onDrillDown(item, direction);
|
|
87
|
+
if (dest)
|
|
88
|
+
onDrillDownTarget(item, direction);
|
|
89
|
+
const { reset: resetSearchState } = this.context;
|
|
90
|
+
resetSearchState();
|
|
91
|
+
this.setState((0, import_helper.pipe)([(0, import_Shuttle.navigateTo)(item, dest), (0, import_Shuttle.resetCheckedItems)()]));
|
|
92
|
+
};
|
|
93
|
+
this.resetCheckedItems = () => {
|
|
94
|
+
this.setState((0, import_Shuttle.resetCheckedItems)());
|
|
95
|
+
};
|
|
96
|
+
this.resetMovedItems = () => {
|
|
97
|
+
const { selectedItems, onRemoveAllFromTarget } = this.props;
|
|
98
|
+
if (!selectedItems) {
|
|
99
|
+
this.setState((0, import_helper.pipe)([(0, import_Shuttle.navigateTo)({ id: null }, true), (0, import_Shuttle.resetMovedItems)()]), () => {
|
|
100
|
+
this.handleChange();
|
|
101
|
+
});
|
|
102
|
+
} else {
|
|
103
|
+
this.setState((0, import_helper.pipe)([(0, import_Shuttle.navigateTo)({ id: null }, true)]));
|
|
104
|
+
}
|
|
105
|
+
onRemoveAllFromTarget();
|
|
106
|
+
};
|
|
107
|
+
this.addToTarget = (item) => {
|
|
108
|
+
const { selectedItems, onAddToTarget } = this.props;
|
|
109
|
+
if (!selectedItems) {
|
|
110
|
+
this.setState((0, import_helper.pipe)([(0, import_Shuttle.addToTarget)(item), (0, import_Shuttle.resetCheckedItems)()]), () => {
|
|
111
|
+
this.handleChange();
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
onAddToTarget(item);
|
|
115
|
+
};
|
|
116
|
+
this.removeFromTarget = (item) => {
|
|
117
|
+
const { selectedItems, onRemoveFromTarget } = this.props;
|
|
118
|
+
if (!selectedItems) {
|
|
119
|
+
this.setState((0, import_helper.pipe)([(0, import_Shuttle.removeFromTarget)(item)]), () => {
|
|
120
|
+
this.handleChange();
|
|
121
|
+
});
|
|
122
|
+
}
|
|
123
|
+
onRemoveFromTarget(item);
|
|
124
|
+
};
|
|
125
|
+
this.toggleItemSelection = (item) => {
|
|
126
|
+
this.setState((0, import_Shuttle.toggleItemSelection)(item.id));
|
|
127
|
+
};
|
|
128
|
+
this.moveCheckedItems = () => {
|
|
129
|
+
const { onAddCheckedItems, selectedItems, nonSelectedItems } = this.props;
|
|
130
|
+
const { checkedItems, preparedItems } = this.state;
|
|
131
|
+
const isControlledV2 = !!selectedItems && !!nonSelectedItems;
|
|
132
|
+
const checked = isControlledV2 ? nonSelectedItems.filter((item) => checkedItems.some((check) => check === item)) : checkedItems;
|
|
133
|
+
const items = (0, import_helper.getItemsById)(checked, preparedItems);
|
|
134
|
+
const actions = !selectedItems ? items.map((item) => (0, import_Shuttle.addToTarget)(item)) : [];
|
|
135
|
+
this.setState((0, import_helper.pipe)([...actions, (0, import_Shuttle.resetCheckedItems)()]), () => {
|
|
136
|
+
this.handleChange();
|
|
137
|
+
});
|
|
138
|
+
onAddCheckedItems(items);
|
|
139
|
+
};
|
|
140
|
+
this.handleTargetSortEnd = ({ sourceItem, targetItem }) => {
|
|
141
|
+
const { idField, onTargetSortEnd } = this.props;
|
|
142
|
+
const { targetItems, hierarchyDest, movedItems } = this.state;
|
|
143
|
+
const hierarchyId = (0, import_helper.getActiveIdFromHierarchy)(hierarchyDest).id;
|
|
144
|
+
const collection = !hierarchyId ? movedItems : targetItems;
|
|
145
|
+
const oldIndex = collection.findIndex((tItem) => tItem[idField] === sourceItem[idField]);
|
|
146
|
+
const newIndex = collection.findIndex((tItem) => tItem[idField] === targetItem[idField]);
|
|
147
|
+
const sortedMovedItems = !hierarchyId ? (0, import_ds_utilities.arrayMove)(movedItems, oldIndex, newIndex) : movedItems;
|
|
148
|
+
const sortedItems = hierarchyId ? (0, import_ds_utilities.arrayMove)(targetItems, oldIndex, newIndex) : targetItems;
|
|
149
|
+
this.setState({
|
|
150
|
+
targetItems: sortedItems,
|
|
151
|
+
movedItems: sortedMovedItems
|
|
152
|
+
});
|
|
153
|
+
onTargetSortEnd({ sourceItem, targetItem });
|
|
154
|
+
};
|
|
78
155
|
this.state = {
|
|
79
156
|
prevProps: {},
|
|
80
157
|
preparedItems: [],
|
|
@@ -85,8 +162,6 @@ class ShuttleImpl extends import_react.Component {
|
|
|
85
162
|
sourceItems: [],
|
|
86
163
|
targetItems: []
|
|
87
164
|
};
|
|
88
|
-
this.moveCheckedItems = this.moveCheckedItems.bind(this);
|
|
89
|
-
this.resetMovedItems = this.resetMovedItems.bind(this);
|
|
90
165
|
}
|
|
91
166
|
static getDerivedStateFromProps(nextProps, prevState) {
|
|
92
167
|
return (0, import_updateShuttleStateFromProps.updateShuttleStateFromProps)(nextProps, prevState);
|
|
@@ -95,83 +170,6 @@ class ShuttleImpl extends import_react.Component {
|
|
|
95
170
|
const { setGetStatus } = this.props;
|
|
96
171
|
setGetStatus(this.getState);
|
|
97
172
|
}
|
|
98
|
-
handleChange() {
|
|
99
|
-
const { onChange } = this.props;
|
|
100
|
-
const { movedItems } = this.state;
|
|
101
|
-
onChange(Object.keys(movedItems));
|
|
102
|
-
}
|
|
103
|
-
navigate(item, dest, direction) {
|
|
104
|
-
const { onDrillDown, onDrillDownTarget } = this.props;
|
|
105
|
-
if (!dest)
|
|
106
|
-
onDrillDown(item, direction);
|
|
107
|
-
if (dest)
|
|
108
|
-
onDrillDownTarget(item, direction);
|
|
109
|
-
const { reset: resetSearchState } = this.context;
|
|
110
|
-
resetSearchState();
|
|
111
|
-
this.setState((0, import_helper.pipe)([(0, import_Shuttle.navigateTo)(item, dest), (0, import_Shuttle.resetCheckedItems)()]));
|
|
112
|
-
}
|
|
113
|
-
resetCheckedItems() {
|
|
114
|
-
this.setState((0, import_Shuttle.resetCheckedItems)());
|
|
115
|
-
}
|
|
116
|
-
resetMovedItems() {
|
|
117
|
-
const { selectedItems, onRemoveAllFromTarget } = this.props;
|
|
118
|
-
if (!selectedItems) {
|
|
119
|
-
this.setState((0, import_helper.pipe)([(0, import_Shuttle.navigateTo)({ id: null }, true), (0, import_Shuttle.resetMovedItems)()]), () => {
|
|
120
|
-
this.handleChange();
|
|
121
|
-
});
|
|
122
|
-
} else {
|
|
123
|
-
this.setState((0, import_helper.pipe)([(0, import_Shuttle.navigateTo)({ id: null }, true)]));
|
|
124
|
-
}
|
|
125
|
-
onRemoveAllFromTarget();
|
|
126
|
-
}
|
|
127
|
-
addToTarget(item) {
|
|
128
|
-
const { selectedItems, onAddToTarget } = this.props;
|
|
129
|
-
if (!selectedItems) {
|
|
130
|
-
this.setState((0, import_helper.pipe)([(0, import_Shuttle.addToTarget)(item), (0, import_Shuttle.resetCheckedItems)()]), () => {
|
|
131
|
-
this.handleChange();
|
|
132
|
-
});
|
|
133
|
-
}
|
|
134
|
-
onAddToTarget(item);
|
|
135
|
-
}
|
|
136
|
-
removeFromTarget(item) {
|
|
137
|
-
const { selectedItems, onRemoveFromTarget } = this.props;
|
|
138
|
-
if (!selectedItems) {
|
|
139
|
-
this.setState((0, import_helper.pipe)([(0, import_Shuttle.removeFromTarget)(item)]), () => {
|
|
140
|
-
this.handleChange();
|
|
141
|
-
});
|
|
142
|
-
}
|
|
143
|
-
onRemoveFromTarget(item);
|
|
144
|
-
}
|
|
145
|
-
toggleItemSelection(item) {
|
|
146
|
-
this.setState((0, import_Shuttle.toggleItemSelection)(item.id));
|
|
147
|
-
}
|
|
148
|
-
moveCheckedItems() {
|
|
149
|
-
const { onAddCheckedItems, selectedItems, nonSelectedItems } = this.props;
|
|
150
|
-
const { checkedItems, preparedItems } = this.state;
|
|
151
|
-
const isControlledV2 = !!selectedItems && !!nonSelectedItems;
|
|
152
|
-
const checked = isControlledV2 ? nonSelectedItems.filter((item) => checkedItems.some((check) => check === item)) : checkedItems;
|
|
153
|
-
const items = (0, import_helper.getItemsById)(checked, preparedItems);
|
|
154
|
-
const actions = !selectedItems ? items.map((item) => (0, import_Shuttle.addToTarget)(item)) : [];
|
|
155
|
-
this.setState((0, import_helper.pipe)([...actions, (0, import_Shuttle.resetCheckedItems)()]), () => {
|
|
156
|
-
this.handleChange();
|
|
157
|
-
});
|
|
158
|
-
onAddCheckedItems(items);
|
|
159
|
-
}
|
|
160
|
-
handleTargetSortEnd({ sourceItem, targetItem }) {
|
|
161
|
-
const { idField, onTargetSortEnd } = this.props;
|
|
162
|
-
const { targetItems, hierarchyDest, movedItems } = this.state;
|
|
163
|
-
const hierarchyId = (0, import_helper.getActiveIdFromHierarchy)(hierarchyDest).id;
|
|
164
|
-
const collection = !hierarchyId ? movedItems : targetItems;
|
|
165
|
-
const oldIndex = collection.findIndex((tItem) => tItem[idField] === sourceItem[idField]);
|
|
166
|
-
const newIndex = collection.findIndex((tItem) => tItem[idField] === targetItem[idField]);
|
|
167
|
-
const sortedMovedItems = !hierarchyId ? (0, import_ds_utilities.arrayMove)(movedItems, oldIndex, newIndex) : movedItems;
|
|
168
|
-
const sortedItems = hierarchyId ? (0, import_ds_utilities.arrayMove)(targetItems, oldIndex, newIndex) : targetItems;
|
|
169
|
-
this.setState({
|
|
170
|
-
targetItems: sortedItems,
|
|
171
|
-
movedItems: sortedMovedItems
|
|
172
|
-
});
|
|
173
|
-
onTargetSortEnd({ sourceItem, targetItem });
|
|
174
|
-
}
|
|
175
173
|
render() {
|
|
176
174
|
const _a = this.props, { idField, nonSelectedItems, moreItemsLoading } = _a, rest = __objRest(_a, ["idField", "nonSelectedItems", "moreItemsLoading"]);
|
|
177
175
|
const {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ShuttleImpl.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/static-property-placement */\n/* eslint-disable react/prop-types */\n/* eslint-disable indent */\n/* eslint-disable import/extensions,react/no-unused-state,no-shadow,max-lines */\nimport React, { Component } from 'react';\nimport { compose, arrayMove } from '@elliemae/ds-utilities';\nimport { withProviders } from './withProviders';\nimport {\n addToTarget,\n navigateTo,\n resetCheckedItems,\n resetMovedItems,\n toggleItemSelection,\n removeFromTarget,\n} from './Shuttle.actions';\nimport {\n getActiveIdFromHierarchy,\n filterBySearch,\n getItemsById,\n pipe,\n getChildrenFromParent,\n filterMovedItems,\n} from './helper';\nimport { ShuttleRenderer } from './ShuttleRenderer';\nimport { SearchState } from './SearchState';\nimport { updateShuttleStateFromProps } from './updateShuttleStateFromProps';\n\nclass ShuttleImpl extends Component {\n static contextType = SearchState.Context;\n\n constructor(props) {\n super(props);\n this.state = {\n prevProps: {},\n preparedItems: [],\n checkedItems: [],\n // left breadcrumb\n hierarchy: [{ name: props.sourceRootTitle, id: null }],\n // right breadcrumb\n hierarchyDest: [{ name: props.targetRootTitle, id: null }],\n\n movedItems: [],\n sourceItems: [],\n targetItems: [],\n };\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,mBAAiC;AACjC,0BAAmC;AACnC,2BAA8B;AAC9B,qBAOO;AACP,oBAOO;AACP,6BAAgC;AAChC,yBAA4B;AAC5B,yCAA4C;AAE5C,0BAA0B,uBAAU;AAAA,EAGlC,YAAY,OAAO;AACjB,UAAM;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/static-property-placement */\n/* eslint-disable react/prop-types */\n/* eslint-disable indent */\n/* eslint-disable import/extensions,react/no-unused-state,no-shadow,max-lines */\nimport React, { Component } from 'react';\nimport { compose, arrayMove } from '@elliemae/ds-utilities';\nimport { withProviders } from './withProviders';\nimport {\n addToTarget,\n navigateTo,\n resetCheckedItems,\n resetMovedItems,\n toggleItemSelection,\n removeFromTarget,\n} from './Shuttle.actions';\nimport {\n getActiveIdFromHierarchy,\n filterBySearch,\n getItemsById,\n pipe,\n getChildrenFromParent,\n filterMovedItems,\n} from './helper';\nimport { ShuttleRenderer } from './ShuttleRenderer';\nimport { SearchState } from './SearchState';\nimport { updateShuttleStateFromProps } from './updateShuttleStateFromProps';\n\nclass ShuttleImpl extends Component {\n static contextType = SearchState.Context;\n\n constructor(props) {\n super(props);\n this.state = {\n prevProps: {},\n preparedItems: [],\n checkedItems: [],\n // left breadcrumb\n hierarchy: [{ name: props.sourceRootTitle, id: null }],\n // right breadcrumb\n hierarchyDest: [{ name: props.targetRootTitle, id: null }],\n\n movedItems: [],\n sourceItems: [],\n targetItems: [],\n };\n }\n\n static getDerivedStateFromProps(nextProps, prevState) {\n return updateShuttleStateFromProps(nextProps, prevState);\n }\n\n componentDidMount() {\n const { setGetStatus } = this.props;\n setGetStatus(this.getState);\n }\n\n getState = () => {\n const { movedItems } = this.state;\n return Object.keys(movedItems);\n };\n\n handleChange = () => {\n const { onChange } = this.props;\n const { movedItems } = this.state;\n onChange(Object.keys(movedItems));\n }\n\n navigate = (item, dest, direction) => {\n const { onDrillDown, onDrillDownTarget } = this.props;\n\n if (!dest) onDrillDown(item, direction);\n if (dest) onDrillDownTarget(item, direction);\n\n const { reset: resetSearchState } = this.context;\n resetSearchState();\n\n this.setState(pipe([navigateTo(item, dest), resetCheckedItems()]));\n }\n\n resetCheckedItems = () => {\n this.setState(resetCheckedItems());\n }\n\n resetMovedItems = () => {\n const { selectedItems, onRemoveAllFromTarget } = this.props;\n if (!selectedItems) {\n this.setState(\n pipe([navigateTo({ id: null }, true), resetMovedItems()]),\n () => {\n this.handleChange();\n },\n );\n } else {\n this.setState(pipe([navigateTo({ id: null }, true)]));\n }\n onRemoveAllFromTarget();\n }\n\n addToTarget = (item) => {\n const { selectedItems, onAddToTarget } = this.props;\n if (!selectedItems) {\n this.setState(pipe([addToTarget(item), resetCheckedItems()]), () => {\n this.handleChange();\n });\n }\n onAddToTarget(item);\n }\n\n removeFromTarget = (item) => {\n const { selectedItems, onRemoveFromTarget } = this.props;\n if (!selectedItems) {\n this.setState(pipe([removeFromTarget(item)]), () => {\n this.handleChange();\n });\n }\n onRemoveFromTarget(item);\n }\n\n toggleItemSelection = (item) => {\n this.setState(toggleItemSelection(item.id));\n }\n\n moveCheckedItems = () => {\n const { onAddCheckedItems, selectedItems, nonSelectedItems } = this.props;\n const { checkedItems, preparedItems } = this.state;\n const isControlledV2 = !!selectedItems && !!nonSelectedItems;\n const checked = isControlledV2\n ? nonSelectedItems.filter((item) =>\n checkedItems.some((check) => check === item),\n )\n : checkedItems;\n const items = getItemsById(checked, preparedItems);\n const actions = !selectedItems\n ? items.map((item) => addToTarget(item))\n : [];\n this.setState(pipe([...actions, resetCheckedItems()]), () => {\n this.handleChange();\n });\n onAddCheckedItems(items);\n }\n\n handleTargetSortEnd = ({ sourceItem, targetItem }) => {\n const { idField, onTargetSortEnd } = this.props;\n const { targetItems, hierarchyDest, movedItems } = this.state;\n\n const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;\n\n const collection = !hierarchyId ? movedItems : targetItems;\n\n const oldIndex = collection.findIndex(\n (tItem) => tItem[idField] === sourceItem[idField],\n );\n const newIndex = collection.findIndex(\n (tItem) => tItem[idField] === targetItem[idField],\n );\n\n const sortedMovedItems = !hierarchyId\n ? arrayMove(movedItems, oldIndex, newIndex)\n : movedItems;\n const sortedItems = hierarchyId\n ? arrayMove(targetItems, oldIndex, newIndex)\n : targetItems;\n\n this.setState({\n targetItems: sortedItems,\n movedItems: sortedMovedItems,\n });\n onTargetSortEnd({ sourceItem, targetItem });\n }\n\n render() {\n const { idField, nonSelectedItems, moreItemsLoading, ...rest } = this.props;\n const {\n hierarchy,\n hierarchyDest,\n checkedItems,\n movedItems,\n preparedItems: items,\n targetItems,\n } = this.state;\n const {\n state: { searchTerm, searching },\n } = this.context;\n\n const handleControlledSourceItms = () => {\n const { id } = getActiveIdFromHierarchy(hierarchy);\n if (id) {\n return filterBySearch(\n searchTerm,\n searching,\n )(\n getChildrenFromParent(id)(\n nonSelectedItems.map((it) => items.find((itt) => itt.id === it)),\n ),\n );\n }\n\n return filterBySearch(\n searchTerm,\n searching,\n )(\n items.filter((it) =>\n nonSelectedItems.some(\n (itt) =>\n itt === it.id &&\n !nonSelectedItems.some((ittt) => ittt === it.parent),\n ),\n ),\n );\n };\n\n let composedSourceItems;\n\n // controlled V2 TODO make it default controlled behavior\n if (nonSelectedItems) {\n composedSourceItems = handleControlledSourceItms();\n } else {\n composedSourceItems = compose(\n filterBySearch(searchTerm, searching),\n filterMovedItems(movedItems),\n getChildrenFromParent(getActiveIdFromHierarchy(hierarchy).id),\n )(items);\n }\n\n const handleControlledTargetItms = () => {\n const { id } = getActiveIdFromHierarchy(hierarchyDest);\n if (id) {\n return getChildrenFromParent(\n getActiveIdFromHierarchy(hierarchyDest).id,\n )(\n this.props.selectedItems.map((it) =>\n items.find((itt) => itt.id === it),\n ),\n );\n }\n\n return targetItems.filter((it) =>\n this.props.selectedItems.some(\n (itt) =>\n itt === it.id &&\n !this.props.selectedItems.some((ittt) => ittt === it.parent),\n ),\n );\n };\n\n let composedTargetItems;\n\n // controlled V2 TODO make it default controlled behavior\n if (nonSelectedItems) {\n composedTargetItems = handleControlledTargetItms();\n } else {\n composedTargetItems = compose((tItems) => {\n const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;\n return hierarchyId\n ? compose(\n filterMovedItems(movedItems),\n getChildrenFromParent(hierarchyId),\n )(tItems)\n : movedItems;\n })(targetItems);\n }\n\n return (\n <ShuttleRenderer\n {...rest}\n moreItemsLoading={moreItemsLoading}\n checkedItems={checkedItems}\n hierarchy={hierarchy}\n hierarchyDest={hierarchyDest}\n onCheckItem={this.toggleItemSelection}\n onClearCheckedItems={this.resetCheckedItems}\n onClearMovedItems={this.resetMovedItems}\n onItemCheck={this.toggleItemSelection}\n onMoveCheckedItems={this.moveCheckedItems}\n onMoveItemToSource={(item) => this.removeFromTarget(item, false)}\n onMoveItemToTarget={(item) => this.addToTarget(item, true)}\n onNavigateOnSourceTo={(item, direction) =>\n this.navigate(item, false, direction)\n }\n onNavigateOnTargetTo={(item, direction) =>\n this.navigate(item, true, direction)\n }\n onSourceSortEnd={() => null}\n onTargetSortEnd={this.handleTargetSortEnd}\n sourceItems={composedSourceItems}\n targetItems={composedTargetItems}\n />\n );\n }\n}\n\nconst ShuttleImplHoc = withProviders(ShuttleImpl);\nexport { ShuttleImplHoc as ShuttleImpl };\nexport default ShuttleImplHoc;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/ShuttleImpl.js
CHANGED
|
@@ -59,6 +59,83 @@ class ShuttleImpl extends Component {
|
|
|
59
59
|
const { movedItems } = this.state;
|
|
60
60
|
return Object.keys(movedItems);
|
|
61
61
|
};
|
|
62
|
+
this.handleChange = () => {
|
|
63
|
+
const { onChange } = this.props;
|
|
64
|
+
const { movedItems } = this.state;
|
|
65
|
+
onChange(Object.keys(movedItems));
|
|
66
|
+
};
|
|
67
|
+
this.navigate = (item, dest, direction) => {
|
|
68
|
+
const { onDrillDown, onDrillDownTarget } = this.props;
|
|
69
|
+
if (!dest)
|
|
70
|
+
onDrillDown(item, direction);
|
|
71
|
+
if (dest)
|
|
72
|
+
onDrillDownTarget(item, direction);
|
|
73
|
+
const { reset: resetSearchState } = this.context;
|
|
74
|
+
resetSearchState();
|
|
75
|
+
this.setState(pipe([navigateTo(item, dest), resetCheckedItems()]));
|
|
76
|
+
};
|
|
77
|
+
this.resetCheckedItems = () => {
|
|
78
|
+
this.setState(resetCheckedItems());
|
|
79
|
+
};
|
|
80
|
+
this.resetMovedItems = () => {
|
|
81
|
+
const { selectedItems, onRemoveAllFromTarget } = this.props;
|
|
82
|
+
if (!selectedItems) {
|
|
83
|
+
this.setState(pipe([navigateTo({ id: null }, true), resetMovedItems()]), () => {
|
|
84
|
+
this.handleChange();
|
|
85
|
+
});
|
|
86
|
+
} else {
|
|
87
|
+
this.setState(pipe([navigateTo({ id: null }, true)]));
|
|
88
|
+
}
|
|
89
|
+
onRemoveAllFromTarget();
|
|
90
|
+
};
|
|
91
|
+
this.addToTarget = (item) => {
|
|
92
|
+
const { selectedItems, onAddToTarget } = this.props;
|
|
93
|
+
if (!selectedItems) {
|
|
94
|
+
this.setState(pipe([addToTarget(item), resetCheckedItems()]), () => {
|
|
95
|
+
this.handleChange();
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
onAddToTarget(item);
|
|
99
|
+
};
|
|
100
|
+
this.removeFromTarget = (item) => {
|
|
101
|
+
const { selectedItems, onRemoveFromTarget } = this.props;
|
|
102
|
+
if (!selectedItems) {
|
|
103
|
+
this.setState(pipe([removeFromTarget(item)]), () => {
|
|
104
|
+
this.handleChange();
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
onRemoveFromTarget(item);
|
|
108
|
+
};
|
|
109
|
+
this.toggleItemSelection = (item) => {
|
|
110
|
+
this.setState(toggleItemSelection(item.id));
|
|
111
|
+
};
|
|
112
|
+
this.moveCheckedItems = () => {
|
|
113
|
+
const { onAddCheckedItems, selectedItems, nonSelectedItems } = this.props;
|
|
114
|
+
const { checkedItems, preparedItems } = this.state;
|
|
115
|
+
const isControlledV2 = !!selectedItems && !!nonSelectedItems;
|
|
116
|
+
const checked = isControlledV2 ? nonSelectedItems.filter((item) => checkedItems.some((check) => check === item)) : checkedItems;
|
|
117
|
+
const items = getItemsById(checked, preparedItems);
|
|
118
|
+
const actions = !selectedItems ? items.map((item) => addToTarget(item)) : [];
|
|
119
|
+
this.setState(pipe([...actions, resetCheckedItems()]), () => {
|
|
120
|
+
this.handleChange();
|
|
121
|
+
});
|
|
122
|
+
onAddCheckedItems(items);
|
|
123
|
+
};
|
|
124
|
+
this.handleTargetSortEnd = ({ sourceItem, targetItem }) => {
|
|
125
|
+
const { idField, onTargetSortEnd } = this.props;
|
|
126
|
+
const { targetItems, hierarchyDest, movedItems } = this.state;
|
|
127
|
+
const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;
|
|
128
|
+
const collection = !hierarchyId ? movedItems : targetItems;
|
|
129
|
+
const oldIndex = collection.findIndex((tItem) => tItem[idField] === sourceItem[idField]);
|
|
130
|
+
const newIndex = collection.findIndex((tItem) => tItem[idField] === targetItem[idField]);
|
|
131
|
+
const sortedMovedItems = !hierarchyId ? arrayMove(movedItems, oldIndex, newIndex) : movedItems;
|
|
132
|
+
const sortedItems = hierarchyId ? arrayMove(targetItems, oldIndex, newIndex) : targetItems;
|
|
133
|
+
this.setState({
|
|
134
|
+
targetItems: sortedItems,
|
|
135
|
+
movedItems: sortedMovedItems
|
|
136
|
+
});
|
|
137
|
+
onTargetSortEnd({ sourceItem, targetItem });
|
|
138
|
+
};
|
|
62
139
|
this.state = {
|
|
63
140
|
prevProps: {},
|
|
64
141
|
preparedItems: [],
|
|
@@ -69,8 +146,6 @@ class ShuttleImpl extends Component {
|
|
|
69
146
|
sourceItems: [],
|
|
70
147
|
targetItems: []
|
|
71
148
|
};
|
|
72
|
-
this.moveCheckedItems = this.moveCheckedItems.bind(this);
|
|
73
|
-
this.resetMovedItems = this.resetMovedItems.bind(this);
|
|
74
149
|
}
|
|
75
150
|
static getDerivedStateFromProps(nextProps, prevState) {
|
|
76
151
|
return updateShuttleStateFromProps(nextProps, prevState);
|
|
@@ -79,83 +154,6 @@ class ShuttleImpl extends Component {
|
|
|
79
154
|
const { setGetStatus } = this.props;
|
|
80
155
|
setGetStatus(this.getState);
|
|
81
156
|
}
|
|
82
|
-
handleChange() {
|
|
83
|
-
const { onChange } = this.props;
|
|
84
|
-
const { movedItems } = this.state;
|
|
85
|
-
onChange(Object.keys(movedItems));
|
|
86
|
-
}
|
|
87
|
-
navigate(item, dest, direction) {
|
|
88
|
-
const { onDrillDown, onDrillDownTarget } = this.props;
|
|
89
|
-
if (!dest)
|
|
90
|
-
onDrillDown(item, direction);
|
|
91
|
-
if (dest)
|
|
92
|
-
onDrillDownTarget(item, direction);
|
|
93
|
-
const { reset: resetSearchState } = this.context;
|
|
94
|
-
resetSearchState();
|
|
95
|
-
this.setState(pipe([navigateTo(item, dest), resetCheckedItems()]));
|
|
96
|
-
}
|
|
97
|
-
resetCheckedItems() {
|
|
98
|
-
this.setState(resetCheckedItems());
|
|
99
|
-
}
|
|
100
|
-
resetMovedItems() {
|
|
101
|
-
const { selectedItems, onRemoveAllFromTarget } = this.props;
|
|
102
|
-
if (!selectedItems) {
|
|
103
|
-
this.setState(pipe([navigateTo({ id: null }, true), resetMovedItems()]), () => {
|
|
104
|
-
this.handleChange();
|
|
105
|
-
});
|
|
106
|
-
} else {
|
|
107
|
-
this.setState(pipe([navigateTo({ id: null }, true)]));
|
|
108
|
-
}
|
|
109
|
-
onRemoveAllFromTarget();
|
|
110
|
-
}
|
|
111
|
-
addToTarget(item) {
|
|
112
|
-
const { selectedItems, onAddToTarget } = this.props;
|
|
113
|
-
if (!selectedItems) {
|
|
114
|
-
this.setState(pipe([addToTarget(item), resetCheckedItems()]), () => {
|
|
115
|
-
this.handleChange();
|
|
116
|
-
});
|
|
117
|
-
}
|
|
118
|
-
onAddToTarget(item);
|
|
119
|
-
}
|
|
120
|
-
removeFromTarget(item) {
|
|
121
|
-
const { selectedItems, onRemoveFromTarget } = this.props;
|
|
122
|
-
if (!selectedItems) {
|
|
123
|
-
this.setState(pipe([removeFromTarget(item)]), () => {
|
|
124
|
-
this.handleChange();
|
|
125
|
-
});
|
|
126
|
-
}
|
|
127
|
-
onRemoveFromTarget(item);
|
|
128
|
-
}
|
|
129
|
-
toggleItemSelection(item) {
|
|
130
|
-
this.setState(toggleItemSelection(item.id));
|
|
131
|
-
}
|
|
132
|
-
moveCheckedItems() {
|
|
133
|
-
const { onAddCheckedItems, selectedItems, nonSelectedItems } = this.props;
|
|
134
|
-
const { checkedItems, preparedItems } = this.state;
|
|
135
|
-
const isControlledV2 = !!selectedItems && !!nonSelectedItems;
|
|
136
|
-
const checked = isControlledV2 ? nonSelectedItems.filter((item) => checkedItems.some((check) => check === item)) : checkedItems;
|
|
137
|
-
const items = getItemsById(checked, preparedItems);
|
|
138
|
-
const actions = !selectedItems ? items.map((item) => addToTarget(item)) : [];
|
|
139
|
-
this.setState(pipe([...actions, resetCheckedItems()]), () => {
|
|
140
|
-
this.handleChange();
|
|
141
|
-
});
|
|
142
|
-
onAddCheckedItems(items);
|
|
143
|
-
}
|
|
144
|
-
handleTargetSortEnd({ sourceItem, targetItem }) {
|
|
145
|
-
const { idField, onTargetSortEnd } = this.props;
|
|
146
|
-
const { targetItems, hierarchyDest, movedItems } = this.state;
|
|
147
|
-
const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;
|
|
148
|
-
const collection = !hierarchyId ? movedItems : targetItems;
|
|
149
|
-
const oldIndex = collection.findIndex((tItem) => tItem[idField] === sourceItem[idField]);
|
|
150
|
-
const newIndex = collection.findIndex((tItem) => tItem[idField] === targetItem[idField]);
|
|
151
|
-
const sortedMovedItems = !hierarchyId ? arrayMove(movedItems, oldIndex, newIndex) : movedItems;
|
|
152
|
-
const sortedItems = hierarchyId ? arrayMove(targetItems, oldIndex, newIndex) : targetItems;
|
|
153
|
-
this.setState({
|
|
154
|
-
targetItems: sortedItems,
|
|
155
|
-
movedItems: sortedMovedItems
|
|
156
|
-
});
|
|
157
|
-
onTargetSortEnd({ sourceItem, targetItem });
|
|
158
|
-
}
|
|
159
157
|
render() {
|
|
160
158
|
const _a = this.props, { idField, nonSelectedItems, moreItemsLoading } = _a, rest = __objRest(_a, ["idField", "nonSelectedItems", "moreItemsLoading"]);
|
|
161
159
|
const {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/ShuttleImpl.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/static-property-placement */\n/* eslint-disable react/prop-types */\n/* eslint-disable indent */\n/* eslint-disable import/extensions,react/no-unused-state,no-shadow,max-lines */\nimport React, { Component } from 'react';\nimport { compose, arrayMove } from '@elliemae/ds-utilities';\nimport { withProviders } from './withProviders';\nimport {\n addToTarget,\n navigateTo,\n resetCheckedItems,\n resetMovedItems,\n toggleItemSelection,\n removeFromTarget,\n} from './Shuttle.actions';\nimport {\n getActiveIdFromHierarchy,\n filterBySearch,\n getItemsById,\n pipe,\n getChildrenFromParent,\n filterMovedItems,\n} from './helper';\nimport { ShuttleRenderer } from './ShuttleRenderer';\nimport { SearchState } from './SearchState';\nimport { updateShuttleStateFromProps } from './updateShuttleStateFromProps';\n\nclass ShuttleImpl extends Component {\n static contextType = SearchState.Context;\n\n constructor(props) {\n super(props);\n this.state = {\n prevProps: {},\n preparedItems: [],\n checkedItems: [],\n // left breadcrumb\n hierarchy: [{ name: props.sourceRootTitle, id: null }],\n // right breadcrumb\n hierarchyDest: [{ name: props.targetRootTitle, id: null }],\n\n movedItems: [],\n sourceItems: [],\n targetItems: [],\n };\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACIA;AACA;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;AACA;AACA;AAEA,0BAA0B,UAAU;AAAA,EAGlC,YAAY,OAAO;AACjB,UAAM;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/static-property-placement */\n/* eslint-disable react/prop-types */\n/* eslint-disable indent */\n/* eslint-disable import/extensions,react/no-unused-state,no-shadow,max-lines */\nimport React, { Component } from 'react';\nimport { compose, arrayMove } from '@elliemae/ds-utilities';\nimport { withProviders } from './withProviders';\nimport {\n addToTarget,\n navigateTo,\n resetCheckedItems,\n resetMovedItems,\n toggleItemSelection,\n removeFromTarget,\n} from './Shuttle.actions';\nimport {\n getActiveIdFromHierarchy,\n filterBySearch,\n getItemsById,\n pipe,\n getChildrenFromParent,\n filterMovedItems,\n} from './helper';\nimport { ShuttleRenderer } from './ShuttleRenderer';\nimport { SearchState } from './SearchState';\nimport { updateShuttleStateFromProps } from './updateShuttleStateFromProps';\n\nclass ShuttleImpl extends Component {\n static contextType = SearchState.Context;\n\n constructor(props) {\n super(props);\n this.state = {\n prevProps: {},\n preparedItems: [],\n checkedItems: [],\n // left breadcrumb\n hierarchy: [{ name: props.sourceRootTitle, id: null }],\n // right breadcrumb\n hierarchyDest: [{ name: props.targetRootTitle, id: null }],\n\n movedItems: [],\n sourceItems: [],\n targetItems: [],\n };\n }\n\n static getDerivedStateFromProps(nextProps, prevState) {\n return updateShuttleStateFromProps(nextProps, prevState);\n }\n\n componentDidMount() {\n const { setGetStatus } = this.props;\n setGetStatus(this.getState);\n }\n\n getState = () => {\n const { movedItems } = this.state;\n return Object.keys(movedItems);\n };\n\n handleChange = () => {\n const { onChange } = this.props;\n const { movedItems } = this.state;\n onChange(Object.keys(movedItems));\n }\n\n navigate = (item, dest, direction) => {\n const { onDrillDown, onDrillDownTarget } = this.props;\n\n if (!dest) onDrillDown(item, direction);\n if (dest) onDrillDownTarget(item, direction);\n\n const { reset: resetSearchState } = this.context;\n resetSearchState();\n\n this.setState(pipe([navigateTo(item, dest), resetCheckedItems()]));\n }\n\n resetCheckedItems = () => {\n this.setState(resetCheckedItems());\n }\n\n resetMovedItems = () => {\n const { selectedItems, onRemoveAllFromTarget } = this.props;\n if (!selectedItems) {\n this.setState(\n pipe([navigateTo({ id: null }, true), resetMovedItems()]),\n () => {\n this.handleChange();\n },\n );\n } else {\n this.setState(pipe([navigateTo({ id: null }, true)]));\n }\n onRemoveAllFromTarget();\n }\n\n addToTarget = (item) => {\n const { selectedItems, onAddToTarget } = this.props;\n if (!selectedItems) {\n this.setState(pipe([addToTarget(item), resetCheckedItems()]), () => {\n this.handleChange();\n });\n }\n onAddToTarget(item);\n }\n\n removeFromTarget = (item) => {\n const { selectedItems, onRemoveFromTarget } = this.props;\n if (!selectedItems) {\n this.setState(pipe([removeFromTarget(item)]), () => {\n this.handleChange();\n });\n }\n onRemoveFromTarget(item);\n }\n\n toggleItemSelection = (item) => {\n this.setState(toggleItemSelection(item.id));\n }\n\n moveCheckedItems = () => {\n const { onAddCheckedItems, selectedItems, nonSelectedItems } = this.props;\n const { checkedItems, preparedItems } = this.state;\n const isControlledV2 = !!selectedItems && !!nonSelectedItems;\n const checked = isControlledV2\n ? nonSelectedItems.filter((item) =>\n checkedItems.some((check) => check === item),\n )\n : checkedItems;\n const items = getItemsById(checked, preparedItems);\n const actions = !selectedItems\n ? items.map((item) => addToTarget(item))\n : [];\n this.setState(pipe([...actions, resetCheckedItems()]), () => {\n this.handleChange();\n });\n onAddCheckedItems(items);\n }\n\n handleTargetSortEnd = ({ sourceItem, targetItem }) => {\n const { idField, onTargetSortEnd } = this.props;\n const { targetItems, hierarchyDest, movedItems } = this.state;\n\n const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;\n\n const collection = !hierarchyId ? movedItems : targetItems;\n\n const oldIndex = collection.findIndex(\n (tItem) => tItem[idField] === sourceItem[idField],\n );\n const newIndex = collection.findIndex(\n (tItem) => tItem[idField] === targetItem[idField],\n );\n\n const sortedMovedItems = !hierarchyId\n ? arrayMove(movedItems, oldIndex, newIndex)\n : movedItems;\n const sortedItems = hierarchyId\n ? arrayMove(targetItems, oldIndex, newIndex)\n : targetItems;\n\n this.setState({\n targetItems: sortedItems,\n movedItems: sortedMovedItems,\n });\n onTargetSortEnd({ sourceItem, targetItem });\n }\n\n render() {\n const { idField, nonSelectedItems, moreItemsLoading, ...rest } = this.props;\n const {\n hierarchy,\n hierarchyDest,\n checkedItems,\n movedItems,\n preparedItems: items,\n targetItems,\n } = this.state;\n const {\n state: { searchTerm, searching },\n } = this.context;\n\n const handleControlledSourceItms = () => {\n const { id } = getActiveIdFromHierarchy(hierarchy);\n if (id) {\n return filterBySearch(\n searchTerm,\n searching,\n )(\n getChildrenFromParent(id)(\n nonSelectedItems.map((it) => items.find((itt) => itt.id === it)),\n ),\n );\n }\n\n return filterBySearch(\n searchTerm,\n searching,\n )(\n items.filter((it) =>\n nonSelectedItems.some(\n (itt) =>\n itt === it.id &&\n !nonSelectedItems.some((ittt) => ittt === it.parent),\n ),\n ),\n );\n };\n\n let composedSourceItems;\n\n // controlled V2 TODO make it default controlled behavior\n if (nonSelectedItems) {\n composedSourceItems = handleControlledSourceItms();\n } else {\n composedSourceItems = compose(\n filterBySearch(searchTerm, searching),\n filterMovedItems(movedItems),\n getChildrenFromParent(getActiveIdFromHierarchy(hierarchy).id),\n )(items);\n }\n\n const handleControlledTargetItms = () => {\n const { id } = getActiveIdFromHierarchy(hierarchyDest);\n if (id) {\n return getChildrenFromParent(\n getActiveIdFromHierarchy(hierarchyDest).id,\n )(\n this.props.selectedItems.map((it) =>\n items.find((itt) => itt.id === it),\n ),\n );\n }\n\n return targetItems.filter((it) =>\n this.props.selectedItems.some(\n (itt) =>\n itt === it.id &&\n !this.props.selectedItems.some((ittt) => ittt === it.parent),\n ),\n );\n };\n\n let composedTargetItems;\n\n // controlled V2 TODO make it default controlled behavior\n if (nonSelectedItems) {\n composedTargetItems = handleControlledTargetItms();\n } else {\n composedTargetItems = compose((tItems) => {\n const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;\n return hierarchyId\n ? compose(\n filterMovedItems(movedItems),\n getChildrenFromParent(hierarchyId),\n )(tItems)\n : movedItems;\n })(targetItems);\n }\n\n return (\n <ShuttleRenderer\n {...rest}\n moreItemsLoading={moreItemsLoading}\n checkedItems={checkedItems}\n hierarchy={hierarchy}\n hierarchyDest={hierarchyDest}\n onCheckItem={this.toggleItemSelection}\n onClearCheckedItems={this.resetCheckedItems}\n onClearMovedItems={this.resetMovedItems}\n onItemCheck={this.toggleItemSelection}\n onMoveCheckedItems={this.moveCheckedItems}\n onMoveItemToSource={(item) => this.removeFromTarget(item, false)}\n onMoveItemToTarget={(item) => this.addToTarget(item, true)}\n onNavigateOnSourceTo={(item, direction) =>\n this.navigate(item, false, direction)\n }\n onNavigateOnTargetTo={(item, direction) =>\n this.navigate(item, true, direction)\n }\n onSourceSortEnd={() => null}\n onTargetSortEnd={this.handleTargetSortEnd}\n sourceItems={composedSourceItems}\n targetItems={composedTargetItems}\n />\n );\n }\n}\n\nconst ShuttleImplHoc = withProviders(ShuttleImpl);\nexport { ShuttleImplHoc as ShuttleImpl };\nexport default ShuttleImplHoc;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-shuttle",
|
|
3
|
-
"version": "3.0.0-next.
|
|
3
|
+
"version": "3.0.0-next.18",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Shuttle",
|
|
6
6
|
"files": [
|
|
@@ -155,16 +155,16 @@
|
|
|
155
155
|
"indent": 4
|
|
156
156
|
},
|
|
157
157
|
"dependencies": {
|
|
158
|
-
"@elliemae/ds-breadcrumb": "3.0.0-next.
|
|
159
|
-
"@elliemae/ds-button": "3.0.0-next.
|
|
160
|
-
"@elliemae/ds-circular-progress-indicator": "3.0.0-next.
|
|
161
|
-
"@elliemae/ds-classnames": "3.0.0-next.
|
|
162
|
-
"@elliemae/ds-form": "3.0.0-next.
|
|
163
|
-
"@elliemae/ds-icons": "3.0.0-next.
|
|
164
|
-
"@elliemae/ds-indeterminate-progress-indicator": "3.0.0-next.
|
|
165
|
-
"@elliemae/ds-system": "3.0.0-next.
|
|
166
|
-
"@elliemae/ds-truncated-tooltip-text": "3.0.0-next.
|
|
167
|
-
"@elliemae/ds-utilities": "3.0.0-next.
|
|
158
|
+
"@elliemae/ds-breadcrumb": "3.0.0-next.18",
|
|
159
|
+
"@elliemae/ds-button": "3.0.0-next.18",
|
|
160
|
+
"@elliemae/ds-circular-progress-indicator": "3.0.0-next.18",
|
|
161
|
+
"@elliemae/ds-classnames": "3.0.0-next.18",
|
|
162
|
+
"@elliemae/ds-form": "3.0.0-next.18",
|
|
163
|
+
"@elliemae/ds-icons": "3.0.0-next.18",
|
|
164
|
+
"@elliemae/ds-indeterminate-progress-indicator": "3.0.0-next.18",
|
|
165
|
+
"@elliemae/ds-system": "3.0.0-next.18",
|
|
166
|
+
"@elliemae/ds-truncated-tooltip-text": "3.0.0-next.18",
|
|
167
|
+
"@elliemae/ds-utilities": "3.0.0-next.18",
|
|
168
168
|
"constate": "~1.3.2",
|
|
169
169
|
"prop-types": "~15.8.1",
|
|
170
170
|
"react-desc": "~4.1.3",
|