@elliemae/ds-shuttle-v2 3.36.0-next.0 → 3.36.0-next.1
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/DSShuttleV2.js +0 -1
- package/dist/cjs/DSShuttleV2.js.map +2 -2
- package/dist/cjs/config/useAutoCalculated/useDataStructure.js.map +1 -1
- package/dist/cjs/config/useFocusTracker/useFocusActionTrackers.js +22 -44
- package/dist/cjs/config/useFocusTracker/useFocusActionTrackers.js.map +1 -1
- package/dist/cjs/config/useFocusTracker/useFocusRegionTrackers.js +10 -20
- package/dist/cjs/config/useFocusTracker/useFocusRegionTrackers.js.map +1 -1
- package/dist/cjs/parts/Dnd/DndHandle.js +2 -4
- package/dist/cjs/parts/Dnd/DndHandle.js.map +1 -1
- package/dist/cjs/parts/Dnd/DragOverlay.js.map +1 -1
- package/dist/cjs/parts/Dnd/DropIndicator.js +1 -2
- package/dist/cjs/parts/Dnd/DropIndicator.js.map +1 -1
- package/dist/cjs/parts/Header.js +1 -2
- package/dist/cjs/parts/Header.js.map +1 -1
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js +1 -2
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map +1 -1
- package/dist/cjs/parts/Item/Item.js +2 -4
- package/dist/cjs/parts/Item/Item.js.map +1 -1
- package/dist/cjs/parts/Item/ItemActions/ItemActions.js.map +1 -1
- package/dist/cjs/parts/Item/ItemMiddleSection.js +2 -4
- package/dist/cjs/parts/Item/ItemMiddleSection.js.map +1 -1
- package/dist/cjs/parts/Item/ItemOverlay.js.map +1 -1
- package/dist/cjs/parts/Item/ItemSelection.js +2 -4
- package/dist/cjs/parts/Item/ItemSelection.js.map +1 -1
- package/dist/cjs/parts/Item/TextSection.js.map +1 -1
- package/dist/cjs/parts/Item/useItemArrowNavigation.js +2 -4
- package/dist/cjs/parts/Item/useItemArrowNavigation.js.map +1 -1
- package/dist/cjs/parts/Item/useItemKeyboardSelection.js.map +1 -1
- package/dist/cjs/parts/Item/useSelectionLogic.js +5 -10
- package/dist/cjs/parts/Item/useSelectionLogic.js.map +1 -1
- package/dist/cjs/parts/MainContent.js.map +1 -1
- package/dist/cjs/parts/Panel/bottom/PanelContentBottomSection.js +3 -6
- package/dist/cjs/parts/Panel/bottom/PanelContentBottomSection.js.map +1 -1
- package/dist/cjs/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js +2 -4
- package/dist/cjs/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js.map +1 -1
- package/dist/cjs/parts/Panel/middle/ItemListWrapper/Index.js +1 -2
- package/dist/cjs/parts/Panel/middle/ItemListWrapper/Index.js.map +1 -1
- package/dist/cjs/parts/Panel/middle/PanelContentMiddleSection.js +3 -6
- package/dist/cjs/parts/Panel/middle/PanelContentMiddleSection.js.map +1 -1
- package/dist/cjs/parts/Panel/top/PanelContentTopSection.js +1 -2
- package/dist/cjs/parts/Panel/top/PanelContentTopSection.js.map +1 -1
- package/dist/cjs/parts/Panel/top/PanelFilterSection.js.map +1 -1
- package/dist/cjs/parts/Panel/top/SelectionHeader.js +2 -4
- package/dist/cjs/parts/Panel/top/SelectionHeader.js.map +1 -1
- package/dist/cjs/tests/configs/basic.js.map +1 -1
- package/dist/cjs/tests/configs/filter.js.map +1 -1
- package/dist/cjs/tests/configs/loadMore.js.map +1 -1
- package/dist/esm/DSShuttleV2.js +0 -1
- package/dist/esm/DSShuttleV2.js.map +2 -2
- package/dist/esm/config/useAutoCalculated/useDataStructure.js.map +1 -1
- package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js +22 -44
- package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js.map +1 -1
- package/dist/esm/config/useFocusTracker/useFocusRegionTrackers.js +10 -20
- package/dist/esm/config/useFocusTracker/useFocusRegionTrackers.js.map +1 -1
- package/dist/esm/parts/Dnd/DndHandle.js +2 -4
- package/dist/esm/parts/Dnd/DndHandle.js.map +1 -1
- package/dist/esm/parts/Dnd/DragOverlay.js.map +1 -1
- package/dist/esm/parts/Dnd/DropIndicator.js +1 -2
- package/dist/esm/parts/Dnd/DropIndicator.js.map +1 -1
- package/dist/esm/parts/Header.js +1 -2
- package/dist/esm/parts/Header.js.map +1 -1
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js +1 -2
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js.map +1 -1
- package/dist/esm/parts/Item/Item.js +2 -4
- package/dist/esm/parts/Item/Item.js.map +1 -1
- package/dist/esm/parts/Item/ItemActions/ItemActions.js.map +1 -1
- package/dist/esm/parts/Item/ItemMiddleSection.js +2 -4
- package/dist/esm/parts/Item/ItemMiddleSection.js.map +1 -1
- package/dist/esm/parts/Item/ItemOverlay.js.map +1 -1
- package/dist/esm/parts/Item/ItemSelection.js +2 -4
- package/dist/esm/parts/Item/ItemSelection.js.map +1 -1
- package/dist/esm/parts/Item/TextSection.js.map +1 -1
- package/dist/esm/parts/Item/useItemArrowNavigation.js +2 -4
- package/dist/esm/parts/Item/useItemArrowNavigation.js.map +1 -1
- package/dist/esm/parts/Item/useItemKeyboardSelection.js.map +1 -1
- package/dist/esm/parts/Item/useSelectionLogic.js +5 -10
- package/dist/esm/parts/Item/useSelectionLogic.js.map +1 -1
- package/dist/esm/parts/MainContent.js.map +1 -1
- package/dist/esm/parts/Panel/bottom/PanelContentBottomSection.js +3 -6
- package/dist/esm/parts/Panel/bottom/PanelContentBottomSection.js.map +1 -1
- package/dist/esm/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js +2 -4
- package/dist/esm/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js.map +1 -1
- package/dist/esm/parts/Panel/middle/ItemListWrapper/Index.js +1 -2
- package/dist/esm/parts/Panel/middle/ItemListWrapper/Index.js.map +1 -1
- package/dist/esm/parts/Panel/middle/PanelContentMiddleSection.js +3 -6
- package/dist/esm/parts/Panel/middle/PanelContentMiddleSection.js.map +1 -1
- package/dist/esm/parts/Panel/top/PanelContentTopSection.js +1 -2
- package/dist/esm/parts/Panel/top/PanelContentTopSection.js.map +1 -1
- package/dist/esm/parts/Panel/top/PanelFilterSection.js.map +1 -1
- package/dist/esm/parts/Panel/top/SelectionHeader.js +2 -4
- package/dist/esm/parts/Panel/top/SelectionHeader.js.map +1 -1
- package/dist/esm/tests/configs/basic.js.map +1 -1
- package/dist/esm/tests/configs/filter.js.map +1 -1
- package/dist/esm/tests/configs/loadMore.js.map +1 -1
- package/package.json +21 -21
|
@@ -20,10 +20,8 @@ const useItemArrowNavigation = (itemMeta) => {
|
|
|
20
20
|
e.preventDefault();
|
|
21
21
|
return;
|
|
22
22
|
}
|
|
23
|
-
if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(key))
|
|
24
|
-
|
|
25
|
-
if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(key))
|
|
26
|
-
e.stopPropagation();
|
|
23
|
+
if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(key)) e.preventDefault();
|
|
24
|
+
if (["ArrowUp", "ArrowDown", "ArrowLeft", "ArrowRight"].includes(key)) e.stopPropagation();
|
|
27
25
|
if (key === "ArrowLeft") {
|
|
28
26
|
if (hasMultipleSelection) {
|
|
29
27
|
trackFocusRegionPanelFocusMoveAll(isDestinationPanel);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/useItemArrowNavigation.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React from 'react';\nimport {\n useFocusItemTracker,\n useFocusActionTrackers,\n useFocusRegionTrackers,\n} from '../../config/useFocusTracker/index.js';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { useInternalStore } from '../../config/useStore/index.js';\n\nexport const useItemArrowNavigation = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { trackFocusRegionPanelFocusMoveAll } = useFocusRegionTrackers();\n const { trackFocusPrevItem, trackFocusNextItem, trackFocusItemReset } = useFocusItemTracker();\n const { trackFocusNextAction, trackFocusPrevAction, trackFocusActionParent, trackFocusActionReset } =\n useFocusActionTrackers();\n const { hasMultipleSelection, isDestinationPanel } = itemMeta;\n\n const getIsDragAndDropHappening = useInternalStore((state) => state.getIsDragAndDropHappening);\n\n const onItemContainerKeyDown = React.useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n (e) => {\n const { key } = e;\n const isDragAndDropHappening = getIsDragAndDropHappening();\n if (isDragAndDropHappening) {\n e.preventDefault();\n return;\n }\n // stopping prepagation it's required to avoid \"ArrowUp/ArrowDown\" to trigger parents logic\n // preventDefault it's just me thinking it's good idea when stopping propagation\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(key)) e.preventDefault();\n if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(key)) e.stopPropagation();\n if (key === 'ArrowLeft') {\n if (hasMultipleSelection) {\n trackFocusRegionPanelFocusMoveAll(isDestinationPanel);\n trackFocusItemReset();\n trackFocusActionReset();\n return;\n }\n\n trackFocusPrevAction(itemMeta);\n return;\n }\n if (key === 'ArrowRight') {\n if (hasMultipleSelection) {\n trackFocusRegionPanelFocusMoveAll(isDestinationPanel);\n trackFocusItemReset();\n trackFocusActionReset();\n return;\n }\n trackFocusNextAction(itemMeta);\n return;\n }\n if (key === 'ArrowUp') {\n trackFocusPrevItem(itemMeta);\n trackFocusActionParent();\n return;\n }\n if (key === 'ArrowDown') {\n trackFocusNextItem(itemMeta);\n trackFocusActionParent();\n return;\n }\n },\n [\n getIsDragAndDropHappening,\n hasMultipleSelection,\n trackFocusPrevAction,\n itemMeta,\n trackFocusRegionPanelFocusMoveAll,\n isDestinationPanel,\n trackFocusItemReset,\n trackFocusActionReset,\n trackFocusNextAction,\n trackFocusPrevItem,\n trackFocusActionParent,\n trackFocusNextItem,\n ],\n );\n\n return React.useMemo(() => ({ onItemContainerKeyDown }), [onItemContainerKeyDown]);\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB,OAAOA,YAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,wBAAwB;AAE1B,MAAM,yBAAyB,CAAC,aAAoC;AACzE,QAAM,EAAE,kCAAkC,IAAI,uBAAuB;AACrE,QAAM,EAAE,oBAAoB,oBAAoB,oBAAoB,IAAI,oBAAoB;AAC5F,QAAM,EAAE,sBAAsB,sBAAsB,wBAAwB,sBAAsB,IAChG,uBAAuB;AACzB,QAAM,EAAE,sBAAsB,mBAAmB,IAAI;AAErD,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAE7F,QAAM,yBAAyBA,OAAM;AAAA,IACnC,CAAC,MAAM;AACL,YAAM,EAAE,IAAI,IAAI;AAChB,YAAM,yBAAyB,0BAA0B;AACzD,UAAI,wBAAwB;AAC1B,UAAE,eAAe;AACjB;AAAA,MACF;AAGA,UAAI,CAAC,WAAW,aAAa,aAAa,YAAY,EAAE,SAAS,GAAG
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACEvB,OAAOA,YAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,wBAAwB;AAE1B,MAAM,yBAAyB,CAAC,aAAoC;AACzE,QAAM,EAAE,kCAAkC,IAAI,uBAAuB;AACrE,QAAM,EAAE,oBAAoB,oBAAoB,oBAAoB,IAAI,oBAAoB;AAC5F,QAAM,EAAE,sBAAsB,sBAAsB,wBAAwB,sBAAsB,IAChG,uBAAuB;AACzB,QAAM,EAAE,sBAAsB,mBAAmB,IAAI;AAErD,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAE7F,QAAM,yBAAyBA,OAAM;AAAA,IACnC,CAAC,MAAM;AACL,YAAM,EAAE,IAAI,IAAI;AAChB,YAAM,yBAAyB,0BAA0B;AACzD,UAAI,wBAAwB;AAC1B,UAAE,eAAe;AACjB;AAAA,MACF;AAGA,UAAI,CAAC,WAAW,aAAa,aAAa,YAAY,EAAE,SAAS,GAAG,EAAG,GAAE,eAAe;AACxF,UAAI,CAAC,WAAW,aAAa,aAAa,YAAY,EAAE,SAAS,GAAG,EAAG,GAAE,gBAAgB;AACzF,UAAI,QAAQ,aAAa;AACvB,YAAI,sBAAsB;AACxB,4CAAkC,kBAAkB;AACpD,8BAAoB;AACpB,gCAAsB;AACtB;AAAA,QACF;AAEA,6BAAqB,QAAQ;AAC7B;AAAA,MACF;AACA,UAAI,QAAQ,cAAc;AACxB,YAAI,sBAAsB;AACxB,4CAAkC,kBAAkB;AACpD,8BAAoB;AACpB,gCAAsB;AACtB;AAAA,QACF;AACA,6BAAqB,QAAQ;AAC7B;AAAA,MACF;AACA,UAAI,QAAQ,WAAW;AACrB,2BAAmB,QAAQ;AAC3B,+BAAuB;AACvB;AAAA,MACF;AACA,UAAI,QAAQ,aAAa;AACvB,2BAAmB,QAAQ;AAC3B,+BAAuB;AACvB;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAOA,OAAM,QAAQ,OAAO,EAAE,uBAAuB,IAAI,CAAC,sBAAsB,CAAC;AACnF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/useItemKeyboardSelection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { useInternalStore } from '../../config/useStore/index.js';\nimport { useSelectionLogic } from './useSelectionLogic.js';\n\nexport const useItemKeyboardSelection = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { datumInternalMeta } = itemMeta;\n const { hydratedId } = datumInternalMeta;\n const { selectItem } = useSelectionLogic(itemMeta);\n const getIsDragAndDropHappening = useInternalStore((state) => state.getIsDragAndDropHappening);\n const onItemKeyDownSelection = React.useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n const { key } = event;\n\n // Spacebar AND ' ' are cross-browser compatibility thing\n if (['Spacebar', ' ', 'Enter'].includes(key)) {\n // we need to invoke \"getIsDragAndDropHappening\" here to ensure we have the latest info at the moment of the event\n const isDragNDroping = getIsDragAndDropHappening();\n if (isDragNDroping || (event.target as HTMLElement).id === `${hydratedId}-drag-handle`) {\n event.preventDefault();\n return;\n }\n event.preventDefault();\n event.stopPropagation();\n selectItem(event);\n }\n },\n [getIsDragAndDropHappening, hydratedId, selectItem],\n );\n return React.useMemo(() => ({ onItemKeyDownSelection }), [onItemKeyDownSelection]);\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAElB,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAE3B,MAAM,2BAA2B,CAAC,aAAoC;AAC3E,QAAM,EAAE,kBAAkB,IAAI;AAC9B,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,EAAE,WAAW,IAAI,kBAAkB,QAAQ;AACjD,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAC7F,QAAM,yBAAyBA,OAAM;AAAA,IACnC,CAAC,UAAU;AACT,YAAM,EAAE,IAAI,IAAI;AAGhB,UAAI,CAAC,YAAY,KAAK,OAAO,EAAE,SAAS,GAAG,GAAG;AAE5C,cAAM,iBAAiB,0BAA0B;AACjD,YAAI,kBAAmB,MAAM,OAAuB,OAAO,GAAG,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAElB,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAE3B,MAAM,2BAA2B,CAAC,aAAoC;AAC3E,QAAM,EAAE,kBAAkB,IAAI;AAC9B,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,EAAE,WAAW,IAAI,kBAAkB,QAAQ;AACjD,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAC7F,QAAM,yBAAyBA,OAAM;AAAA,IACnC,CAAC,UAAU;AACT,YAAM,EAAE,IAAI,IAAI;AAGhB,UAAI,CAAC,YAAY,KAAK,OAAO,EAAE,SAAS,GAAG,GAAG;AAE5C,cAAM,iBAAiB,0BAA0B;AACjD,YAAI,kBAAmB,MAAM,OAAuB,OAAO,GAAG,UAAU,gBAAgB;AACtF,gBAAM,eAAe;AACrB;AAAA,QACF;AACA,cAAM,eAAe;AACrB,cAAM,gBAAgB;AACtB,mBAAW,KAAK;AAAA,MAClB;AAAA,IACF;AAAA,IACA,CAAC,2BAA2B,YAAY,UAAU;AAAA,EACpD;AACA,SAAOA,OAAM,QAAQ,OAAO,EAAE,uBAAuB,IAAI,CAAC,sBAAsB,CAAC;AACnF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -44,21 +44,17 @@ const useSelectionLogic = ({
|
|
|
44
44
|
shiftSelectedIdsArray.forEach((id) => {
|
|
45
45
|
allSelected[id] = true;
|
|
46
46
|
allDeSelected[id] = false;
|
|
47
|
-
if (panelSelectedItems[id] !== true)
|
|
48
|
-
shouldShiftDeSelect = false;
|
|
47
|
+
if (panelSelectedItems[id] !== true) shouldShiftDeSelect = false;
|
|
49
48
|
});
|
|
50
|
-
if (shouldShiftDeSelect)
|
|
51
|
-
|
|
52
|
-
else
|
|
53
|
-
newSelection = { ...panelSelectedItems, ...allSelected };
|
|
49
|
+
if (shouldShiftDeSelect) newSelection = { ...panelSelectedItems, ...allDeSelected };
|
|
50
|
+
else newSelection = { ...panelSelectedItems, ...allSelected };
|
|
54
51
|
}
|
|
55
52
|
} else {
|
|
56
53
|
newSelection = { ...panelSelectedItems };
|
|
57
54
|
const isAddition = newSelection[hydratedId] !== true;
|
|
58
55
|
if (isAddition) {
|
|
59
56
|
newSelection[hydratedId] = true;
|
|
60
|
-
} else
|
|
61
|
-
delete newSelection[hydratedId];
|
|
57
|
+
} else delete newSelection[hydratedId];
|
|
62
58
|
}
|
|
63
59
|
setPanelLastSelectedItem(hydratedId);
|
|
64
60
|
onSelectionChange(newSelection, { event, item: datum });
|
|
@@ -84,8 +80,7 @@ const useSelectionLogic = ({
|
|
|
84
80
|
);
|
|
85
81
|
const onShiftMouseDownPreventTextSelection = React2.useCallback((event) => {
|
|
86
82
|
const { shiftKey } = event;
|
|
87
|
-
if (shiftKey)
|
|
88
|
-
event.preventDefault();
|
|
83
|
+
if (shiftKey) event.preventDefault();
|
|
89
84
|
}, []);
|
|
90
85
|
return React2.useMemo(
|
|
91
86
|
() => ({ selectItem, onShiftMouseDownPreventTextSelection }),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/useSelectionLogic.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport React from 'react';\nimport { useInternalStore, usePropsStore } from '../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { useFocusItemTracker, useFocusActionTrackers, useFocusTracker } from '../../config/useFocusTracker/index.js';\nexport const useSelectionLogic = ({\n isDestinationPanel,\n datumInternalMeta,\n datum,\n datumRenderFlags,\n}: DSShuttleV2T.ItemMeta) => {\n const { trackFocusItem } = useFocusItemTracker();\n const { trackFocusActionParent } = useFocusActionTrackers();\n const { trackFocusRegionPanelItem } = useFocusTracker();\n\n const getPanelLastSelectedItem = useInternalStore((store) => store.getPanelLastSelectedItem);\n const setPanelLastSelectedItem = useInternalStore((store) =>\n isDestinationPanel ? store.setDestinationPanelLastSelectedItem : store.setSourcePanelLastSelectedItem,\n );\n\n const panelSelectionableDataIds = usePropsStore((store) =>\n isDestinationPanel ? store.destinationSelectionableDataIds : store.sourceSelectionableDataIds,\n );\n\n const onSelectionChange = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange,\n );\n const panelSelectedItems = usePropsStore((state) =>\n isDestinationPanel ? state.destinationSelectedItems : state.sourceSelectedItems,\n );\n const selectItem = React.useCallback(\n (event: React.KeyboardEvent<HTMLDivElement> | React.MouseEvent<HTMLDivElement | HTMLButtonElement>) => {\n const { selectionPrevented } = datumRenderFlags;\n const { hydratedId } = datumInternalMeta;\n const { shiftKey } = event;\n const lastSelectedItem = getPanelLastSelectedItem(isDestinationPanel);\n if (!selectionPrevented) {\n let newSelection: Record<string, boolean> = {};\n // shift select logic\n if (shiftKey && lastSelectedItem) {\n const startSelIndx = panelSelectionableDataIds.findIndex((id) => id === lastSelectedItem);\n const endSelIndx = panelSelectionableDataIds.findIndex((id) => id === hydratedId);\n if (startSelIndx !== -1 && endSelIndx !== -1) {\n const ordererIndexes = [startSelIndx, endSelIndx].sort();\n const shiftSelectedIdsArray = panelSelectionableDataIds.slice(ordererIndexes[0], ordererIndexes[1] + 1);\n let shouldShiftDeSelect = true;\n // I track both \"all Select\"/\"all unselect\" so I can \".forEach\" only once and apply either version after\n const allSelected: Record<string, boolean> = {};\n const allDeSelected: Record<string, boolean> = {};\n shiftSelectedIdsArray.forEach((id) => {\n allSelected[id] = true;\n allDeSelected[id] = false;\n // if anything inside the shift-select was not selected, shift-select will \"select\"\n if (panelSelectedItems[id] !== true) shouldShiftDeSelect = false;\n });\n if (shouldShiftDeSelect) newSelection = { ...panelSelectedItems, ...allDeSelected };\n else newSelection = { ...panelSelectedItems, ...allSelected };\n }\n } else {\n // single selection logic\n newSelection = { ...panelSelectedItems };\n const isAddition = newSelection[hydratedId] !== true;\n if (isAddition) {\n newSelection[hydratedId] = true;\n } else delete newSelection[hydratedId];\n }\n // we track the item for \"shift select\" purposes\n // this must happen AFTER shift select logic!\n setPanelLastSelectedItem(hydratedId);\n onSelectionChange(newSelection, { event, item: datum });\n }\n // focus tracking logic\n trackFocusRegionPanelItem(isDestinationPanel);\n trackFocusItem({ original: datum, ...datumInternalMeta });\n trackFocusActionParent();\n },\n [\n datum,\n datumInternalMeta,\n datumRenderFlags,\n getPanelLastSelectedItem,\n isDestinationPanel,\n onSelectionChange,\n panelSelectedItems,\n panelSelectionableDataIds,\n setPanelLastSelectedItem,\n trackFocusActionParent,\n trackFocusItem,\n trackFocusRegionPanelItem,\n ],\n );\n\n const onShiftMouseDownPreventTextSelection = React.useCallback((event: React.MouseEvent<HTMLDivElement>) => {\n const { shiftKey } = event;\n if (shiftKey) event.preventDefault();\n }, []);\n return React.useMemo(\n () => ({ selectItem, onShiftMouseDownPreventTextSelection }),\n [selectItem, onShiftMouseDownPreventTextSelection],\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,OAAOA,YAAW;AAClB,SAAS,kBAAkB,qBAAqB;AAEhD,SAAS,qBAAqB,wBAAwB,uBAAuB;AACtE,MAAM,oBAAoB,CAAC;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAA6B;AAC3B,QAAM,EAAE,eAAe,IAAI,oBAAoB;AAC/C,QAAM,EAAE,uBAAuB,IAAI,uBAAuB;AAC1D,QAAM,EAAE,0BAA0B,IAAI,gBAAgB;AAEtD,QAAM,2BAA2B,iBAAiB,CAAC,UAAU,MAAM,wBAAwB;AAC3F,QAAM,2BAA2B;AAAA,IAAiB,CAAC,UACjD,qBAAqB,MAAM,sCAAsC,MAAM;AAAA,EACzE;AAEA,QAAM,4BAA4B;AAAA,IAAc,CAAC,UAC/C,qBAAqB,MAAM,kCAAkC,MAAM;AAAA,EACrE;AAEA,QAAM,oBAAoB;AAAA,IAAc,CAAC,UACvC,qBAAqB,MAAM,+BAA+B,MAAM;AAAA,EAClE;AACA,QAAM,qBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,aAAaA,OAAM;AAAA,IACvB,CAAC,UAAsG;AACrG,YAAM,EAAE,mBAAmB,IAAI;AAC/B,YAAM,EAAE,WAAW,IAAI;AACvB,YAAM,EAAE,SAAS,IAAI;AACrB,YAAM,mBAAmB,yBAAyB,kBAAkB;AACpE,UAAI,CAAC,oBAAoB;AACvB,YAAI,eAAwC,CAAC;AAE7C,YAAI,YAAY,kBAAkB;AAChC,gBAAM,eAAe,0BAA0B,UAAU,CAAC,OAAO,OAAO,gBAAgB;AACxF,gBAAM,aAAa,0BAA0B,UAAU,CAAC,OAAO,OAAO,UAAU;AAChF,cAAI,iBAAiB,MAAM,eAAe,IAAI;AAC5C,kBAAM,iBAAiB,CAAC,cAAc,UAAU,EAAE,KAAK;AACvD,kBAAM,wBAAwB,0BAA0B,MAAM,eAAe,CAAC,GAAG,eAAe,CAAC,IAAI,CAAC;AACtG,gBAAI,sBAAsB;AAE1B,kBAAM,cAAuC,CAAC;AAC9C,kBAAM,gBAAyC,CAAC;AAChD,kCAAsB,QAAQ,CAAC,OAAO;AACpC,0BAAY,EAAE,IAAI;AAClB,4BAAc,EAAE,IAAI;AAEpB,kBAAI,mBAAmB,EAAE,MAAM
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/MainContent.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { useFontSizeDetector } from '@elliemae/ds-hooks-fontsize-detector';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useOnBlurOut } from '@elliemae/ds-utilities';\nimport { PanelWrapper } from './PanelWrapper.js';\nimport { usePropsStore } from '../config/useStore/index.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../config/DSShuttleV2Definitions.js';\nimport { useFocusTracker } from '../config/useFocusTracker/index.js';\n\nconst StyledWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.WRAPPER })``;\n\nconst layoutWithSmallFont = {\n cols: { small: ['auto'], medium: ['1fr', '1fr'] },\n rows: { small: ['1fr', '1fr'], medium: ['auto'] },\n};\nconst layoutWithBigFont = {\n cols: ['auto'],\n rows: ['1fr', '1fr'],\n};\n\ntype ResizeObserverConstructorEntries = Parameters<ConstructorParameters<typeof ResizeObserver>[0]>[0];\n\nconst useResizeObserver = (ref: HTMLElement | null | undefined) => {\n const [dimensions, setDimensions] = React.useState<number>(0);\n\n React.useEffect(() => {\n if (ref) {\n const observeTarget = ref;\n const resizeObserver = new ResizeObserver((entries: ResizeObserverConstructorEntries) => {\n entries.forEach((entry) => {\n setDimensions(Math.ceil(entry.contentRect.height));\n });\n });\n resizeObserver.observe(observeTarget);\n\n return () => {\n resizeObserver.unobserve(observeTarget);\n };\n }\n }, [ref]);\n return dimensions;\n};\n\n// this custom hook will return the font size of the font detector element\n\nexport const MainContent = React.memo(() => {\n const { trackFocusRegionReset, trackFocusItemReset, trackFocusActionReset } = useFocusTracker();\n const config = React.useMemo(\n () => ({\n onBlur: () => {\n trackFocusRegionReset();\n trackFocusItemReset();\n trackFocusActionReset();\n },\n }),\n [trackFocusActionReset, trackFocusItemReset, trackFocusRegionReset],\n );\n const handleOnBlurOut = useOnBlurOut(config);\n const destinationHasMultipleSelectedItems = usePropsStore((store) => store.destinationHasMultipleSelectedItems);\n const sourceHasMultipleSelectedItems = usePropsStore((store) => store.sourceHasMultipleSelectedItems);\n const getOwnerProps = usePropsStore((store) => store.get);\n\n const metaInfo = useFontSizeDetector();\n\n const colsAndRowsLayout = useMemo(() => {\n if (metaInfo.isLarge) {\n return layoutWithBigFont;\n } else {\n return layoutWithSmallFont;\n }\n }, [metaInfo]);\n\n const [ref, setRef] = React.useState<HTMLDivElement | null>();\n const parentNode = ref?.parentNode as HTMLElement | null | undefined;\n const height = useResizeObserver(parentNode);\n const finalHeight = height !== 0 ? height : 208;\n return (\n <StyledWrapper\n gutter=\"xs\"\n onBlur={handleOnBlurOut}\n {...colsAndRowsLayout}\n getOwnerProps={getOwnerProps}\n style={{ height: `${finalHeight}px` }}\n innerRef={setRef}\n >\n <PanelWrapper isDestinationPanel={false} hasMultipleSelection={sourceHasMultipleSelectedItems} />\n <PanelWrapper isDestinationPanel hasMultipleSelection={destinationHasMultipleSelectedItems} />\n </StyledWrapper>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC8EnB,SAQE,KARF;AA9EJ,OAAOA,UAAS,eAAe;AAC/B,SAAS,2BAA2B;AACpC,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,uBAAuB;AAEhC,MAAM,gBAAgB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,QAAQ,CAAC;AAE5F,MAAM,sBAAsB;AAAA,EAC1B,MAAM,EAAE,OAAO,CAAC,MAAM,GAAG,QAAQ,CAAC,OAAO,KAAK,EAAE;AAAA,EAChD,MAAM,EAAE,OAAO,CAAC,OAAO,KAAK,GAAG,QAAQ,CAAC,MAAM,EAAE;AAClD;AACA,MAAM,oBAAoB;AAAA,EACxB,MAAM,CAAC,MAAM;AAAA,EACb,MAAM,CAAC,OAAO,KAAK;AACrB;AAIA,MAAM,oBAAoB,CAAC,QAAwC;AACjE,QAAM,CAAC,YAAY,aAAa,IAAIA,OAAM,SAAiB,CAAC;AAE5D,EAAAA,OAAM,UAAU,MAAM;AACpB,QAAI,KAAK;AACP,YAAM,gBAAgB;AACtB,YAAM,iBAAiB,IAAI,eAAe,CAAC,YAA8C;AACvF,gBAAQ,QAAQ,CAAC,UAAU;AACzB,wBAAc,KAAK,KAAK,MAAM,YAAY,MAAM,CAAC;AAAA,QACnD,CAAC;AAAA,MACH,CAAC;AACD,qBAAe,QAAQ,aAAa;AAEpC,aAAO,MAAM;AACX,uBAAe,UAAU,aAAa;AAAA,MACxC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACR,SAAO;AACT;AAIO,MAAM,cAAcA,OAAM,KAAK,MAAM;AAC1C,QAAM,EAAE,uBAAuB,qBAAqB,sBAAsB,IAAI,gBAAgB;AAC9F,QAAM,SAASA,OAAM;AAAA,IACnB,OAAO;AAAA,MACL,QAAQ,MAAM;AACZ,8BAAsB;AACtB,4BAAoB;AACpB,8BAAsB;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,uBAAuB,qBAAqB,qBAAqB;AAAA,EACpE;AACA,QAAM,kBAAkB,aAAa,MAAM;AAC3C,QAAM,sCAAsC,cAAc,CAAC,UAAU,MAAM,mCAAmC;AAC9G,QAAM,iCAAiC,cAAc,CAAC,UAAU,MAAM,8BAA8B;AACpG,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,WAAW,oBAAoB;AAErC,QAAM,oBAAoB,QAAQ,MAAM;AACtC,QAAI,SAAS,SAAS;AACpB,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,CAAC,KAAK,MAAM,IAAIA,OAAM,SAAgC;AAC5D,QAAM,aAAa,KAAK;AACxB,QAAM,SAAS,kBAAkB,UAAU;AAC3C,QAAM,cAAc,WAAW,IAAI,SAAS;AAC5C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,QAAQ;AAAA,MACP,GAAG;AAAA,MACJ;AAAA,MACA,OAAO,EAAE,QAAQ,GAAG,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC8EnB,SAQE,KARF;AA9EJ,OAAOA,UAAS,eAAe;AAC/B,SAAS,2BAA2B;AACpC,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAC9B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,uBAAuB;AAEhC,MAAM,gBAAgB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,QAAQ,CAAC;AAE5F,MAAM,sBAAsB;AAAA,EAC1B,MAAM,EAAE,OAAO,CAAC,MAAM,GAAG,QAAQ,CAAC,OAAO,KAAK,EAAE;AAAA,EAChD,MAAM,EAAE,OAAO,CAAC,OAAO,KAAK,GAAG,QAAQ,CAAC,MAAM,EAAE;AAClD;AACA,MAAM,oBAAoB;AAAA,EACxB,MAAM,CAAC,MAAM;AAAA,EACb,MAAM,CAAC,OAAO,KAAK;AACrB;AAIA,MAAM,oBAAoB,CAAC,QAAwC;AACjE,QAAM,CAAC,YAAY,aAAa,IAAIA,OAAM,SAAiB,CAAC;AAE5D,EAAAA,OAAM,UAAU,MAAM;AACpB,QAAI,KAAK;AACP,YAAM,gBAAgB;AACtB,YAAM,iBAAiB,IAAI,eAAe,CAAC,YAA8C;AACvF,gBAAQ,QAAQ,CAAC,UAAU;AACzB,wBAAc,KAAK,KAAK,MAAM,YAAY,MAAM,CAAC;AAAA,QACnD,CAAC;AAAA,MACH,CAAC;AACD,qBAAe,QAAQ,aAAa;AAEpC,aAAO,MAAM;AACX,uBAAe,UAAU,aAAa;AAAA,MACxC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACR,SAAO;AACT;AAIO,MAAM,cAAcA,OAAM,KAAK,MAAM;AAC1C,QAAM,EAAE,uBAAuB,qBAAqB,sBAAsB,IAAI,gBAAgB;AAC9F,QAAM,SAASA,OAAM;AAAA,IACnB,OAAO;AAAA,MACL,QAAQ,MAAM;AACZ,8BAAsB;AACtB,4BAAoB;AACpB,8BAAsB;AAAA,MACxB;AAAA,IACF;AAAA,IACA,CAAC,uBAAuB,qBAAqB,qBAAqB;AAAA,EACpE;AACA,QAAM,kBAAkB,aAAa,MAAM;AAC3C,QAAM,sCAAsC,cAAc,CAAC,UAAU,MAAM,mCAAmC;AAC9G,QAAM,iCAAiC,cAAc,CAAC,UAAU,MAAM,8BAA8B;AACpG,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,WAAW,oBAAoB;AAErC,QAAM,oBAAoB,QAAQ,MAAM;AACtC,QAAI,SAAS,SAAS;AACpB,aAAO;AAAA,IACT,OAAO;AACL,aAAO;AAAA,IACT;AAAA,EACF,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,CAAC,KAAK,MAAM,IAAIA,OAAM,SAAgC;AAC5D,QAAM,aAAa,KAAK;AACxB,QAAM,SAAS,kBAAkB,UAAU;AAC3C,QAAM,cAAc,WAAW,IAAI,SAAS;AAC5C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,QAAO;AAAA,MACP,QAAQ;AAAA,MACP,GAAG;AAAA,MACJ;AAAA,MACA,OAAO,EAAE,QAAQ,GAAG,WAAW,KAAK;AAAA,MACpC,UAAU;AAAA,MAEV;AAAA,4BAAC,gBAAa,oBAAoB,OAAO,sBAAsB,gCAAgC;AAAA,QAC/F,oBAAC,gBAAa,oBAAkB,MAAC,sBAAsB,qCAAqC;AAAA;AAAA;AAAA,EAC9F;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -25,10 +25,8 @@ const PanelContentBottomSection = React2.memo((panelMetaInfo) => {
|
|
|
25
25
|
const { trackFocusRegionBottom, trackFocusLoadMoreBtn, trackFocusLoadMoreBtnDestination, trackFocusActionReset } = useFocusTracker();
|
|
26
26
|
const onBottomSectionFocus = React2.useCallback(() => {
|
|
27
27
|
trackFocusRegionBottom(isDestinationPanel);
|
|
28
|
-
if (isDestinationPanel)
|
|
29
|
-
|
|
30
|
-
else
|
|
31
|
-
trackFocusLoadMoreBtn();
|
|
28
|
+
if (isDestinationPanel) trackFocusLoadMoreBtnDestination();
|
|
29
|
+
else trackFocusLoadMoreBtn();
|
|
32
30
|
trackFocusActionReset();
|
|
33
31
|
}, [
|
|
34
32
|
isDestinationPanel,
|
|
@@ -43,8 +41,7 @@ const PanelContentBottomSection = React2.memo((panelMetaInfo) => {
|
|
|
43
41
|
const { onLoadMoreButtonKeyDown } = useLoadMoreBtnArrowNavigation(panelMetaInfo);
|
|
44
42
|
const getOwnerProps = usePropsStore((store) => store.get);
|
|
45
43
|
const getOwnerPropsArguments = React2.useCallback(() => panelMetaInfo, [panelMetaInfo]);
|
|
46
|
-
if (shouldNotTakeSpace)
|
|
47
|
-
return /* @__PURE__ */ jsx("div", {});
|
|
44
|
+
if (shouldNotTakeSpace) return /* @__PURE__ */ jsx("div", {});
|
|
48
45
|
return /* @__PURE__ */ jsxs(
|
|
49
46
|
StyledListWrapperBottom,
|
|
50
47
|
{
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Panel/bottom/PanelContentBottomSection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable no-unused-vars */\n/* eslint-disable @typescript-eslint/no-unused-vars */\nimport React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useFocusTracker } from '../../../config/useFocusTracker/index.js';\nimport { usePropsStore } from '../../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { LoadMoreBtn } from './LoadMoreBtn.js';\nimport { LoadingMore } from './LoadingMore.js';\nimport { useLoadMoreBtnArrowNavigation } from './useLoadMoreBtnArrowNavigation.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../config/DSShuttleV2Definitions.js';\n\nconst StyledListWrapperBottom = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.LIST_WRAPPER_BOTTOM })`\n min-height: 2.769rem;\n border-top: 1px solid neutral-400;\n`;\nconst wrapperColsRows = ['1fr'];\n\nexport const PanelContentBottomSection = React.memo((panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const { isDestinationPanel = false } = panelMetaInfo;\n\n const withLoadMore = usePropsStore((state) =>\n isDestinationPanel ? state.destinationWithLoadMore : state.sourceWithLoadMore,\n );\n const isLoadingMore = usePropsStore((state) =>\n isDestinationPanel ? state.destinationIsLoadingMore : state.sourceIsLoadingMore,\n );\n const { trackFocusRegionBottom, trackFocusLoadMoreBtn, trackFocusLoadMoreBtnDestination, trackFocusActionReset } =\n useFocusTracker();\n const onBottomSectionFocus = React.useCallback(() => {\n trackFocusRegionBottom(isDestinationPanel);\n if (isDestinationPanel) trackFocusLoadMoreBtnDestination();\n else trackFocusLoadMoreBtn();\n trackFocusActionReset();\n }, [\n isDestinationPanel,\n trackFocusActionReset,\n trackFocusLoadMoreBtn,\n trackFocusLoadMoreBtnDestination,\n trackFocusRegionBottom,\n ]);\n\n // this 3 booleans MUST be auto-exclusives with each other\n const shouldDisplayLoadingMore = isLoadingMore;\n const shouldDisplayLoadMoreBtn = withLoadMore && !isLoadingMore;\n const shouldNotTakeSpace = !withLoadMore && !isLoadingMore;\n const { onLoadMoreButtonKeyDown } = useLoadMoreBtnArrowNavigation(panelMetaInfo);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n if (shouldNotTakeSpace) return <div />;\n return (\n <StyledListWrapperBottom\n cols={wrapperColsRows}\n rows={wrapperColsRows}\n onFocus={onBottomSectionFocus}\n onKeyDown={onLoadMoreButtonKeyDown}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {shouldDisplayLoadingMore ? <LoadingMore {...panelMetaInfo} /> : null}\n {shouldDisplayLoadMoreBtn ? <LoadMoreBtn {...panelMetaInfo} /> : null}\n </StyledListWrapperBottom>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACoDU,cAE7B,YAF6B;AAlDjC,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,qCAAqC;AAC9C,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,0BAA0B,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAIlH,MAAM,kBAAkB,CAAC,KAAK;AAEvB,MAAM,4BAA4BA,OAAM,KAAK,CAAC,kBAA8C;AACjG,QAAM,EAAE,qBAAqB,MAAM,IAAI;AAEvC,QAAM,eAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,0BAA0B,MAAM;AAAA,EAC7D;AACA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,uBAAuB,kCAAkC,sBAAsB,IAC7G,gBAAgB;AAClB,QAAM,uBAAuBA,OAAM,YAAY,MAAM;AACnD,2BAAuB,kBAAkB;AACzC,QAAI
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACoDU,cAE7B,YAF6B;AAlDjC,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,uBAAuB;AAChC,SAAS,qBAAqB;AAE9B,SAAS,mBAAmB;AAC5B,SAAS,mBAAmB;AAC5B,SAAS,qCAAqC;AAC9C,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,0BAA0B,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAIlH,MAAM,kBAAkB,CAAC,KAAK;AAEvB,MAAM,4BAA4BA,OAAM,KAAK,CAAC,kBAA8C;AACjG,QAAM,EAAE,qBAAqB,MAAM,IAAI;AAEvC,QAAM,eAAe;AAAA,IAAc,CAAC,UAClC,qBAAqB,MAAM,0BAA0B,MAAM;AAAA,EAC7D;AACA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,uBAAuB,kCAAkC,sBAAsB,IAC7G,gBAAgB;AAClB,QAAM,uBAAuBA,OAAM,YAAY,MAAM;AACnD,2BAAuB,kBAAkB;AACzC,QAAI,mBAAoB,kCAAiC;AAAA,QACpD,uBAAsB;AAC3B,0BAAsB;AAAA,EACxB,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAGD,QAAM,2BAA2B;AACjC,QAAM,2BAA2B,gBAAgB,CAAC;AAClD,QAAM,qBAAqB,CAAC,gBAAgB,CAAC;AAC7C,QAAM,EAAE,wBAAwB,IAAI,8BAA8B,aAAa;AAE/E,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAErF,MAAI,mBAAoB,QAAO,oBAAC,SAAI;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MAEC;AAAA,mCAA2B,oBAAC,eAAa,GAAG,eAAe,IAAK;AAAA,QAChE,2BAA2B,oBAAC,eAAa,GAAG,eAAe,IAAK;AAAA;AAAA;AAAA,EACnE;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -19,10 +19,8 @@ const useLoadMoreBtnArrowNavigation = (panelMetaInfo) => {
|
|
|
19
19
|
e.preventDefault();
|
|
20
20
|
return;
|
|
21
21
|
}
|
|
22
|
-
if (["ArrowUp", "ArrowDown"].includes(key))
|
|
23
|
-
|
|
24
|
-
if (["ArrowUp", "ArrowDown"].includes(key))
|
|
25
|
-
e.stopPropagation();
|
|
22
|
+
if (["ArrowUp", "ArrowDown"].includes(key)) e.preventDefault();
|
|
23
|
+
if (["ArrowUp", "ArrowDown"].includes(key)) e.stopPropagation();
|
|
26
24
|
if (key === "ArrowUp") {
|
|
27
25
|
trackFocusRegionPanelItem(panelMetaInfo.isDestinationPanel);
|
|
28
26
|
trackFocusNextItem(panelMetaInfo);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport {\n useFocusItemTracker,\n useFocusActionTrackers,\n useFocusRegionTrackers,\n} from '../../../config/useFocusTracker/index.js';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { useInternalStore } from '../../../config/useStore/index.js';\n\nexport const useLoadMoreBtnArrowNavigation = (panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const { trackFocusPrevItem, trackFocusNextItem } = useFocusItemTracker();\n const { trackFocusActionParent } = useFocusActionTrackers();\n const { trackFocusRegionPanelItem } = useFocusRegionTrackers();\n const getIsDragAndDropHappening = useInternalStore((state) => state.getIsDragAndDropHappening);\n\n const onLoadMoreButtonKeyDown = React.useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n (e) => {\n const { key } = e;\n // we need to invoke \"getIsDragAndDropHappening\" here to ensure we have the latest info at the moment of the event\n const isDragAndDropHappening = getIsDragAndDropHappening();\n if (isDragAndDropHappening) {\n e.preventDefault();\n return;\n }\n // stopping prepagation it's required to avoid \"ArrowUp/ArrowDown\" to trigger parents logic\n // preventDefault it's just me thinking it's good idea when stopping propagation\n if (['ArrowUp', 'ArrowDown'].includes(key)) e.preventDefault();\n if (['ArrowUp', 'ArrowDown'].includes(key)) e.stopPropagation();\n\n // =============================================================================\n // THIS IS NOT LIKE /src/parts/Item/useItemArrowNavigation.tsx\n // THIS IS INVERTED BY DESIGN AND DESIRED TO BE INVERTED\n // =============================================================================\n // load-more-btn -> last element\n if (key === 'ArrowUp') {\n trackFocusRegionPanelItem(panelMetaInfo.isDestinationPanel);\n trackFocusNextItem(panelMetaInfo); // this results in \"Last\" element of the list\n trackFocusActionParent();\n }\n // load-more-btn -> first element\n if (key === 'ArrowDown') {\n trackFocusRegionPanelItem(panelMetaInfo.isDestinationPanel);\n trackFocusPrevItem(panelMetaInfo); // this results in \"First\" element of the list\n trackFocusActionParent();\n }\n },\n [\n getIsDragAndDropHappening,\n trackFocusRegionPanelItem,\n panelMetaInfo,\n trackFocusNextItem,\n trackFocusActionParent,\n trackFocusPrevItem,\n ],\n );\n\n return React.useMemo(() => ({ onLoadMoreButtonKeyDown }), [onLoadMoreButtonKeyDown]);\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,wBAAwB;AAE1B,MAAM,gCAAgC,CAAC,kBAA8C;AAC1F,QAAM,EAAE,oBAAoB,mBAAmB,IAAI,oBAAoB;AACvE,QAAM,EAAE,uBAAuB,IAAI,uBAAuB;AAC1D,QAAM,EAAE,0BAA0B,IAAI,uBAAuB;AAC7D,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAE7F,QAAM,0BAA0BA,OAAM;AAAA,IACpC,CAAC,MAAM;AACL,YAAM,EAAE,IAAI,IAAI;AAEhB,YAAM,yBAAyB,0BAA0B;AACzD,UAAI,wBAAwB;AAC1B,UAAE,eAAe;AACjB;AAAA,MACF;AAGA,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,GAAG
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,OAAOA,YAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,wBAAwB;AAE1B,MAAM,gCAAgC,CAAC,kBAA8C;AAC1F,QAAM,EAAE,oBAAoB,mBAAmB,IAAI,oBAAoB;AACvE,QAAM,EAAE,uBAAuB,IAAI,uBAAuB;AAC1D,QAAM,EAAE,0BAA0B,IAAI,uBAAuB;AAC7D,QAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAE7F,QAAM,0BAA0BA,OAAM;AAAA,IACpC,CAAC,MAAM;AACL,YAAM,EAAE,IAAI,IAAI;AAEhB,YAAM,yBAAyB,0BAA0B;AACzD,UAAI,wBAAwB;AAC1B,UAAE,eAAe;AACjB;AAAA,MACF;AAGA,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,GAAG,EAAG,GAAE,eAAe;AAC7D,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,GAAG,EAAG,GAAE,gBAAgB;AAO9D,UAAI,QAAQ,WAAW;AACrB,kCAA0B,cAAc,kBAAkB;AAC1D,2BAAmB,aAAa;AAChC,+BAAuB;AAAA,MACzB;AAEA,UAAI,QAAQ,aAAa;AACvB,kCAA0B,cAAc,kBAAkB;AAC1D,2BAAmB,aAAa;AAChC,+BAAuB;AAAA,MACzB;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,SAAOA,OAAM,QAAQ,OAAO,EAAE,wBAAwB,IAAI,CAAC,uBAAuB,CAAC;AACrF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -15,8 +15,7 @@ const StyledItemsWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttle
|
|
|
15
15
|
`;
|
|
16
16
|
const ItemRenderer = ({ index, extraItemProps }) => {
|
|
17
17
|
const { itemList, getDatumHydratables, panelMetaInfo, withDragNDrop = false } = extraItemProps || {};
|
|
18
|
-
if (!itemList || !getDatumHydratables || !panelMetaInfo)
|
|
19
|
-
return null;
|
|
18
|
+
if (!itemList || !getDatumHydratables || !panelMetaInfo) return null;
|
|
20
19
|
const item = itemList[index];
|
|
21
20
|
const { original: datum, ...datumInternalMeta } = item;
|
|
22
21
|
const datumHydratables = getDatumHydratables(item);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../../src/parts/Panel/middle/ItemListWrapper/Index.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\nimport React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSFastList } from '@elliemae/ds-fast-list';\nimport { styled } from '@elliemae/ds-system';\nimport { usePropsStore } from '../../../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../../../react-desc-prop-types.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../../config/DSShuttleV2Definitions.js';\nimport { ItemSortable } from '../../../Item/Item.js';\nimport { withConditionalDnDRowContext } from '../../../HoC/withConditionalDnDRowContext.js';\nimport { useGetDatumHydratables } from './useGetDatumHydratables.js';\nimport { getDatumFlags } from './getDatumFlags.js';\n\ninterface ItemRendererT {\n extraItemProps?: {\n itemList: DSShuttleV2T.ConfiguredDatum[];\n getDatumHydratables: ReturnType<typeof useGetDatumHydratables>;\n panelMetaInfo: DSShuttleV2T.PanelMetaInfo;\n withDragNDrop: boolean;\n };\n index: number;\n}\nconst StyledItemsWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEMS_WRAPPER })`\n position: relative;\n`;\n\nconst ItemRenderer = ({ index, extraItemProps }: ItemRendererT) => {\n const { itemList, getDatumHydratables, panelMetaInfo, withDragNDrop = false } = extraItemProps || {};\n if (!itemList || !getDatumHydratables || !panelMetaInfo) return null;\n const item = itemList[index];\n const { original: datum, ...datumInternalMeta } = item;\n const datumHydratables = getDatumHydratables(item);\n const datumRenderFlags = getDatumFlags({ ...datumInternalMeta, ...datumHydratables, ...panelMetaInfo });\n const itemMeta = {\n datum,\n datumHydratables,\n datumInternalMeta,\n datumRenderFlags,\n ...panelMetaInfo,\n withDragNDrop,\n };\n return <ItemSortable key={datumHydratables.id} {...itemMeta} />;\n};\n\nconst ItemListWrapper = React.memo((panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const { isDestinationPanel } = panelMetaInfo;\n const itemList = usePropsStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const actionRef = usePropsStore((state) =>\n isDestinationPanel ? state.destinationVirtualRef : state.sourceVirtualRef,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n\n const getDatumHydratables = useGetDatumHydratables(panelMetaInfo);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n return (\n <StyledItemsWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <DSFastList\n actionRef={actionRef}\n count={itemList.length}\n ItemRenderer={ItemRenderer}\n extraItemProps={{ itemList, getDatumHydratables, panelMetaInfo, withDragNDrop }}\n getId={(index: number) => itemList[index].hydratedId}\n />\n </StyledItemsWrapper>\n );\n});\n\nexport const ItemListWrapperWithContext = withConditionalDnDRowContext(ItemListWrapper);\nexport default ItemListWrapperWithContext;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACyCd;AAxCT,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,oBAAoB;AAC7B,SAAS,oCAAoC;AAC7C,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAW9B,MAAM,qBAAqB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,cAAc,CAAC;AAAA;AAAA;AAIvG,MAAM,eAAe,CAAC,EAAE,OAAO,eAAe,MAAqB;AACjE,QAAM,EAAE,UAAU,qBAAqB,eAAe,gBAAgB,MAAM,IAAI,kBAAkB,CAAC;AACnG,MAAI,CAAC,YAAY,CAAC,uBAAuB,CAAC
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACyCd;AAxCT,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,kBAAkB;AAC3B,SAAS,cAAc;AACvB,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,oBAAoB;AAC7B,SAAS,oCAAoC;AAC7C,SAAS,8BAA8B;AACvC,SAAS,qBAAqB;AAW9B,MAAM,qBAAqB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,cAAc,CAAC;AAAA;AAAA;AAIvG,MAAM,eAAe,CAAC,EAAE,OAAO,eAAe,MAAqB;AACjE,QAAM,EAAE,UAAU,qBAAqB,eAAe,gBAAgB,MAAM,IAAI,kBAAkB,CAAC;AACnG,MAAI,CAAC,YAAY,CAAC,uBAAuB,CAAC,cAAe,QAAO;AAChE,QAAM,OAAO,SAAS,KAAK;AAC3B,QAAM,EAAE,UAAU,OAAO,GAAG,kBAAkB,IAAI;AAClD,QAAM,mBAAmB,oBAAoB,IAAI;AACjD,QAAM,mBAAmB,cAAc,EAAE,GAAG,mBAAmB,GAAG,kBAAkB,GAAG,cAAc,CAAC;AACtG,QAAM,WAAW;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,IACH;AAAA,EACF;AACA,SAAO,oBAAC,gBAAwC,GAAG,YAAzB,iBAAiB,EAAkB;AAC/D;AAEA,MAAM,kBAAkBA,OAAM,KAAK,CAAC,kBAA8C;AAChF,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,WAAW;AAAA,IAAc,CAAC,UAC9B,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,YAAY;AAAA,IAAc,CAAC,UAC/B,qBAAqB,MAAM,wBAAwB,MAAM;AAAA,EAC3D;AAEA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AAEA,QAAM,sBAAsB,uBAAuB,aAAa;AAEhE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAErF,SACE,oBAAC,sBAAmB,eAA8B,wBAChD;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,SAAS;AAAA,MAChB;AAAA,MACA,gBAAgB,EAAE,UAAU,qBAAqB,eAAe,cAAc;AAAA,MAC9E,OAAO,CAAC,UAAkB,SAAS,KAAK,EAAE;AAAA;AAAA,EAC5C,GACF;AAEJ,CAAC;AAEM,MAAM,6BAA6B,6BAA6B,eAAe;AACtF,IAAO,gBAAQ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -90,10 +90,8 @@ const PanelContentMiddleSection = React2.memo((panelMetaInfo) => {
|
|
|
90
90
|
}
|
|
91
91
|
if ((key === "ArrowUp" || key === "End") && itemList.length > 0) {
|
|
92
92
|
if (withLoadMore) {
|
|
93
|
-
if (isDestinationPanel)
|
|
94
|
-
|
|
95
|
-
else
|
|
96
|
-
trackFocusLoadMoreBtn();
|
|
93
|
+
if (isDestinationPanel) trackFocusLoadMoreBtnDestination();
|
|
94
|
+
else trackFocusLoadMoreBtn();
|
|
97
95
|
} else {
|
|
98
96
|
trackFocusItemLast(panelMetaInfo);
|
|
99
97
|
actionRef.current.scrollTo(itemsLength - 1);
|
|
@@ -118,8 +116,7 @@ const PanelContentMiddleSection = React2.memo((panelMetaInfo) => {
|
|
|
118
116
|
]
|
|
119
117
|
);
|
|
120
118
|
const cols = React2.useMemo(() => {
|
|
121
|
-
if (hasMultipleSelection)
|
|
122
|
-
return ["1fr", "5rem"];
|
|
119
|
+
if (hasMultipleSelection) return ["1fr", "5rem"];
|
|
123
120
|
return ["auto"];
|
|
124
121
|
}, [hasMultipleSelection]);
|
|
125
122
|
const getOwnerProps = usePropsStore((store) => store.get);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Panel/middle/PanelContentMiddleSection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useCallback } from 'react';\nimport { uid } from 'uid';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { useOnSpecificFocus } from '@elliemae/ds-utilities';\nimport { usePropsStore, useInternalStore } from '../../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { ItemListWrapperWithContext } from './ItemListWrapper/Index.js';\nimport { EmptyItems } from './EmptyItems.js';\nimport { useFocusTracker } from '../../../config/useFocusTracker/index.js';\nimport { LoadingItems } from './LoadingItems.js';\nimport { MultipleSelectionAction } from './MultipleSelectionAction.js';\nimport { REGIONS_FOCUSES } from '../../../constants/index.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../config/DSShuttleV2Definitions.js';\nimport { StyledA11yNoVisible } from '../../../styles.js';\n\nconst useInnerRefHandlers = (isDestinationPanel: boolean) => {\n const setZustandRef = useInternalStore((state) => state.setZustandRef);\n const currRegion = isDestinationPanel ? REGIONS_FOCUSES.DESTINATION_PANEL : REGIONS_FOCUSES.SOURCE_PANEL;\n\n const innerRefHandlerParentItem = React.useCallback(\n (node: HTMLDivElement | null) => {\n setZustandRef([currRegion, '', ''], node);\n },\n [currRegion, setZustandRef],\n );\n return React.useMemo(() => ({ innerRefHandlerParentItem }), [innerRefHandlerParentItem]);\n};\n\nconst rows = [1];\n\nconst StyledListWrapperMid = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.LIST_WRAPPER_MID })`\n overflow: hidden;\n position: relative;\n :focus,\n :focus-visible {\n outline: 2px solid brand-700;\n }\n`;\n\nexport const PanelContentMiddleSection = React.memo((panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const { isDestinationPanel = false, hasMultipleSelection } = panelMetaInfo;\n const itemsLength = usePropsStore((state) =>\n isDestinationPanel ? state.destinationData.length : state.sourceData.length,\n );\n\n const itemList = usePropsStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n const isLoading = usePropsStore((state) => (isDestinationPanel ? state.destinationIsLoading : state.sourceIsLoading));\n const showEmptyMessage = !isLoading && itemsLength === 0;\n const showItems = !isLoading && !showEmptyMessage;\n\n const actionRef = usePropsStore((state) =>\n isDestinationPanel ? state.destinationVirtualRef : state.sourceVirtualRef,\n );\n\n const getIsDragAndDropHappening = useInternalStore((state) => state.getIsDragAndDropHappening);\n const withLoadMore = usePropsStore((state) =>\n isDestinationPanel ? state.destinationWithLoadMore : state.sourceWithLoadMore,\n );\n const { innerRefHandlerParentItem } = useInnerRefHandlers(isDestinationPanel);\n const {\n trackFocusRegionPanel,\n trackFocusItemFirst,\n trackFocusItemLast,\n trackFocusActionParent,\n trackFocusRegionPanelItem,\n trackFocusLoadMoreBtnDestination,\n trackFocusLoadMoreBtn,\n } = useFocusTracker();\n const config = React.useMemo(\n () => ({\n onFocus: () => {\n trackFocusRegionPanel(isDestinationPanel);\n },\n }),\n [trackFocusRegionPanel, isDestinationPanel],\n );\n const onPanelFocus = useOnSpecificFocus(config);\n\n const onPanelKeyDown = React.useCallback<React.KeyboardEventHandler<HTMLDivElement>>(\n (e) => {\n const { key } = e;\n // we need to invoke \"getIsDragAndDropHappening\" here to ensure we have the latest info at the moment of the event\n const isDragAndDropHappening = getIsDragAndDropHappening();\n if (isDragAndDropHappening) {\n e.preventDefault();\n return;\n }\n if (['Home', 'End', 'ArrowUp', 'ArrowDown'].includes(key)) {\n e.preventDefault();\n e.stopPropagation();\n trackFocusRegionPanelItem(isDestinationPanel);\n trackFocusActionParent();\n // we won't receive ArrowUp/ArrowDown if this happens in a child because children are stopping propagation\n if ((key === 'ArrowDown' || key === 'Home') && itemList.length > 0) {\n actionRef.current.scrollTo(0);\n trackFocusItemFirst(panelMetaInfo);\n }\n if ((key === 'ArrowUp' || key === 'End') && itemList.length > 0) {\n if (withLoadMore) {\n if (isDestinationPanel) trackFocusLoadMoreBtnDestination();\n else trackFocusLoadMoreBtn();\n } else {\n trackFocusItemLast(panelMetaInfo);\n actionRef.current.scrollTo(itemsLength - 1);\n }\n }\n }\n },\n [\n getIsDragAndDropHappening,\n trackFocusRegionPanelItem,\n isDestinationPanel,\n trackFocusActionParent,\n itemList.length,\n actionRef,\n trackFocusItemFirst,\n panelMetaInfo,\n withLoadMore,\n trackFocusLoadMoreBtnDestination,\n trackFocusLoadMoreBtn,\n trackFocusItemLast,\n itemsLength,\n ],\n );\n\n const cols = React.useMemo(() => {\n if (hasMultipleSelection) return ['1fr', '5rem'];\n return ['auto'];\n }, [hasMultipleSelection]);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n const defaultAriaDescribedBy =\n itemList.length > 0\n ? 'Press Up and Down arrow to navigate the options list and Press Right and Left arrow to access items actions'\n : 'No items available in the panel';\n\n const uidDescribedBy = React.useMemo(() => uid(), []);\n\n const defaultAriaLabel = React.useMemo(\n () => `Entering ${isDestinationPanel ? 'destination' : 'source'} panel. `,\n [isDestinationPanel],\n );\n\n return (\n <StyledListWrapperMid\n onFocus={onPanelFocus}\n onKeyDown={onPanelKeyDown}\n role=\"group\"\n tabIndex={0}\n rows={rows}\n aria-label={defaultAriaLabel}\n aria-describedby={uidDescribedBy}\n aria-roledescription={isDestinationPanel ? 'shuttle right panel' : 'shuttle left panel'}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n innerRef={innerRefHandlerParentItem}\n >\n <StyledA11yNoVisible id={uidDescribedBy}>{defaultAriaDescribedBy}</StyledA11yNoVisible>\n <Grid cols={cols} rows={rows}>\n {isLoading ? <LoadingItems {...panelMetaInfo} /> : null}\n {showEmptyMessage ? <EmptyItems {...panelMetaInfo} /> : null}\n {showItems ? <ItemListWrapperWithContext {...panelMetaInfo} /> : null}\n {hasMultipleSelection ? <MultipleSelectionAction {...panelMetaInfo} /> : null}\n </Grid>\n </StyledListWrapperMid>\n );\n});\n"],
|
|
5
|
-
"mappings": "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
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -17,8 +17,7 @@ const PanelContentTopSection = (panelMetaInfo) => {
|
|
|
17
17
|
);
|
|
18
18
|
const topSectionRows = React2.useMemo(() => {
|
|
19
19
|
const cols = [];
|
|
20
|
-
if (isSearchBarOpen)
|
|
21
|
-
cols.push("auto");
|
|
20
|
+
if (isSearchBarOpen) cols.push("auto");
|
|
22
21
|
cols.push("auto");
|
|
23
22
|
return cols;
|
|
24
23
|
}, [isSearchBarOpen]);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Panel/top/PanelContentTopSection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { usePropsStore } from '../../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { SelectionHeader } from './SelectionHeader.js';\nimport { PanelFilterSection } from './PanelFilterSection.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../config/DSShuttleV2Definitions.js';\n\nconst StyledListWrapperTop = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.LIST_WRAPPER_TOP })``;\n\nexport const PanelContentTopSection = (panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n const { isDestinationPanel = false } = panelMetaInfo;\n const isSearchBarOpen = usePropsStore((state) =>\n isDestinationPanel ? state.destinationShowSearchbar : state.sourceShowSearchbar,\n );\n const topSectionRows = React.useMemo(() => {\n const cols = [];\n if (isSearchBarOpen) cols.push('auto');\n cols.push('auto');\n return cols;\n }, [isSearchBarOpen]);\n return (\n <StyledListWrapperTop\n rows={topSectionRows}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {isSearchBarOpen ? <PanelFilterSection {...panelMetaInfo} /> : null}\n <SelectionHeader {...panelMetaInfo} />\n </StyledListWrapperTop>\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC0BnB,SAKqB,KALrB;AA1BJ,OAAOA,UAAS,mBAAmB;AACnC,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,0BAA0B;AACnC,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,uBAAuB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,iBAAiB,CAAC;AAErG,MAAM,yBAAyB,CAAC,kBAA8C;AACnF,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAE/E,QAAM,EAAE,qBAAqB,MAAM,IAAI;AACvC,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,iBAAiBA,OAAM,QAAQ,MAAM;AACzC,UAAM,OAAO,CAAC;AACd,QAAI
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC0BnB,SAKqB,KALrB;AA1BJ,OAAOA,UAAS,mBAAmB;AACnC,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAE9B,SAAS,uBAAuB;AAChC,SAAS,0BAA0B;AACnC,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,uBAAuB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,iBAAiB,CAAC;AAErG,MAAM,yBAAyB,CAAC,kBAA8C;AACnF,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAE/E,QAAM,EAAE,qBAAqB,MAAM,IAAI;AACvC,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,iBAAiBA,OAAM,QAAQ,MAAM;AACzC,UAAM,OAAO,CAAC;AACd,QAAI,gBAAiB,MAAK,KAAK,MAAM;AACrC,SAAK,KAAK,MAAM;AAChB,WAAO;AAAA,EACT,GAAG,CAAC,eAAe,CAAC;AACpB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MAEC;AAAA,0BAAkB,oBAAC,sBAAoB,GAAG,eAAe,IAAK;AAAA,QAC/D,oBAAC,mBAAiB,GAAG,eAAe;AAAA;AAAA;AAAA,EACtC;AAEJ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Panel/top/PanelFilterSection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { styled } from '@elliemae/ds-system';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { usePropsStore } from '../../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../config/DSShuttleV2Definitions.js';\n\nconst StyledSearchWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.AREA_SEARCH_WRAPPER })`\n border-bottom: 1px solid neutral-400;\n border-radius: 0;\n`;\nconst StyledInputText = styled(DSInputText, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.AREA_SEARCH_BAR })`\n border: none;\n :focus {\n border-radius: 0;\n }\n`;\n\nexport const PanelFilterSection = (panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n const { isDestinationPanel = false } = panelMetaInfo;\n const onFilterCb = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationFilterChange : state.onSourceFilterChange,\n );\n const filterValue = usePropsStore((state) =>\n isDestinationPanel ? state.destinationFilterValue : state.sourceFilterValue,\n );\n const handleFilterChange = React.useCallback(\n (value: string | number, event: React.ChangeEvent<HTMLInputElement>) => {\n onFilterCb?.(`${value}`, { event });\n },\n [onFilterCb],\n );\n return (\n <StyledSearchWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <StyledInputText\n value={filterValue}\n onValueChange={handleFilterChange}\n aria-label={isDestinationPanel ? 'Destination input search' : 'Source input search'}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n </StyledSearchWrapper>\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACsCjB;AAtCN,OAAOA,UAAS,mBAAmB;AACnC,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,sBAAsB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAI9G,MAAM,kBAAkB,OAAO,aAAa,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOtG,MAAM,qBAAqB,CAAC,kBAA8C;AAC/E,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAE/E,QAAM,EAAE,qBAAqB,MAAM,IAAI;AACvC,QAAM,aAAa;AAAA,IAAc,CAAC,UAChC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,cAAc;AAAA,IAAc,CAAC,UACjC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AACA,QAAM,qBAAqBA,OAAM;AAAA,IAC/B,CAAC,OAAwB,UAA+C;AACtE,mBAAa,GAAG,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACsCjB;AAtCN,OAAOA,UAAS,mBAAmB;AACnC,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,mBAAmB;AAC5B,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,sBAAsB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,oBAAoB,CAAC;AAAA;AAAA;AAAA;AAI9G,MAAM,kBAAkB,OAAO,aAAa,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAOtG,MAAM,qBAAqB,CAAC,kBAA8C;AAC/E,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAE/E,QAAM,EAAE,qBAAqB,MAAM,IAAI;AACvC,QAAM,aAAa;AAAA,IAAc,CAAC,UAChC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,cAAc;AAAA,IAAc,CAAC,UACjC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AACA,QAAM,qBAAqBA,OAAM;AAAA,IAC/B,CAAC,OAAwB,UAA+C;AACtE,mBAAa,GAAG,KAAK,IAAI,EAAE,MAAM,CAAC;AAAA,IACpC;AAAA,IACA,CAAC,UAAU;AAAA,EACb;AACA,SACE,oBAAC,uBAAoB,eAA8B,wBACjD;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP,eAAe;AAAA,MACf,cAAY,qBAAqB,6BAA6B;AAAA,MAC9D;AAAA,MACA;AAAA;AAAA,EACF,GACF;AAEJ;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -47,10 +47,8 @@ const SelectionHeader = React2.memo((panelMetaInfo) => {
|
|
|
47
47
|
const checkboxValue = React2.useMemo(() => {
|
|
48
48
|
let newVal = false;
|
|
49
49
|
if (selectionLength > 0)
|
|
50
|
-
if (selectionLength === selectionableItems.length)
|
|
51
|
-
|
|
52
|
-
else
|
|
53
|
-
newVal = "mixed";
|
|
50
|
+
if (selectionLength === selectionableItems.length) newVal = true;
|
|
51
|
+
else newVal = "mixed";
|
|
54
52
|
return newVal;
|
|
55
53
|
}, [selectionableItems.length, selectionLength]);
|
|
56
54
|
const handleSelectAll = React2.useCallback(
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/Panel/top/SelectionHeader.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useMemo } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { DSControlledCheckbox, type DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport { Grid } from '@elliemae/ds-grid';\nimport { usePropsStore } from '../../../config/useStore/index.js';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../config/DSShuttleV2Definitions.js';\n\nconst StyledSelectionHeaderWrapper = styled(Grid, {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.AREA_SELECTION_HEADER,\n})`\n line-height: 1;\n font-size: 1rem;\n background-color: neutral-000;\n border-bottom: 1px solid neutral-400;\n`;\nconst StyledSelectionHeaderCountLabel = styled('div', {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.AREA_SELECTION_HEADER_COUNT_LABEL,\n})`\n text-align: end;\n color: neutral-500;\n font-weight: 600;\n`;\n\nconst StyledCheckbox = styled(DSControlledCheckbox)``;\n\nconst wrapperCols = ['auto', '1fr'];\nexport const SelectionHeader = React.memo((panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const { isDestinationPanel = false } = panelMetaInfo;\n const selectionableItems = usePropsStore((state) =>\n isDestinationPanel ? state.destinationSelectionableData : state.sourceSelectionableData,\n );\n const ids = usePropsStore((state) =>\n isDestinationPanel ? state.destinationSelectionableIds : state.sourceSelectionableIds,\n );\n\n const checkboxSelectAllProps = usePropsStore((state) => state.checkboxSelectAllProps);\n\n const ariaControls = useMemo(\n () =>\n ids.length === 0\n ? ''\n : ids\n .split(' ')\n .map((d) => `${d}-wrapper`)\n .join(' '),\n [ids],\n );\n\n const onSelectionChange = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange,\n );\n const selectionLength = usePropsStore((state) =>\n isDestinationPanel ? state.destinationSelectionItemArray.length : state.sourceSelectionItemArray.length,\n );\n const checkboxValue = React.useMemo(() => {\n let newVal: boolean | 'mixed' = false;\n if (selectionLength > 0)\n if (selectionLength === selectionableItems.length) newVal = true;\n else newVal = 'mixed';\n return newVal;\n }, [selectionableItems.length, selectionLength]);\n\n const handleSelectAll = React.useCallback<DSControlledCheckboxT.InternalProps['onChange']>(\n (_, event) => {\n if (checkboxValue === true) {\n onSelectionChange({}, { event });\n } else {\n const newSelection: DSShuttleV2T.InternalProps['sourceSelectedItems'] = {};\n selectionableItems.forEach((selectableItem) => {\n newSelection[selectableItem.hydratedId] = true;\n });\n onSelectionChange(newSelection, { event });\n }\n },\n [checkboxValue, onSelectionChange, selectionableItems],\n );\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n return (\n <StyledSelectionHeaderWrapper\n cols={wrapperCols}\n justifyContent=\"center\"\n alignItems=\"center\"\n py=\"7px\"\n px=\"xxs2\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <Grid justifyContent=\"center\" alignItems=\"center\">\n <StyledCheckbox\n checked={checkboxValue}\n aria-label={`${checkboxValue === true ? 'Deselect' : 'Select'} all ${\n isDestinationPanel ? 'destination' : 'source'\n } items`}\n onChange={handleSelectAll}\n aria-controls={ariaControls}\n // need to overwrite this becasue the default aria-labelledby is not working for axe-core\n aria-labelledby=\"\"\n disabled={selectionableItems.length === 0}\n aria-disabled={selectionableItems.length === 0}\n {...(checkboxSelectAllProps &&\n checkboxSelectAllProps({ isDestinationPanel, hasMultipleSelection: selectionLength > 1 }))}\n />\n </Grid>\n <StyledSelectionHeaderCountLabel getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n {selectionLength} selected\n </StyledSelectionHeaderCountLabel>\n </StyledSelectionHeaderWrapper>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC8Ff,cAeF,YAfE;AA9FR,OAAOA,UAAS,aAAa,eAAe;AAC5C,SAAS,cAAc;AACvB,SAAS,4BAAwD;AACjE,SAAS,YAAY;AACrB,SAAS,qBAAqB;AAE9B,SAAS,iBAAiB,wBAAwB;AAElD,MAAM,+BAA+B,OAAO,MAAM;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAMD,MAAM,kCAAkC,OAAO,OAAO;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAMD,MAAM,iBAAiB,OAAO,oBAAoB;AAElD,MAAM,cAAc,CAAC,QAAQ,KAAK;AAC3B,MAAM,kBAAkBA,OAAM,KAAK,CAAC,kBAA8C;AACvF,QAAM,EAAE,qBAAqB,MAAM,IAAI;AACvC,QAAM,qBAAqB;AAAA,IAAc,CAAC,UACxC,qBAAqB,MAAM,+BAA+B,MAAM;AAAA,EAClE;AACA,QAAM,MAAM;AAAA,IAAc,CAAC,UACzB,qBAAqB,MAAM,8BAA8B,MAAM;AAAA,EACjE;AAEA,QAAM,yBAAyB,cAAc,CAAC,UAAU,MAAM,sBAAsB;AAEpF,QAAM,eAAe;AAAA,IACnB,MACE,IAAI,WAAW,IACX,KACA,IACG,MAAM,GAAG,EACT,IAAI,CAAC,MAAM,GAAG,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/tests/configs/basic.js"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useMemo, useState, useCallback } from 'react';\nimport { DSBreadcrumb } from '@elliemae/ds-breadcrumb';\nimport { useDSTree } from '@elliemae/ds-tree-model';\nimport { uid } from 'uid';\n\nconst genTreeOfData = ({ prefix, depth = 0, parent = null, childIndex = 0, finalDepth = 2 }) => {\n const node = {\n id: uid(),\n label: parent ? `${parent.label}.${childIndex}` : `${prefix} 0`,\n parent: parent ? parent.id : null,\n };\n\n if (depth <= finalDepth) {\n node.subitems = Array.from({ length: 2 }, (_, i) =>\n genTreeOfData({ prefix, depth: depth + 1, parent: node, childIndex: i, finalDepth }),\n );\n }\n return node;\n};\n\nconst options = {\n getUniqueId: (item) => item.id,\n};\n\nconst startingSourceData = genTreeOfData({ prefix: 'Source' });\nconst startingDestinationData = genTreeOfData({ prefix: 'Destination' });\n\nconst BreadCrumb = (props) => {\n const { breadCrumbPath, setCurrentNode, ...rest } = props;\n\n return (\n <DSBreadcrumb isTitle {...rest}>\n {breadCrumbPath.map((node) => (\n <DSBreadcrumb.Item\n key={`${node.dsId}`}\n label={node.plainItem.label}\n onClick={() => setCurrentNode(node)}\n dataTestId=\"amigo\"\n />\n ))}\n </DSBreadcrumb>\n );\n};\n\nexport const BreadCrumbHoc = ({ path, setCurrentNode }) => {\n const WrappedBreadCrumb = (props) => <BreadCrumb {...props} breadCrumbPath={path} setCurrentNode={setCurrentNode} />;\n return WrappedBreadCrumb;\n};\n\nconst useListData = (startingData) => {\n const { hash, getRoot, getNode, getPath, addNode, replaceNode, removeNode } = useDSTree(startingData, options);\n const [currentNode, setCurrentNode] = useState(getRoot());\n const [selection, setSelection] = useState({});\n\n const breadcrumbPath = useMemo(() => getPath(currentNode.dsId), [currentNode, getPath]);\n\n const displayedData = useMemo(\n () => currentNode.children.map((node) => node.getJson()),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [currentNode, hash],\n );\n\n const onDrilldown = useCallback((item) => setCurrentNode(getNode(item.id)), [getNode]);\n\n return useMemo(\n () => ({\n getNode,\n addNode,\n replaceNode,\n removeNode,\n currentNode,\n setCurrentNode,\n selection,\n setSelection,\n\n breadcrumbPath,\n displayedData,\n onDrilldown,\n }),\n [addNode, breadcrumbPath, currentNode, displayedData, getNode, onDrilldown, removeNode, replaceNode, selection],\n );\n};\n\nexport const useShuttle = () => {\n const {\n currentNode: currentSourceNode,\n setCurrentNode: setCurrentSourceNode,\n selection: sourceSelection,\n setSelection: setSourceSelection,\n breadcrumbPath: sourceBreadCrumbPath,\n displayedData: sourceDisplayedData,\n onDrilldown: onSourceDrilldown,\n addNode: addSourceNode,\n removeNode: removeSourceNode,\n } = useListData(startingSourceData);\n\n const {\n currentNode: currentDestinationNode,\n setCurrentNode: setCurrentDestinationNode,\n selection: destinationSelection,\n setSelection: setDestinationSelection,\n breadcrumbPath: destinationBreadCrumbPath,\n displayedData: destinationDisplayedData,\n onDrilldown: onDestinationDrilldown,\n addNode: addDestinationNode,\n removeNode: removeDestinationNode,\n } = useListData(startingDestinationData);\n\n const onSourceAdd = useCallback(\n (items) => items.forEach((item) => addSourceNode(item, { parent: currentSourceNode })),\n [addSourceNode, currentSourceNode],\n );\n\n const onSourceRemove = useCallback(\n (items) => items.forEach((item) => removeSourceNode(item.id, item)),\n [removeSourceNode],\n );\n\n const onDestinationAdd = useCallback(\n (items) => items.forEach((item) => addDestinationNode(item, { parent: currentDestinationNode })),\n [addDestinationNode, currentDestinationNode],\n );\n\n const onDestinationRemove = useCallback(\n (items) => items.forEach((item) => removeDestinationNode(item.id)),\n [removeDestinationNode],\n );\n\n return {\n setCurrentSourceNode,\n setCurrentDestinationNode,\n sourceDisplayedData,\n destinationDisplayedData,\n sourceSelection,\n destinationSelection,\n setSourceSelection,\n setDestinationSelection,\n onSourceDrilldown,\n onDestinationDrilldown,\n onSourceAdd,\n onSourceRemove,\n onDestinationAdd,\n onDestinationRemove,\n sourceBreadCrumbPath,\n destinationBreadCrumbPath,\n\n currentSourceNode,\n currentDestinationNode,\n };\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACkCf;AAjCR,OAAOA,UAAS,SAAS,UAAU,mBAAmB;AACtD,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,WAAW;AAEpB,MAAM,gBAAgB,CAAC,EAAE,QAAQ,QAAQ,GAAG,SAAS,MAAM,aAAa,GAAG,aAAa,EAAE,MAAM;AAC9F,QAAM,OAAO;AAAA,IACX,IAAI,IAAI;AAAA,IACR,OAAO,SAAS,GAAG,OAAO,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/tests/configs/filter.js"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useMemo, useState, useCallback } from 'react';\nimport { DSBreadcrumb } from '@elliemae/ds-breadcrumb';\nimport { useDSTree } from '@elliemae/ds-tree-model';\nimport { uid } from 'uid';\n\nconst genTreeOfData = ({ prefix, depth = 0, parent = null, childIndex = 0, finalDepth = 2 }) => {\n const node = {\n id: uid(),\n label: parent ? `${parent.label}.${childIndex}` : `${prefix} 0`,\n parent: parent ? parent.id : null,\n };\n\n if (depth <= finalDepth) {\n node.subitems = Array.from({ length: 2 }, (_, i) =>\n genTreeOfData({ prefix, depth: depth + 1, parent: node, childIndex: i, finalDepth }),\n );\n }\n return node;\n};\n\nconst options = {\n getUniqueId: (item) => item.id,\n};\n\nconst startingSourceData = genTreeOfData({ prefix: 'Source' });\nconst startingDestinationData = genTreeOfData({ prefix: 'Destination' });\n\nconst matcheslenientStringSearch = (filter, str) => {\n const regexpString = `[\\\\s\\\\S]*${filter.replace(/\\s/g, '').split('').join('[\\\\s\\\\S]*')}[\\\\s\\\\S]*`;\n const regexpFilter = new RegExp(regexpString);\n return regexpFilter.test(str);\n};\n\nconst BreadCrumb = (props) => {\n const { breadCrumbPath, setCurrentNode, ...rest } = props;\n\n return (\n <DSBreadcrumb isTitle {...rest}>\n {breadCrumbPath.map((node) => (\n <DSBreadcrumb.Item key={`${node.dsId}`} label={node.plainItem.label} onClick={() => setCurrentNode(node)} />\n ))}\n </DSBreadcrumb>\n );\n};\n\nexport const BreadCrumbHoc = ({ path, setCurrentNode }) => {\n const WrappedBreadCrumb = (props) => <BreadCrumb {...props} breadCrumbPath={path} setCurrentNode={setCurrentNode} />;\n return WrappedBreadCrumb;\n};\n\nconst useListData = (startingData) => {\n const { hash, getRoot, getNode, getPath, addNode, replaceNode, removeNode } = useDSTree(startingData, options);\n const [currentNode, setCurrentNode] = useState(getRoot());\n const [filterValue, setFilterValue] = useState('');\n\n const [selection, setSelection] = useState({});\n\n const breadcrumbPath = useMemo(() => getPath(currentNode.dsId), [currentNode, getPath]);\n\n const displayedData = useMemo(\n () =>\n currentNode.children\n .map((node) => node.getJson())\n .filter((item) => matcheslenientStringSearch(filterValue, item.label)),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [currentNode, hash, filterValue],\n );\n\n const onDrilldown = useCallback((item) => setCurrentNode(getNode(item.id)), [getNode]);\n\n return {\n getNode,\n addNode,\n replaceNode,\n removeNode,\n currentNode,\n setCurrentNode,\n selection,\n setSelection,\n filterValue,\n setFilterValue,\n breadcrumbPath,\n displayedData,\n onDrilldown,\n };\n};\n\nexport const useShuttle = () => {\n const {\n currentNode: currentSourceNode,\n setCurrentNode: setCurrentSourceNode,\n selection: sourceSelection,\n setSelection: setSourceSelection,\n breadcrumbPath: sourceBreadCrumbPath,\n displayedData: sourceDisplayedData,\n filterValue: sourceFilterValue,\n setFilterValue: setSourceFilterValue,\n onDrilldown: onSourceDrilldown,\n getNode: getSourceNode,\n addNode: addSourceNode,\n removeNode: removeSourceNode,\n } = useListData(startingSourceData);\n\n const {\n currentNode: currentDestinationNode,\n setCurrentNode: setCurrentDestinationNode,\n selection: destinationSelection,\n setSelection: setDestinationSelection,\n breadcrumbPath: destinationBreadCrumbPath,\n displayedData: destinationDisplayedData,\n filterValue: destinationFilterValue,\n setFilterValue: setDestinationFilterValue,\n onDrilldown: onDestinationDrilldown,\n getNode: getDestinationNode,\n addNode: addDestinationNode,\n removeNode: removeDestinationNode,\n } = useListData(startingDestinationData);\n\n const onSourceAdd = useCallback(\n (items) =>\n items.forEach((item) => addSourceNode(item, { parent: getSourceNode(item.parent) ?? currentSourceNode })),\n [addSourceNode, currentSourceNode, getSourceNode],\n );\n\n const onSourceRemove = useCallback(\n (items) => items.forEach((item) => removeSourceNode(item.id, item)),\n [removeSourceNode],\n );\n\n const onDestinationAdd = useCallback(\n (items) =>\n items.forEach((item) =>\n addDestinationNode(item, { parent: getDestinationNode(item.parent) ?? currentDestinationNode }),\n ),\n [addDestinationNode, currentDestinationNode, getDestinationNode],\n );\n\n const onDestinationRemove = useCallback(\n (items) => items.forEach((item) => removeDestinationNode(item.id)),\n [removeDestinationNode],\n );\n\n return useMemo(\n () => ({\n setCurrentSourceNode,\n setCurrentDestinationNode,\n sourceDisplayedData,\n destinationDisplayedData,\n sourceSelection,\n destinationSelection,\n setSourceSelection,\n setDestinationSelection,\n sourceFilterValue,\n destinationFilterValue,\n setSourceFilterValue,\n setDestinationFilterValue,\n onSourceDrilldown,\n onDestinationDrilldown,\n onSourceAdd,\n onSourceRemove,\n onDestinationAdd,\n onDestinationRemove,\n sourceBreadCrumbPath,\n destinationBreadCrumbPath,\n\n currentSourceNode,\n currentDestinationNode,\n }),\n [\n setCurrentSourceNode,\n setCurrentDestinationNode,\n sourceDisplayedData,\n destinationDisplayedData,\n sourceSelection,\n destinationSelection,\n setSourceSelection,\n setDestinationSelection,\n sourceFilterValue,\n destinationFilterValue,\n setSourceFilterValue,\n setDestinationFilterValue,\n onSourceDrilldown,\n onDestinationDrilldown,\n onSourceAdd,\n onSourceRemove,\n onDestinationAdd,\n onDestinationRemove,\n sourceBreadCrumbPath,\n destinationBreadCrumbPath,\n\n currentSourceNode,\n currentDestinationNode,\n ],\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACwCf;AAvCR,OAAOA,UAAS,SAAS,UAAU,mBAAmB;AACtD,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,WAAW;AAEpB,MAAM,gBAAgB,CAAC,EAAE,QAAQ,QAAQ,GAAG,SAAS,MAAM,aAAa,GAAG,aAAa,EAAE,MAAM;AAC9F,QAAM,OAAO;AAAA,IACX,IAAI,IAAI;AAAA,IACR,OAAO,SAAS,GAAG,OAAO,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/tests/configs/loadMore.js"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useMemo, useState, useCallback } from 'react';\nimport { DSBreadcrumb } from '@elliemae/ds-breadcrumb';\nimport { useDSTree } from '@elliemae/ds-tree-model';\nimport { uid } from 'uid';\n\nconst genTreeOfData = ({ prefix, depth = 0, parent = null, childIndex = 0, finalDepth = 2 }) => {\n const node = {\n id: uid(),\n label: parent ? `${parent.label}.${childIndex}` : `${prefix} 0`,\n parent: parent ? parent.id : null,\n };\n\n if (depth <= finalDepth) {\n node.subitems = Array.from({ length: 2 }, (_, i) =>\n genTreeOfData({ prefix, depth: depth + 1, parent: node, childIndex: i, finalDepth }),\n );\n }\n return node;\n};\n\nconst options = {\n getUniqueId: (item) => item.id,\n};\n\nconst startingSourceData = genTreeOfData({ prefix: 'Source' });\nconst startingDestinationData = genTreeOfData({ prefix: 'Destination' });\n\nconst BreadCrumb = (props) => {\n const { breadCrumbPath, setCurrentNode, ...rest } = props;\n\n return (\n <DSBreadcrumb isTitle {...rest}>\n {breadCrumbPath.map((node) => (\n <DSBreadcrumb.Item key={`${node.dsId}`} label={node.plainItem.label} onClick={() => setCurrentNode(node)} />\n ))}\n </DSBreadcrumb>\n );\n};\n\nexport const BreadCrumbHoc = ({ path, setCurrentNode }) => {\n const WrappedBreadCrumb = (props) => <BreadCrumb {...props} breadCrumbPath={path} setCurrentNode={setCurrentNode} />;\n return WrappedBreadCrumb;\n};\n\nconst useListData = (startingData) => {\n const { hash, getRoot, getNode, getPath, addNode, replaceNode, removeNode } = useDSTree(startingData, options);\n const [currentNode, setCurrentNode] = useState(getRoot());\n const [selection, setSelection] = useState({});\n const [isLoadingMore, setIsLoadingMore] = useState(false);\n\n const breadcrumbPath = useMemo(() => getPath(currentNode.dsId), [currentNode, getPath]);\n\n const displayedData = useMemo(\n () => currentNode.children.map((node) => node.getJson()),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [currentNode, hash],\n );\n\n const onDrilldown = useCallback((item) => setCurrentNode(getNode(item.id)), [getNode]);\n\n const onLoadMore = useCallback(() => {\n setIsLoadingMore(true);\n setTimeout(() => {\n const newChildren = Array.from({ length: 1 }, (_, i) =>\n genTreeOfData({ parent: currentNode.plainItem, childIndex: currentNode.children.length + i }),\n );\n newChildren.forEach((child) => addNode(child, { parent: currentNode }));\n setIsLoadingMore(false);\n }, 1000);\n }, [addNode, currentNode]);\n\n return {\n getNode,\n addNode,\n replaceNode,\n removeNode,\n currentNode,\n setCurrentNode,\n selection,\n setSelection,\n isLoadingMore,\n onLoadMore,\n breadcrumbPath,\n displayedData,\n onDrilldown,\n };\n};\n\nexport const useShuttle = () => {\n const {\n currentNode: currentSourceNode,\n setCurrentNode: setCurrentSourceNode,\n selection: sourceSelection,\n setSelection: setSourceSelection,\n breadcrumbPath: sourceBreadCrumbPath,\n displayedData: sourceDisplayedData,\n onDrilldown: onSourceDrilldown,\n getNode: getSourceNode,\n addNode: addSourceNode,\n removeNode: removeSourceNode,\n isLoadingMore: isSourceLoadingMore,\n onLoadMore: onLoadMoreSource,\n } = useListData(startingSourceData, 'S');\n\n const {\n currentNode: currentDestinationNode,\n setCurrentNode: setCurrentDestinationNode,\n selection: destinationSelection,\n setSelection: setDestinationSelection,\n breadcrumbPath: destinationBreadCrumbPath,\n displayedData: destinationDisplayedData,\n onDrilldown: onDestinationDrilldown,\n getNode: getDestinationNode,\n addNode: addDestinationNode,\n removeNode: removeDestinationNode,\n isLoadingMore: isDestinationLoadingMore,\n onLoadMore: onLoadMoreDestination,\n } = useListData(startingDestinationData, 'D');\n\n const onSourceAdd = useCallback(\n (items) =>\n items.forEach((item) => addSourceNode(item, { parent: getSourceNode(item.parent) ?? currentSourceNode })),\n [addSourceNode, currentSourceNode, getSourceNode],\n );\n\n const onSourceRemove = useCallback(\n (items) => items.forEach((item) => removeSourceNode(item.id, item)),\n [removeSourceNode],\n );\n\n const onDestinationAdd = useCallback(\n (items) =>\n items.forEach((item) =>\n addDestinationNode(item, { parent: getDestinationNode(item.parent) ?? currentDestinationNode }),\n ),\n [addDestinationNode, currentDestinationNode, getDestinationNode],\n );\n\n const onDestinationRemove = useCallback(\n (items) => items.forEach((item) => removeDestinationNode(item.id)),\n [removeDestinationNode],\n );\n\n return {\n setCurrentSourceNode,\n setCurrentDestinationNode,\n sourceDisplayedData,\n destinationDisplayedData,\n sourceSelection,\n destinationSelection,\n setSourceSelection,\n setDestinationSelection,\n onSourceDrilldown,\n onDestinationDrilldown,\n onSourceAdd,\n onSourceRemove,\n onDestinationAdd,\n onDestinationRemove,\n sourceBreadCrumbPath,\n destinationBreadCrumbPath,\n isSourceLoadingMore,\n onLoadMoreSource,\n isDestinationLoadingMore,\n onLoadMoreDestination,\n\n currentSourceNode,\n currentDestinationNode,\n };\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACkCf;AAjCR,OAAOA,UAAS,SAAS,UAAU,mBAAmB;AACtD,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,WAAW;AAEpB,MAAM,gBAAgB,CAAC,EAAE,QAAQ,QAAQ,GAAG,SAAS,MAAM,aAAa,GAAG,aAAa,EAAE,MAAM;AAC9F,QAAM,OAAO;AAAA,IACX,IAAI,IAAI;AAAA,IACR,OAAO,SAAS,GAAG,OAAO,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACkCf;AAjCR,OAAOA,UAAS,SAAS,UAAU,mBAAmB;AACtD,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,WAAW;AAEpB,MAAM,gBAAgB,CAAC,EAAE,QAAQ,QAAQ,GAAG,SAAS,MAAM,aAAa,GAAG,aAAa,EAAE,MAAM;AAC9F,QAAM,OAAO;AAAA,IACX,IAAI,IAAI;AAAA,IACR,OAAO,SAAS,GAAG,OAAO,KAAK,IAAI,UAAU,KAAK,GAAG,MAAM;AAAA,IAC3D,QAAQ,SAAS,OAAO,KAAK;AAAA,EAC/B;AAEA,MAAI,SAAS,YAAY;AACvB,SAAK,WAAW,MAAM;AAAA,MAAK,EAAE,QAAQ,EAAE;AAAA,MAAG,CAAC,GAAG,MAC5C,cAAc,EAAE,QAAQ,OAAO,QAAQ,GAAG,QAAQ,MAAM,YAAY,GAAG,WAAW,CAAC;AAAA,IACrF;AAAA,EACF;AACA,SAAO;AACT;AAEA,MAAM,UAAU;AAAA,EACd,aAAa,CAAC,SAAS,KAAK;AAC9B;AAEA,MAAM,qBAAqB,cAAc,EAAE,QAAQ,SAAS,CAAC;AAC7D,MAAM,0BAA0B,cAAc,EAAE,QAAQ,cAAc,CAAC;AAEvE,MAAM,aAAa,CAAC,UAAU;AAC5B,QAAM,EAAE,gBAAgB,gBAAgB,GAAG,KAAK,IAAI;AAEpD,SACE,oBAAC,gBAAa,SAAO,MAAE,GAAG,MACvB,yBAAe,IAAI,CAAC,SACnB,oBAAC,aAAa,MAAb,EAAuC,OAAO,KAAK,UAAU,OAAO,SAAS,MAAM,eAAe,IAAI,KAA/E,GAAG,KAAK,IAAI,EAAsE,CAC3G,GACH;AAEJ;AAEO,MAAM,gBAAgB,CAAC,EAAE,MAAM,eAAe,MAAM;AACzD,QAAM,oBAAoB,CAAC,UAAU,oBAAC,cAAY,GAAG,OAAO,gBAAgB,MAAM,gBAAgC;AAClH,SAAO;AACT;AAEA,MAAM,cAAc,CAAC,iBAAiB;AACpC,QAAM,EAAE,MAAM,SAAS,SAAS,SAAS,SAAS,aAAa,WAAW,IAAI,UAAU,cAAc,OAAO;AAC7G,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,QAAQ,CAAC;AACxD,QAAM,CAAC,WAAW,YAAY,IAAI,SAAS,CAAC,CAAC;AAC7C,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,KAAK;AAExD,QAAM,iBAAiB,QAAQ,MAAM,QAAQ,YAAY,IAAI,GAAG,CAAC,aAAa,OAAO,CAAC;AAEtF,QAAM,gBAAgB;AAAA,IACpB,MAAM,YAAY,SAAS,IAAI,CAAC,SAAS,KAAK,QAAQ,CAAC;AAAA;AAAA,IAEvD,CAAC,aAAa,IAAI;AAAA,EACpB;AAEA,QAAM,cAAc,YAAY,CAAC,SAAS,eAAe,QAAQ,KAAK,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC;AAErF,QAAM,aAAa,YAAY,MAAM;AACnC,qBAAiB,IAAI;AACrB,eAAW,MAAM;AACf,YAAM,cAAc,MAAM;AAAA,QAAK,EAAE,QAAQ,EAAE;AAAA,QAAG,CAAC,GAAG,MAChD,cAAc,EAAE,QAAQ,YAAY,WAAW,YAAY,YAAY,SAAS,SAAS,EAAE,CAAC;AAAA,MAC9F;AACA,kBAAY,QAAQ,CAAC,UAAU,QAAQ,OAAO,EAAE,QAAQ,YAAY,CAAC,CAAC;AACtE,uBAAiB,KAAK;AAAA,IACxB,GAAG,GAAI;AAAA,EACT,GAAG,CAAC,SAAS,WAAW,CAAC;AAEzB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAEO,MAAM,aAAa,MAAM;AAC9B,QAAM;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,aAAa;AAAA,IACb,SAAS;AAAA,IACT,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,YAAY;AAAA,EACd,IAAI,YAAY,oBAAoB,GAAG;AAEvC,QAAM;AAAA,IACJ,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB,WAAW;AAAA,IACX,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,eAAe;AAAA,IACf,aAAa;AAAA,IACb,SAAS;AAAA,IACT,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,YAAY;AAAA,EACd,IAAI,YAAY,yBAAyB,GAAG;AAE5C,QAAM,cAAc;AAAA,IAClB,CAAC,UACC,MAAM,QAAQ,CAAC,SAAS,cAAc,MAAM,EAAE,QAAQ,cAAc,KAAK,MAAM,KAAK,kBAAkB,CAAC,CAAC;AAAA,IAC1G,CAAC,eAAe,mBAAmB,aAAa;AAAA,EAClD;AAEA,QAAM,iBAAiB;AAAA,IACrB,CAAC,UAAU,MAAM,QAAQ,CAAC,SAAS,iBAAiB,KAAK,IAAI,IAAI,CAAC;AAAA,IAClE,CAAC,gBAAgB;AAAA,EACnB;AAEA,QAAM,mBAAmB;AAAA,IACvB,CAAC,UACC,MAAM;AAAA,MAAQ,CAAC,SACb,mBAAmB,MAAM,EAAE,QAAQ,mBAAmB,KAAK,MAAM,KAAK,uBAAuB,CAAC;AAAA,IAChG;AAAA,IACF,CAAC,oBAAoB,wBAAwB,kBAAkB;AAAA,EACjE;AAEA,QAAM,sBAAsB;AAAA,IAC1B,CAAC,UAAU,MAAM,QAAQ,CAAC,SAAS,sBAAsB,KAAK,EAAE,CAAC;AAAA,IACjE,CAAC,qBAAqB;AAAA,EACxB;AAEA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAEA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-shuttle-v2",
|
|
3
|
-
"version": "3.36.0-next.
|
|
3
|
+
"version": "3.36.0-next.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Shuttle v2",
|
|
6
6
|
"files": [
|
|
@@ -38,31 +38,31 @@
|
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"fast-deep-equal": "~3.1.3",
|
|
40
40
|
"uid": "~2.0.1",
|
|
41
|
-
"@elliemae/ds-button-v2": "3.36.0-next.
|
|
42
|
-
"@elliemae/ds-
|
|
43
|
-
"@elliemae/ds-
|
|
44
|
-
"@elliemae/ds-
|
|
45
|
-
"@elliemae/ds-form-
|
|
46
|
-
"@elliemae/ds-
|
|
47
|
-
"@elliemae/ds-
|
|
48
|
-
"@elliemae/ds-
|
|
49
|
-
"@elliemae/ds-
|
|
50
|
-
"@elliemae/ds-
|
|
51
|
-
"@elliemae/ds-popperjs": "3.36.0-next.
|
|
52
|
-
"@elliemae/ds-props-helpers": "3.36.0-next.
|
|
53
|
-
"@elliemae/ds-system": "3.36.0-next.
|
|
54
|
-
"@elliemae/ds-typescript-helpers": "3.36.0-next.
|
|
55
|
-
"@elliemae/ds-typography": "3.36.0-next.
|
|
56
|
-
"@elliemae/ds-utilities": "3.36.0-next.
|
|
57
|
-
"@elliemae/ds-zustand-helpers": "3.36.0-next.
|
|
41
|
+
"@elliemae/ds-button-v2": "3.36.0-next.1",
|
|
42
|
+
"@elliemae/ds-circular-progress-indicator": "3.36.0-next.1",
|
|
43
|
+
"@elliemae/ds-drag-and-drop": "3.36.0-next.1",
|
|
44
|
+
"@elliemae/ds-fast-list": "3.36.0-next.1",
|
|
45
|
+
"@elliemae/ds-form-checkbox": "3.36.0-next.1",
|
|
46
|
+
"@elliemae/ds-form-input-text": "3.36.0-next.1",
|
|
47
|
+
"@elliemae/ds-grid": "3.36.0-next.1",
|
|
48
|
+
"@elliemae/ds-hooks-fontsize-detector": "3.36.0-next.1",
|
|
49
|
+
"@elliemae/ds-icons": "3.36.0-next.1",
|
|
50
|
+
"@elliemae/ds-indeterminate-progress-indicator": "3.36.0-next.1",
|
|
51
|
+
"@elliemae/ds-popperjs": "3.36.0-next.1",
|
|
52
|
+
"@elliemae/ds-props-helpers": "3.36.0-next.1",
|
|
53
|
+
"@elliemae/ds-system": "3.36.0-next.1",
|
|
54
|
+
"@elliemae/ds-typescript-helpers": "3.36.0-next.1",
|
|
55
|
+
"@elliemae/ds-typography": "3.36.0-next.1",
|
|
56
|
+
"@elliemae/ds-utilities": "3.36.0-next.1",
|
|
57
|
+
"@elliemae/ds-zustand-helpers": "3.36.0-next.1"
|
|
58
58
|
},
|
|
59
59
|
"devDependencies": {
|
|
60
60
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
61
61
|
"lodash": "^4.17.21",
|
|
62
62
|
"styled-components": "~5.3.9",
|
|
63
|
-
"@elliemae/ds-breadcrumb": "3.36.0-next.
|
|
64
|
-
"@elliemae/ds-monorepo-devops": "3.36.0-next.
|
|
65
|
-
"@elliemae/ds-tree-model": "3.36.0-next.
|
|
63
|
+
"@elliemae/ds-breadcrumb": "3.36.0-next.1",
|
|
64
|
+
"@elliemae/ds-monorepo-devops": "3.36.0-next.1",
|
|
65
|
+
"@elliemae/ds-tree-model": "3.36.0-next.1"
|
|
66
66
|
},
|
|
67
67
|
"peerDependencies": {
|
|
68
68
|
"lodash": "^4.17.21",
|