@elliemae/ds-shuttle 3.0.0-next.2 → 3.0.0-next.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (217) hide show
  1. package/dist/cjs/AnimationState.js +75 -0
  2. package/dist/cjs/AnimationState.js.map +7 -0
  3. package/dist/cjs/DSShuttle.js +170 -0
  4. package/dist/cjs/DSShuttle.js.map +7 -0
  5. package/dist/cjs/SearchState.js +60 -0
  6. package/dist/cjs/SearchState.js.map +7 -0
  7. package/dist/cjs/Shuttle.actions.js +136 -0
  8. package/dist/cjs/Shuttle.actions.js.map +7 -0
  9. package/dist/cjs/ShuttleContainer.js +108 -0
  10. package/dist/cjs/ShuttleContainer.js.map +7 -0
  11. package/dist/cjs/ShuttleImpl.js +242 -0
  12. package/dist/cjs/ShuttleImpl.js.map +7 -0
  13. package/dist/cjs/ShuttleRenderer.js +203 -0
  14. package/dist/cjs/ShuttleRenderer.js.map +7 -0
  15. package/dist/cjs/ShuttleState.js +84 -0
  16. package/dist/cjs/ShuttleState.js.map +7 -0
  17. package/dist/cjs/animation/animationConfig.js +78 -0
  18. package/dist/cjs/animation/animationConfig.js.map +7 -0
  19. package/dist/cjs/classedComponents.js +72 -0
  20. package/dist/cjs/classedComponents.js.map +7 -0
  21. package/dist/cjs/components/LoadingIndicator.js +52 -0
  22. package/dist/cjs/components/LoadingIndicator.js.map +7 -0
  23. package/dist/cjs/components/OverflowList.js +71 -0
  24. package/dist/cjs/components/OverflowList.js.map +7 -0
  25. package/dist/cjs/components/ShuttleBreadcrumb.js +54 -0
  26. package/dist/cjs/components/ShuttleBreadcrumb.js.map +7 -0
  27. package/dist/cjs/components/ShuttleInfiniteScrollIndicator.js +48 -0
  28. package/dist/cjs/components/ShuttleInfiniteScrollIndicator.js.map +7 -0
  29. package/dist/cjs/components/ShuttleListItem/ActionButtons.js +76 -0
  30. package/dist/cjs/components/ShuttleListItem/ActionButtons.js.map +7 -0
  31. package/dist/cjs/components/ShuttleListItem/ShuttleListItem.js +121 -0
  32. package/dist/cjs/components/ShuttleListItem/ShuttleListItem.js.map +7 -0
  33. package/dist/cjs/components/ShuttleListItem/ShuttleSourceListItem.js +127 -0
  34. package/dist/cjs/components/ShuttleListItem/ShuttleSourceListItem.js.map +7 -0
  35. package/dist/cjs/components/ShuttleListItem/ShuttleTargetListItem.js +110 -0
  36. package/dist/cjs/components/ShuttleListItem/ShuttleTargetListItem.js.map +7 -0
  37. package/dist/cjs/components/ShuttleListPanel.js +49 -0
  38. package/dist/cjs/components/ShuttleListPanel.js.map +7 -0
  39. package/dist/cjs/components/ShuttleSearchBox.js +99 -0
  40. package/dist/cjs/components/ShuttleSearchBox.js.map +7 -0
  41. package/dist/cjs/components/ShuttleSource.js +223 -0
  42. package/dist/cjs/components/ShuttleSource.js.map +7 -0
  43. package/dist/cjs/components/ShuttleTarget.js +135 -0
  44. package/dist/cjs/components/ShuttleTarget.js.map +7 -0
  45. package/dist/cjs/components/VirtualizedItem.js +65 -0
  46. package/dist/cjs/components/VirtualizedItem.js.map +7 -0
  47. package/dist/cjs/components/VirtualizedList.js +104 -0
  48. package/dist/cjs/components/VirtualizedList.js.map +7 -0
  49. package/dist/cjs/components/VirtualizedSortableList.js +77 -0
  50. package/dist/cjs/components/VirtualizedSortableList.js.map +7 -0
  51. package/dist/cjs/helper.js +99 -0
  52. package/dist/cjs/helper.js.map +7 -0
  53. package/dist/cjs/index.js +38 -0
  54. package/dist/cjs/index.js.map +7 -0
  55. package/dist/cjs/tests/utils.js +1235 -0
  56. package/dist/cjs/tests/utils.js.map +7 -0
  57. package/dist/cjs/updateShuttleStateFromProps.js +108 -0
  58. package/dist/cjs/updateShuttleStateFromProps.js.map +7 -0
  59. package/dist/cjs/utils.js +54 -0
  60. package/dist/cjs/utils.js.map +7 -0
  61. package/dist/cjs/withProviders.js +57 -0
  62. package/dist/cjs/withProviders.js.map +7 -0
  63. package/{esm → dist/esm}/AnimationState.js +12 -8
  64. package/dist/esm/AnimationState.js.map +7 -0
  65. package/dist/esm/DSShuttle.js +141 -0
  66. package/dist/esm/DSShuttle.js.map +7 -0
  67. package/dist/esm/SearchState.js +31 -0
  68. package/dist/esm/SearchState.js.map +7 -0
  69. package/dist/esm/Shuttle.actions.js +118 -0
  70. package/dist/esm/Shuttle.actions.js.map +7 -0
  71. package/dist/esm/ShuttleContainer.js +92 -0
  72. package/dist/esm/ShuttleContainer.js.map +7 -0
  73. package/dist/esm/ShuttleImpl.js +229 -0
  74. package/dist/esm/ShuttleImpl.js.map +7 -0
  75. package/dist/esm/ShuttleRenderer.js +176 -0
  76. package/dist/esm/ShuttleRenderer.js.map +7 -0
  77. package/dist/esm/ShuttleState.js +55 -0
  78. package/dist/esm/ShuttleState.js.map +7 -0
  79. package/dist/esm/animation/animationConfig.js +49 -0
  80. package/dist/esm/animation/animationConfig.js.map +7 -0
  81. package/dist/esm/classedComponents.js +43 -0
  82. package/dist/esm/classedComponents.js.map +7 -0
  83. package/dist/esm/components/LoadingIndicator.js +23 -0
  84. package/dist/esm/components/LoadingIndicator.js.map +7 -0
  85. package/dist/esm/components/OverflowList.js +44 -0
  86. package/dist/esm/components/OverflowList.js.map +7 -0
  87. package/dist/esm/components/ShuttleBreadcrumb.js +25 -0
  88. package/dist/esm/components/ShuttleBreadcrumb.js.map +7 -0
  89. package/dist/esm/components/ShuttleInfiniteScrollIndicator.js +19 -0
  90. package/dist/esm/components/ShuttleInfiniteScrollIndicator.js.map +7 -0
  91. package/dist/esm/components/ShuttleListItem/ActionButtons.js +49 -0
  92. package/dist/esm/components/ShuttleListItem/ActionButtons.js.map +7 -0
  93. package/dist/esm/components/ShuttleListItem/ShuttleListItem.js +94 -0
  94. package/dist/esm/components/ShuttleListItem/ShuttleListItem.js.map +7 -0
  95. package/dist/esm/components/ShuttleListItem/ShuttleSourceListItem.js +100 -0
  96. package/dist/esm/components/ShuttleListItem/ShuttleSourceListItem.js.map +7 -0
  97. package/dist/esm/components/ShuttleListItem/ShuttleTargetListItem.js +83 -0
  98. package/dist/esm/components/ShuttleListItem/ShuttleTargetListItem.js.map +7 -0
  99. package/dist/esm/components/ShuttleListPanel.js +20 -0
  100. package/dist/esm/components/ShuttleListPanel.js.map +7 -0
  101. package/dist/esm/components/ShuttleSearchBox.js +70 -0
  102. package/dist/esm/components/ShuttleSearchBox.js.map +7 -0
  103. package/dist/esm/components/ShuttleSource.js +208 -0
  104. package/dist/esm/components/ShuttleSource.js.map +7 -0
  105. package/dist/esm/components/ShuttleTarget.js +119 -0
  106. package/dist/esm/components/ShuttleTarget.js.map +7 -0
  107. package/dist/esm/components/VirtualizedItem.js +38 -0
  108. package/dist/esm/components/VirtualizedItem.js.map +7 -0
  109. package/dist/esm/components/VirtualizedList.js +77 -0
  110. package/dist/esm/components/VirtualizedList.js.map +7 -0
  111. package/dist/esm/components/VirtualizedSortableList.js +50 -0
  112. package/dist/esm/components/VirtualizedSortableList.js.map +7 -0
  113. package/dist/esm/helper.js +72 -0
  114. package/dist/esm/helper.js.map +7 -0
  115. package/dist/esm/index.js +9 -0
  116. package/dist/esm/index.js.map +7 -0
  117. package/dist/esm/tests/utils.js +1208 -0
  118. package/dist/esm/tests/utils.js.map +7 -0
  119. package/dist/esm/updateShuttleStateFromProps.js +81 -0
  120. package/dist/esm/updateShuttleStateFromProps.js.map +7 -0
  121. package/dist/esm/utils.js +27 -0
  122. package/dist/esm/utils.js.map +7 -0
  123. package/dist/esm/withProviders.js +30 -0
  124. package/dist/esm/withProviders.js.map +7 -0
  125. package/package.json +98 -89
  126. package/cjs/AnimationState.js +0 -48
  127. package/cjs/DSShuttle.js +0 -223
  128. package/cjs/SearchState.js +0 -41
  129. package/cjs/Shuttle.actions.js +0 -137
  130. package/cjs/ShuttleContainer.js +0 -87
  131. package/cjs/ShuttleImpl.js +0 -311
  132. package/cjs/ShuttleRenderer.js +0 -139
  133. package/cjs/ShuttleState.js +0 -80
  134. package/cjs/animation/animationConfig.js +0 -81
  135. package/cjs/classedComponents.js +0 -71
  136. package/cjs/components/LoadingIndicator.js +0 -25
  137. package/cjs/components/OverflowList.js +0 -53
  138. package/cjs/components/ShuttleBreadcrumb.js +0 -42
  139. package/cjs/components/ShuttleInfiniteScrollIndicator.js +0 -39
  140. package/cjs/components/ShuttleListItem/ActionButtons.js +0 -55
  141. package/cjs/components/ShuttleListItem/ShuttleListItem.js +0 -85
  142. package/cjs/components/ShuttleListItem/ShuttleSourceListItem.js +0 -76
  143. package/cjs/components/ShuttleListItem/ShuttleTargetListItem.js +0 -57
  144. package/cjs/components/ShuttleListPanel.js +0 -31
  145. package/cjs/components/ShuttleSearchBox.js +0 -110
  146. package/cjs/components/ShuttleSource.js +0 -188
  147. package/cjs/components/ShuttleTarget.js +0 -116
  148. package/cjs/components/VirtualizedItem.js +0 -46
  149. package/cjs/components/VirtualizedList.js +0 -93
  150. package/cjs/components/VirtualizedSortableList.js +0 -41
  151. package/cjs/helper.js +0 -117
  152. package/cjs/index.js +0 -12
  153. package/cjs/updateShuttleStateFromProps.js +0 -94
  154. package/cjs/utils.js +0 -43
  155. package/cjs/withProviders.js +0 -29
  156. package/esm/DSShuttle.js +0 -213
  157. package/esm/SearchState.js +0 -35
  158. package/esm/Shuttle.actions.js +0 -123
  159. package/esm/ShuttleContainer.js +0 -80
  160. package/esm/ShuttleImpl.js +0 -304
  161. package/esm/ShuttleRenderer.js +0 -132
  162. package/esm/ShuttleState.js +0 -74
  163. package/esm/animation/animationConfig.js +0 -77
  164. package/esm/classedComponents.js +0 -51
  165. package/esm/components/LoadingIndicator.js +0 -18
  166. package/esm/components/OverflowList.js +0 -46
  167. package/esm/components/ShuttleBreadcrumb.js +0 -35
  168. package/esm/components/ShuttleInfiniteScrollIndicator.js +0 -32
  169. package/esm/components/ShuttleListItem/ActionButtons.js +0 -43
  170. package/esm/components/ShuttleListItem/ShuttleListItem.js +0 -76
  171. package/esm/components/ShuttleListItem/ShuttleSourceListItem.js +0 -68
  172. package/esm/components/ShuttleListItem/ShuttleTargetListItem.js +0 -49
  173. package/esm/components/ShuttleListPanel.js +0 -24
  174. package/esm/components/ShuttleSearchBox.js +0 -104
  175. package/esm/components/ShuttleSource.js +0 -179
  176. package/esm/components/ShuttleTarget.js +0 -107
  177. package/esm/components/VirtualizedItem.js +0 -40
  178. package/esm/components/VirtualizedList.js +0 -84
  179. package/esm/components/VirtualizedSortableList.js +0 -34
  180. package/esm/helper.js +0 -78
  181. package/esm/index.js +0 -2
  182. package/esm/updateShuttleStateFromProps.js +0 -88
  183. package/esm/utils.js +0 -18
  184. package/esm/withProviders.js +0 -22
  185. package/types/AnimationState.d.ts +0 -26
  186. package/types/DSShuttle.d.ts +0 -341
  187. package/types/SearchState.d.ts +0 -22
  188. package/types/Shuttle.actions.d.ts +0 -11
  189. package/types/ShuttleContainer.d.ts +0 -3
  190. package/types/ShuttleImpl.d.ts +0 -3
  191. package/types/ShuttleRenderer.d.ts +0 -37
  192. package/types/ShuttleState.d.ts +0 -53
  193. package/types/animation/animationConfig.d.ts +0 -68
  194. package/types/classedComponents.d.ts +0 -14
  195. package/types/components/LoadingIndicator.d.ts +0 -3
  196. package/types/components/OverflowList.d.ts +0 -7
  197. package/types/components/ShuttleBreadcrumb.d.ts +0 -7
  198. package/types/components/ShuttleInfiniteScrollIndicator.d.ts +0 -5
  199. package/types/components/ShuttleListItem/ActionButtons.d.ts +0 -4
  200. package/types/components/ShuttleListItem/ShuttleListItem.d.ts +0 -14
  201. package/types/components/ShuttleListItem/ShuttleSourceListItem.d.ts +0 -13
  202. package/types/components/ShuttleListItem/ShuttleTargetListItem.d.ts +0 -13
  203. package/types/components/ShuttleListPanel.d.ts +0 -7
  204. package/types/components/ShuttleSearchBox.d.ts +0 -20
  205. package/types/components/ShuttleSource.d.ts +0 -54
  206. package/types/components/ShuttleTarget.d.ts +0 -16
  207. package/types/components/VirtualizedItem.d.ts +0 -3
  208. package/types/components/VirtualizedList.d.ts +0 -12
  209. package/types/components/VirtualizedSortableList.d.ts +0 -6
  210. package/types/helper.d.ts +0 -16
  211. package/types/index.d.ts +0 -1
  212. package/types/tests/DSShuttle.events.test.d.ts +0 -1
  213. package/types/tests/DSShuttle.test.d.ts +0 -1
  214. package/types/tests/utils.d.ts +0 -116
  215. package/types/updateShuttleStateFromProps.d.ts +0 -1
  216. package/types/utils.d.ts +0 -2
  217. package/types/withProviders.d.ts +0 -3
