@elliemae/ds-shuttle-v2 3.14.1 → 3.14.2
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/config/DSShuttleV2Definitions.js +2 -1
- package/dist/cjs/config/DSShuttleV2Definitions.js.map +2 -2
- package/dist/cjs/config/itemMovementHelpers.js +29 -52
- package/dist/cjs/config/itemMovementHelpers.js.map +2 -2
- package/dist/cjs/config/useFocusTracker/useFocusActionTrackers.js +6 -9
- package/dist/cjs/config/useFocusTracker/useFocusActionTrackers.js.map +2 -2
- package/dist/cjs/config/useFocusTracker/useFocusItemTracker.js +16 -49
- package/dist/cjs/config/useFocusTracker/useFocusItemTracker.js.map +2 -2
- package/dist/cjs/config/useFocusTracker/useFocusRegionTrackers.js +1 -5
- package/dist/cjs/config/useFocusTracker/useFocusRegionTrackers.js.map +2 -2
- package/dist/cjs/config/useStore/focusAndTabIndexManager.js +73 -0
- package/dist/cjs/config/useStore/focusAndTabIndexManager.js.map +7 -0
- package/dist/cjs/config/useStore/types.js +24 -0
- package/dist/cjs/config/useStore/types.js.map +7 -0
- package/dist/cjs/config/useStore/useStore.js +13 -0
- package/dist/cjs/config/useStore/useStore.js.map +3 -3
- package/dist/cjs/constants/index.js +1 -3
- package/dist/cjs/constants/index.js.map +2 -2
- package/dist/cjs/parts/Dnd/DndHandle.js +5 -1
- package/dist/cjs/parts/Dnd/DndHandle.js.map +2 -2
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js +14 -12
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map +2 -2
- package/dist/cjs/parts/Item/Item.js +39 -38
- package/dist/cjs/parts/Item/Item.js.map +2 -2
- package/dist/cjs/parts/Item/ItemActions/ItemActions.js +3 -3
- package/dist/cjs/parts/Item/ItemActions/ItemActions.js.map +2 -2
- package/dist/cjs/parts/Item/ItemActions/useInnerRefHandlers.js +8 -23
- package/dist/cjs/parts/Item/ItemActions/useInnerRefHandlers.js.map +2 -2
- package/dist/cjs/parts/Item/ItemOverlay.js +2 -1
- package/dist/cjs/parts/Item/ItemOverlay.js.map +2 -2
- package/dist/cjs/parts/Item/useItemArrowNavigation.js +7 -22
- package/dist/cjs/parts/Item/useItemArrowNavigation.js.map +2 -2
- package/dist/cjs/parts/Item/useSelectionLogic.js +1 -1
- package/dist/cjs/parts/Item/useSelectionLogic.js.map +2 -2
- package/dist/cjs/parts/MainContent.js +2 -2
- package/dist/cjs/parts/MainContent.js.map +2 -2
- package/dist/cjs/parts/Panel/bottom/LoadMoreBtn.js +2 -8
- package/dist/cjs/parts/Panel/bottom/LoadMoreBtn.js.map +2 -2
- package/dist/cjs/parts/Panel/bottom/useInnerRefHandlers.js +7 -12
- package/dist/cjs/parts/Panel/bottom/useInnerRefHandlers.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/ItemListWrapper/Index.js +3 -12
- package/dist/cjs/parts/Panel/middle/ItemListWrapper/Index.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/MultipleSelectionAction.js +3 -7
- package/dist/cjs/parts/Panel/middle/MultipleSelectionAction.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/PanelContentMiddleSection.js +21 -19
- package/dist/cjs/parts/Panel/middle/PanelContentMiddleSection.js.map +2 -2
- package/dist/cjs/parts/Panel/top/SelectionHeader.js +3 -3
- package/dist/cjs/parts/Panel/top/SelectionHeader.js.map +2 -2
- package/dist/esm/config/DSShuttleV2Definitions.js +2 -1
- package/dist/esm/config/DSShuttleV2Definitions.js.map +2 -2
- package/dist/esm/config/itemMovementHelpers.js +30 -53
- package/dist/esm/config/itemMovementHelpers.js.map +2 -2
- package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js +6 -9
- package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js.map +2 -2
- package/dist/esm/config/useFocusTracker/useFocusItemTracker.js +16 -49
- package/dist/esm/config/useFocusTracker/useFocusItemTracker.js.map +2 -2
- package/dist/esm/config/useFocusTracker/useFocusRegionTrackers.js +1 -5
- package/dist/esm/config/useFocusTracker/useFocusRegionTrackers.js.map +2 -2
- package/dist/esm/config/useStore/focusAndTabIndexManager.js +47 -0
- package/dist/esm/config/useStore/focusAndTabIndexManager.js.map +7 -0
- package/dist/esm/config/useStore/types.js +2 -0
- package/dist/esm/config/useStore/types.js.map +7 -0
- package/dist/esm/config/useStore/useStore.js +13 -0
- package/dist/esm/config/useStore/useStore.js.map +2 -2
- package/dist/esm/constants/index.js +1 -3
- package/dist/esm/constants/index.js.map +2 -2
- package/dist/esm/parts/Dnd/DndHandle.js +5 -1
- package/dist/esm/parts/Dnd/DndHandle.js.map +2 -2
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js +14 -12
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js.map +2 -2
- package/dist/esm/parts/Item/Item.js +39 -38
- package/dist/esm/parts/Item/Item.js.map +2 -2
- package/dist/esm/parts/Item/ItemActions/ItemActions.js +3 -3
- package/dist/esm/parts/Item/ItemActions/ItemActions.js.map +2 -2
- package/dist/esm/parts/Item/ItemActions/useInnerRefHandlers.js +8 -23
- package/dist/esm/parts/Item/ItemActions/useInnerRefHandlers.js.map +2 -2
- package/dist/esm/parts/Item/ItemOverlay.js +2 -1
- package/dist/esm/parts/Item/ItemOverlay.js.map +2 -2
- package/dist/esm/parts/Item/useItemArrowNavigation.js +7 -22
- package/dist/esm/parts/Item/useItemArrowNavigation.js.map +2 -2
- package/dist/esm/parts/Item/useSelectionLogic.js +1 -1
- package/dist/esm/parts/Item/useSelectionLogic.js.map +2 -2
- package/dist/esm/parts/MainContent.js +3 -3
- package/dist/esm/parts/MainContent.js.map +2 -2
- package/dist/esm/parts/Panel/bottom/LoadMoreBtn.js +2 -8
- package/dist/esm/parts/Panel/bottom/LoadMoreBtn.js.map +2 -2
- package/dist/esm/parts/Panel/bottom/useInnerRefHandlers.js +7 -12
- package/dist/esm/parts/Panel/bottom/useInnerRefHandlers.js.map +2 -2
- package/dist/esm/parts/Panel/middle/ItemListWrapper/Index.js +4 -13
- package/dist/esm/parts/Panel/middle/ItemListWrapper/Index.js.map +2 -2
- package/dist/esm/parts/Panel/middle/MultipleSelectionAction.js +3 -7
- package/dist/esm/parts/Panel/middle/MultipleSelectionAction.js.map +2 -2
- package/dist/esm/parts/Panel/middle/PanelContentMiddleSection.js +21 -19
- package/dist/esm/parts/Panel/middle/PanelContentMiddleSection.js.map +2 -2
- package/dist/esm/parts/Panel/top/SelectionHeader.js +4 -4
- package/dist/esm/parts/Panel/top/SelectionHeader.js.map +2 -2
- package/dist/types/config/DSShuttleV2Definitions.d.ts +1 -0
- package/dist/types/config/useFocusTracker/useFocusActionTrackers.d.ts +0 -2
- package/dist/types/config/useFocusTracker/useFocusItemTracker.d.ts +2 -6
- package/dist/types/config/useFocusTracker/useFocusRegionTrackers.d.ts +0 -2
- package/dist/types/config/useFocusTracker/useFocusTracker.d.ts +2 -8
- package/dist/types/config/useStore/focusAndTabIndexManager.d.ts +10 -0
- package/dist/types/config/useStore/types.d.ts +28 -0
- package/dist/types/config/useStore/useStore.d.ts +33 -57
- package/dist/types/constants/index.d.ts +1 -3
- package/dist/types/parts/Dnd/DndHandle.d.ts +3 -3
- package/dist/types/parts/Item/ItemActions/useInnerRefHandlers.d.ts +0 -2
- package/dist/types/parts/Panel/bottom/useInnerRefHandlers.d.ts +0 -1
- package/package.json +17 -17
- package/dist/cjs/config/useStore/createAtomInStore.bak +0 -18
- package/dist/esm/config/useStore/createAtomInStore.bak +0 -18
|
@@ -62,7 +62,8 @@ const DSShuttleV2Slots = {
|
|
|
62
62
|
AREA_SEARCH_WRAPPER: "area-search-wrapper",
|
|
63
63
|
AREA_SEARCH_BAR: "area-search-bar",
|
|
64
64
|
AREA_SELECTION_HEADER: "area-selection-header",
|
|
65
|
-
AREA_SELECTION_HEADER_COUNT_LABEL: "area-selection-header-count-label"
|
|
65
|
+
AREA_SELECTION_HEADER_COUNT_LABEL: "area-selection-header-count-label",
|
|
66
|
+
DRAG_AND_DROP_HANDLE: "drag-and-drop-handle"
|
|
66
67
|
};
|
|
67
68
|
const DSShuttleV2DataTestIds = (0, import_ds_system.slotObjectToDataTestIds)(DSShuttleV2Name, DSShuttleV2Slots);
|
|
68
69
|
//# sourceMappingURL=DSShuttleV2Definitions.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/DSShuttleV2Definitions.ts", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSShuttleV2Name = 'DSShuttleV2' as const;\n\nexport const DSShuttleV2Slots = {\n HEADER_SEARCH_ICON: 'header-search-icon',\n WRAPPER: 'wrapper',\n PANEL_WRAPPER: 'panel-wrapper',\n LIST_WRAPPER: 'list-wrapper',\n ITEM_WRAPPER: 'item-wrapper',\n ITEM_ICON_WRAPPER: 'item-icon-wrapper',\n ITEM_LABEL_WRAPPER: 'item-label-wrapper',\n ITEM_MIDSECTION_WRAPPER: 'item-midsection-wrapper',\n ITEM_SELECTION: 'item-selection',\n ITEM_ACTIONS_WRAPPER: 'item-actions-wrapper',\n ITEM_ACTION_WRAPPER: 'item-action-wrapper',\n ITEM_ACTION_BTN: 'item-action-btn',\n ITEM_ACTION_BTN_DRILLDOWN_ICON: 'item-action-btn-drilldown-icon',\n ITEM_ACTION_BTN_TO_SOURCE_ICON: 'item-action-btn-to-source-icon',\n ITEM_ACTION_BTN_TO_DESTINATION_ICON: 'item-action-btn-to-destination-icon',\n LIST_BOTTOM_LOADING_MORE: 'list-bottom-loading-more',\n LIST_BOTTOM_LOAD_MORE_BTN: 'list-bottom-load-more-btn',\n LIST_WRAPPER_BOTTOM: 'list-wrapper-bottom',\n EMPTY_LIST_WRAPPER: 'empty-list-wrapper',\n ITEMS_WRAPPER: 'items-wrapper',\n LOADING_LIST_WRAPPER: 'loading-list-wrapper',\n MOVE_MULTIPLE_WRAPPER: 'move-multiple-wrapper',\n MOVE_MULTIPLE_BTN: 'move-multiple-btn',\n LIST_WRAPPER_MID: 'list-wrapper-mid',\n LIST_WRAPPER_MID_SCROLLER: 'list-wrapper-mid-scroller',\n LIST_WRAPPER_TOP: 'list-wrapper-top',\n AREA_SEARCH_WRAPPER: 'area-search-wrapper',\n AREA_SEARCH_BAR: 'area-search-bar',\n AREA_SELECTION_HEADER: 'area-selection-header',\n AREA_SELECTION_HEADER_COUNT_LABEL: 'area-selection-header-count-label',\n} as const;\n\nexport const DSShuttleV2DataTestIds = slotObjectToDataTestIds(DSShuttleV2Name, DSShuttleV2Slots)
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,kBAAkB;AAExB,MAAM,mBAAmB;AAAA,EAC9B,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,eAAe;AAAA,EACf,cAAc;AAAA,EACd,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,EACzB,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,iBAAiB;AAAA,EACjB,gCAAgC;AAAA,EAChC,gCAAgC;AAAA,EAChC,qCAAqC;AAAA,EACrC,0BAA0B;AAAA,EAC1B,2BAA2B;AAAA,EAC3B,qBAAqB;AAAA,EACrB,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,uBAAuB;AAAA,EACvB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,2BAA2B;AAAA,EAC3B,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,iBAAiB;AAAA,EACjB,uBAAuB;AAAA,EACvB,mCAAmC;
|
|
4
|
+
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSShuttleV2Name = 'DSShuttleV2' as const;\n\nexport const DSShuttleV2Slots = {\n HEADER_SEARCH_ICON: 'header-search-icon',\n WRAPPER: 'wrapper',\n PANEL_WRAPPER: 'panel-wrapper',\n LIST_WRAPPER: 'list-wrapper',\n ITEM_WRAPPER: 'item-wrapper',\n ITEM_ICON_WRAPPER: 'item-icon-wrapper',\n ITEM_LABEL_WRAPPER: 'item-label-wrapper',\n ITEM_MIDSECTION_WRAPPER: 'item-midsection-wrapper',\n ITEM_SELECTION: 'item-selection',\n ITEM_ACTIONS_WRAPPER: 'item-actions-wrapper',\n ITEM_ACTION_WRAPPER: 'item-action-wrapper',\n ITEM_ACTION_BTN: 'item-action-btn',\n ITEM_ACTION_BTN_DRILLDOWN_ICON: 'item-action-btn-drilldown-icon',\n ITEM_ACTION_BTN_TO_SOURCE_ICON: 'item-action-btn-to-source-icon',\n ITEM_ACTION_BTN_TO_DESTINATION_ICON: 'item-action-btn-to-destination-icon',\n LIST_BOTTOM_LOADING_MORE: 'list-bottom-loading-more',\n LIST_BOTTOM_LOAD_MORE_BTN: 'list-bottom-load-more-btn',\n LIST_WRAPPER_BOTTOM: 'list-wrapper-bottom',\n EMPTY_LIST_WRAPPER: 'empty-list-wrapper',\n ITEMS_WRAPPER: 'items-wrapper',\n LOADING_LIST_WRAPPER: 'loading-list-wrapper',\n MOVE_MULTIPLE_WRAPPER: 'move-multiple-wrapper',\n MOVE_MULTIPLE_BTN: 'move-multiple-btn',\n LIST_WRAPPER_MID: 'list-wrapper-mid',\n LIST_WRAPPER_MID_SCROLLER: 'list-wrapper-mid-scroller',\n LIST_WRAPPER_TOP: 'list-wrapper-top',\n AREA_SEARCH_WRAPPER: 'area-search-wrapper',\n AREA_SEARCH_BAR: 'area-search-bar',\n AREA_SELECTION_HEADER: 'area-selection-header',\n AREA_SELECTION_HEADER_COUNT_LABEL: 'area-selection-header-count-label',\n DRAG_AND_DROP_HANDLE: 'drag-and-drop-handle',\n} as const;\n\nexport const DSShuttleV2DataTestIds = slotObjectToDataTestIds(DSShuttleV2Name, DSShuttleV2Slots);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AAEjC,MAAM,kBAAkB;AAExB,MAAM,mBAAmB;AAAA,EAC9B,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,eAAe;AAAA,EACf,cAAc;AAAA,EACd,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,EACzB,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,EACrB,iBAAiB;AAAA,EACjB,gCAAgC;AAAA,EAChC,gCAAgC;AAAA,EAChC,qCAAqC;AAAA,EACrC,0BAA0B;AAAA,EAC1B,2BAA2B;AAAA,EAC3B,qBAAqB;AAAA,EACrB,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,uBAAuB;AAAA,EACvB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,2BAA2B;AAAA,EAC3B,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,iBAAiB;AAAA,EACjB,uBAAuB;AAAA,EACvB,mCAAmC;AAAA,EACnC,sBAAsB;AACxB;AAEO,MAAM,6BAAyB,0CAAwB,iBAAiB,gBAAgB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -30,7 +30,6 @@ __export(itemMovementHelpers_exports, {
|
|
|
30
30
|
module.exports = __toCommonJS(itemMovementHelpers_exports);
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
32
|
var import_react = __toESM(require("react"));
|
|
33
|
-
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
34
33
|
var import_useStore = require("./useStore");
|
|
35
34
|
const useHandleMoveSelection = ({ isDestinationPanel }) => {
|
|
36
35
|
const currOnRemove = (0, import_useStore.usePropsStore)(
|
|
@@ -48,55 +47,45 @@ const useHandleMoveSelection = ({ isDestinationPanel }) => {
|
|
|
48
47
|
const otherOnSoftDelete = (0, import_useStore.usePropsStore)(
|
|
49
48
|
(state) => isDestinationPanel ? state.onSourceSoftDelete : state.onDestinationSoftDelete
|
|
50
49
|
);
|
|
51
|
-
const currSelectionMap = (0, import_useStore.
|
|
50
|
+
const currSelectionMap = (0, import_useStore.usePropsStore)(
|
|
52
51
|
(store) => isDestinationPanel ? store.destinationSelectionArray : store.sourceSelectionArray
|
|
53
52
|
);
|
|
54
53
|
const currOnSelectionChange = (0, import_useStore.usePropsStore)(
|
|
55
54
|
(state) => isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange
|
|
56
55
|
);
|
|
57
56
|
const otherPanelOnAdd = (0, import_useStore.usePropsStore)((state) => isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd);
|
|
58
|
-
const destinationSelectionArray = (0, import_useStore.
|
|
59
|
-
const sourceSelectionArray = (0, import_useStore.
|
|
57
|
+
const destinationSelectionArray = (0, import_useStore.usePropsStore)((store) => store.destinationSelectionItemArray);
|
|
58
|
+
const sourceSelectionArray = (0, import_useStore.usePropsStore)((store) => store.sourceSelectionItemArray);
|
|
60
59
|
const selectedItems = isDestinationPanel ? destinationSelectionArray : sourceSelectionArray;
|
|
61
|
-
const mutableSelectedItems = (0, import_ds_utilities.useMakeMutable)(selectedItems);
|
|
62
|
-
const mutableCurrSelectionMap = (0, import_ds_utilities.useMakeMutable)(currSelectionMap);
|
|
63
|
-
const mutableCurrOnSelectionChange = (0, import_ds_utilities.useMakeMutable)(currOnSelectionChange);
|
|
64
|
-
const mutableCurrOnRemove = (0, import_ds_utilities.useMakeMutable)(currOnRemove);
|
|
65
|
-
const mutableOtherOnAdd = (0, import_ds_utilities.useMakeMutable)(otherPanelOnAdd);
|
|
66
|
-
const mutableCurrOnSoftDelete = (0, import_ds_utilities.useMakeMutable)(currOnSoftDelete);
|
|
67
|
-
const mutableOtherOnSoftDelete = (0, import_ds_utilities.useMakeMutable)(otherOnSoftDelete);
|
|
68
|
-
const mutableCurrSoftDeletedItems = (0, import_ds_utilities.useMakeMutable)(currSoftDeletedItems);
|
|
69
|
-
const mutableOtherSoftDeletedItems = (0, import_ds_utilities.useMakeMutable)(otherSoftDeletedItems);
|
|
70
60
|
const moveSelection = import_react.default.useCallback(
|
|
71
61
|
(event) => {
|
|
72
62
|
event.preventDefault();
|
|
73
63
|
event.stopPropagation();
|
|
74
|
-
|
|
75
|
-
|
|
64
|
+
currOnRemove(selectedItems, { event });
|
|
65
|
+
otherPanelOnAdd(selectedItems, { event });
|
|
76
66
|
const currSoftDeletedMap = {};
|
|
77
67
|
const otherSoftDeletedMap = {};
|
|
78
|
-
|
|
68
|
+
currSelectionMap.forEach((id) => {
|
|
79
69
|
currSoftDeletedMap[id] = true;
|
|
80
70
|
otherSoftDeletedMap[id] = false;
|
|
81
71
|
});
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
72
|
+
currOnSoftDelete({ ...currSoftDeletedItems, ...currSoftDeletedMap }, { event });
|
|
73
|
+
otherOnSoftDelete({ ...otherSoftDeletedItems, ...otherSoftDeletedMap }, { event });
|
|
74
|
+
currOnSelectionChange({}, { event });
|
|
85
75
|
},
|
|
86
76
|
[
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
77
|
+
currOnRemove,
|
|
78
|
+
selectedItems,
|
|
79
|
+
otherPanelOnAdd,
|
|
80
|
+
currSelectionMap,
|
|
81
|
+
currOnSoftDelete,
|
|
82
|
+
currSoftDeletedItems,
|
|
83
|
+
otherOnSoftDelete,
|
|
84
|
+
otherSoftDeletedItems,
|
|
85
|
+
currOnSelectionChange
|
|
96
86
|
]
|
|
97
87
|
);
|
|
98
|
-
|
|
99
|
-
return import_react.default.useMemo(() => ({ moveSelection: mutableMoveSelection.current }), [mutableMoveSelection]);
|
|
88
|
+
return import_react.default.useMemo(() => ({ moveSelection }), [moveSelection]);
|
|
100
89
|
};
|
|
101
90
|
const useHandleMoveItem = ({ datum, datumInternalMeta, isDestinationPanel }) => {
|
|
102
91
|
const currSoftDeletedItems = (0, import_useStore.usePropsStore)(
|
|
@@ -115,36 +104,24 @@ const useHandleMoveItem = ({ datum, datumInternalMeta, isDestinationPanel }) =>
|
|
|
115
104
|
(state) => isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove
|
|
116
105
|
);
|
|
117
106
|
const otherPanelOnAdd = (0, import_useStore.usePropsStore)((state) => isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd);
|
|
118
|
-
const mutableCurrOnRemove = (0, import_ds_utilities.useMakeMutable)(currOnRemove);
|
|
119
|
-
const mutableOtherOnAdd = (0, import_ds_utilities.useMakeMutable)(otherPanelOnAdd);
|
|
120
|
-
const mutableCurrOnSoftDelete = (0, import_ds_utilities.useMakeMutable)(currOnSoftDelete);
|
|
121
|
-
const mutableOtherOnSoftDelete = (0, import_ds_utilities.useMakeMutable)(otherOnSoftDelete);
|
|
122
|
-
const mutableCurrSoftDeletedItems = (0, import_ds_utilities.useMakeMutable)(currSoftDeletedItems);
|
|
123
|
-
const mutableOtherSoftDeletedItems = (0, import_ds_utilities.useMakeMutable)(otherSoftDeletedItems);
|
|
124
107
|
const moveItem = import_react.default.useCallback(
|
|
125
108
|
(event) => {
|
|
126
109
|
event.preventDefault();
|
|
127
110
|
event.stopPropagation();
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
{ event }
|
|
133
|
-
);
|
|
134
|
-
mutableOtherOnSoftDelete.current(
|
|
135
|
-
{ ...mutableOtherSoftDeletedItems.current, [datumInternalMeta.hydratedId]: false },
|
|
136
|
-
{ event }
|
|
137
|
-
);
|
|
111
|
+
currOnRemove([datum], { event });
|
|
112
|
+
otherPanelOnAdd([datum], { event });
|
|
113
|
+
currOnSoftDelete({ ...currSoftDeletedItems, [datumInternalMeta.hydratedId]: true }, { event });
|
|
114
|
+
otherOnSoftDelete({ ...otherSoftDeletedItems, [datumInternalMeta.hydratedId]: false }, { event });
|
|
138
115
|
},
|
|
139
116
|
[
|
|
117
|
+
currOnRemove,
|
|
118
|
+
currOnSoftDelete,
|
|
119
|
+
currSoftDeletedItems,
|
|
140
120
|
datum,
|
|
141
121
|
datumInternalMeta.hydratedId,
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
mutableOtherOnAdd,
|
|
146
|
-
mutableOtherOnSoftDelete,
|
|
147
|
-
mutableOtherSoftDeletedItems
|
|
122
|
+
otherOnSoftDelete,
|
|
123
|
+
otherPanelOnAdd,
|
|
124
|
+
otherSoftDeletedItems
|
|
148
125
|
]
|
|
149
126
|
);
|
|
150
127
|
return moveItem;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/config/itemMovementHelpers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAkB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport React from 'react';\nimport { type DSButtonT } from '@elliemae/ds-button-v2';\nimport { type DSShuttleV2T } from '../react-desc-prop-types';\nimport { usePropsStore } from './useStore';\n\nexport const useHandleMoveSelection = ({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) => {\n const currOnRemove = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove,\n );\n const currSoftDeletedItems = usePropsStore((state) =>\n isDestinationPanel ? state.destinationSoftDeletedItems : state.sourceSoftDeletedItems,\n );\n const currOnSoftDelete = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationSoftDelete : state.onSourceSoftDelete,\n );\n const otherSoftDeletedItems = usePropsStore((state) =>\n isDestinationPanel ? state.sourceSoftDeletedItems : state.destinationSoftDeletedItems,\n );\n const otherOnSoftDelete = usePropsStore((state) =>\n isDestinationPanel ? state.onSourceSoftDelete : state.onDestinationSoftDelete,\n );\n const currSelectionMap = usePropsStore((store) =>\n isDestinationPanel ? store.destinationSelectionArray : store.sourceSelectionArray,\n );\n const currOnSelectionChange = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationSelectionChange : state.onSourceSelectionChange,\n );\n\n const otherPanelOnAdd = usePropsStore((state) => (isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd));\n\n const destinationSelectionArray = usePropsStore((store) => store.destinationSelectionItemArray);\n const sourceSelectionArray = usePropsStore((store) => store.sourceSelectionItemArray);\n const selectedItems = isDestinationPanel ? destinationSelectionArray : sourceSelectionArray;\n\n const moveSelection = React.useCallback(\n (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n event.preventDefault();\n event.stopPropagation();\n // movement\n currOnRemove(selectedItems, { event });\n otherPanelOnAdd(selectedItems, { event });\n // soft delete\n const currSoftDeletedMap: DSShuttleV2T.SoftDeletedMap = {};\n const otherSoftDeletedMap: DSShuttleV2T.SoftDeletedMap = {};\n currSelectionMap.forEach((id) => {\n currSoftDeletedMap[id] = true;\n otherSoftDeletedMap[id] = false;\n });\n currOnSoftDelete({ ...currSoftDeletedItems, ...currSoftDeletedMap }, { event });\n otherOnSoftDelete({ ...otherSoftDeletedItems, ...otherSoftDeletedMap }, { event });\n // cleanup\n currOnSelectionChange({}, { event });\n },\n [\n currOnRemove,\n selectedItems,\n otherPanelOnAdd,\n currSelectionMap,\n currOnSoftDelete,\n currSoftDeletedItems,\n otherOnSoftDelete,\n otherSoftDeletedItems,\n currOnSelectionChange,\n ],\n );\n return React.useMemo(() => ({ moveSelection: moveSelection }), [moveSelection]);\n};\n\nexport const useHandleMoveItem = ({ datum, datumInternalMeta, isDestinationPanel }: DSShuttleV2T.ItemMeta) => {\n const currSoftDeletedItems = usePropsStore((state) =>\n isDestinationPanel ? state.destinationSoftDeletedItems : state.sourceSoftDeletedItems,\n );\n const otherSoftDeletedItems = usePropsStore((state) =>\n isDestinationPanel ? state.sourceSoftDeletedItems : state.destinationSoftDeletedItems,\n );\n const currOnSoftDelete = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationSoftDelete : state.onSourceSoftDelete,\n );\n const otherOnSoftDelete = usePropsStore((state) =>\n isDestinationPanel ? state.onSourceSoftDelete : state.onDestinationSoftDelete,\n );\n\n const currOnRemove = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationRemove : state.onSourceRemove,\n );\n const otherPanelOnAdd = usePropsStore((state) => (isDestinationPanel ? state.onSourceAdd : state.onDestinationAdd));\n\n const moveItem = React.useCallback(\n (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLButtonElement>) => {\n event.preventDefault();\n event.stopPropagation();\n currOnRemove([datum], { event });\n otherPanelOnAdd([datum], { event });\n currOnSoftDelete({ ...currSoftDeletedItems, [datumInternalMeta.hydratedId]: true }, { event });\n otherOnSoftDelete({ ...otherSoftDeletedItems, [datumInternalMeta.hydratedId]: false }, { event });\n },\n [\n currOnRemove,\n currOnSoftDelete,\n currSoftDeletedItems,\n datum,\n datumInternalMeta.hydratedId,\n otherOnSoftDelete,\n otherPanelOnAdd,\n otherSoftDeletedItems,\n ],\n );\n return moveItem;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -29,7 +29,6 @@ __export(useFocusActionTrackers_exports, {
|
|
|
29
29
|
module.exports = __toCommonJS(useFocusActionTrackers_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
31
|
var import_react = require("react");
|
|
32
|
-
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
33
32
|
var import_constants = require("../../constants");
|
|
34
33
|
var import_useStore = require("../useStore");
|
|
35
34
|
const getMoveBtnActionByProxymity = (flags) => {
|
|
@@ -100,8 +99,7 @@ const getActionByProxymity = ({ flags, currentAction }) => {
|
|
|
100
99
|
return getParenBtnActionByProxymity(flags);
|
|
101
100
|
};
|
|
102
101
|
const useFocusActionTrackers = () => {
|
|
103
|
-
const
|
|
104
|
-
const mutableFocusItemAction = (0, import_ds_utilities.useMakeMutable)(focusItemAction);
|
|
102
|
+
const getFocusItemAction = (0, import_useStore.useInternalStore)((state) => state.getFocusItemAction);
|
|
105
103
|
const setFocusItemAction = (0, import_useStore.useInternalStore)((state) => state.setFocusItemAction);
|
|
106
104
|
const removeDragAndDropFromDestination = (0, import_useStore.usePropsStore)((state) => state.removeDragAndDropFromDestination);
|
|
107
105
|
const addDragAndDropFromSource = (0, import_useStore.usePropsStore)((state) => state.addDragAndDropFromSource);
|
|
@@ -112,11 +110,11 @@ const useFocusActionTrackers = () => {
|
|
|
112
110
|
const withDragAndDrop = isDestinationPanel && !removeDragAndDropFromDestination || !isDestinationPanel && addDragAndDropFromSource;
|
|
113
111
|
const { prevAction } = getActionByProxymity({
|
|
114
112
|
flags: { preventMove, preventDrilldown, withDragAndDrop },
|
|
115
|
-
currentAction:
|
|
113
|
+
currentAction: getFocusItemAction()
|
|
116
114
|
});
|
|
117
115
|
setFocusItemAction(prevAction);
|
|
118
116
|
},
|
|
119
|
-
[addDragAndDropFromSource,
|
|
117
|
+
[addDragAndDropFromSource, getFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction]
|
|
120
118
|
);
|
|
121
119
|
const trackFocusNextAction = (0, import_react.useCallback)(
|
|
122
120
|
({ isDestinationPanel, datumHydratables }) => {
|
|
@@ -125,15 +123,14 @@ const useFocusActionTrackers = () => {
|
|
|
125
123
|
const withDragAndDrop = isDestinationPanel && !removeDragAndDropFromDestination || !isDestinationPanel && addDragAndDropFromSource;
|
|
126
124
|
const { nextAction } = getActionByProxymity({
|
|
127
125
|
flags: { preventMove, preventDrilldown, withDragAndDrop },
|
|
128
|
-
currentAction:
|
|
126
|
+
currentAction: getFocusItemAction()
|
|
129
127
|
});
|
|
130
128
|
setFocusItemAction(nextAction);
|
|
131
129
|
},
|
|
132
|
-
[addDragAndDropFromSource,
|
|
130
|
+
[addDragAndDropFromSource, getFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction]
|
|
133
131
|
);
|
|
134
132
|
return (0, import_react.useMemo)(
|
|
135
133
|
() => ({
|
|
136
|
-
mutableFocusItemAction,
|
|
137
134
|
trackFocusActionMove: () => setFocusItemAction("move-btn"),
|
|
138
135
|
trackFocusActionDrilldown: () => setFocusItemAction("drilldown-btn"),
|
|
139
136
|
trackFocusActionDragAndDrop: () => setFocusItemAction("drag-n-drop"),
|
|
@@ -142,7 +139,7 @@ const useFocusActionTrackers = () => {
|
|
|
142
139
|
trackFocusPrevAction,
|
|
143
140
|
trackFocusNextAction
|
|
144
141
|
}),
|
|
145
|
-
[
|
|
142
|
+
[setFocusItemAction, trackFocusNextAction, trackFocusPrevAction]
|
|
146
143
|
);
|
|
147
144
|
};
|
|
148
145
|
//# sourceMappingURL=useFocusActionTrackers.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/config/useFocusTracker/useFocusActionTrackers.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useMemo, useCallback } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAqC;
|
|
4
|
+
"sourcesContent": ["import { useMemo, useCallback } from 'react';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { ACTIONS_FOCUSES } from '../../constants';\nimport { useInternalStore, usePropsStore } from '../useStore';\n\ntype ActionFlags = {\n preventDrilldown: boolean;\n withDragAndDrop: boolean;\n preventMove: boolean;\n};\ntype ActionByProxymity = {\n prevAction: (typeof ACTIONS_FOCUSES)[keyof typeof ACTIONS_FOCUSES];\n nextAction: (typeof ACTIONS_FOCUSES)[keyof typeof ACTIONS_FOCUSES];\n};\nconst getMoveBtnActionByProxymity = (flags: ActionFlags) => {\n // move button\n const { preventDrilldown, withDragAndDrop } = flags;\n const actionMap = { prevAction: '', nextAction: '' } as ActionByProxymity;\n // prev\n // drilldown if it exist\n // else drag n drop if it exist\n // else parent\n if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n else if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n // next\n // drag n drop if it exist\n // else parent\n if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n return actionMap;\n};\nconst getDragAndDropBtnActionByProxymity = (flags: ActionFlags) => {\n // Drag and drop handler\n const { preventMove, preventDrilldown } = flags;\n // next\n // always parent\n const actionMap = { prevAction: '', nextAction: ACTIONS_FOCUSES.PARENT } as ActionByProxymity;\n // prev\n // move if it exist\n // else drilldown if it exist\n // else parent\n if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;\n else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n return actionMap;\n};\nconst getDrilldownBtnActionByProxymity = (flags: ActionFlags) => {\n // Drilldown handler\n const { withDragAndDrop, preventMove } = flags;\n // prev\n // always parent\n const actionMap = { prevAction: ACTIONS_FOCUSES.PARENT, nextAction: '' } as ActionByProxymity;\n // next\n // move if it exist\n // else drag n drop if it exist\n // else parent\n if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;\n else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n return actionMap;\n};\nconst getParenBtnActionByProxymity = (flags: ActionFlags) => {\n // Parent handler\n const { preventDrilldown, withDragAndDrop, preventMove } = flags;\n const actionMap = { prevAction: '', nextAction: '' } as ActionByProxymity;\n // prev\n // drag n drop if it exist\n // else move if it exist\n // else drilldown if it exist\n // else parent\n if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n else if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;\n else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;\n // next\n // drilldown if it exist\n // else move if it exist\n // else drag n drop if it exist\n // else parent\n if (!preventDrilldown) actionMap.nextAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;\n else if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;\n else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;\n else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;\n return actionMap;\n};\nconst getActionByProxymity = ({ flags, currentAction }: { flags: ActionFlags; currentAction: string }) => {\n if (currentAction === ACTIONS_FOCUSES.MOVE_BTN) return getMoveBtnActionByProxymity(flags);\n if (currentAction === ACTIONS_FOCUSES.DRAG_N_DROP) return getDragAndDropBtnActionByProxymity(flags);\n if (currentAction === ACTIONS_FOCUSES.DRILLDOWN_BTN) return getDrilldownBtnActionByProxymity(flags);\n return getParenBtnActionByProxymity(flags);\n};\nexport const useFocusActionTrackers = () => {\n const getFocusItemAction = useInternalStore((state) => state.getFocusItemAction);\n const setFocusItemAction = useInternalStore((state) => state.setFocusItemAction);\n const removeDragAndDropFromDestination = usePropsStore((state) => state.removeDragAndDropFromDestination);\n const addDragAndDropFromSource = usePropsStore((state) => state.addDragAndDropFromSource);\n const trackFocusPrevAction = useCallback(\n ({ isDestinationPanel, datumHydratables }: DSShuttleV2T.ItemMeta) => {\n const preventMove = Boolean(datumHydratables.preventMove);\n const preventDrilldown = Boolean(datumHydratables.preventDrilldown);\n const withDragAndDrop =\n (isDestinationPanel && !removeDragAndDropFromDestination) || (!isDestinationPanel && addDragAndDropFromSource);\n const { prevAction } = getActionByProxymity({\n flags: { preventMove, preventDrilldown, withDragAndDrop },\n currentAction: getFocusItemAction(),\n });\n setFocusItemAction(prevAction);\n },\n [addDragAndDropFromSource, getFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction],\n );\n const trackFocusNextAction = useCallback(\n ({ isDestinationPanel, datumHydratables }: DSShuttleV2T.ItemMeta) => {\n const preventMove = Boolean(datumHydratables.preventMove);\n const preventDrilldown = Boolean(datumHydratables.preventDrilldown);\n const withDragAndDrop =\n (isDestinationPanel && !removeDragAndDropFromDestination) || (!isDestinationPanel && addDragAndDropFromSource);\n const { nextAction } = getActionByProxymity({\n flags: { preventMove, preventDrilldown, withDragAndDrop },\n currentAction: getFocusItemAction(),\n });\n setFocusItemAction(nextAction);\n },\n [addDragAndDropFromSource, getFocusItemAction, removeDragAndDropFromDestination, setFocusItemAction],\n );\n return useMemo(\n () => ({\n trackFocusActionMove: () => setFocusItemAction('move-btn'),\n trackFocusActionDrilldown: () => setFocusItemAction('drilldown-btn'),\n trackFocusActionDragAndDrop: () => setFocusItemAction('drag-n-drop'),\n trackFocusActionParent: () => setFocusItemAction('parent'),\n trackFocusActionReset: () => setFocusItemAction(''),\n trackFocusPrevAction,\n trackFocusNextAction,\n }),\n [setFocusItemAction, trackFocusNextAction, trackFocusPrevAction],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -29,40 +29,21 @@ __export(useFocusItemTracker_exports, {
|
|
|
29
29
|
module.exports = __toCommonJS(useFocusItemTracker_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
31
|
var import_react = require("react");
|
|
32
|
-
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
33
32
|
var import_useStore = require("../useStore");
|
|
34
33
|
var import_constants = require("../../constants/index");
|
|
35
34
|
const useFocusItemTracker = () => {
|
|
36
|
-
const
|
|
37
|
-
const mutableFocusItem = (0, import_ds_utilities.useMakeMutable)(focusItem);
|
|
35
|
+
const getFocusItem = (0, import_useStore.useInternalStore)((state) => state.getFocusItem);
|
|
38
36
|
const setFocusItem = (0, import_useStore.useInternalStore)((state) => state.setFocusItem);
|
|
39
|
-
const sourceData = (0, import_useStore.
|
|
40
|
-
const destinationData = (0, import_useStore.
|
|
37
|
+
const sourceData = (0, import_useStore.usePropsStore)((state) => state.sourceConfiguredData);
|
|
38
|
+
const destinationData = (0, import_useStore.usePropsStore)((state) => state.destinationConfiguredData);
|
|
41
39
|
const sourceWithLoadMore = (0, import_useStore.usePropsStore)((state) => state.sourceWithLoadMore);
|
|
42
40
|
const destinationWithLoadMore = (0, import_useStore.usePropsStore)((state) => state.destinationWithLoadMore);
|
|
43
41
|
const trackFocusPrevItem = (0, import_react.useCallback)(
|
|
44
42
|
({ isDestinationPanel }) => {
|
|
43
|
+
const focusItem = getFocusItem();
|
|
45
44
|
const referenceData = isDestinationPanel ? destinationData : sourceData;
|
|
46
45
|
const withLoadMore = isDestinationPanel ? destinationWithLoadMore : sourceWithLoadMore;
|
|
47
|
-
|
|
48
|
-
if (withLoadMore)
|
|
49
|
-
setFocusItem(
|
|
50
|
-
isDestinationPanel ? import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION : import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE
|
|
51
|
-
);
|
|
52
|
-
else {
|
|
53
|
-
const prevItemIndex = referenceData.length > 1 ? referenceData.length - 1 : 0;
|
|
54
|
-
const prevItem = referenceData[prevItemIndex];
|
|
55
|
-
setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(prevItem));
|
|
56
|
-
}
|
|
57
|
-
return;
|
|
58
|
-
}
|
|
59
|
-
if (mutableFocusItem.current === import_constants.ITEMS_FOCUSES.LAST) {
|
|
60
|
-
const prevItemIndex = referenceData.length > 2 ? referenceData.length - 2 : 0;
|
|
61
|
-
const prevItem = referenceData[prevItemIndex];
|
|
62
|
-
setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(prevItem));
|
|
63
|
-
return;
|
|
64
|
-
}
|
|
65
|
-
const currentItemIndex = referenceData.findIndex((currItem) => currItem.hydratedId === mutableFocusItem.current);
|
|
46
|
+
const currentItemIndex = referenceData.findIndex((currItem) => currItem.hydratedId === focusItem);
|
|
66
47
|
if (currentItemIndex === 0 && withLoadMore)
|
|
67
48
|
setFocusItem(isDestinationPanel ? import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION : import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE);
|
|
68
49
|
else if (currentItemIndex !== -1) {
|
|
@@ -75,31 +56,14 @@ const useFocusItemTracker = () => {
|
|
|
75
56
|
setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(prevItem));
|
|
76
57
|
}
|
|
77
58
|
},
|
|
78
|
-
[destinationData, destinationWithLoadMore,
|
|
59
|
+
[destinationData, destinationWithLoadMore, getFocusItem, setFocusItem, sourceData, sourceWithLoadMore]
|
|
79
60
|
);
|
|
80
61
|
const trackFocusNextItem = (0, import_react.useCallback)(
|
|
81
62
|
({ isDestinationPanel }) => {
|
|
63
|
+
const focusItem = getFocusItem();
|
|
82
64
|
const referenceData = isDestinationPanel ? destinationData : sourceData;
|
|
83
65
|
const withLoadMore = isDestinationPanel ? destinationWithLoadMore : sourceWithLoadMore;
|
|
84
|
-
|
|
85
|
-
const nextItemIndex = referenceData.length > 1 ? 1 : 0;
|
|
86
|
-
const nextItem = referenceData[nextItemIndex];
|
|
87
|
-
setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(nextItem));
|
|
88
|
-
return;
|
|
89
|
-
}
|
|
90
|
-
if (mutableFocusItem.current === import_constants.ITEMS_FOCUSES.LAST) {
|
|
91
|
-
if (withLoadMore)
|
|
92
|
-
setFocusItem(
|
|
93
|
-
isDestinationPanel ? import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION : import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE
|
|
94
|
-
);
|
|
95
|
-
else {
|
|
96
|
-
const nextItemIndex = 0;
|
|
97
|
-
const nextItem = referenceData[nextItemIndex];
|
|
98
|
-
setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(nextItem));
|
|
99
|
-
}
|
|
100
|
-
return;
|
|
101
|
-
}
|
|
102
|
-
const currentItemIndex = referenceData.findIndex((currItem) => currItem.hydratedId === mutableFocusItem.current);
|
|
66
|
+
const currentItemIndex = referenceData.findIndex((currItem) => currItem.hydratedId === focusItem);
|
|
103
67
|
if (currentItemIndex === referenceData.length - 1 && withLoadMore)
|
|
104
68
|
setFocusItem(isDestinationPanel ? import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION : import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE);
|
|
105
69
|
else if (currentItemIndex !== -1) {
|
|
@@ -112,21 +76,24 @@ const useFocusItemTracker = () => {
|
|
|
112
76
|
setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(nextItem));
|
|
113
77
|
}
|
|
114
78
|
},
|
|
115
|
-
[destinationData, destinationWithLoadMore,
|
|
79
|
+
[destinationData, destinationWithLoadMore, getFocusItem, setFocusItem, sourceData, sourceWithLoadMore]
|
|
116
80
|
);
|
|
117
81
|
return (0, import_react.useMemo)(
|
|
118
82
|
() => ({
|
|
119
|
-
mutableFocusItem,
|
|
120
83
|
trackFocusItem: (item) => setFocusItem(item.hydratedId),
|
|
121
84
|
trackFocusItemReset: () => setFocusItem(import_constants.ITEMS_FOCUSES.RESET),
|
|
122
|
-
trackFocusItemFirst: () => setFocusItem(import_constants.ITEMS_FOCUSES.
|
|
123
|
-
trackFocusItemLast: () => setFocusItem(
|
|
85
|
+
trackFocusItemFirst: ({ isDestinationPanel }) => setFocusItem(import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(isDestinationPanel ? destinationData[0] : sourceData[0])),
|
|
86
|
+
trackFocusItemLast: ({ isDestinationPanel }) => setFocusItem(
|
|
87
|
+
import_constants.ITEMS_FOCUSES.GET_SPECIFIC_ITEM(
|
|
88
|
+
isDestinationPanel ? destinationData[destinationData.length - 1] : sourceData[sourceData.length - 1]
|
|
89
|
+
)
|
|
90
|
+
),
|
|
124
91
|
trackFocusLoadMoreBtnDestination: () => setFocusItem(import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION),
|
|
125
92
|
trackFocusLoadMoreBtn: () => setFocusItem(import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE),
|
|
126
93
|
trackFocusPrevItem,
|
|
127
94
|
trackFocusNextItem
|
|
128
95
|
}),
|
|
129
|
-
[
|
|
96
|
+
[destinationData, setFocusItem, sourceData, trackFocusNextItem, trackFocusPrevItem]
|
|
130
97
|
);
|
|
131
98
|
};
|
|
132
99
|
//# sourceMappingURL=useFocusItemTracker.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/config/useFocusTracker/useFocusItemTracker.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useMemo, useCallback } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAqC;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useMemo, useCallback } from 'react';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { useInternalStore, usePropsStore } from '../useStore';\nimport { ITEMS_FOCUSES } from '../../constants/index';\n\nexport const useFocusItemTracker = () => {\n const getFocusItem = useInternalStore((state) => state.getFocusItem);\n const setFocusItem = useInternalStore((state) => state.setFocusItem);\n const sourceData = usePropsStore((state) => state.sourceConfiguredData);\n const destinationData = usePropsStore((state) => state.destinationConfiguredData);\n const sourceWithLoadMore = usePropsStore((state) => state.sourceWithLoadMore);\n const destinationWithLoadMore = usePropsStore((state) => state.destinationWithLoadMore);\n const trackFocusPrevItem = useCallback(\n ({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) => {\n const focusItem = getFocusItem();\n const referenceData = isDestinationPanel ? destinationData : sourceData;\n const withLoadMore = isDestinationPanel ? destinationWithLoadMore : sourceWithLoadMore;\n // loop logic\n const currentItemIndex = referenceData.findIndex((currItem) => currItem.hydratedId === focusItem);\n if (currentItemIndex === 0 && withLoadMore)\n setFocusItem(isDestinationPanel ? ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION : ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE);\n else if (currentItemIndex !== -1) {\n const prevItemIndex = currentItemIndex === 0 ? referenceData.length - 1 : currentItemIndex - 1;\n const prevItem = referenceData[prevItemIndex];\n setFocusItem(ITEMS_FOCUSES.GET_SPECIFIC_ITEM(prevItem));\n } else {\n const prevItemIndex = 0;\n const prevItem = referenceData[prevItemIndex];\n setFocusItem(ITEMS_FOCUSES.GET_SPECIFIC_ITEM(prevItem));\n }\n },\n [destinationData, destinationWithLoadMore, getFocusItem, setFocusItem, sourceData, sourceWithLoadMore],\n );\n const trackFocusNextItem = useCallback(\n ({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) => {\n const focusItem = getFocusItem();\n const referenceData = isDestinationPanel ? destinationData : sourceData;\n const withLoadMore = isDestinationPanel ? destinationWithLoadMore : sourceWithLoadMore;\n // focus loop logic\n const currentItemIndex = referenceData.findIndex((currItem) => currItem.hydratedId === focusItem);\n if (currentItemIndex === referenceData.length - 1 && withLoadMore)\n setFocusItem(isDestinationPanel ? ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION : ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE);\n else if (currentItemIndex !== -1) {\n const nextItemIndex = currentItemIndex === referenceData.length - 1 ? 0 : currentItemIndex + 1;\n const nextItem = referenceData[nextItemIndex];\n setFocusItem(ITEMS_FOCUSES.GET_SPECIFIC_ITEM(nextItem));\n } else {\n const nextItemIndex = referenceData.length - 1;\n const nextItem = referenceData[nextItemIndex];\n setFocusItem(ITEMS_FOCUSES.GET_SPECIFIC_ITEM(nextItem));\n }\n },\n [destinationData, destinationWithLoadMore, getFocusItem, setFocusItem, sourceData, sourceWithLoadMore],\n );\n return useMemo(\n () => ({\n trackFocusItem: (item: DSShuttleV2T.ConfiguredDatum) => setFocusItem(item.hydratedId),\n trackFocusItemReset: () => setFocusItem(ITEMS_FOCUSES.RESET),\n trackFocusItemFirst: ({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) =>\n setFocusItem(ITEMS_FOCUSES.GET_SPECIFIC_ITEM(isDestinationPanel ? destinationData[0] : sourceData[0])),\n trackFocusItemLast: ({ isDestinationPanel }: DSShuttleV2T.PanelMetaInfo) =>\n setFocusItem(\n ITEMS_FOCUSES.GET_SPECIFIC_ITEM(\n isDestinationPanel ? destinationData[destinationData.length - 1] : sourceData[sourceData.length - 1],\n ),\n ),\n trackFocusLoadMoreBtnDestination: () => setFocusItem(ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION),\n trackFocusLoadMoreBtn: () => setFocusItem(ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE),\n trackFocusPrevItem,\n trackFocusNextItem,\n }),\n [destinationData, setFocusItem, sourceData, trackFocusNextItem, trackFocusPrevItem],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAqC;AAErC,sBAAgD;AAChD,uBAA8B;AAEvB,MAAM,sBAAsB,MAAM;AACvC,QAAM,mBAAe,kCAAiB,CAAC,UAAU,MAAM,YAAY;AACnE,QAAM,mBAAe,kCAAiB,CAAC,UAAU,MAAM,YAAY;AACnE,QAAM,iBAAa,+BAAc,CAAC,UAAU,MAAM,oBAAoB;AACtE,QAAM,sBAAkB,+BAAc,CAAC,UAAU,MAAM,yBAAyB;AAChF,QAAM,yBAAqB,+BAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,8BAA0B,+BAAc,CAAC,UAAU,MAAM,uBAAuB;AACtF,QAAM,yBAAqB;AAAA,IACzB,CAAC,EAAE,mBAAmB,MAAkC;AACtD,YAAM,YAAY,aAAa;AAC/B,YAAM,gBAAgB,qBAAqB,kBAAkB;AAC7D,YAAM,eAAe,qBAAqB,0BAA0B;AAEpE,YAAM,mBAAmB,cAAc,UAAU,CAAC,aAAa,SAAS,eAAe,SAAS;AAChG,UAAI,qBAAqB,KAAK;AAC5B,qBAAa,qBAAqB,+BAAc,4BAA4B,+BAAc,oBAAoB;AAAA,eACvG,qBAAqB,IAAI;AAChC,cAAM,gBAAgB,qBAAqB,IAAI,cAAc,SAAS,IAAI,mBAAmB;AAC7F,cAAM,WAAW,cAAc;AAC/B,qBAAa,+BAAc,kBAAkB,QAAQ,CAAC;AAAA,MACxD,OAAO;AACL,cAAM,gBAAgB;AACtB,cAAM,WAAW,cAAc;AAC/B,qBAAa,+BAAc,kBAAkB,QAAQ,CAAC;AAAA,MACxD;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,yBAAyB,cAAc,cAAc,YAAY,kBAAkB;AAAA,EACvG;AACA,QAAM,yBAAqB;AAAA,IACzB,CAAC,EAAE,mBAAmB,MAAkC;AACtD,YAAM,YAAY,aAAa;AAC/B,YAAM,gBAAgB,qBAAqB,kBAAkB;AAC7D,YAAM,eAAe,qBAAqB,0BAA0B;AAEpE,YAAM,mBAAmB,cAAc,UAAU,CAAC,aAAa,SAAS,eAAe,SAAS;AAChG,UAAI,qBAAqB,cAAc,SAAS,KAAK;AACnD,qBAAa,qBAAqB,+BAAc,4BAA4B,+BAAc,oBAAoB;AAAA,eACvG,qBAAqB,IAAI;AAChC,cAAM,gBAAgB,qBAAqB,cAAc,SAAS,IAAI,IAAI,mBAAmB;AAC7F,cAAM,WAAW,cAAc;AAC/B,qBAAa,+BAAc,kBAAkB,QAAQ,CAAC;AAAA,MACxD,OAAO;AACL,cAAM,gBAAgB,cAAc,SAAS;AAC7C,cAAM,WAAW,cAAc;AAC/B,qBAAa,+BAAc,kBAAkB,QAAQ,CAAC;AAAA,MACxD;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,yBAAyB,cAAc,cAAc,YAAY,kBAAkB;AAAA,EACvG;AACA,aAAO;AAAA,IACL,OAAO;AAAA,MACL,gBAAgB,CAAC,SAAuC,aAAa,KAAK,UAAU;AAAA,MACpF,qBAAqB,MAAM,aAAa,+BAAc,KAAK;AAAA,MAC3D,qBAAqB,CAAC,EAAE,mBAAmB,MACzC,aAAa,+BAAc,kBAAkB,qBAAqB,gBAAgB,KAAK,WAAW,EAAE,CAAC;AAAA,MACvG,oBAAoB,CAAC,EAAE,mBAAmB,MACxC;AAAA,QACE,+BAAc;AAAA,UACZ,qBAAqB,gBAAgB,gBAAgB,SAAS,KAAK,WAAW,WAAW,SAAS;AAAA,QACpG;AAAA,MACF;AAAA,MACF,kCAAkC,MAAM,aAAa,+BAAc,yBAAyB;AAAA,MAC5F,uBAAuB,MAAM,aAAa,+BAAc,oBAAoB;AAAA,MAC5E;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,cAAc,YAAY,oBAAoB,kBAAkB;AAAA,EACpF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -29,16 +29,12 @@ __export(useFocusRegionTrackers_exports, {
|
|
|
29
29
|
module.exports = __toCommonJS(useFocusRegionTrackers_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
31
|
var import_react = require("react");
|
|
32
|
-
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
33
32
|
var import_useStore = require("../useStore");
|
|
34
33
|
var import_constants = require("../../constants/index");
|
|
35
34
|
const useFocusRegionTrackers = () => {
|
|
36
|
-
const focusRegion = (0, import_useStore.useInternalStore)((state) => state.focusRegion);
|
|
37
|
-
const mutableFocusRegion = (0, import_ds_utilities.useMakeMutable)(focusRegion);
|
|
38
35
|
const setFocusRegion = (0, import_useStore.useInternalStore)((state) => state.setFocusRegion);
|
|
39
36
|
return (0, import_react.useMemo)(
|
|
40
37
|
() => ({
|
|
41
|
-
mutableFocusRegion,
|
|
42
38
|
trackFocusRegionSourceHeader: () => setFocusRegion(import_constants.REGIONS_FOCUSES.SOURCE_HEADER),
|
|
43
39
|
trackFocusRegionSourcePanel: () => setFocusRegion(import_constants.REGIONS_FOCUSES.SOURCE_PANEL),
|
|
44
40
|
trackFocusRegionSourceBottom: () => setFocusRegion(import_constants.REGIONS_FOCUSES.SOURCE_BOTTOM),
|
|
@@ -81,7 +77,7 @@ const useFocusRegionTrackers = () => {
|
|
|
81
77
|
},
|
|
82
78
|
trackFocusRegionReset: () => setFocusRegion("")
|
|
83
79
|
}),
|
|
84
|
-
[
|
|
80
|
+
[setFocusRegion]
|
|
85
81
|
);
|
|
86
82
|
};
|
|
87
83
|
//# sourceMappingURL=useFocusRegionTrackers.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/config/useFocusTracker/useFocusRegionTrackers.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useMemo } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,
|
|
4
|
+
"sourcesContent": ["import { useMemo } from 'react';\nimport { useInternalStore } from '../useStore';\nimport { REGIONS_FOCUSES } from '../../constants/index';\n\nexport const useFocusRegionTrackers = () => {\n const setFocusRegion = useInternalStore((state) => state.setFocusRegion);\n return useMemo(\n () => ({\n trackFocusRegionSourceHeader: () => setFocusRegion(REGIONS_FOCUSES.SOURCE_HEADER),\n trackFocusRegionSourcePanel: () => setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL),\n trackFocusRegionSourceBottom: () => setFocusRegion(REGIONS_FOCUSES.SOURCE_BOTTOM),\n trackFocusRegionSourcePanelItem: () => setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM),\n trackFocusRegionSourcePanelFocusAll: () => setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM_MOVE_ALL),\n trackFocusRegionDestinationHeader: () => setFocusRegion(REGIONS_FOCUSES.DESTINATION_HEADER),\n trackFocusRegionDestinationPanel: () => setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL),\n trackFocusRegionDestinationBottom: () => setFocusRegion(REGIONS_FOCUSES.DESTINATION_BOTTOM),\n trackFocusRegionDestinationPanelItem: () => setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM),\n trackFocusRegionDestinationPanelFocusMoveAll: () =>\n setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM_MOVE_ALL),\n trackFocusRegionHeader: (isDestinationPanel: boolean) => {\n if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_HEADER);\n else setFocusRegion(REGIONS_FOCUSES.SOURCE_HEADER);\n },\n trackFocusRegionBottom: (isDestinationPanel: boolean) => {\n if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_BOTTOM);\n else setFocusRegion(REGIONS_FOCUSES.SOURCE_BOTTOM);\n },\n trackFocusRegionPanel: (isDestinationPanel: boolean) => {\n if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL);\n else setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL);\n },\n trackFocusRegionPanelItem: (isDestinationPanel: boolean) => {\n if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM);\n else setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM);\n },\n trackFocusRegionPanelFocusMoveAll: (isDestinationPanel: boolean) => {\n if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM_MOVE_ALL);\n else setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM_MOVE_ALL);\n },\n trackFocusRegionReset: () => setFocusRegion(''),\n }),\n [setFocusRegion],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,sBAAiC;AACjC,uBAAgC;AAEzB,MAAM,yBAAyB,MAAM;AAC1C,QAAM,qBAAiB,kCAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,aAAO;AAAA,IACL,OAAO;AAAA,MACL,8BAA8B,MAAM,eAAe,iCAAgB,aAAa;AAAA,MAChF,6BAA6B,MAAM,eAAe,iCAAgB,YAAY;AAAA,MAC9E,8BAA8B,MAAM,eAAe,iCAAgB,aAAa;AAAA,MAChF,iCAAiC,MAAM,eAAe,iCAAgB,iBAAiB;AAAA,MACvF,qCAAqC,MAAM,eAAe,iCAAgB,0BAA0B;AAAA,MACpG,mCAAmC,MAAM,eAAe,iCAAgB,kBAAkB;AAAA,MAC1F,kCAAkC,MAAM,eAAe,iCAAgB,iBAAiB;AAAA,MACxF,mCAAmC,MAAM,eAAe,iCAAgB,kBAAkB;AAAA,MAC1F,sCAAsC,MAAM,eAAe,iCAAgB,sBAAsB;AAAA,MACjG,8CAA8C,MAC5C,eAAe,iCAAgB,+BAA+B;AAAA,MAChE,wBAAwB,CAAC,uBAAgC;AACvD,YAAI;AAAoB,yBAAe,iCAAgB,kBAAkB;AAAA;AACpE,yBAAe,iCAAgB,aAAa;AAAA,MACnD;AAAA,MACA,wBAAwB,CAAC,uBAAgC;AACvD,YAAI;AAAoB,yBAAe,iCAAgB,kBAAkB;AAAA;AACpE,yBAAe,iCAAgB,aAAa;AAAA,MACnD;AAAA,MACA,uBAAuB,CAAC,uBAAgC;AACtD,YAAI;AAAoB,yBAAe,iCAAgB,iBAAiB;AAAA;AACnE,yBAAe,iCAAgB,YAAY;AAAA,MAClD;AAAA,MACA,2BAA2B,CAAC,uBAAgC;AAC1D,YAAI;AAAoB,yBAAe,iCAAgB,sBAAsB;AAAA;AACxE,yBAAe,iCAAgB,iBAAiB;AAAA,MACvD;AAAA,MACA,mCAAmC,CAAC,uBAAgC;AAClE,YAAI;AAAoB,yBAAe,iCAAgB,+BAA+B;AAAA;AACjF,yBAAe,iCAAgB,0BAA0B;AAAA,MAChE;AAAA,MACA,uBAAuB,MAAM,eAAe,EAAE;AAAA,IAChD;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
22
|
+
mod
|
|
23
|
+
));
|
|
24
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
|
+
var focusAndTabIndexManager_exports = {};
|
|
26
|
+
__export(focusAndTabIndexManager_exports, {
|
|
27
|
+
focusAndTabIndexManager: () => focusAndTabIndexManager
|
|
28
|
+
});
|
|
29
|
+
module.exports = __toCommonJS(focusAndTabIndexManager_exports);
|
|
30
|
+
var React = __toESM(require("react"));
|
|
31
|
+
var import_constants = require("../../constants");
|
|
32
|
+
const getElementFromState = (state) => {
|
|
33
|
+
const [focusRegion, focusItem, focusItemAction, get] = state;
|
|
34
|
+
const { getZustandRef } = get();
|
|
35
|
+
if (focusItem === import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE && (focusRegion === import_constants.REGIONS_FOCUSES.SOURCE_BOTTOM || focusRegion === import_constants.REGIONS_FOCUSES.SOURCE_PANEL_ITEM)) {
|
|
36
|
+
return getZustandRef([focusItem]);
|
|
37
|
+
}
|
|
38
|
+
if (focusItem === import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION && (focusRegion === import_constants.REGIONS_FOCUSES.DESTINATION_BOTTOM || focusRegion === import_constants.REGIONS_FOCUSES.DESTINATION_PANEL_ITEM)) {
|
|
39
|
+
return getZustandRef([focusItem]);
|
|
40
|
+
}
|
|
41
|
+
return getZustandRef([focusRegion, focusItem, focusItemAction]);
|
|
42
|
+
};
|
|
43
|
+
const isItem = (state) => state[2] === "parent" && state[1] !== import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_SOURCE && state[1] !== import_constants.ITEMS_FOCUSES.LOAD_MORE_BTN_DESTINATION;
|
|
44
|
+
const isMove = (state) => state[2] === "move-btn";
|
|
45
|
+
const isDrilldown = (state) => state[2] === "drilldown-btn";
|
|
46
|
+
const shouldApplyRovingTabIndex = (state) => isItem(state) || isMove(state) || isDrilldown(state);
|
|
47
|
+
const tabIndexManager = ({
|
|
48
|
+
selectedState,
|
|
49
|
+
previousSelectedState,
|
|
50
|
+
currentFocusedItem,
|
|
51
|
+
nextFocusedItem
|
|
52
|
+
}) => {
|
|
53
|
+
if (currentFocusedItem && shouldApplyRovingTabIndex(previousSelectedState)) {
|
|
54
|
+
currentFocusedItem.tabIndex = -1;
|
|
55
|
+
}
|
|
56
|
+
if (nextFocusedItem && shouldApplyRovingTabIndex(selectedState)) {
|
|
57
|
+
nextFocusedItem.tabIndex = 0;
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
const focusAndTabIndexManager = (selectedState, previousSelectedState) => {
|
|
61
|
+
const currentFocusedItem = getElementFromState(previousSelectedState);
|
|
62
|
+
const nextFocusedItem = getElementFromState(selectedState);
|
|
63
|
+
const get = selectedState[3];
|
|
64
|
+
const { setShouldFocusItemOnRender } = get();
|
|
65
|
+
tabIndexManager({ selectedState, previousSelectedState, currentFocusedItem, nextFocusedItem });
|
|
66
|
+
if (isItem(selectedState)) {
|
|
67
|
+
setShouldFocusItemOnRender(true);
|
|
68
|
+
} else {
|
|
69
|
+
setShouldFocusItemOnRender(false);
|
|
70
|
+
}
|
|
71
|
+
nextFocusedItem?.focus();
|
|
72
|
+
};
|
|
73
|
+
//# sourceMappingURL=focusAndTabIndexManager.js.map
|