@elliemae/ds-shuttle 2.2.1 → 2.3.0-alpha.4
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 +46 -19
- package/cjs/AnimationState.js.map +7 -0
- package/cjs/DSShuttle.js +166 -219
- package/cjs/DSShuttle.js.map +7 -0
- package/cjs/SearchState.js +44 -25
- package/cjs/SearchState.js.map +7 -0
- package/cjs/Shuttle.actions.js +87 -98
- package/cjs/Shuttle.actions.js.map +7 -0
- package/cjs/ShuttleContainer.js +56 -61
- package/cjs/ShuttleContainer.js.map +7 -0
- package/cjs/ShuttleImpl.js +109 -206
- package/cjs/ShuttleImpl.js.map +7 -0
- package/cjs/ShuttleRenderer.js +140 -135
- package/cjs/ShuttleRenderer.js.map +7 -0
- package/cjs/ShuttleState.js +57 -53
- package/cjs/ShuttleState.js.map +7 -0
- package/cjs/animation/animationConfig.js +53 -56
- package/cjs/animation/animationConfig.js.map +7 -0
- package/cjs/classedComponents.js +70 -69
- package/cjs/classedComponents.js.map +7 -0
- package/cjs/components/LoadingIndicator.js +49 -22
- package/cjs/components/LoadingIndicator.js.map +7 -0
- package/cjs/components/OverflowList.js +50 -48
- package/cjs/components/OverflowList.js.map +7 -0
- package/cjs/components/ShuttleBreadcrumb.js +52 -40
- package/cjs/components/ShuttleBreadcrumb.js.map +7 -0
- package/cjs/components/ShuttleInfiniteScrollIndicator.js +46 -37
- package/cjs/components/ShuttleInfiniteScrollIndicator.js.map +7 -0
- package/cjs/components/ShuttleListItem/ActionButtons.js +56 -51
- package/cjs/components/ShuttleListItem/ActionButtons.js.map +7 -0
- package/cjs/components/ShuttleListItem/ShuttleListItem.js +78 -80
- package/cjs/components/ShuttleListItem/ShuttleListItem.js.map +7 -0
- package/cjs/components/ShuttleListItem/ShuttleSourceListItem.js +78 -64
- package/cjs/components/ShuttleListItem/ShuttleSourceListItem.js.map +7 -0
- package/cjs/components/ShuttleListItem/ShuttleTargetListItem.js +72 -56
- package/cjs/components/ShuttleListItem/ShuttleTargetListItem.js.map +7 -0
- package/cjs/components/ShuttleListPanel.js +44 -26
- package/cjs/components/ShuttleListPanel.js.map +7 -0
- package/cjs/components/ShuttleSearchBox.js +61 -72
- package/cjs/components/ShuttleSearchBox.js.map +7 -0
- package/cjs/components/ShuttleSource.js +150 -146
- package/cjs/components/ShuttleSource.js.map +7 -0
- package/cjs/components/ShuttleTarget.js +88 -100
- package/cjs/components/ShuttleTarget.js.map +7 -0
- package/cjs/components/VirtualizedItem.js +45 -40
- package/cjs/components/VirtualizedItem.js.map +7 -0
- package/cjs/components/VirtualizedList.js +81 -86
- package/cjs/components/VirtualizedList.js.map +7 -0
- package/cjs/components/VirtualizedSortableList.js +47 -40
- package/cjs/components/VirtualizedSortableList.js.map +7 -0
- package/cjs/helper.js +69 -103
- package/cjs/helper.js.map +7 -0
- package/cjs/index.js +38 -12
- package/cjs/index.js.map +7 -0
- package/cjs/tests/utils.js +1218 -0
- package/cjs/tests/utils.js.map +7 -0
- package/cjs/updateShuttleStateFromProps.js +73 -69
- package/cjs/updateShuttleStateFromProps.js.map +7 -0
- package/cjs/utils.js +40 -42
- package/cjs/utils.js.map +7 -0
- package/cjs/withProviders.js +43 -27
- package/cjs/withProviders.js.map +7 -0
- package/esm/AnimationState.js +12 -8
- package/esm/AnimationState.js.map +7 -0
- package/esm/DSShuttle.js +126 -198
- package/esm/DSShuttle.js.map +7 -0
- package/esm/SearchState.js +15 -19
- package/esm/SearchState.js.map +7 -0
- package/esm/Shuttle.actions.js +63 -80
- package/esm/Shuttle.actions.js.map +7 -0
- package/esm/ShuttleContainer.js +34 -50
- package/esm/ShuttleContainer.js.map +7 -0
- package/esm/ShuttleImpl.js +78 -183
- package/esm/ShuttleImpl.js.map +7 -0
- package/esm/ShuttleRenderer.js +111 -128
- package/esm/ShuttleRenderer.js.map +7 -0
- package/esm/ShuttleState.js +34 -53
- package/esm/ShuttleState.js.map +7 -0
- package/esm/animation/animationConfig.js +24 -52
- package/esm/animation/animationConfig.js.map +7 -0
- package/esm/classedComponents.js +43 -51
- package/esm/classedComponents.js.map +7 -0
- package/esm/components/LoadingIndicator.js +20 -15
- package/esm/components/LoadingIndicator.js.map +7 -0
- package/esm/components/OverflowList.js +21 -41
- package/esm/components/OverflowList.js.map +7 -0
- package/esm/components/ShuttleBreadcrumb.js +23 -33
- package/esm/components/ShuttleBreadcrumb.js.map +7 -0
- package/esm/components/ShuttleInfiniteScrollIndicator.js +18 -31
- package/esm/components/ShuttleInfiniteScrollIndicator.js.map +7 -0
- package/esm/components/ShuttleListItem/ActionButtons.js +27 -39
- package/esm/components/ShuttleListItem/ActionButtons.js.map +7 -0
- package/esm/components/ShuttleListItem/ShuttleListItem.js +50 -72
- package/esm/components/ShuttleListItem/ShuttleListItem.js.map +7 -0
- package/esm/components/ShuttleListItem/ShuttleSourceListItem.js +45 -52
- package/esm/components/ShuttleListItem/ShuttleSourceListItem.js.map +7 -0
- package/esm/components/ShuttleListItem/ShuttleTargetListItem.js +42 -47
- package/esm/components/ShuttleListItem/ShuttleTargetListItem.js.map +7 -0
- package/esm/components/ShuttleListPanel.js +15 -19
- package/esm/components/ShuttleListPanel.js.map +7 -0
- package/esm/components/ShuttleSearchBox.js +32 -66
- package/esm/components/ShuttleSearchBox.js.map +7 -0
- package/esm/components/ShuttleSource.js +125 -129
- package/esm/components/ShuttleSource.js.map +7 -0
- package/esm/components/ShuttleTarget.js +68 -89
- package/esm/components/ShuttleTarget.js.map +7 -0
- package/esm/components/VirtualizedItem.js +15 -33
- package/esm/components/VirtualizedItem.js.map +7 -0
- package/esm/components/VirtualizedList.js +50 -75
- package/esm/components/VirtualizedList.js.map +7 -0
- package/esm/components/VirtualizedSortableList.js +17 -32
- package/esm/components/VirtualizedSortableList.js.map +7 -0
- package/esm/helper.js +43 -67
- package/esm/helper.js.map +7 -0
- package/esm/index.js +9 -2
- package/esm/index.js.map +7 -0
- package/esm/tests/utils.js +1189 -0
- package/esm/tests/utils.js.map +7 -0
- package/esm/updateShuttleStateFromProps.js +39 -58
- package/esm/updateShuttleStateFromProps.js.map +7 -0
- package/esm/utils.js +12 -18
- package/esm/utils.js.map +7 -0
- package/esm/withProviders.js +14 -20
- package/esm/withProviders.js.map +7 -0
- package/package.json +11 -11
- package/types/AnimationState.d.ts +3 -2
- package/types/DSShuttle.d.ts +1 -1
- package/types/SearchState.d.ts +3 -2
- package/types/ShuttleImpl.d.ts +3 -2
- package/types/ShuttleRenderer.d.ts +1 -0
- package/types/ShuttleState.d.ts +3 -2
- package/types/components/LoadingIndicator.d.ts +1 -0
- package/types/components/OverflowList.d.ts +1 -0
- package/types/components/ShuttleBreadcrumb.d.ts +1 -0
- package/types/components/ShuttleInfiniteScrollIndicator.d.ts +1 -0
- package/types/components/ShuttleListItem/ShuttleListItem.d.ts +1 -0
- package/types/components/ShuttleListItem/ShuttleSourceListItem.d.ts +1 -0
- package/types/components/ShuttleListItem/ShuttleTargetListItem.d.ts +1 -0
- package/types/components/ShuttleListPanel.d.ts +1 -0
- package/types/components/ShuttleSearchBox.d.ts +3 -1
- package/types/components/ShuttleSource.d.ts +1 -0
- package/types/components/ShuttleTarget.d.ts +1 -0
- package/types/components/VirtualizedItem.d.ts +1 -0
- package/types/components/VirtualizedList.d.ts +1 -0
- package/types/components/VirtualizedSortableList.d.ts +1 -0
- package/types/index.d.ts +1 -1
- package/types/updateShuttleStateFromProps.d.ts +3 -1
- package/types/withProviders.d.ts +1 -0
|
@@ -1,49 +1,44 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
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; }
|
|
17
|
-
|
|
18
|
-
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; }
|
|
19
|
-
|
|
20
|
-
function ShuttleTargetListItem(_ref) {
|
|
21
|
-
let {
|
|
22
|
-
item = {},
|
|
23
|
-
onMoveToSource = () => null,
|
|
24
|
-
onNavigateOnTargetTo = () => null,
|
|
25
|
-
isRoot = false,
|
|
26
|
-
showDeleteButton = true,
|
|
27
|
-
showDrillDownButton = true,
|
|
28
|
-
showActions = true,
|
|
29
|
-
index
|
|
30
|
-
} = _ref,
|
|
31
|
-
rest = _objectWithoutProperties(_ref, _excluded);
|
|
32
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2, { useCallback } from "react";
|
|
3
|
+
import { DeleteButton, DrillDownButton } from "./ActionButtons";
|
|
4
|
+
import { ShuttleListItem } from "./ShuttleListItem";
|
|
5
|
+
function ShuttleTargetListItem({
|
|
6
|
+
item = {},
|
|
7
|
+
onMoveToSource = () => null,
|
|
8
|
+
onNavigateOnTargetTo = () => null,
|
|
9
|
+
isRoot = false,
|
|
10
|
+
showDeleteButton = true,
|
|
11
|
+
showDrillDownButton = true,
|
|
12
|
+
showActions = true,
|
|
13
|
+
index,
|
|
14
|
+
...rest
|
|
15
|
+
}) {
|
|
33
16
|
const moveToSource = useCallback(() => onMoveToSource(item), [item]);
|
|
34
|
-
const navigateOnTargetTo = useCallback(() => onNavigateOnTargetTo(item), [
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
17
|
+
const navigateOnTargetTo = useCallback(() => onNavigateOnTargetTo(item), [
|
|
18
|
+
item
|
|
19
|
+
]);
|
|
20
|
+
return /* @__PURE__ */ React2.createElement(ShuttleListItem, {
|
|
21
|
+
...rest,
|
|
22
|
+
actions: [
|
|
23
|
+
showDrillDownButton && /* @__PURE__ */ React2.createElement(DrillDownButton, {
|
|
24
|
+
key: "drill-down",
|
|
25
|
+
disabled: !item.hasChildren && !item.asyncLoad || item.readOnly || item.disableDrillDown,
|
|
26
|
+
onClick: navigateOnTargetTo
|
|
27
|
+
}),
|
|
28
|
+
showDeleteButton && isRoot && /* @__PURE__ */ React2.createElement(DeleteButton, {
|
|
29
|
+
key: "delete",
|
|
30
|
+
disabled: item.readOnly,
|
|
31
|
+
onClick: moveToSource,
|
|
32
|
+
"data-testid": "ds-shuttle__close-button"
|
|
33
|
+
})
|
|
34
|
+
],
|
|
35
|
+
item,
|
|
36
|
+
showActions
|
|
37
|
+
});
|
|
47
38
|
}
|
|
48
|
-
|
|
49
|
-
export {
|
|
39
|
+
var ShuttleTargetListItem_default = ShuttleTargetListItem;
|
|
40
|
+
export {
|
|
41
|
+
ShuttleTargetListItem,
|
|
42
|
+
ShuttleTargetListItem_default as default
|
|
43
|
+
};
|
|
44
|
+
//# sourceMappingURL=ShuttleTargetListItem.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/components/ShuttleListItem/ShuttleTargetListItem.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-underscore-dangle */\nimport React, { useCallback } from 'react';\nimport { DeleteButton, DrillDownButton } from './ActionButtons';\nimport { ShuttleListItem } from './ShuttleListItem';\n\nfunction ShuttleTargetListItem({\n item = {},\n onMoveToSource = () => null,\n onNavigateOnTargetTo = () => null,\n isRoot = false,\n showDeleteButton = true,\n showDrillDownButton = true,\n showActions = true,\n index,\n ...rest\n}) {\n const moveToSource = useCallback(() => onMoveToSource(item), [item]);\n const navigateOnTargetTo = useCallback(() => onNavigateOnTargetTo(item), [\n item,\n ]);\n return (\n <ShuttleListItem\n {...rest}\n actions={[\n showDrillDownButton && (\n <DrillDownButton\n key=\"drill-down\"\n disabled={\n (!item.hasChildren && !item.asyncLoad) ||\n item.readOnly ||\n item.disableDrillDown\n }\n onClick={navigateOnTargetTo}\n />\n ),\n showDeleteButton && isRoot && (\n <DeleteButton\n key=\"delete\"\n disabled={item.readOnly}\n onClick={moveToSource}\n data-testid=\"ds-shuttle__close-button\"\n />\n ),\n ]}\n item={item}\n showActions={showActions}\n />\n );\n}\n\nexport { ShuttleTargetListItem };\nexport default ShuttleTargetListItem;\n"],
|
|
5
|
+
"mappings": "AAAA;ACCA;AACA;AACA;AAEA,+BAA+B;AAAA,EAC7B,OAAO;AAAA,EACP,iBAAiB,MAAM;AAAA,EACvB,uBAAuB,MAAM;AAAA,EAC7B,SAAS;AAAA,EACT,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd;AAAA,KACG;AAAA,GACF;AACD,QAAM,eAAe,YAAY,MAAM,eAAe,OAAO,CAAC;AAC9D,QAAM,qBAAqB,YAAY,MAAM,qBAAqB,OAAO;AAAA,IACvE;AAAA;AAEF,SACE,qCAAC,iBAAD;AAAA,OACM;AAAA,IACJ,SAAS;AAAA,MACP,uBACE,qCAAC,iBAAD;AAAA,QACE,KAAI;AAAA,QACJ,UACG,CAAC,KAAK,eAAe,CAAC,KAAK,aAC5B,KAAK,YACL,KAAK;AAAA,QAEP,SAAS;AAAA;AAAA,MAGb,oBAAoB,UAClB,qCAAC,cAAD;AAAA,QACE,KAAI;AAAA,QACJ,UAAU,KAAK;AAAA,QACf,SAAS;AAAA,QACT,eAAY;AAAA;AAAA;AAAA,IAIlB;AAAA,IACA;AAAA;AAAA;AAMN,IAAO,gCAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,24 +1,20 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import DSButton from
|
|
4
|
-
import { ShuttleListPanel as
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
open = false,
|
|
10
|
-
children
|
|
11
|
-
} = _ref;
|
|
12
|
-
return /*#__PURE__*/_jsx(ShuttleListPanel$1, {
|
|
13
|
-
classProps: {
|
|
14
|
-
open
|
|
15
|
-
}
|
|
16
|
-
}, void 0, /*#__PURE__*/_jsx(DSButton, {
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2 from "react";
|
|
3
|
+
import { DSButton } from "@elliemae/ds-button";
|
|
4
|
+
import { ShuttleListPanel as Wrapper } from "../classedComponents";
|
|
5
|
+
function ShuttleListPanel({ onClick = () => null, open = false, children }) {
|
|
6
|
+
return /* @__PURE__ */ React2.createElement(Wrapper, {
|
|
7
|
+
classProps: { open }
|
|
8
|
+
}, /* @__PURE__ */ React2.createElement(DSButton, {
|
|
17
9
|
buttonType: "text",
|
|
18
10
|
icon: children,
|
|
19
|
-
onClick
|
|
11
|
+
onClick,
|
|
20
12
|
"data-testid": "list-panel-btn"
|
|
21
13
|
}));
|
|
22
14
|
}
|
|
23
|
-
|
|
24
|
-
export {
|
|
15
|
+
var ShuttleListPanel_default = ShuttleListPanel;
|
|
16
|
+
export {
|
|
17
|
+
ShuttleListPanel,
|
|
18
|
+
ShuttleListPanel_default as default
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=ShuttleListPanel.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/ShuttleListPanel.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { DSButton } from '@elliemae/ds-button';\nimport { ShuttleListPanel as Wrapper } from '../classedComponents';\n\nfunction ShuttleListPanel({ onClick = () => null, open = false, children }) {\n return (\n <Wrapper classProps={{ open }}>\n <DSButton buttonType=\"text\" icon={children} onClick={onClick} data-testid=\"list-panel-btn\" />\n </Wrapper>\n );\n}\n\nexport { ShuttleListPanel };\nexport default ShuttleListPanel;\n"],
|
|
5
|
+
"mappings": "AAAA;ACAA;AACA;AACA;AAEA,0BAA0B,EAAE,UAAU,MAAM,MAAM,OAAO,OAAO,YAAY;AAC1E,SACE,qCAAC,SAAD;AAAA,IAAS,YAAY,EAAE;AAAA,KACrB,qCAAC,UAAD;AAAA,IAAU,YAAW;AAAA,IAAO,MAAM;AAAA,IAAU;AAAA,IAAkB,eAAY;AAAA;AAAA;AAMhF,IAAO,2BAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,18 +1,10 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Component } from
|
|
3
|
-
import { aggregatedClasses } from
|
|
4
|
-
import { debounce } from
|
|
5
|
-
import { DSTextBox } from
|
|
6
|
-
|
|
7
|
-
const
|
|
8
|
-
const SearchBoxContainer = aggregatedClasses('div')(blockName, null, _ref => {
|
|
9
|
-
let {
|
|
10
|
-
isOpen
|
|
11
|
-
} = _ref;
|
|
12
|
-
return {
|
|
13
|
-
opened: isOpen
|
|
14
|
-
};
|
|
15
|
-
});
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2, { Component } from "react";
|
|
3
|
+
import { aggregatedClasses } from "@elliemae/ds-classnames";
|
|
4
|
+
import { debounce } from "@elliemae/ds-utilities";
|
|
5
|
+
import { DSTextBox } from "@elliemae/ds-form";
|
|
6
|
+
const blockName = "shuttle-search-box";
|
|
7
|
+
const SearchBoxContainer = aggregatedClasses("div")(blockName, null, ({ isOpen }) => ({ opened: isOpen }));
|
|
16
8
|
const filterList = debounce((term, onFilterCallback) => {
|
|
17
9
|
onFilterCallback(term);
|
|
18
10
|
}, 200);
|
|
@@ -23,82 +15,56 @@ class ShuttleSearchBox extends Component {
|
|
|
23
15
|
value: props.value,
|
|
24
16
|
prevProps: {}
|
|
25
17
|
};
|
|
26
|
-
this.handleChange = this.handleChange.bind(this);
|
|
27
18
|
this.handleKeyPress = this.handleKeyPress.bind(this);
|
|
19
|
+
this.handleChange = this.handleChange.bind(this);
|
|
28
20
|
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
let {
|
|
32
|
-
prevProps
|
|
33
|
-
} = _ref2;
|
|
34
|
-
const {
|
|
35
|
-
value
|
|
36
|
-
} = nextProps;
|
|
37
|
-
|
|
21
|
+
static getDerivedStateFromProps(nextProps, { prevProps }) {
|
|
22
|
+
const { value } = nextProps;
|
|
38
23
|
if (value !== prevProps.value) {
|
|
39
24
|
return {
|
|
40
25
|
value,
|
|
41
|
-
prevProps: {
|
|
42
|
-
value
|
|
43
|
-
}
|
|
26
|
+
prevProps: { value }
|
|
44
27
|
};
|
|
45
28
|
}
|
|
46
|
-
|
|
47
29
|
return null;
|
|
48
30
|
}
|
|
49
|
-
|
|
50
31
|
handleChange(e) {
|
|
51
|
-
const {
|
|
52
|
-
|
|
53
|
-
filterOnKeyStroke,
|
|
54
|
-
onFilter
|
|
55
|
-
} = this.props;
|
|
56
|
-
const {
|
|
57
|
-
value
|
|
58
|
-
} = e.target;
|
|
32
|
+
const { onChange, filterOnKeyStroke, onFilter } = this.props;
|
|
33
|
+
const { value } = e.target;
|
|
59
34
|
onChange(value);
|
|
60
|
-
if (filterOnKeyStroke)
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
});
|
|
35
|
+
if (filterOnKeyStroke)
|
|
36
|
+
filterList(value, onFilter);
|
|
37
|
+
this.setState({ value });
|
|
64
38
|
}
|
|
65
|
-
|
|
66
39
|
handleKeyPress(e) {
|
|
67
|
-
const {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
if (e.keyCode === 13) onFilter(e.target.value);
|
|
40
|
+
const { onFilter } = this.props;
|
|
41
|
+
if (e.keyCode === 13)
|
|
42
|
+
onFilter(e.target.value);
|
|
71
43
|
}
|
|
72
|
-
|
|
73
44
|
render() {
|
|
74
|
-
const {
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
onClose,
|
|
80
|
-
placeholder
|
|
81
|
-
} = this.props;
|
|
82
|
-
return /*#__PURE__*/_jsx(SearchBoxContainer, {
|
|
83
|
-
classProps: {
|
|
84
|
-
isOpen
|
|
85
|
-
}
|
|
86
|
-
}, void 0, /*#__PURE__*/_jsx(DSTextBox, {
|
|
45
|
+
const { value } = this.state;
|
|
46
|
+
const { isOpen, onClose, placeholder } = this.props;
|
|
47
|
+
return /* @__PURE__ */ React2.createElement(SearchBoxContainer, {
|
|
48
|
+
classProps: { isOpen }
|
|
49
|
+
}, /* @__PURE__ */ React2.createElement(DSTextBox, {
|
|
87
50
|
autoFocus: true,
|
|
88
51
|
clearable: true,
|
|
89
52
|
onChange: this.handleChange,
|
|
90
53
|
onClear: onClose,
|
|
91
54
|
onKeyDown: this.handleKeyPress,
|
|
92
|
-
placeholder
|
|
93
|
-
value
|
|
55
|
+
placeholder,
|
|
56
|
+
value
|
|
94
57
|
}));
|
|
95
58
|
}
|
|
96
|
-
|
|
97
59
|
}
|
|
98
60
|
ShuttleSearchBox.defaultProps = {
|
|
99
61
|
filterOnKeyStroke: false,
|
|
100
62
|
onChange: () => null,
|
|
101
63
|
onFilter: () => null
|
|
102
64
|
};
|
|
103
|
-
|
|
104
|
-
export {
|
|
65
|
+
var ShuttleSearchBox_default = ShuttleSearchBox;
|
|
66
|
+
export {
|
|
67
|
+
ShuttleSearchBox,
|
|
68
|
+
ShuttleSearchBox_default as default
|
|
69
|
+
};
|
|
70
|
+
//# sourceMappingURL=ShuttleSearchBox.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/ShuttleSearchBox.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-unused-state */\nimport React, { Component } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { debounce } from '@elliemae/ds-utilities';\nimport { DSTextBox } from '@elliemae/ds-form';\n\nconst blockName = 'shuttle-search-box';\n\nconst SearchBoxContainer = aggregatedClasses('div')(blockName, null, ({ isOpen }) => ({ opened: isOpen }));\n\nconst filterList = debounce((term, onFilterCallback) => {\n onFilterCallback(term);\n}, 200);\n\nclass ShuttleSearchBox extends Component {\n static defaultProps = {\n filterOnKeyStroke: false,\n onChange: () => null,\n onFilter: () => null,\n };\n\n constructor(props) {\n super(props);\n this.state = {\n value: props.value,\n prevProps: {},\n };\n this.handleKeyPress = this.handleKeyPress.bind(this);\n this.handleChange = this.handleChange.bind(this);\n }\n\n static getDerivedStateFromProps(nextProps, { prevProps }) {\n const { value } = nextProps;\n if (value !== prevProps.value) {\n return {\n value,\n prevProps: { value },\n };\n }\n return null;\n }\n\n handleChange(e) {\n const { onChange, filterOnKeyStroke, onFilter } = this.props;\n const { value } = e.target;\n onChange(value);\n if (filterOnKeyStroke) filterList(value, onFilter);\n this.setState({ value });\n }\n\n handleKeyPress(e) {\n const { onFilter } = this.props;\n if (e.keyCode === 13) onFilter(e.target.value);\n }\n\n render() {\n const { value } = this.state;\n const { isOpen, onClose, placeholder } = this.props;\n return (\n <SearchBoxContainer classProps={{ isOpen }}>\n <DSTextBox\n autoFocus\n clearable\n onChange={this.handleChange}\n onClear={onClose}\n onKeyDown={this.handleKeyPress}\n placeholder={placeholder}\n value={value}\n />\n </SearchBoxContainer>\n );\n }\n}\n\nexport { ShuttleSearchBox };\nexport default ShuttleSearchBox;\n"],
|
|
5
|
+
"mappings": "AAAA;ACCA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,qBAAqB,kBAAkB,OAAO,WAAW,MAAM,CAAC,EAAE,aAAc,GAAE,QAAQ;AAEhG,MAAM,aAAa,SAAS,CAAC,MAAM,qBAAqB;AACtD,mBAAiB;AAAA,GAChB;AAEH,+BAA+B,UAAU;AAAA,EAOvC,YAAY,OAAO;AACjB,UAAM;AACN,SAAK,QAAQ;AAAA,MACX,OAAO,MAAM;AAAA,MACb,WAAW;AAAA;AAEb,SAAK,iBAAiB,KAAK,eAAe,KAAK;AAC/C,SAAK,eAAe,KAAK,aAAa,KAAK;AAAA;AAAA,SAGtC,yBAAyB,WAAW,EAAE,aAAa;AACxD,UAAM,EAAE,UAAU;AAClB,QAAI,UAAU,UAAU,OAAO;AAC7B,aAAO;AAAA,QACL;AAAA,QACA,WAAW,EAAE;AAAA;AAAA;AAGjB,WAAO;AAAA;AAAA,EAGT,aAAa,GAAG;AACd,UAAM,EAAE,UAAU,mBAAmB,aAAa,KAAK;AACvD,UAAM,EAAE,UAAU,EAAE;AACpB,aAAS;AACT,QAAI;AAAmB,iBAAW,OAAO;AACzC,SAAK,SAAS,EAAE;AAAA;AAAA,EAGlB,eAAe,GAAG;AAChB,UAAM,EAAE,aAAa,KAAK;AAC1B,QAAI,EAAE,YAAY;AAAI,eAAS,EAAE,OAAO;AAAA;AAAA,EAG1C,SAAS;AACP,UAAM,EAAE,UAAU,KAAK;AACvB,UAAM,EAAE,QAAQ,SAAS,gBAAgB,KAAK;AAC9C,WACE,qCAAC,oBAAD;AAAA,MAAoB,YAAY,EAAE;AAAA,OAChC,qCAAC,WAAD;AAAA,MACE,WAAS;AAAA,MACT,WAAS;AAAA,MACT,UAAU,KAAK;AAAA,MACf,SAAS;AAAA,MACT,WAAW,KAAK;AAAA,MAChB;AAAA,MACA;AAAA;AAAA;AAAA;AApDD,AADT,iBACS,eAAe;AAAA,EACpB,mBAAmB;AAAA,EACnB,UAAU,MAAM;AAAA,EAChB,UAAU,MAAM;AAAA;AAyDpB,IAAO,2BAAQ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,91 +1,75 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
import
|
|
24
|
-
import
|
|
25
|
-
import
|
|
26
|
-
import {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
function
|
|
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
|
-
sourceClearItemsText = 'CLEAR ALL',
|
|
58
|
-
searchPlaceholder,
|
|
59
|
-
renderSourceCounter = amount => "".concat(amount, " items"),
|
|
60
|
-
onGetMoreItems = () => {},
|
|
61
|
-
moreItemsLoading = false,
|
|
62
|
-
hasNextPage = false
|
|
63
|
-
} = _ref;
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
import React2, { useCallback, useContext, useMemo } from "react";
|
|
3
|
+
import PropTypes from "prop-types";
|
|
4
|
+
import { ArrowShortRight, Search } from "@elliemae/ds-icons";
|
|
5
|
+
import { DSButton } from "@elliemae/ds-button";
|
|
6
|
+
import { runAll } from "@elliemae/ds-utilities";
|
|
7
|
+
import { ShuttleSearchBox } from "./ShuttleSearchBox";
|
|
8
|
+
import { ShuttleInfiniteScrollIndicator } from "./ShuttleInfiniteScrollIndicator";
|
|
9
|
+
import { ShuttleSourceListItem } from "./ShuttleListItem/ShuttleSourceListItem";
|
|
10
|
+
import {
|
|
11
|
+
ShuttleFooterCounter,
|
|
12
|
+
Overflow,
|
|
13
|
+
ShuttleFooter,
|
|
14
|
+
ShuttleHeader,
|
|
15
|
+
ShuttleHeaderBreadcrumb,
|
|
16
|
+
ShuttleHeaderSearchToggle,
|
|
17
|
+
ShuttleList,
|
|
18
|
+
ShuttleWrapper,
|
|
19
|
+
ShuttleFooterActions,
|
|
20
|
+
EmptyMessage,
|
|
21
|
+
LoadingList
|
|
22
|
+
} from "../classedComponents";
|
|
23
|
+
import { ShuttleListPanel } from "./ShuttleListPanel";
|
|
24
|
+
import { VirtualizedList } from "./VirtualizedList";
|
|
25
|
+
import { getActiveIdFromHierarchy } from "../helper";
|
|
26
|
+
import { AnimationState } from "../AnimationState";
|
|
27
|
+
import { SearchState } from "../SearchState";
|
|
28
|
+
import { VirtualizedSortableList } from "./VirtualizedSortableList";
|
|
29
|
+
import { LoadingIndicator } from "./LoadingIndicator";
|
|
30
|
+
const noop = () => {
|
|
31
|
+
};
|
|
32
|
+
function ShuttleSource({
|
|
33
|
+
items = [],
|
|
34
|
+
checkedItems = [],
|
|
35
|
+
hierarchy = [],
|
|
36
|
+
onMoveItem = noop,
|
|
37
|
+
onCheckItem = noop,
|
|
38
|
+
onMoveCheckedItems = noop,
|
|
39
|
+
onNavigateTo = noop,
|
|
40
|
+
onClearCheckedItems = noop,
|
|
41
|
+
emptyMessage = "No items found",
|
|
42
|
+
composeSourceItemProps = noop,
|
|
43
|
+
loading = false,
|
|
44
|
+
onSearch = noop,
|
|
45
|
+
onSearchClose = noop,
|
|
46
|
+
onSearchOpen = noop,
|
|
47
|
+
sourceSortable = false,
|
|
48
|
+
onSortEnd = noop,
|
|
49
|
+
sourceClearItemsText = "CLEAR ALL",
|
|
50
|
+
searchPlaceholder,
|
|
51
|
+
renderSourceCounter = (amount) => `${amount} items`,
|
|
52
|
+
onGetMoreItems = () => {
|
|
53
|
+
},
|
|
54
|
+
moreItemsLoading = false,
|
|
55
|
+
hasNextPage = false
|
|
56
|
+
}) {
|
|
64
57
|
const {
|
|
65
|
-
state: {
|
|
66
|
-
|
|
67
|
-
isMoving
|
|
68
|
-
}
|
|
69
|
-
} = useContext(AnimationContext.Context);
|
|
58
|
+
state: { isMovingBack = false, isMoving }
|
|
59
|
+
} = useContext(AnimationState.Context);
|
|
70
60
|
const {
|
|
71
|
-
state: {
|
|
72
|
-
searching,
|
|
73
|
-
searchTerm
|
|
74
|
-
},
|
|
61
|
+
state: { searching, searchTerm },
|
|
75
62
|
setSearchTerm,
|
|
76
63
|
reset: resetSearch,
|
|
77
64
|
toggleSearchBox
|
|
78
65
|
} = useContext(SearchState.Context);
|
|
79
|
-
const hashedCheckedItems = useMemo(() => checkedItems.reduce((result, item) =>
|
|
80
|
-
[item]: true
|
|
81
|
-
}), {}), [checkedItems]);
|
|
66
|
+
const hashedCheckedItems = useMemo(() => checkedItems.reduce((result, item) => ({ ...result, [item]: true }), {}), [checkedItems]);
|
|
82
67
|
const handleCloseSearch = useCallback(() => {
|
|
83
|
-
setSearchTerm(
|
|
68
|
+
setSearchTerm("");
|
|
84
69
|
runAll(resetSearch, onSearchClose)();
|
|
85
70
|
}, [searching]);
|
|
86
71
|
const handleToggleSearch = useCallback(() => {
|
|
87
72
|
toggleSearchBox(!searching);
|
|
88
|
-
|
|
89
73
|
if (searching) {
|
|
90
74
|
handleCloseSearch();
|
|
91
75
|
} else {
|
|
@@ -93,87 +77,99 @@ function ShuttleSource(_ref) {
|
|
|
93
77
|
}
|
|
94
78
|
}, [searching]);
|
|
95
79
|
const ComponentList = useMemo(() => sourceSortable ? VirtualizedSortableList : VirtualizedList, [sourceSortable]);
|
|
96
|
-
|
|
97
|
-
const handleSortEnd = _ref2 => {
|
|
98
|
-
let {
|
|
99
|
-
oldIndex,
|
|
100
|
-
newIndex
|
|
101
|
-
} = _ref2;
|
|
80
|
+
const handleSortEnd = ({ oldIndex, newIndex }) => {
|
|
102
81
|
onSortEnd({
|
|
103
82
|
sourceItem: items[oldIndex],
|
|
104
83
|
targetItem: items[newIndex]
|
|
105
84
|
});
|
|
106
85
|
};
|
|
107
|
-
|
|
108
86
|
const isEmpty = !items.length;
|
|
109
87
|
const hasContent = !loading && !isEmpty;
|
|
110
88
|
const contentIsEmpty = !loading && isEmpty;
|
|
111
|
-
return
|
|
112
|
-
hierarchy
|
|
113
|
-
onNavigateTo
|
|
114
|
-
}),
|
|
89
|
+
return /* @__PURE__ */ React2.createElement(ShuttleWrapper, null, /* @__PURE__ */ React2.createElement(ShuttleHeader, null, /* @__PURE__ */ React2.createElement(ShuttleHeaderBreadcrumb, {
|
|
90
|
+
hierarchy,
|
|
91
|
+
onNavigateTo
|
|
92
|
+
}), /* @__PURE__ */ React2.createElement(ShuttleHeaderSearchToggle, {
|
|
115
93
|
buttonType: "text",
|
|
116
|
-
icon:
|
|
94
|
+
icon: /* @__PURE__ */ React2.createElement(Search, null),
|
|
117
95
|
onClick: handleToggleSearch,
|
|
118
|
-
containerProps: {
|
|
119
|
-
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
},
|
|
125
|
-
style: {
|
|
126
|
-
pointerEvents: isMoving ? 'none' : null
|
|
127
|
-
}
|
|
128
|
-
}, void 0, /*#__PURE__*/_jsx(ShuttleSearchBox, {
|
|
96
|
+
containerProps: { "data-testid": "shuttle-header-search-toggle" }
|
|
97
|
+
})), /* @__PURE__ */ React2.createElement(ShuttleList, {
|
|
98
|
+
classProps: { showPulse: isMovingBack },
|
|
99
|
+
style: { pointerEvents: isMoving ? "none" : null }
|
|
100
|
+
}, /* @__PURE__ */ React2.createElement(ShuttleSearchBox, {
|
|
101
|
+
key: searching,
|
|
129
102
|
isOpen: searching,
|
|
130
103
|
onClose: runAll(() => toggleSearchBox(false), handleCloseSearch),
|
|
131
104
|
onFilter: runAll(setSearchTerm, onSearch),
|
|
132
105
|
placeholder: searchPlaceholder,
|
|
133
106
|
value: searchTerm
|
|
134
|
-
}
|
|
107
|
+
}), hasContent ? /* @__PURE__ */ React2.createElement(Overflow, {
|
|
135
108
|
activeHierarchy: getActiveIdFromHierarchy(hierarchy).id,
|
|
136
109
|
classProps: {
|
|
137
110
|
searching,
|
|
138
111
|
empty: isEmpty
|
|
139
112
|
}
|
|
140
|
-
},
|
|
113
|
+
}, /* @__PURE__ */ React2.createElement(ComponentList, {
|
|
114
|
+
key: searchTerm,
|
|
141
115
|
helperClass: "drag-helper",
|
|
142
|
-
itemRenderer:
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
onMoveToTarget: onMoveItem,
|
|
155
|
-
onNavigateOnSourceTo: onNavigateTo,
|
|
156
|
-
showSortHandler: sourceSortable
|
|
157
|
-
}));
|
|
158
|
-
},
|
|
159
|
-
items: items,
|
|
116
|
+
itemRenderer: ({ item, ...rest }) => /* @__PURE__ */ React2.createElement(ShuttleSourceListItem, {
|
|
117
|
+
"data-testid": "source-list-item",
|
|
118
|
+
...rest,
|
|
119
|
+
...composeSourceItemProps(item, rest),
|
|
120
|
+
isChecked: !!hashedCheckedItems[item.id],
|
|
121
|
+
item,
|
|
122
|
+
onItemCheck: onCheckItem,
|
|
123
|
+
onMoveToTarget: onMoveItem,
|
|
124
|
+
onNavigateOnSourceTo: onNavigateTo,
|
|
125
|
+
showSortHandler: sourceSortable
|
|
126
|
+
}),
|
|
127
|
+
items,
|
|
160
128
|
onSortEnd: handleSortEnd,
|
|
161
129
|
getMoreItems: onGetMoreItems,
|
|
162
|
-
hasNextPage
|
|
163
|
-
}
|
|
130
|
+
hasNextPage
|
|
131
|
+
})) : null, contentIsEmpty ? /* @__PURE__ */ React2.createElement(LoadingList, {
|
|
164
132
|
"data-testid": "shuttle__loading-list"
|
|
165
|
-
},
|
|
133
|
+
}, /* @__PURE__ */ React2.createElement(EmptyMessage, null, emptyMessage)) : null, loading ? /* @__PURE__ */ React2.createElement(LoadingList, {
|
|
166
134
|
"data-testid": "shuttle__loading-list"
|
|
167
|
-
},
|
|
135
|
+
}, /* @__PURE__ */ React2.createElement(LoadingIndicator, null)) : null, /* @__PURE__ */ React2.createElement(ShuttleListPanel, {
|
|
168
136
|
onClick: onMoveCheckedItems,
|
|
169
137
|
open: checkedItems.length > 1
|
|
170
|
-
},
|
|
138
|
+
}, /* @__PURE__ */ React2.createElement(ArrowShortRight, null)), moreItemsLoading ? /* @__PURE__ */ React2.createElement(ShuttleInfiniteScrollIndicator, {
|
|
171
139
|
isOpen: true
|
|
172
|
-
})
|
|
140
|
+
}) : null), /* @__PURE__ */ React2.createElement(ShuttleFooter, null, /* @__PURE__ */ React2.createElement(ShuttleFooterActions, null, !!checkedItems.length && /* @__PURE__ */ React2.createElement(DSButton, {
|
|
173
141
|
buttonType: "link",
|
|
174
142
|
labelText: sourceClearItemsText,
|
|
175
143
|
onClick: onClearCheckedItems
|
|
176
|
-
})),
|
|
144
|
+
})), /* @__PURE__ */ React2.createElement(ShuttleFooterCounter, null, renderSourceCounter(checkedItems.length))));
|
|
177
145
|
}
|
|
178
|
-
|
|
179
|
-
|
|
146
|
+
ShuttleSource.propTypes = {
|
|
147
|
+
items: PropTypes.arrayOf(PropTypes.shape({})),
|
|
148
|
+
checkedItems: PropTypes.arrayOf(PropTypes.shape({})),
|
|
149
|
+
hierarchy: PropTypes.arrayOf(PropTypes.shape({})),
|
|
150
|
+
onMoveItem: PropTypes.func,
|
|
151
|
+
onCheckItem: PropTypes.func,
|
|
152
|
+
onMoveCheckedItems: PropTypes.func,
|
|
153
|
+
onNavigateTo: PropTypes.func,
|
|
154
|
+
onClearCheckedItems: PropTypes.func,
|
|
155
|
+
emptyMessage: PropTypes.string,
|
|
156
|
+
composeSourceItemProps: PropTypes.func,
|
|
157
|
+
loading: PropTypes.bool,
|
|
158
|
+
onSearch: PropTypes.func,
|
|
159
|
+
onSearchClose: PropTypes.func,
|
|
160
|
+
onSearchOpen: PropTypes.func,
|
|
161
|
+
sourceSortable: PropTypes.bool,
|
|
162
|
+
onSortEnd: PropTypes.func,
|
|
163
|
+
sourceClearItemsText: PropTypes.string,
|
|
164
|
+
searchPlaceholder: PropTypes.string,
|
|
165
|
+
renderSourceCounter: PropTypes.func,
|
|
166
|
+
onGetMoreItems: PropTypes.func,
|
|
167
|
+
moreItemsLoading: PropTypes.bool,
|
|
168
|
+
hasNextPage: PropTypes.bool
|
|
169
|
+
};
|
|
170
|
+
var ShuttleSource_default = ShuttleSource;
|
|
171
|
+
export {
|
|
172
|
+
ShuttleSource,
|
|
173
|
+
ShuttleSource_default as default
|
|
174
|
+
};
|
|
175
|
+
//# sourceMappingURL=ShuttleSource.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/ShuttleSource.tsx"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable no-shadow */\nimport React, { useCallback, useContext, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport { ArrowShortRight, Search } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { runAll } from '@elliemae/ds-utilities';\nimport { ShuttleSearchBox } from './ShuttleSearchBox';\nimport { ShuttleInfiniteScrollIndicator } from './ShuttleInfiniteScrollIndicator';\nimport { ShuttleSourceListItem } from './ShuttleListItem/ShuttleSourceListItem';\nimport {\n ShuttleFooterCounter,\n Overflow,\n ShuttleFooter,\n ShuttleHeader,\n ShuttleHeaderBreadcrumb,\n ShuttleHeaderSearchToggle,\n ShuttleList,\n ShuttleWrapper,\n ShuttleFooterActions,\n EmptyMessage,\n LoadingList,\n} from '../classedComponents';\nimport { ShuttleListPanel } from './ShuttleListPanel';\nimport { VirtualizedList } from './VirtualizedList';\nimport { getActiveIdFromHierarchy } from '../helper';\nimport { AnimationState } from '../AnimationState';\nimport { SearchState } from '../SearchState';\nimport { VirtualizedSortableList } from './VirtualizedSortableList';\nimport { LoadingIndicator } from './LoadingIndicator';\n\nconst noop = () => {};\n\nfunction ShuttleSource({\n items = [],\n checkedItems = [], // build Map() and memoize it for better performance\n hierarchy = [],\n onMoveItem = noop,\n onCheckItem = noop,\n onMoveCheckedItems = noop,\n onNavigateTo = noop,\n onClearCheckedItems = noop,\n emptyMessage = 'No items found',\n composeSourceItemProps = noop,\n loading = false,\n onSearch = noop,\n onSearchClose = noop,\n onSearchOpen = noop,\n sourceSortable = false,\n onSortEnd = noop,\n sourceClearItemsText = 'CLEAR ALL',\n searchPlaceholder,\n renderSourceCounter = (amount) => `${amount} items`,\n onGetMoreItems = () => {},\n moreItemsLoading = false,\n hasNextPage = false,\n}) {\n const {\n state: { isMovingBack = false, isMoving },\n } = useContext(AnimationState.Context);\n const {\n state: { searching, searchTerm },\n setSearchTerm,\n reset: resetSearch,\n toggleSearchBox,\n } = useContext(SearchState.Context);\n\n const hashedCheckedItems = useMemo(\n () => checkedItems.reduce((result, item) => ({ ...result, [item]: true }), {}),\n [checkedItems],\n );\n\n const handleCloseSearch = useCallback(() => {\n setSearchTerm('');\n runAll(resetSearch, onSearchClose)();\n }, [searching]);\n\n const handleToggleSearch = useCallback(() => {\n toggleSearchBox(!searching);\n if (searching) {\n handleCloseSearch();\n } else {\n onSearchOpen();\n }\n }, [searching]);\n\n const ComponentList = useMemo(() => (sourceSortable ? VirtualizedSortableList : VirtualizedList), [sourceSortable]);\n\n const handleSortEnd = ({ oldIndex, newIndex }) => {\n onSortEnd({\n sourceItem: items[oldIndex],\n targetItem: items[newIndex],\n });\n };\n\n const isEmpty = !items.length;\n const hasContent = !loading && !isEmpty;\n const contentIsEmpty = !loading && isEmpty;\n\n return (\n <ShuttleWrapper>\n <ShuttleHeader>\n <ShuttleHeaderBreadcrumb hierarchy={hierarchy} onNavigateTo={onNavigateTo} />\n <ShuttleHeaderSearchToggle\n buttonType=\"text\"\n icon={<Search />}\n onClick={handleToggleSearch}\n containerProps={{ 'data-testid': 'shuttle-header-search-toggle' }}\n />\n </ShuttleHeader>\n <ShuttleList classProps={{ showPulse: isMovingBack }} style={{ pointerEvents: isMoving ? 'none' : null }}>\n <ShuttleSearchBox\n key={searching}\n isOpen={searching}\n onClose={runAll(() => toggleSearchBox(false), handleCloseSearch)}\n onFilter={runAll(setSearchTerm, onSearch)}\n placeholder={searchPlaceholder}\n value={searchTerm}\n />\n {hasContent ? (\n <Overflow\n activeHierarchy={getActiveIdFromHierarchy(hierarchy).id}\n classProps={{\n searching,\n empty: isEmpty,\n }}\n >\n <ComponentList\n key={searchTerm}\n helperClass=\"drag-helper\"\n itemRenderer={({ item, ...rest }) => (\n <ShuttleSourceListItem\n data-testid=\"source-list-item\"\n {...rest}\n {...composeSourceItemProps(item, rest)}\n isChecked={!!hashedCheckedItems[item.id]}\n item={item}\n onItemCheck={onCheckItem}\n onMoveToTarget={onMoveItem}\n onNavigateOnSourceTo={onNavigateTo}\n showSortHandler={sourceSortable}\n />\n )}\n items={items}\n onSortEnd={handleSortEnd}\n getMoreItems={onGetMoreItems}\n hasNextPage={hasNextPage}\n />\n </Overflow>\n ) : null}\n {contentIsEmpty ? (\n <LoadingList data-testid=\"shuttle__loading-list\">\n <EmptyMessage>{emptyMessage}</EmptyMessage>\n </LoadingList>\n ) : null}\n {loading ? (\n <LoadingList data-testid=\"shuttle__loading-list\">\n <LoadingIndicator />\n </LoadingList>\n ) : null}\n <ShuttleListPanel onClick={onMoveCheckedItems} open={checkedItems.length > 1}>\n <ArrowShortRight />\n </ShuttleListPanel>\n {moreItemsLoading ? <ShuttleInfiniteScrollIndicator isOpen /> : null}\n </ShuttleList>\n <ShuttleFooter>\n <ShuttleFooterActions>\n {!!checkedItems.length && (\n <DSButton buttonType=\"link\" labelText={sourceClearItemsText} onClick={onClearCheckedItems} />\n )}\n </ShuttleFooterActions>\n <ShuttleFooterCounter>{renderSourceCounter(checkedItems.length)}</ShuttleFooterCounter>\n </ShuttleFooter>\n </ShuttleWrapper>\n );\n}\n\nShuttleSource.propTypes = {\n items: PropTypes.arrayOf(PropTypes.shape({})),\n checkedItems: PropTypes.arrayOf(PropTypes.shape({})),\n hierarchy: PropTypes.arrayOf(PropTypes.shape({})),\n onMoveItem: PropTypes.func,\n onCheckItem: PropTypes.func,\n onMoveCheckedItems: PropTypes.func,\n onNavigateTo: PropTypes.func,\n onClearCheckedItems: PropTypes.func,\n emptyMessage: PropTypes.string,\n composeSourceItemProps: PropTypes.func,\n loading: PropTypes.bool,\n onSearch: PropTypes.func,\n onSearchClose: PropTypes.func,\n onSearchOpen: PropTypes.func,\n sourceSortable: PropTypes.bool,\n onSortEnd: PropTypes.func,\n sourceClearItemsText: PropTypes.string,\n searchPlaceholder: PropTypes.string,\n renderSourceCounter: PropTypes.func,\n onGetMoreItems: PropTypes.func,\n moreItemsLoading: PropTypes.bool,\n hasNextPage: PropTypes.bool,\n};\n\nexport { ShuttleSource };\nexport default ShuttleSource;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|