@@ -1,304 +0,0 @@
1
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
2
- import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
3
- import 'core-js/modules/esnext.async-iterator.filter.js';
4
- import 'core-js/modules/esnext.iterator.constructor.js';
5
- import 'core-js/modules/esnext.iterator.filter.js';
6
- import 'core-js/modules/esnext.async-iterator.some.js';
7
- import 'core-js/modules/esnext.iterator.some.js';
8
- import 'core-js/modules/esnext.async-iterator.map.js';
9
- import 'core-js/modules/esnext.iterator.map.js';
10
- import 'core-js/modules/web.dom-collections.iterator.js';
11
- import 'core-js/modules/esnext.async-iterator.find.js';
12
- import 'core-js/modules/esnext.iterator.find.js';
13
- import 'core-js/modules/esnext.async-iterator.for-each.js';
14
- import 'core-js/modules/esnext.iterator.for-each.js';
15
- import { Component } from 'react';
16
- import { arrayMove, compose } from '@elliemae/ds-utilities';
17
- import withProviders from './withProviders.js';
18
- import { navigateTo, resetCheckedItems, resetMovedItems, addToTarget, removeFromTarget, toggleItemSelection } from './Shuttle.actions.js';
19
- import { pipe, getItemsById, getActiveIdFromHierarchy, filterBySearch, filterMovedItems, getChildrenFromParent } from './helper.js';
20
- import ShuttleRenderer from './ShuttleRenderer.js';
21
- import SearchState from './SearchState.js';
22
- import updateShuttleStateFromProps from './updateShuttleStateFromProps.js';
23
- import { jsx } from 'react/jsx-runtime';
24
-
25
- const _excluded = ["idField", "nonSelectedItems", "moreItemsLoading"];
26
-
27
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
28
-
29
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
30
-
31
- class ShuttleImpl extends Component {
32
- constructor(props) {
33
- super(props);
34
-
35
- this.getState = () => {
36
- const {
37
- movedItems
38
- } = this.state;
39
- return Object.keys(movedItems);
40
- };
41
-
42
- this.state = {
43
- prevProps: {},
44
- preparedItems: [],
45
- checkedItems: [],
46
- // left breadcrumb
47
- hierarchy: [{
48
- name: props.sourceRootTitle,
49
- id: null
50
- }],
51
- // right breadcrumb
52
- hierarchyDest: [{
53
- name: props.targetRootTitle,
54
- id: null
55
- }],
56
- movedItems: [],
57
- sourceItems: [],
58
- targetItems: []
59
- };
60
- this.toggleItemSelection = this.toggleItemSelection.bind(this);
61
- this.resetCheckedItems = this.resetCheckedItems.bind(this);
62
- this.resetMovedItems = this.resetMovedItems.bind(this);
63
- this.moveCheckedItems = this.moveCheckedItems.bind(this);
64
- this.handleTargetSortEnd = this.handleTargetSortEnd.bind(this);
65
- }
66
-
67
- static getDerivedStateFromProps(nextProps, prevState) {
68
- return updateShuttleStateFromProps(nextProps, prevState);
69
- }
70
-
71
- componentDidMount() {
72
- const {
73
- setGetStatus
74
- } = this.props;
75
- setGetStatus(this.getState);
76
- }
77
-
78
- handleChange() {
79
- const {
80
- onChange
81
- } = this.props;
82
- const {
83
- movedItems
84
- } = this.state;
85
- onChange(Object.keys(movedItems));
86
- }
87
-
88
- navigate(item, dest, direction) {
89
- const {
90
- onDrillDown,
91
- onDrillDownTarget
92
- } = this.props;
93
- if (!dest) onDrillDown(item, direction);
94
- if (dest) onDrillDownTarget(item, direction);
95
- const {
96
- reset: resetSearchState
97
- } = this.context;
98
- resetSearchState();
99
- this.setState(pipe([navigateTo(item, dest), resetCheckedItems()]));
100
- }
101
-
102
- resetCheckedItems() {
103
- this.setState(resetCheckedItems());
104
- }
105
-
106
- resetMovedItems() {
107
- const {
108
- selectedItems,
109
- onRemoveAllFromTarget
110
- } = this.props;
111
-
112
- if (!selectedItems) {
113
- this.setState(pipe([navigateTo({
114
- id: null
115
- }, true), resetMovedItems()]), () => {
116
- this.handleChange();
117
- });
118
- } else {
119
- this.setState(pipe([navigateTo({
120
- id: null
121
- }, true)]));
122
- }
123
-
124
- onRemoveAllFromTarget();
125
- }
126
-
127
- addToTarget(item) {
128
- const {
129
- selectedItems,
130
- onAddToTarget
131
- } = this.props;
132
-
133
- if (!selectedItems) {
134
- this.setState(pipe([addToTarget(item), resetCheckedItems()]), () => {
135
- this.handleChange();
136
- });
137
- }
138
-
139
- onAddToTarget(item);
140
- }
141
-
142
- removeFromTarget(item) {
143
- const {
144
- selectedItems,
145
- onRemoveFromTarget
146
- } = this.props;
147
-
148
- if (!selectedItems) {
149
- this.setState(pipe([removeFromTarget(item)]), () => {
150
- this.handleChange();
151
- });
152
- }
153
-
154
- onRemoveFromTarget(item);
155
- }
156
-
157
- toggleItemSelection(item) {
158
- this.setState(toggleItemSelection(item.id));
159
- }
160
-
161
- moveCheckedItems() {
162
- const {
163
- onAddCheckedItems,
164
- selectedItems,
165
- nonSelectedItems
166
- } = this.props;
167
- const {
168
- checkedItems,
169
- preparedItems
170
- } = this.state;
171
- const isControlledV2 = !!selectedItems && !!nonSelectedItems;
172
- const checked = isControlledV2 ? nonSelectedItems.filter(item => checkedItems.some(check => check === item)) : checkedItems;
173
- const items = getItemsById(checked, preparedItems);
174
- const actions = !selectedItems ? items.map(item => addToTarget(item)) : [];
175
- this.setState(pipe([...actions, resetCheckedItems()]), () => {
176
- this.handleChange();
177
- });
178
- onAddCheckedItems(items);
179
- }
180
-
181
- handleTargetSortEnd(_ref) {
182
- let {
183
- sourceItem,
184
- targetItem
185
- } = _ref;
186
- const {
187
- idField,
188
- onTargetSortEnd
189
- } = this.props;
190
- const {
191
- targetItems,
192
- hierarchyDest,
193
- movedItems
194
- } = this.state;
195
- const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;
196
- const collection = !hierarchyId ? movedItems : targetItems;
197
- const oldIndex = collection.findIndex(tItem => tItem[idField] === sourceItem[idField]);
198
- const newIndex = collection.findIndex(tItem => tItem[idField] === targetItem[idField]);
199
- const sortedMovedItems = !hierarchyId ? arrayMove(movedItems, oldIndex, newIndex) : movedItems;
200
- const sortedItems = hierarchyId ? arrayMove(targetItems, oldIndex, newIndex) : targetItems;
201
- this.setState({
202
- targetItems: sortedItems,
203
- movedItems: sortedMovedItems
204
- });
205
- onTargetSortEnd({
206
- sourceItem,
207
- targetItem
208
- });
209
- }
210
-
211
- render() {
212
- const _this$props = this.props,
213
- {
214
- idField,
215
- nonSelectedItems,
216
- moreItemsLoading
217
- } = _this$props,
218
- rest = _objectWithoutProperties(_this$props, _excluded);
219
-
220
- const {
221
- hierarchy,
222
- hierarchyDest,
223
- checkedItems,
224
- movedItems,
225
- preparedItems: items,
226
- targetItems
227
- } = this.state;
228
- const {
229
- state: {
230
- searchTerm,
231
- searching
232
- }
233
- } = this.context;
234
-
235
- const handleControlledSourceItms = () => {
236
- const {
237
- id
238
- } = getActiveIdFromHierarchy(hierarchy);
239
-
240
- if (id) {
241
- return filterBySearch(searchTerm, searching)(getChildrenFromParent(id)(nonSelectedItems.map(it => items.find(itt => itt.id === it))));
242
- }
243
-
244
- return filterBySearch(searchTerm, searching)(items.filter(it => nonSelectedItems.some(itt => itt === it.id && !nonSelectedItems.some(ittt => ittt === it.parent))));
245
- };
246
-
247
- let composedSourceItems; // controlled V2 TODO make it default controlled behavior
248
-
249
- if (nonSelectedItems) {
250
- composedSourceItems = handleControlledSourceItms();
251
- } else {
252
- composedSourceItems = compose(filterBySearch(searchTerm, searching), filterMovedItems(movedItems), getChildrenFromParent(getActiveIdFromHierarchy(hierarchy).id))(items);
253
- }
254
-
255
- const handleControlledTargetItms = () => {
256
- const {
257
- id
258
- } = getActiveIdFromHierarchy(hierarchyDest);
259
-
260
- if (id) {
261
- return getChildrenFromParent(getActiveIdFromHierarchy(hierarchyDest).id)(this.props.selectedItems.map(it => items.find(itt => itt.id === it)));
262
- }
263
-
264
- return targetItems.filter(it => this.props.selectedItems.some(itt => itt === it.id && !this.props.selectedItems.some(ittt => ittt === it.parent)));
265
- };
266
-
267
- let composedTargetItems; // controlled V2 TODO make it default controlled behavior
268
-
269
- if (nonSelectedItems) {
270
- composedTargetItems = handleControlledTargetItms();
271
- } else {
272
- composedTargetItems = compose(tItems => {
273
- const hierarchyId = getActiveIdFromHierarchy(hierarchyDest).id;
274
- return hierarchyId ? compose(filterMovedItems(movedItems), getChildrenFromParent(hierarchyId))(tItems) : movedItems;
275
- })(targetItems);
276
- }
277
-
278
- return /*#__PURE__*/jsx(ShuttleRenderer, _objectSpread(_objectSpread({}, rest), {}, {
279
- moreItemsLoading: moreItemsLoading,
280
- checkedItems: checkedItems,
281
- hierarchy: hierarchy,
282
- hierarchyDest: hierarchyDest,
283
- onCheckItem: this.toggleItemSelection,
284
- onClearCheckedItems: this.resetCheckedItems,
285
- onClearMovedItems: this.resetMovedItems,
286
- onItemCheck: this.toggleItemSelection,
287
- onMoveCheckedItems: this.moveCheckedItems,
288
- onMoveItemToSource: item => this.removeFromTarget(item, false),
289
- onMoveItemToTarget: item => this.addToTarget(item, true),
290
- onNavigateOnSourceTo: (item, direction) => this.navigate(item, false, direction),
291
- onNavigateOnTargetTo: (item, direction) => this.navigate(item, true, direction),
292
- onSourceSortEnd: () => null,
293
- onTargetSortEnd: this.handleTargetSortEnd,
294
- sourceItems: composedSourceItems,
295
- targetItems: composedTargetItems
296
- }));
297
- }
298
-
299
- }
300
-
301
- ShuttleImpl.contextType = SearchState.Context;
302
- var ShuttleImpl$1 = withProviders(ShuttleImpl);
303
-
304
- export { ShuttleImpl$1 as default };
@@ -1,132 +0,0 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.for-each.js';
5
- import 'core-js/modules/esnext.iterator.for-each.js';
6
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
7
- import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
8
- import { useContext, useCallback } from 'react';
9
- import ShuttleSource from './components/ShuttleSource.js';
10
- import ShuttleTarget from './components/ShuttleTarget.js';
11
- import { ShuttleContainer } from './classedComponents.js';
12
- import AnimationContext from './AnimationState.js';
13
- import { jsxs, jsx } from 'react/jsx-runtime';
14
-
15
- const _excluded = ["containerProps", "onNavigateOnTargetTo", "onNavigateOnSourceTo", "onMoveItemToSource", "onMoveItemToTarget", "onClearMovedItems", "onMoveCheckedItems", "onClearCheckedItems", "onToggleSearch", "onSearch", "onSearchClose", "onSearchOpen", "searching", "onCheckItem", "hierarchy", "hierarchyDest", "checkedItems", "sourceItems", "targetItems", "sourceEmptyMessage", "targetEmptyMessage", "composeTargetItemProps", "composeSourceItemProps", "targetSortable", "sourceSortable", "onSourceSortEnd", "onTargetSortEnd", "loadingSource", "loadingTarget", "onGetMoreItems", "moreItemsLoading", "hasNextPage"];
16
-
17
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
18
-
19
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
20
-
21
- const noop = () => {};
22
-
23
- function ShuttleRenderer(_ref) {
24
- let {
25
- containerProps,
26
- onNavigateOnTargetTo = noop,
27
- onNavigateOnSourceTo = noop,
28
- onMoveItemToSource = noop,
29
- onMoveItemToTarget = noop,
30
- onClearMovedItems = noop,
31
- onMoveCheckedItems = noop,
32
- onClearCheckedItems = noop,
33
- onToggleSearch = noop,
34
- onSearch = noop,
35
- onSearchClose = noop,
36
- onSearchOpen = noop,
37
- searching = false,
38
- onCheckItem = noop,
39
- hierarchy = [],
40
- hierarchyDest = [],
41
- checkedItems = [],
42
- sourceItems = [],
43
- targetItems = [],
44
- sourceEmptyMessage,
45
- targetEmptyMessage,
46
- composeTargetItemProps,
47
- composeSourceItemProps,
48
- targetSortable,
49
- sourceSortable,
50
- onSourceSortEnd,
51
- onTargetSortEnd,
52
- loadingSource = false,
53
- loadingTarget = false,
54
- onGetMoreItems = () => {},
55
- moreItemsLoading = false,
56
- hasNextPage = false
57
- } = _ref,
58
- otherProps = _objectWithoutProperties(_ref, _excluded);
59
-
60
- const {
61
- setIsMoving,
62
- setIsDrillingDown,
63
- setIsMovingBack,
64
- reset
65
- } = useContext(AnimationContext.Context);
66
- const removeAnimationState = useCallback(() => setTimeout(() => reset(), 500));
67
- return /*#__PURE__*/jsxs(ShuttleContainer, _objectSpread(_objectSpread({
68
- "data-testid": "em-ds-shuttle"
69
- }, containerProps), {}, {
70
- children: [/*#__PURE__*/jsx(ShuttleSource, _objectSpread(_objectSpread({}, otherProps), {}, {
71
- checkedItems: checkedItems,
72
- composeSourceItemProps: composeSourceItemProps,
73
- emptyMessage: sourceEmptyMessage,
74
- hierarchy: hierarchy,
75
- items: sourceItems,
76
- onCheckItem: onCheckItem,
77
- onClearCheckedItems: onClearCheckedItems,
78
- onMoveCheckedItems: item => {
79
- setIsMoving(true);
80
- onMoveCheckedItems(item);
81
- },
82
- onMoveItem: item => {
83
- setIsMoving(true);
84
- onMoveItemToTarget(item);
85
- removeAnimationState();
86
- },
87
- onNavigateTo: function (item) {
88
- let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'down';
89
- const indexInHierarchy = hierarchy.findIndex(hItem => hItem.id === item.id);
90
- setIsDrillingDown(indexInHierarchy === -1);
91
- onNavigateOnSourceTo(item, direction);
92
- },
93
- onSearch: onSearch,
94
- onSearchClose: onSearchClose,
95
- onSearchOpen: onSearchOpen,
96
- onSortEnd: onSourceSortEnd,
97
- onToggleSearch: onToggleSearch,
98
- searching: searching,
99
- sourceSortable: sourceSortable,
100
- loading: loadingSource,
101
- onGetMoreItems: onGetMoreItems,
102
- moreItemsLoading: moreItemsLoading,
103
- hasNextPage: hasNextPage
104
- })), /*#__PURE__*/jsx(ShuttleTarget, _objectSpread(_objectSpread({}, otherProps), {}, {
105
- composeTargetItemProps: composeTargetItemProps,
106
- emptyMessage: targetEmptyMessage,
107
- hierarchy: hierarchyDest,
108
- items: targetItems,
109
- onClearMovedItems: () => {
110
- setIsMovingBack(true);
111
- removeAnimationState();
112
- onClearMovedItems();
113
- },
114
- onMoveItem: item => {
115
- setIsMovingBack(true);
116
- removeAnimationState();
117
- onMoveItemToSource(item);
118
- },
119
- onNavigateTo: function (item) {
120
- let direction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'down';
121
- const indexInHierarchy = hierarchyDest.findIndex(hItem => hItem.id === item.id);
122
- setIsDrillingDown(indexInHierarchy === -1);
123
- onNavigateOnTargetTo(item, direction);
124
- },
125
- onSortEnd: onTargetSortEnd,
126
- targetSortable: targetSortable,
127
- loading: loadingTarget
128
- }))]
129
- }));
130
- }
131
-
132
- export { ShuttleRenderer as default };
@@ -1,74 +0,0 @@
1
- import 'core-js/modules/web.dom-collections.iterator.js';
2
- import 'core-js/modules/esnext.async-iterator.map.js';
3
- import 'core-js/modules/esnext.iterator.map.js';
4
- import { useState } from 'react';
5
- import createContainer from 'constate';
6
- import { getItemsById, pipe } from './helper.js';
7
- import { moveItem, resetMovedItems, navigateTo, resetCheckedItems, toggleItemSelection } from './Shuttle.actions.js';
8
-
9
- function useShuttleState() {
10
- const [shuttleState, setShuttleState] = useState({
11
- checkedItems: [],
12
- movedItems: {},
13
- hierarchy: [{
14
- name: 'Category',
15
- id: null
16
- }],
17
- hierarchyDest: [{
18
- name: 'Added users',
19
- id: null
20
- }]
21
- });
22
-
23
- const setState = state => setShuttleState(state(shuttleState));
24
-
25
- function setMovedItems() {
26
- let itemsIds = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
27
- let items = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
28
- const itemsToMove = getItemsById(itemsIds, items);
29
- const pipeActions = itemsToMove.map(item => moveItem(item));
30
- setState(pipe([resetMovedItems(), ...pipeActions]));
31
- }
32
-
33
- function navigate(item, dest) {
34
- setState(pipe([navigateTo(item, dest), resetCheckedItems()]));
35
- }
36
-
37
- function resetCheckedItems$1() {
38
- setState(resetCheckedItems());
39
- }
40
-
41
- function resetMovedItems$1() {
42
- setState(pipe([navigateTo({
43
- id: null
44
- }, true), resetMovedItems()]));
45
- }
46
-
47
- function moveItem$1(item, dest) {
48
- setState(pipe([moveItem(item), resetCheckedItems()]));
49
- }
50
-
51
- function toggleItemSelection$1(item) {
52
- setState(toggleItemSelection(item.id));
53
- }
54
-
55
- function moveCheckedItems(items) {
56
- const pipeActions = items.map(item => moveItem$1(item));
57
- setState(pipe([...pipeActions, resetCheckedItems$1()]));
58
- }
59
-
60
- return {
61
- state: shuttleState,
62
- toggleItemSelection: toggleItemSelection$1,
63
- moveCheckedItems,
64
- moveItem: moveItem$1,
65
- resetMovedItems: resetMovedItems$1,
66
- resetCheckedItems: resetCheckedItems$1,
67
- navigate,
68
- setMovedItems
69
- };
70
- }
71
-
72
- var useShuttleState$1 = createContainer(useShuttleState, value => [value.state]);
73
-
74
- export { useShuttleState$1 as default };
@@ -1,77 +0,0 @@
1
- // shuttle list and items constants
2
- const itemAnimationDuration = 300;
3
- const listAnimationDuration = 300;
4
- const xPosMovement = 500; // breadcrumb constants
5
-
6
- const breadcrumbDuration = 200;
7
- const xBreadcrumbPos = 300;
8
- const animationConfig = {
9
- slideRight: {
10
- from: {
11
- transform: 'translate3d(0,0,0)'
12
- },
13
- to: {
14
- transform: "translate3d(".concat(xPosMovement, "px,0,0)")
15
- }
16
- },
17
- slideLeft: {
18
- from: {
19
- transform: 'translate3d(0,0,0)'
20
- },
21
- to: {
22
- transform: "translate3d(".concat(-xPosMovement, "px,0,0)")
23
- }
24
- },
25
- moveItem: isMovingLeft => ({
26
- config: {
27
- duration: itemAnimationDuration
28
- },
29
- enter: {
30
- opacity: 1,
31
- transform: "translate3d(".concat(0, "px,0,0)")
32
- },
33
- from: {
34
- opacity: 1,
35
- transform: "translate3d(".concat(isMovingLeft ? -xPosMovement : xPosMovement, "px,0,0)")
36
- },
37
- leave: {
38
- transform: "translate3d(".concat(isMovingLeft ? -xPosMovement : xPosMovement, "px,0,0)")
39
- }
40
- }),
41
- moveList: isDrillingDown => ({
42
- config: {
43
- duration: listAnimationDuration
44
- },
45
- enter: {
46
- opacity: 1,
47
- transform: 'translate3d(0,0,0)'
48
- },
49
- from: {
50
- opacity: 0,
51
- transform: "translate3d(0px,".concat(isDrillingDown ? xPosMovement : -xPosMovement, "px,0)")
52
- },
53
- leave: {
54
- opacity: 0,
55
- transform: "translate3d(0,".concat(isDrillingDown ? -xPosMovement : xPosMovement, "px,0)")
56
- }
57
- }),
58
- breadcrumb: () => ({
59
- config: {
60
- duration: breadcrumbDuration
61
- },
62
- enter: {
63
- opacity: 1,
64
- transform: "translate3d(".concat(0, "px,0,0)")
65
- },
66
- from: {
67
- opacity: 0,
68
- transform: "translate3d(".concat(xBreadcrumbPos, "px,0px,0)")
69
- },
70
- leave: {
71
- opacity: 0,
72
- transform: "translate3d(".concat(xBreadcrumbPos, "px,0,0)")
73
- }
74
- })
75
- };
76
-
77
- export { animationConfig };
@@ -1,51 +0,0 @@
1
- import DSButton from '@elliemae/ds-button';
2
- import { aggregatedClasses } from '@elliemae/ds-classnames';
3
- import ShuttleBreadcrumb from './components/ShuttleBreadcrumb.js';
4
- import OverflowList from './components/OverflowList.js';
5
-
6
- const blockName = 'shuttle';
7
- const headerBlockName = "".concat(blockName, "-header");
8
- const listBlockName = "".concat(blockName, "-list");
9
- const footerBlockName = "".concat(blockName, "-footer");
10
- const ShuttleContainer = aggregatedClasses('div')(blockName); // wrapper
11
-
12
- const ShuttleWrapper = aggregatedClasses('div')("".concat(blockName, "-wrapper")); // header
13
-
14
- const ShuttleHeader = aggregatedClasses('div')(headerBlockName);
15
- const ShuttleHeaderBreadcrumb = aggregatedClasses(ShuttleBreadcrumb)(headerBlockName, 'breadcrumb');
16
- const ShuttleHeaderSearchToggle = aggregatedClasses(DSButton)(headerBlockName, 'search-toggle'); // list
17
-
18
- const ShuttleList = aggregatedClasses('div')(listBlockName, null, _ref => {
19
- let {
20
- showPulse
21
- } = _ref;
22
- return {
23
- 'show-pulse': showPulse
24
- };
25
- });
26
- const ShuttleListPanel = aggregatedClasses('div')(listBlockName, 'panel', _ref2 => {
27
- let {
28
- open
29
- } = _ref2;
30
- return {
31
- open
32
- };
33
- });
34
- const Overflow = aggregatedClasses(OverflowList)(listBlockName, 'overflow', _ref3 => {
35
- let {
36
- empty,
37
- searching
38
- } = _ref3;
39
- return {
40
- empty,
41
- searching
42
- };
43
- });
44
- const EmptyMessage = aggregatedClasses('span')(listBlockName, 'empty-message');
45
- const LoadingList = aggregatedClasses('div')(listBlockName, 'loading-list'); // footer
46
-
47
- const ShuttleFooter = aggregatedClasses('div')(footerBlockName);
48
- const ShuttleFooterActions = aggregatedClasses('div')(footerBlockName, 'actions');
49
- const ShuttleFooterCounter = aggregatedClasses('span')(footerBlockName, 'counter');
50
-
51
- export { EmptyMessage, LoadingList, Overflow, ShuttleContainer, ShuttleFooter, ShuttleFooterActions, ShuttleFooterCounter, ShuttleHeader, ShuttleHeaderBreadcrumb, ShuttleHeaderSearchToggle, ShuttleList, ShuttleListPanel, ShuttleWrapper };
@@ -1,18 +0,0 @@
1
- import _jsx from '@babel/runtime/helpers/esm/jsx';
2
- import 'react';
3
- import { DSCircularProgressIndicator } from '@elliemae/ds-circular-progress-indicator';
4
- import styled from 'styled-components';
5
-
6
- var _Wrapper;
7
- const Wrapper = /*#__PURE__*/styled.div.withConfig({
8
- componentId: "sc-18oj125-0"
9
- })(["display:flex;justify-content:center;align-items:center;width:100%;height:100%;"]);
10
-
11
- const LoadingIndicator = () => _Wrapper || (_Wrapper = /*#__PURE__*/_jsx(Wrapper, {
12
- "data-testid": "shuttle__loading-indicator"
13
- }, void 0, /*#__PURE__*/_jsx(DSCircularProgressIndicator, {
14
- size: "xl",
15
- showLabel: true
16
- })));
17
-
18
- export { LoadingIndicator as default };