@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
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useAutoCalculated/useDataStructure.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\n\ntype ConfigureDestinationConfig = {\n destinationData: DSShuttleV2T.Datum[];\n destinationSelectedItems: DSShuttleV2T.SelectionMap;\n destinationSoftDeletedItems: DSShuttleV2T.SoftDeletedMap;\n getId: DSShuttleV2T.PrimaryKeyHydraters['getId'];\n getPreventMove: DSShuttleV2T.FunctionalHydraters['getPreventMove'];\n};\nconst configureDestination = ({\n destinationData,\n destinationSelectedItems,\n destinationSoftDeletedItems,\n getId,\n getPreventMove,\n}: ConfigureDestinationConfig) => {\n const destinationSelectedItemsMap: Record<string, { datum: DSShuttleV2T.Datum; index: number }> = {};\n const destinationSelectionArray: DSShuttleV2T.PrimaryKeyHydratables['id'][] = [];\n const destinationSelectionableDataIds: DSShuttleV2T.PrimaryKeyHydratables['id'][] = [];\n\n const destinationSelectionItemArray: DSShuttleV2T.Datum[] = [];\n const destinationConfiguredData: DSShuttleV2T.ConfiguredDatum[] = [];\n const destinationSelectionableData: DSShuttleV2T.ConfiguredDatum[] = [];\n\n destinationData.forEach((datum, i) => {\n const hydratedId = getId(datum);\n const hydratedPreventMove = getPreventMove?.(datum, { isDestinationPanel: true }) ?? false;\n let isSelected = false;\n if (destinationSelectedItems[hydratedId] === true) {\n destinationSelectionItemArray.push(datum);\n destinationSelectionArray.push(hydratedId);\n isSelected = true;\n }\n let softDeleted = false;\n if (destinationSoftDeletedItems[hydratedId] === true) {\n softDeleted = true;\n }\n destinationSelectedItemsMap[hydratedId] = { datum, index: i };\n const configuredItem = {\n hydratedId,\n hydratedPreventMove,\n isSelected,\n softDeleted,\n original: datum,\n localIndex: i,\n isFirst: i === 0,\n isLast: i === destinationData.length - 1,\n } as const;\n destinationConfiguredData.push(configuredItem);\n if (!hydratedPreventMove && !softDeleted) {\n destinationSelectionableData.push(configuredItem);\n destinationSelectionableDataIds.push(`${hydratedId}`);\n }\n });\n const destinationHasMultipleSelectedItems = destinationSelectionArray.length >= 1;\n const destinationSelectionableIds = destinationSelectionableDataIds.join(' ');\n\n return {\n destinationSelectedItemsMap,\n destinationSelectionItemArray,\n destinationSelectionArray,\n destinationHasMultipleSelectedItems,\n destinationConfiguredData,\n destinationSelectionableData,\n destinationSelectionableDataIds,\n destinationSelectionableIds,\n };\n};\ntype ConfigureSourceConfig = {\n sourceData: DSShuttleV2T.Datum[];\n sourceSelectedItems: DSShuttleV2T.SelectionMap;\n sourceSoftDeletedItems: DSShuttleV2T.SoftDeletedMap;\n getId: DSShuttleV2T.PrimaryKeyHydraters['getId'];\n getPreventMove: DSShuttleV2T.FunctionalHydraters['getPreventMove'];\n};\n\nconst configureSource = ({\n sourceData,\n sourceSelectedItems,\n sourceSoftDeletedItems,\n getId,\n getPreventMove,\n}: ConfigureSourceConfig) => {\n const sourceSelectedItemsMap: Record<string, { datum: DSShuttleV2T.Datum; index: number }> = {};\n const sourceSelectionArray: DSShuttleV2T.PrimaryKeyHydratables['id'][] = [];\n const sourceSelectionableDataIds: DSShuttleV2T.PrimaryKeyHydratables['id'][] = [];\n\n const sourceSelectionItemArray: DSShuttleV2T.Datum[] = [];\n const sourceConfiguredData: DSShuttleV2T.ConfiguredDatum[] = [];\n const sourceSelectionableData: DSShuttleV2T.ConfiguredDatum[] = [];\n sourceData.forEach((datum, i) => {\n const hydratedId = getId(datum);\n const hydratedPreventMove = getPreventMove?.(datum, { isDestinationPanel: false }) ?? false;\n let isSelected = false;\n if (sourceSelectedItems[hydratedId] === true) {\n sourceSelectionItemArray.push(datum);\n sourceSelectionArray.push(hydratedId);\n isSelected = true;\n }\n let softDeleted = false;\n if (sourceSoftDeletedItems[hydratedId] === true) {\n softDeleted = true;\n }\n\n sourceSelectedItemsMap[hydratedId] = { datum, index: i };\n const configuredItem = {\n hydratedId,\n hydratedPreventMove,\n isSelected,\n softDeleted,\n original: datum,\n localIndex: i,\n isFirst: i === 0,\n isLast: i === sourceData.length - 1,\n } as const;\n sourceConfiguredData.push(configuredItem);\n if (!hydratedPreventMove && !softDeleted) {\n sourceSelectionableData.push(configuredItem);\n sourceSelectionableDataIds.push(`${hydratedId}`);\n }\n });\n const sourceHasMultipleSelectedItems = sourceSelectionArray.length >= 1;\n const sourceSelectionableIds = sourceSelectionableDataIds.join(' ');\n return {\n sourceConfiguredData,\n sourceSelectedItemsMap,\n sourceSelectionItemArray,\n sourceSelectionArray,\n sourceHasMultipleSelectedItems,\n sourceSelectionableData,\n sourceSelectionableDataIds,\n sourceSelectionableIds,\n };\n};\n\nexport const useDataStructure = (propsFromUser: DSShuttleV2T.InternalProps) => {\n const {\n sourceData,\n sourceSelectedItems,\n destinationData,\n destinationSelectedItems,\n getId,\n getPreventMove,\n sourceSoftDeletedItems,\n destinationSoftDeletedItems,\n } = propsFromUser;\n return useMemo(\n () => ({\n ...configureSource({ sourceData, sourceSelectedItems, sourceSoftDeletedItems, getId, getPreventMove }),\n ...configureDestination({\n destinationData,\n destinationSelectedItems,\n destinationSoftDeletedItems,\n getId,\n getPreventMove,\n }),\n }),\n [\n sourceData,\n sourceSelectedItems,\n sourceSoftDeletedItems,\n getId,\n getPreventMove,\n destinationData,\n destinationSelectedItems,\n destinationSoftDeletedItems,\n ],\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AAUxB,MAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAkC;AAChC,QAAM,8BAA4F,CAAC;AACnG,QAAM,4BAAwE,CAAC;AAC/E,QAAM,kCAA8E,CAAC;AAErF,QAAM,gCAAsD,CAAC;AAC7D,QAAM,4BAA4D,CAAC;AACnE,QAAM,+BAA+D,CAAC;AAEtE,kBAAgB,QAAQ,CAAC,OAAO,MAAM;AACpC,UAAM,aAAa,MAAM,KAAK;AAC9B,UAAM,sBAAsB,iBAAiB,OAAO,EAAE,oBAAoB,KAAK,CAAC,KAAK;AACrF,QAAI,aAAa;AACjB,QAAI,yBAAyB,UAAU,MAAM,MAAM;AACjD,oCAA8B,KAAK,KAAK;AACxC,gCAA0B,KAAK,UAAU;AACzC,mBAAa;AAAA,IACf;AACA,QAAI,cAAc;AAClB,QAAI,4BAA4B,UAAU,MAAM,MAAM;AACpD,oBAAc;AAAA,IAChB;AACA,gCAA4B,UAAU,IAAI,EAAE,OAAO,OAAO,EAAE;AAC5D,UAAM,iBAAiB;AAAA,MACrB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,SAAS,MAAM;AAAA,MACf,QAAQ,MAAM,gBAAgB,SAAS;AAAA,IACzC;AACA,8BAA0B,KAAK,cAAc;AAC7C,QAAI,CAAC,uBAAuB,CAAC,aAAa;AACxC,mCAA6B,KAAK,cAAc;AAChD,sCAAgC,KAAK,GAAG,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -5,68 +5,46 @@ import { useInternalStore, usePropsStore } from "../useStore/index.js";
|
|
|
5
5
|
const getMoveBtnActionByProxymity = (flags) => {
|
|
6
6
|
const { preventDrilldown, withDragAndDrop } = flags;
|
|
7
7
|
const actionMap = { prevAction: "", nextAction: "" };
|
|
8
|
-
if (!preventDrilldown)
|
|
9
|
-
|
|
10
|
-
else
|
|
11
|
-
|
|
12
|
-
else
|
|
13
|
-
actionMap.prevAction = ACTIONS_FOCUSES.PARENT;
|
|
14
|
-
if (withDragAndDrop)
|
|
15
|
-
actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
16
|
-
else
|
|
17
|
-
actionMap.nextAction = ACTIONS_FOCUSES.PARENT;
|
|
8
|
+
if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;
|
|
9
|
+
else if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
10
|
+
else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;
|
|
11
|
+
if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
12
|
+
else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;
|
|
18
13
|
return actionMap;
|
|
19
14
|
};
|
|
20
15
|
const getDragAndDropBtnActionByProxymity = (flags) => {
|
|
21
16
|
const { preventMove, preventDrilldown } = flags;
|
|
22
17
|
const actionMap = { prevAction: "", nextAction: ACTIONS_FOCUSES.PARENT };
|
|
23
|
-
if (!preventMove)
|
|
24
|
-
|
|
25
|
-
else
|
|
26
|
-
actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;
|
|
27
|
-
else
|
|
28
|
-
actionMap.prevAction = ACTIONS_FOCUSES.PARENT;
|
|
18
|
+
if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;
|
|
19
|
+
else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;
|
|
20
|
+
else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;
|
|
29
21
|
return actionMap;
|
|
30
22
|
};
|
|
31
23
|
const getDrilldownBtnActionByProxymity = (flags) => {
|
|
32
24
|
const { withDragAndDrop, preventMove } = flags;
|
|
33
25
|
const actionMap = { prevAction: ACTIONS_FOCUSES.PARENT, nextAction: "" };
|
|
34
|
-
if (!preventMove)
|
|
35
|
-
|
|
36
|
-
else
|
|
37
|
-
actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
38
|
-
else
|
|
39
|
-
actionMap.nextAction = ACTIONS_FOCUSES.PARENT;
|
|
26
|
+
if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;
|
|
27
|
+
else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
28
|
+
else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;
|
|
40
29
|
return actionMap;
|
|
41
30
|
};
|
|
42
31
|
const getParenBtnActionByProxymity = (flags) => {
|
|
43
32
|
const { preventDrilldown, withDragAndDrop, preventMove } = flags;
|
|
44
33
|
const actionMap = { prevAction: "", nextAction: "" };
|
|
45
|
-
if (withDragAndDrop)
|
|
46
|
-
|
|
47
|
-
else if (!
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
else
|
|
52
|
-
|
|
53
|
-
if (!preventDrilldown)
|
|
54
|
-
actionMap.nextAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;
|
|
55
|
-
else if (!preventMove)
|
|
56
|
-
actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;
|
|
57
|
-
else if (withDragAndDrop)
|
|
58
|
-
actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
59
|
-
else
|
|
60
|
-
actionMap.nextAction = ACTIONS_FOCUSES.PARENT;
|
|
34
|
+
if (withDragAndDrop) actionMap.prevAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
35
|
+
else if (!preventMove) actionMap.prevAction = ACTIONS_FOCUSES.MOVE_BTN;
|
|
36
|
+
else if (!preventDrilldown) actionMap.prevAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;
|
|
37
|
+
else actionMap.prevAction = ACTIONS_FOCUSES.PARENT;
|
|
38
|
+
if (!preventDrilldown) actionMap.nextAction = ACTIONS_FOCUSES.DRILLDOWN_BTN;
|
|
39
|
+
else if (!preventMove) actionMap.nextAction = ACTIONS_FOCUSES.MOVE_BTN;
|
|
40
|
+
else if (withDragAndDrop) actionMap.nextAction = ACTIONS_FOCUSES.DRAG_N_DROP;
|
|
41
|
+
else actionMap.nextAction = ACTIONS_FOCUSES.PARENT;
|
|
61
42
|
return actionMap;
|
|
62
43
|
};
|
|
63
44
|
const getActionByProxymity = ({ flags, currentAction }) => {
|
|
64
|
-
if (currentAction === ACTIONS_FOCUSES.MOVE_BTN)
|
|
65
|
-
|
|
66
|
-
if (currentAction === ACTIONS_FOCUSES.
|
|
67
|
-
return getDragAndDropBtnActionByProxymity(flags);
|
|
68
|
-
if (currentAction === ACTIONS_FOCUSES.DRILLDOWN_BTN)
|
|
69
|
-
return getDrilldownBtnActionByProxymity(flags);
|
|
45
|
+
if (currentAction === ACTIONS_FOCUSES.MOVE_BTN) return getMoveBtnActionByProxymity(flags);
|
|
46
|
+
if (currentAction === ACTIONS_FOCUSES.DRAG_N_DROP) return getDragAndDropBtnActionByProxymity(flags);
|
|
47
|
+
if (currentAction === ACTIONS_FOCUSES.DRILLDOWN_BTN) return getDrilldownBtnActionByProxymity(flags);
|
|
70
48
|
return getParenBtnActionByProxymity(flags);
|
|
71
49
|
};
|
|
72
50
|
const useFocusActionTrackers = () => {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useFocusTracker/useFocusActionTrackers.ts"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useCallback } from 'react';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { ACTIONS_FOCUSES } from '../../constants/index.js';\nimport { useInternalStore, usePropsStore } from '../useStore/index.js';\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, datumInternalMeta: { hydratedPreventMove } }: DSShuttleV2T.ItemMeta) => {\n const preventMove = Boolean(hydratedPreventMove);\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, datumInternalMeta: { hydratedPreventMove } }: DSShuttleV2T.ItemMeta) => {\n const preventMove = Boolean(hydratedPreventMove);\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"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,SAAS,mBAAmB;AAErC,SAAS,uBAAuB;AAChC,SAAS,kBAAkB,qBAAqB;AAWhD,MAAM,8BAA8B,CAAC,UAAuB;AAE1D,QAAM,EAAE,kBAAkB,gBAAgB,IAAI;AAC9C,QAAM,YAAY,EAAE,YAAY,IAAI,YAAY,GAAG;AAKnD,MAAI,CAAC
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -17,34 +17,24 @@ const useFocusRegionTrackers = () => {
|
|
|
17
17
|
trackFocusRegionDestinationPanelItem: () => setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM),
|
|
18
18
|
trackFocusRegionDestinationPanelFocusMoveAll: () => setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM_MOVE_ALL),
|
|
19
19
|
trackFocusRegionHeader: (isDestinationPanel) => {
|
|
20
|
-
if (isDestinationPanel)
|
|
21
|
-
|
|
22
|
-
else
|
|
23
|
-
setFocusRegion(REGIONS_FOCUSES.SOURCE_HEADER);
|
|
20
|
+
if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_HEADER);
|
|
21
|
+
else setFocusRegion(REGIONS_FOCUSES.SOURCE_HEADER);
|
|
24
22
|
},
|
|
25
23
|
trackFocusRegionBottom: (isDestinationPanel) => {
|
|
26
|
-
if (isDestinationPanel)
|
|
27
|
-
|
|
28
|
-
else
|
|
29
|
-
setFocusRegion(REGIONS_FOCUSES.SOURCE_BOTTOM);
|
|
24
|
+
if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_BOTTOM);
|
|
25
|
+
else setFocusRegion(REGIONS_FOCUSES.SOURCE_BOTTOM);
|
|
30
26
|
},
|
|
31
27
|
trackFocusRegionPanel: (isDestinationPanel) => {
|
|
32
|
-
if (isDestinationPanel)
|
|
33
|
-
|
|
34
|
-
else
|
|
35
|
-
setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL);
|
|
28
|
+
if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL);
|
|
29
|
+
else setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL);
|
|
36
30
|
},
|
|
37
31
|
trackFocusRegionPanelItem: (isDestinationPanel) => {
|
|
38
|
-
if (isDestinationPanel)
|
|
39
|
-
|
|
40
|
-
else
|
|
41
|
-
setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM);
|
|
32
|
+
if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM);
|
|
33
|
+
else setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM);
|
|
42
34
|
},
|
|
43
35
|
trackFocusRegionPanelFocusMoveAll: (isDestinationPanel) => {
|
|
44
|
-
if (isDestinationPanel)
|
|
45
|
-
|
|
46
|
-
else
|
|
47
|
-
setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM_MOVE_ALL);
|
|
36
|
+
if (isDestinationPanel) setFocusRegion(REGIONS_FOCUSES.DESTINATION_PANEL_ITEM_MOVE_ALL);
|
|
37
|
+
else setFocusRegion(REGIONS_FOCUSES.SOURCE_PANEL_ITEM_MOVE_ALL);
|
|
48
38
|
},
|
|
49
39
|
trackFocusRegionReset: () => setFocusRegion("")
|
|
50
40
|
}),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useFocusTracker/useFocusRegionTrackers.ts"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport { useInternalStore } from '../useStore/index.js';\nimport { REGIONS_FOCUSES } from '../../constants/index.js';\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"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AACxB,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAEzB,MAAM,yBAAyB,MAAM;AAC1C,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,SAAO;AAAA,IACL,OAAO;AAAA,MACL,8BAA8B,MAAM,eAAe,gBAAgB,aAAa;AAAA,MAChF,6BAA6B,MAAM,eAAe,gBAAgB,YAAY;AAAA,MAC9E,8BAA8B,MAAM,eAAe,gBAAgB,aAAa;AAAA,MAChF,iCAAiC,MAAM,eAAe,gBAAgB,iBAAiB;AAAA,MACvF,qCAAqC,MAAM,eAAe,gBAAgB,0BAA0B;AAAA,MACpG,mCAAmC,MAAM,eAAe,gBAAgB,kBAAkB;AAAA,MAC1F,kCAAkC,MAAM,eAAe,gBAAgB,iBAAiB;AAAA,MACxF,mCAAmC,MAAM,eAAe,gBAAgB,kBAAkB;AAAA,MAC1F,sCAAsC,MAAM,eAAe,gBAAgB,sBAAsB;AAAA,MACjG,8CAA8C,MAC5C,eAAe,gBAAgB,+BAA+B;AAAA,MAChE,wBAAwB,CAAC,uBAAgC;AACvD,YAAI
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AACxB,SAAS,wBAAwB;AACjC,SAAS,uBAAuB;AAEzB,MAAM,yBAAyB,MAAM;AAC1C,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,SAAO;AAAA,IACL,OAAO;AAAA,MACL,8BAA8B,MAAM,eAAe,gBAAgB,aAAa;AAAA,MAChF,6BAA6B,MAAM,eAAe,gBAAgB,YAAY;AAAA,MAC9E,8BAA8B,MAAM,eAAe,gBAAgB,aAAa;AAAA,MAChF,iCAAiC,MAAM,eAAe,gBAAgB,iBAAiB;AAAA,MACvF,qCAAqC,MAAM,eAAe,gBAAgB,0BAA0B;AAAA,MACpG,mCAAmC,MAAM,eAAe,gBAAgB,kBAAkB;AAAA,MAC1F,kCAAkC,MAAM,eAAe,gBAAgB,iBAAiB;AAAA,MACxF,mCAAmC,MAAM,eAAe,gBAAgB,kBAAkB;AAAA,MAC1F,sCAAsC,MAAM,eAAe,gBAAgB,sBAAsB;AAAA,MACjG,8CAA8C,MAC5C,eAAe,gBAAgB,+BAA+B;AAAA,MAChE,wBAAwB,CAAC,uBAAgC;AACvD,YAAI,mBAAoB,gBAAe,gBAAgB,kBAAkB;AAAA,YACpE,gBAAe,gBAAgB,aAAa;AAAA,MACnD;AAAA,MACA,wBAAwB,CAAC,uBAAgC;AACvD,YAAI,mBAAoB,gBAAe,gBAAgB,kBAAkB;AAAA,YACpE,gBAAe,gBAAgB,aAAa;AAAA,MACnD;AAAA,MACA,uBAAuB,CAAC,uBAAgC;AACtD,YAAI,mBAAoB,gBAAe,gBAAgB,iBAAiB;AAAA,YACnE,gBAAe,gBAAgB,YAAY;AAAA,MAClD;AAAA,MACA,2BAA2B,CAAC,uBAAgC;AAC1D,YAAI,mBAAoB,gBAAe,gBAAgB,sBAAsB;AAAA,YACxE,gBAAe,gBAAgB,iBAAiB;AAAA,MACvD;AAAA,MACA,mCAAmC,CAAC,uBAAgC;AAClE,YAAI,mBAAoB,gBAAe,gBAAgB,+BAA+B;AAAA,YACjF,gBAAe,gBAAgB,0BAA0B;AAAA,MAChE;AAAA,MACA,uBAAuB,MAAM,eAAe,EAAE;AAAA,IAChD;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -13,10 +13,8 @@ const StyledGripperButtonOrOverlay = styled("div", {
|
|
|
13
13
|
slot: DSShuttleV2Slots.DRAG_AND_DROP_HANDLE
|
|
14
14
|
})`
|
|
15
15
|
cursor: ${({ isActive, isDragOverlay, disabled }) => {
|
|
16
|
-
if (isActive || isDragOverlay)
|
|
17
|
-
|
|
18
|
-
if (disabled)
|
|
19
|
-
return "not-allowed";
|
|
16
|
+
if (isActive || isDragOverlay) return "grabbing";
|
|
17
|
+
if (disabled) return "not-allowed";
|
|
20
18
|
return "grab";
|
|
21
19
|
}};
|
|
22
20
|
outline: none;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Dnd/DndHandle.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\nimport React from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport type { useSortable } from '@elliemae/ds-drag-and-drop';\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport { DATA_TESTID } from '../../constants/index.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../config/DSShuttleV2Definitions.js';\nimport { usePropsStore } from '../../config/useStore/useStore.js';\n\nexport const StyledGripperButtonOrOverlay = styled('div', {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.DRAG_AND_DROP_HANDLE,\n})<{\n isActive: boolean;\n isDragOverlay?: boolean;\n disabled?: boolean;\n}>`\n cursor: ${({ isActive, isDragOverlay, disabled }) => {\n if (isActive || isDragOverlay) return 'grabbing';\n if (disabled) return 'not-allowed';\n return 'grab';\n }};\n outline: none;\n display: flex;\n align-items: center;\n touch-action: none;\n &:focus {\n outline: 1px solid brand-700;\n }\n`;\n\nexport const DragHandle: React.ComponentType<{\n id: string;\n innerRef: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;\n useSortableHelpers: ReturnType<typeof useSortable>;\n isDndActive: boolean;\n isDragging: boolean;\n disabled?: boolean;\n}> = (props) => {\n const { id, isDndActive, isDragging, disabled = false, innerRef, useSortableHelpers } = props;\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => props, [props]);\n\n return (\n <StyledGripperButtonOrOverlay\n {...(!disabled && useSortableHelpers\n ? {\n ...useSortableHelpers.listeners,\n ...useSortableHelpers.attributes,\n }\n : {})}\n aria-label=\"drag and drop handle\"\n isActive={isDndActive}\n innerRef={mergeRefs(innerRef, useSortableHelpers?.setActivatorNodeRef)}\n tabIndex={-1}\n data-testid={DATA_TESTID.SHUTTLE_DRAG_HANDLE}\n id={`${id}-drag-handle`}\n key={`${id}-drag-handle`}\n disabled={disabled}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <GripperVertical size=\"s\" color={isDragging || disabled ? ['neutral', '500'] : ['brand-primary', '800']} />\n </StyledGripperButtonOrOverlay>\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACgEjB;AAlBF;AA7CJ,OAAOA,YAAW;AAClB,SAAS,uBAAuB;AAEhC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAEvB,MAAM,+BAA+B,OAAO,OAAO;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA,YAKW,CAAC,EAAE,UAAU,eAAe,SAAS,MAAM;AACnD,MAAI,YAAY
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACgEjB;AAlBF;AA7CJ,OAAOA,YAAW;AAClB,SAAS,uBAAuB;AAEhC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAEvB,MAAM,+BAA+B,OAAO,OAAO;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA,YAKW,CAAC,EAAE,UAAU,eAAe,SAAS,MAAM;AACnD,MAAI,YAAY,cAAe,QAAO;AACtC,MAAI,SAAU,QAAO;AACrB,SAAO;AACT,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUI,MAAM,aAOR,CAAC,UAAU;AACd,QAAM,EAAE,IAAI,aAAa,YAAY,WAAW,OAAO,UAAU,mBAAmB,IAAI;AAExF,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,OAAO,CAAC,KAAK,CAAC;AAErE,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAI,CAAC,YAAY,qBACd;AAAA,QACE,GAAG,mBAAmB;AAAA,QACtB,GAAG,mBAAmB;AAAA,MACxB,IACA,CAAC;AAAA,MACL,cAAW;AAAA,MACX,UAAU;AAAA,MACV,UAAU,UAAU,UAAU,oBAAoB,mBAAmB;AAAA,MACrE,UAAU;AAAA,MACV,eAAa,YAAY;AAAA,MACzB,IAAI,GAAG,EAAE;AAAA,MACT,KAAK,GAAG,EAAE;AAAA,MACV;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEA,oBAAC,mBAAgB,MAAK,KAAI,OAAO,cAAc,WAAW,CAAC,WAAW,KAAK,IAAI,CAAC,iBAAiB,KAAK,GAAG;AAAA,EAC3G;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/Dnd/DragOverlay.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport { DATA_TESTID } from '../../constants/index.js';\nimport { StyledGripperButtonOrOverlay } from './DndHandle.js';\n\nexport const DragOverlay: React.ComponentType<{\n id: string;\n isDndActive: boolean;\n isDragging: boolean;\n}> = ({ id, isDragging, isDndActive }) => (\n <StyledGripperButtonOrOverlay\n isDragOverlay\n isActive={isDndActive}\n tabIndex={-1}\n data-testid={DATA_TESTID.SHUTTLE_DRAG_HANDLE}\n id={`${id}-drag-overlay`}\n key={`${id}-drag-overlay`}\n >\n <GripperVertical size=\"s\" color={isDragging ? ['neutral', '500'] : ['brand-primary', '800']} />\n </StyledGripperButtonOrOverlay>\n);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACkBnB;AAjBJ,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oCAAoC;AAEtC,MAAM,cAIR,CAAC,EAAE,IAAI,YAAY,YAAY,MAClC;AAAA,EAAC;AAAA;AAAA,IACC,eAAa;AAAA,IACb,UAAU;AAAA,IACV,UAAU;AAAA,IACV,eAAa,YAAY;AAAA,IACzB,IAAI,GAAG;AAAA,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACkBnB;AAjBJ,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oCAAoC;AAEtC,MAAM,cAIR,CAAC,EAAE,IAAI,YAAY,YAAY,MAClC;AAAA,EAAC;AAAA;AAAA,IACC,eAAa;AAAA,IACb,UAAU;AAAA,IACV,UAAU;AAAA,IACV,eAAa,YAAY;AAAA,IACzB,IAAI,GAAG,EAAE;AAAA,IAGT,8BAAC,mBAAgB,MAAK,KAAI,OAAO,aAAa,CAAC,WAAW,KAAK,IAAI,CAAC,iBAAiB,KAAK,GAAG;AAAA;AAAA,EAFxF,GAAG,EAAE;AAGZ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,8 +33,7 @@ const StyledIndicator = styled.div`
|
|
|
33
33
|
const CircleIndicator = (style, isDropValid) => /* @__PURE__ */ jsx("svg", { height: "6", width: "6", style, children: /* @__PURE__ */ jsx("circle", { cx: "3", cy: "3", r: "3", strokeWidth: "0", fill: isDropValid ? "#1E79C2" : "#C64252" }) });
|
|
34
34
|
const DropIndicator = (props) => {
|
|
35
35
|
const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;
|
|
36
|
-
if (dropIndicatorPosition === false || dropIndicatorPosition === DropIndicatorPosition.None)
|
|
37
|
-
return null;
|
|
36
|
+
if (dropIndicatorPosition === false || dropIndicatorPosition === DropIndicatorPosition.None) return null;
|
|
38
37
|
const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;
|
|
39
38
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
40
39
|
CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid),
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Dnd/DropIndicator.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { DropIndicatorPosition } from '../../constants/index.js';\ninterface DropIndicatorProps {\n vertical: boolean;\n dropIndicatorPosition: false | DSShuttleV2T.DropIndicatorPositionValues;\n isDropValid: boolean;\n isLast?: boolean;\n}\n\nconst getPositionStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => {\n if (vertical) {\n return `\n left: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n right: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n `;\n }\n return `\n top: ${dropIndicatorPosition === DropIndicatorPosition.Before ? '0' : 'unset'};\n bottom: ${dropIndicatorPosition === DropIndicatorPosition.After ? '0' : 'unset'};\n `;\n};\n\nconst getCircleStyles = ({ dropIndicatorPosition, vertical }: DropIndicatorProps) => ({\n position: 'absolute',\n top: vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n bottom: vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n left: !vertical || dropIndicatorPosition === DropIndicatorPosition.After ? 'unset' : '-2px',\n right: !vertical || dropIndicatorPosition === DropIndicatorPosition.Before ? 'unset' : '-2px',\n opacity: 1,\n});\n\nconst StyledIndicator = styled.div<DropIndicatorProps>`\n position: absolute;\n ${getPositionStyles}\n box-sizing: border-box;\n width: ${(props) => (props.vertical ? '2px' : '100%')};\n height: ${(props) => (props.vertical ? '100%' : '2px')};\n background-color: ${({ isDropValid, theme }) => (isDropValid ? theme.colors.brand[600] : theme.colors.danger[900])};\n`;\n\nconst CircleIndicator = (style: Record<string, unknown>, isDropValid: boolean) => (\n <svg height=\"6\" width=\"6\" style={style}>\n <circle cx=\"3\" cy=\"3\" r=\"3\" strokeWidth=\"0\" fill={isDropValid ? '#1E79C2' : '#C64252'} />\n </svg>\n);\n\nconst DropIndicator: React.ComponentType<DropIndicatorProps> = (props) => {\n const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;\n if (dropIndicatorPosition === false || dropIndicatorPosition === DropIndicatorPosition.None) return null;\n\n const safeDropIndicatorPosition = isLast ? DropIndicatorPosition.Before : dropIndicatorPosition;\n return (\n <>\n {CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid)}\n <StyledIndicator\n vertical={vertical}\n dropIndicatorPosition={safeDropIndicatorPosition}\n isDropValid={isDropValid}\n />\n </>\n );\n};\n\nexport { DropIndicator };\nexport default DropIndicator;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC4CnB,SAUA,UAVA,KAUA,YAVA;AA3CJ,SAAS,cAAc;AAEvB,SAAS,6BAA6B;AAQtC,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,sBAAsB,SAAS,MAAM;AAAA,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC4CnB,SAUA,UAVA,KAUA,YAVA;AA3CJ,SAAS,cAAc;AAEvB,SAAS,6BAA6B;AAQtC,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,sBAAsB,SAAS,MAAM,OAAO;AAAA,eACrE,0BAA0B,sBAAsB,QAAQ,MAAM,OAAO;AAAA;AAAA,EAElF;AACA,SAAO;AAAA,aACI,0BAA0B,sBAAsB,SAAS,MAAM,OAAO;AAAA,gBACnE,0BAA0B,sBAAsB,QAAQ,MAAM,OAAO;AAAA;AAErF;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,KAAK,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,sBAAsB,QAAQ,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,sBAAsB,SAAS,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,OAAO;AAAA;AAAA,IAE3B,iBAAiB;AAAA;AAAA,WAEV,CAAC,UAAW,MAAM,WAAW,QAAQ,MAAO;AAAA,YAC3C,CAAC,UAAW,MAAM,WAAW,SAAS,KAAM;AAAA,sBAClC,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,GAAG,IAAI,MAAM,OAAO,OAAO,GAAG,CAAE;AAAA;AAGpH,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,oBAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,8BAAC,YAAO,IAAG,KAAI,IAAG,KAAI,GAAE,KAAI,aAAY,KAAI,MAAM,cAAc,YAAY,WAAW,GACzF;AAGF,MAAM,gBAAyD,CAAC,UAAU;AACxE,QAAM,EAAE,UAAU,uBAAuB,QAAQ,YAAY,IAAI;AACjE,MAAI,0BAA0B,SAAS,0BAA0B,sBAAsB,KAAM,QAAO;AAEpG,QAAM,4BAA4B,SAAS,sBAAsB,SAAS;AAC1E,SACE,iCACG;AAAA,oBAAgB,gBAAgB,EAAE,GAAG,OAAO,uBAAuB,0BAA0B,CAAC,GAAG,WAAW;AAAA,IAC7G;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,uBAAuB;AAAA,QACvB;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAGA,IAAO,wBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/parts/Header.js
CHANGED
|
@@ -37,8 +37,7 @@ const Header = React2.memo((panelMetaInfo) => {
|
|
|
37
37
|
);
|
|
38
38
|
const cols = React2.useMemo(() => {
|
|
39
39
|
const finalCols = ["1fr"];
|
|
40
|
-
if (onSearchBarOpen)
|
|
41
|
-
finalCols.push("auto");
|
|
40
|
+
if (onSearchBarOpen) finalCols.push("auto");
|
|
42
41
|
return finalCols;
|
|
43
42
|
}, [onSearchBarOpen]);
|
|
44
43
|
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/Header.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { Search } from '@elliemae/ds-icons';\nimport {\n DSButtonV2,\n type DSButtonT,\n // BUTTON_SIZES\n} from '@elliemae/ds-button-v2';\nimport { styled } from '@elliemae/ds-system';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../config/DSShuttleV2Definitions.js';\nimport { usePropsStore } from '../config/useStore/index.js';\nimport { useFocusTracker } from '../config/useFocusTracker/index.js';\nimport { type DSShuttleV2T } from '../react-desc-prop-types.js';\nconst StyledIconButton = styled(DSButtonV2, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.HEADER_SEARCH_ICON })``;\nexport const Header = React.memo((panelMetaInfo: DSShuttleV2T.PanelMetaInfo) => {\n const { isDestinationPanel } = panelMetaInfo;\n const HeaderRenderer = usePropsStore((state) => (isDestinationPanel ? state.DestinationHeader : state.SourceHeader));\n const headerRendererProps = usePropsStore((state) =>\n isDestinationPanel ? state.destinationHeaderProps : state.sourceHeaderProps,\n );\n\n const onSearchBarOpen = usePropsStore((state) =>\n isDestinationPanel ? state.onDesinationOpenSearchbar : state.onSourceOpenSearchbar,\n );\n const isSearchBarOpen = usePropsStore((state) =>\n isDestinationPanel ? state.destinationShowSearchbar : state.sourceShowSearchbar,\n );\n const { trackFocusRegionHeader, trackFocusItemReset, trackFocusActionReset } = useFocusTracker();\n const onHeaderFocus = React.useCallback(() => {\n trackFocusRegionHeader(isDestinationPanel);\n trackFocusItemReset();\n trackFocusActionReset();\n }, [isDestinationPanel, trackFocusActionReset, trackFocusItemReset, trackFocusRegionHeader]);\n\n const handleFilterClick = React.useCallback(\n (event: Parameters<Required<DSButtonT.Props>['onClick']>[0]) => {\n onSearchBarOpen?.(!isSearchBarOpen, { event });\n },\n [isSearchBarOpen, onSearchBarOpen],\n );\n\n const cols = React.useMemo(() => {\n const finalCols = ['1fr'];\n if (onSearchBarOpen) finalCols.push('auto');\n return finalCols;\n }, [onSearchBarOpen]);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => panelMetaInfo, [panelMetaInfo]);\n\n return (\n <Grid onFocus={onHeaderFocus} cols={cols}>\n <HeaderRenderer {...headerRendererProps} />\n {onSearchBarOpen ? (\n <Grid alignItems=\"center\" justifyContent=\"center\">\n <StyledIconButton\n aria-label={`Toggle ${isDestinationPanel ? 'destination' : 'source'} panel filter bar`}\n buttonType=\"icon\"\n onClick={handleFilterClick}\n w={24}\n h={24}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <Search width=\"1.077rem\" height=\"1.077rem\" />\n </StyledIconButton>\n </Grid>\n ) : null}\n </Grid>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACmDnB,SACE,KADF;AAnDJ,OAAOA,UAAS,mBAAmB;AACnC,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAGK;AACP,SAAS,cAAc;AACvB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAEhC,MAAM,mBAAmB,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,mBAAmB,CAAC;AACzG,MAAM,SAASA,OAAM,KAAK,CAAC,kBAA8C;AAC9E,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,iBAAiB,cAAc,CAAC,UAAW,qBAAqB,MAAM,oBAAoB,MAAM,YAAa;AACnH,QAAM,sBAAsB;AAAA,IAAc,CAAC,UACzC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AAEA,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,qBAAqB,sBAAsB,IAAI,gBAAgB;AAC/F,QAAM,gBAAgBA,OAAM,YAAY,MAAM;AAC5C,2BAAuB,kBAAkB;AACzC,wBAAoB;AACpB,0BAAsB;AAAA,EACxB,GAAG,CAAC,oBAAoB,uBAAuB,qBAAqB,sBAAsB,CAAC;AAE3F,QAAM,oBAAoBA,OAAM;AAAA,IAC9B,CAAC,UAA+D;AAC9D,wBAAkB,CAAC,iBAAiB,EAAE,MAAM,CAAC;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,OAAOA,OAAM,QAAQ,MAAM;AAC/B,UAAM,YAAY,CAAC,KAAK;AACxB,QAAI
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACmDnB,SACE,KADF;AAnDJ,OAAOA,UAAS,mBAAmB;AACnC,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAGK;AACP,SAAS,cAAc;AACvB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAEhC,MAAM,mBAAmB,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,mBAAmB,CAAC;AACzG,MAAM,SAASA,OAAM,KAAK,CAAC,kBAA8C;AAC9E,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,iBAAiB,cAAc,CAAC,UAAW,qBAAqB,MAAM,oBAAoB,MAAM,YAAa;AACnH,QAAM,sBAAsB;AAAA,IAAc,CAAC,UACzC,qBAAqB,MAAM,yBAAyB,MAAM;AAAA,EAC5D;AAEA,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AACA,QAAM,kBAAkB;AAAA,IAAc,CAAC,UACrC,qBAAqB,MAAM,2BAA2B,MAAM;AAAA,EAC9D;AACA,QAAM,EAAE,wBAAwB,qBAAqB,sBAAsB,IAAI,gBAAgB;AAC/F,QAAM,gBAAgBA,OAAM,YAAY,MAAM;AAC5C,2BAAuB,kBAAkB;AACzC,wBAAoB;AACpB,0BAAsB;AAAA,EACxB,GAAG,CAAC,oBAAoB,uBAAuB,qBAAqB,sBAAsB,CAAC;AAE3F,QAAM,oBAAoBA,OAAM;AAAA,IAC9B,CAAC,UAA+D;AAC9D,wBAAkB,CAAC,iBAAiB,EAAE,MAAM,CAAC;AAAA,IAC/C;AAAA,IACA,CAAC,iBAAiB,eAAe;AAAA,EACnC;AAEA,QAAM,OAAOA,OAAM,QAAQ,MAAM;AAC/B,UAAM,YAAY,CAAC,KAAK;AACxB,QAAI,gBAAiB,WAAU,KAAK,MAAM;AAC1C,WAAO;AAAA,EACT,GAAG,CAAC,eAAe,CAAC;AAEpB,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,YAAY,MAAM,eAAe,CAAC,aAAa,CAAC;AAE/E,SACE,qBAAC,QAAK,SAAS,eAAe,MAC5B;AAAA,wBAAC,kBAAgB,GAAG,qBAAqB;AAAA,IACxC,kBACC,oBAAC,QAAK,YAAW,UAAS,gBAAe,UACvC;AAAA,MAAC;AAAA;AAAA,QACC,cAAY,UAAU,qBAAqB,gBAAgB,QAAQ;AAAA,QACnE,YAAW;AAAA,QACX,SAAS;AAAA,QACT,GAAG;AAAA,QACH,GAAG;AAAA,QACH;AAAA,QACA;AAAA,QAEA,8BAAC,UAAO,OAAM,YAAW,QAAO,YAAW;AAAA;AAAA,IAC7C,GACF,IACE;AAAA,KACN;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -64,8 +64,7 @@ const withConditionalDnDRowContext = (Component) => (props) => {
|
|
|
64
64
|
setIsDropValid(isDropValid);
|
|
65
65
|
setDndDraggingItem(activeItem?.original ?? null);
|
|
66
66
|
setDropIndicatorPosition(dropIndicatorPosition);
|
|
67
|
-
if (!active)
|
|
68
|
-
setDndDraggingItemMeta(null);
|
|
67
|
+
if (!active) setDndDraggingItemMeta(null);
|
|
69
68
|
}, [
|
|
70
69
|
active,
|
|
71
70
|
activeItem,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/HoC/withConditionalDnDRowContext.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent */\n/* eslint-disable max-statements */\n/* eslint-disable max-params */\n/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useContext, useEffect } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { ThemeContext } from '@xstyled/styled-components';\nimport type { DnDKitTree } from '@elliemae/ds-drag-and-drop';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore/index.js';\nimport type { DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { ItemOverlay } from '../Item/ItemOverlay.js';\n\n// create a type omittting height from PanelMetaInfo\ntype HoCConfig = DSShuttleV2T.PanelMetaInfo;\ntype InternalHoCStates = {\n activeId?: DSShuttleV2T.HydratedId;\n overId?: DSShuttleV2T.HydratedId;\n isDropValid?: boolean;\n};\ntype ResultComponentProps = DSShuttleV2T.PanelMetaInfo & InternalHoCStates;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: TypescriptHelpersT.ReactFunctionalHOCWithDifferentInterface<\n HoCConfig,\n ResultComponentProps\n> = (Component) => (props) => {\n const { isDestinationPanel } = props;\n const itemList = usePropsStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n const theme = useContext(ThemeContext);\n\n const setDndDraggingItemMeta = useInternalStore((state) => state.setDndDraggingItemMeta);\n const dndDraggingItemMeta = useInternalStore((state) => state.dndDraggingItemMeta);\n const setOverId = useInternalStore((state) => state.setOverId);\n const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\n const setDndDraggingItem = useInternalStore((state) => state.setDndDraggingItem);\n const setLastActiveId = useInternalStore((state) => state.setLastActiveId);\n const setDropIndicatorPosition = useInternalStore((state) => state.setDropIndicatorPosition);\n\n const onItemsReorder = usePropsStore((state) =>\n isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder,\n );\n\n const onReorder: DnDKitTree.OnReorder<DSShuttleV2T.ConfiguredDatum> = useCallback(\n (dndActive, targetIndex, metadata) => {\n // eslint-disable-next-line no-unused-vars\n const { considerExpanding, over: dndOver, ...dndData } = metadata;\n const over = dndOver.original.original;\n const active = dndActive.original.original;\n const cleanedMetaData = { ...dndData, over, active, targetIndex };\n onItemsReorder(active, cleanedMetaData);\n },\n [onItemsReorder],\n );\n\n const treeConfig = React.useMemo(() => {\n const configuredItemList = itemList.map((item, i) => ({\n // dnd\n uid: item.hydratedId,\n depth: 0,\n parentId: null,\n realIndex: i,\n childrenCount: 0,\n original: item,\n subitems: [],\n index: i,\n }));\n return {\n flattenedItems: configuredItemList,\n isHorizontalDnD: false,\n isExpandable: false,\n onReorder,\n maxDragAndDropLevel: 0,\n getIsDropValid: () => true,\n };\n }, [itemList, onReorder]);\n\n const { dndContextProps, sortableContextProps, activeItem, active, over, dropIndicatorPosition, isDropValid } =\n useTreeDndkitConfig(treeConfig);\n\n const containerSortableContextProps = sortableContextProps.root;\n\n useEffect(() => {\n setLastActiveId(active?.id?.toString() ?? '');\n setOverId(over?.id?.toString() ?? '');\n setIsDropValid(isDropValid);\n setDndDraggingItem(activeItem?.original ?? null);\n setDropIndicatorPosition(dropIndicatorPosition);\n if (!active) setDndDraggingItemMeta(null);\n }, [\n active,\n activeItem,\n dropIndicatorPosition,\n isDropValid,\n over,\n setDndDraggingItem,\n setDndDraggingItemMeta,\n setDropIndicatorPosition,\n setIsDropValid,\n setLastActiveId,\n setOverId,\n ]);\n\n if (withDragNDrop)\n return (\n <DndContext {...dndContextProps}>\n <SortableContext {...containerSortableContextProps}>\n <Component {...props} />\n {createPortal(\n <DragOverlay style={{ width: 'auto' }} zIndex={theme.zIndex.tooltip}>\n <>{dndDraggingItemMeta ? <ItemOverlay {...dndDraggingItemMeta} /> : null}</>\n </DragOverlay>,\n document.body,\n )}\n </SortableContext>\n </DndContext>\n );\n return <Component {...props} />;\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACiHf,SAIM,UAHJ,KADF;AA7GR,OAAOA,UAAS,aAAa,YAAY,iBAAiB;AAE1D,SAAS,oBAAoB;AAE7B,SAAS,YAAY,aAAa,iBAAiB,2BAA2B;AAC9E,SAAS,oBAAoB;AAC7B,SAAS,kBAAkB,qBAAqB;AAEhD,SAAS,mBAAmB;AAYrB,MAAM,+BAGT,CAAC,cAAc,CAAC,UAAU;AAC5B,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,WAAW;AAAA,IAAc,CAAC,UAC9B,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,gBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AACA,QAAM,QAAQ,WAAW,YAAY;AAErC,QAAM,yBAAyB,iBAAiB,CAAC,UAAU,MAAM,sBAAsB;AACvF,QAAM,sBAAsB,iBAAiB,CAAC,UAAU,MAAM,mBAAmB;AACjF,QAAM,YAAY,iBAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,qBAAqB,iBAAiB,CAAC,UAAU,MAAM,kBAAkB;AAC/E,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,2BAA2B,iBAAiB,CAAC,UAAU,MAAM,wBAAwB;AAE3F,QAAM,iBAAiB;AAAA,IAAc,CAAC,UACpC,qBAAqB,MAAM,uBAAuB,MAAM;AAAA,EAC1D;AAEA,QAAM,YAAgE;AAAA,IACpE,CAAC,WAAW,aAAa,aAAa;AAEpC,YAAM,EAAE,mBAAmB,MAAM,SAAS,GAAG,QAAQ,IAAI;AACzD,YAAMC,QAAO,QAAQ,SAAS;AAC9B,YAAMC,UAAS,UAAU,SAAS;AAClC,YAAM,kBAAkB,EAAE,GAAG,SAAS,MAAAD,OAAM,QAAAC,SAAQ,YAAY;AAChE,qBAAeA,SAAQ,eAAe;AAAA,IACxC;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,QAAM,aAAaF,OAAM,QAAQ,MAAM;AACrC,UAAM,qBAAqB,SAAS,IAAI,CAAC,MAAM,OAAO;AAAA;AAAA,MAEpD,KAAK,KAAK;AAAA,MACV,OAAO;AAAA,MACP,UAAU;AAAA,MACV,WAAW;AAAA,MACX,eAAe;AAAA,MACf,UAAU;AAAA,MACV,UAAU,CAAC;AAAA,MACX,OAAO;AAAA,IACT,EAAE;AACF,WAAO;AAAA,MACL,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,MACjB,cAAc;AAAA,MACd;AAAA,MACA,qBAAqB;AAAA,MACrB,gBAAgB,MAAM;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,UAAU,SAAS,CAAC;AAExB,QAAM,EAAE,iBAAiB,sBAAsB,YAAY,QAAQ,MAAM,uBAAuB,YAAY,IAC1G,oBAAoB,UAAU;AAEhC,QAAM,gCAAgC,qBAAqB;AAE3D,YAAU,MAAM;AACd,oBAAgB,QAAQ,IAAI,SAAS,KAAK,EAAE;AAC5C,cAAU,MAAM,IAAI,SAAS,KAAK,EAAE;AACpC,mBAAe,WAAW;AAC1B,uBAAmB,YAAY,YAAY,IAAI;AAC/C,6BAAyB,qBAAqB;AAC9C,QAAI,CAAC
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React", "over", "active"]
|
|
7
7
|
}
|
|
@@ -89,8 +89,7 @@ const Item = React2.memo((itemMeta) => {
|
|
|
89
89
|
const { datumInternalMeta, withDragNDrop, useSortableHelpers, hasMultipleSelection } = itemMeta;
|
|
90
90
|
const { isSelected, hydratedId, softDeleted } = datumInternalMeta;
|
|
91
91
|
const cols = useMemo(() => {
|
|
92
|
-
if (withDragNDrop)
|
|
93
|
-
return ["5px", "auto", "1fr", "auto"];
|
|
92
|
+
if (withDragNDrop) return ["5px", "auto", "1fr", "auto"];
|
|
94
93
|
return ["5px", "1fr", "auto"];
|
|
95
94
|
}, [withDragNDrop]);
|
|
96
95
|
const setDndDraggingItemMeta = useInternalStore((state) => state.setDndDraggingItemMeta);
|
|
@@ -99,8 +98,7 @@ const Item = React2.memo((itemMeta) => {
|
|
|
99
98
|
React2.useEffect(() => {
|
|
100
99
|
if (isDraggingThisItem) {
|
|
101
100
|
setDndDraggingItemMeta((prevItemMeta) => {
|
|
102
|
-
if (prevItemMeta?.datumInternalMeta.hydratedId === hydratedId)
|
|
103
|
-
return prevItemMeta;
|
|
101
|
+
if (prevItemMeta?.datumInternalMeta.hydratedId === hydratedId) return prevItemMeta;
|
|
104
102
|
return itemMeta;
|
|
105
103
|
});
|
|
106
104
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/Item.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-statements */\nimport React, { useMemo } from 'react';\nimport { useHeadlessTooltip } from '@elliemae/ds-utilities';\nimport { styled, css } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\n\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../config/DSShuttleV2Definitions.js';\nimport { useInternalStore, usePropsStore } from '../../config/useStore/index.js';\nimport { ItemSelection } from './ItemSelection.js';\nimport { ItemActions } from './ItemActions/index.js';\nimport { ItemMiddleSection } from './ItemMiddleSection.js';\nimport { useSelectionLogic } from './useSelectionLogic.js';\nimport { useItemArrowNavigation } from './useItemArrowNavigation.js';\nimport { REGIONS_FOCUSES } from '../../constants/index.js';\nimport { DragHandle } from '../Dnd/DndHandle.js';\nimport { DropIndicator } from '../Dnd/DropIndicator.js';\nimport { withConditionalUseSortable } from '../HoC/withConditionalUseSortable.js';\nimport { useInnerRefHandlers as useInnerRefActionHandlers } from './ItemActions/useInnerRefHandlers.js';\nimport { useItemKeyboardSelection } from './useItemKeyboardSelection.js';\nimport { useThisItemIsFocused } from './useThisItemIsFocused.js';\n\n// we are using the class-name added via slot for the children `:hover` styling of icon colors\nconst cssDisabled = css`\n background-color: ${({ theme }) => theme.colors.neutral['100']};\n color: ${({ theme }) => theme.colors.neutral['300']};\n .DSShuttleV2-item-action-btn-to-source-icon > svg,\n .DSShuttleV2-item-action-btn-to-destination-icon > svg,\n .DSShuttleV2-item-action-btn-drilldown-icon > svg {\n fill: ${({ theme }) => theme.colors.neutral['300']};\n }\n`;\n\nconst focusRing = css`\n outline: 2px solid ${({ theme }) => theme.colors.brand['700']};\n outline-offset: -2px;\n`;\ninterface ItemWrapperT {\n isDragging: boolean;\n isDndActive: boolean;\n hasFocusRing: boolean;\n}\n\nconst ItemWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_WRAPPER })<ItemWrapperT>`\n min-height: 2.769rem;\n position: relative;\n background-color: white;\n &:hover {\n background-color: ${({ isDndActive, theme }) => (!isDndActive ? theme.colors.brand['200'] : 'white')};\n .DSShuttleV2-item-action-btn-to-source-icon > svg,\n .DSShuttleV2-item-action-btn-to-destination-icon > svg,\n .DSShuttleV2-item-action-btn-drilldown-icon > svg {\n fill: brand-700;\n }\n ${({ isDragging }) => isDragging && cssDisabled}\n }\n\n ${({ hasFocusRing }) => hasFocusRing && focusRing}\n\n border-bottom: 1px solid neutral-100;\n\n ${({ isDragging }) => isDragging && cssDisabled}\n`;\n\nconst ItemSelectionWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_CHECKBOX })`\n height: 100%;\n &:focus {\n outline: none;\n }\n`;\n\nconst useInnerRefHandlers = (itemMeta: DSShuttleV2T.ItemMeta) => {\n const { datumInternalMeta, isDestinationPanel } = itemMeta;\n const { hydratedId } = datumInternalMeta;\n const setZustandRef = useInternalStore((state) => state.setZustandRef);\n\n const setDeferFocusUntilFirstRender = useInternalStore((state) => state.setDeferFocusUntilFirstRender);\n const getDeferFocusUntilFirstRender = useInternalStore((state) => state.getDeferFocusUntilFirstRender);\n\n const thisItemIsFocused = useThisItemIsFocused(itemMeta);\n\n const currRegion = isDestinationPanel ? REGIONS_FOCUSES.DESTINATION_PANEL_ITEM : REGIONS_FOCUSES.SOURCE_PANEL_ITEM;\n const currItemId = hydratedId;\n\n const innerRefHandlerParentItem = React.useCallback(\n (node: HTMLDivElement | null) => {\n setZustandRef([currRegion, currItemId, 'parent'], node);\n\n if (getDeferFocusUntilFirstRender() && thisItemIsFocused && node) {\n node?.focus();\n setDeferFocusUntilFirstRender(false);\n }\n },\n [\n setZustandRef,\n currRegion,\n currItemId,\n getDeferFocusUntilFirstRender,\n thisItemIsFocused,\n setDeferFocusUntilFirstRender,\n ],\n );\n return React.useMemo(() => ({ innerRefHandlerParentItem }), [innerRefHandlerParentItem]);\n};\n\nexport const Item = React.memo((itemMeta: DSShuttleV2T.ItemMeta) => {\n const { datumInternalMeta, withDragNDrop, useSortableHelpers, hasMultipleSelection } = itemMeta;\n const { isSelected, hydratedId, softDeleted } = datumInternalMeta;\n\n const cols = useMemo(() => {\n if (withDragNDrop) return ['5px', 'auto', '1fr', 'auto'];\n return ['5px', '1fr', 'auto'];\n }, [withDragNDrop]);\n\n const setDndDraggingItemMeta = useInternalStore((state) => state.setDndDraggingItemMeta);\n const getIsDragAndDropHappening = useInternalStore((state) => state.getIsDragAndDropHappening);\n const isDraggingThisItem = useInternalStore((state) => state.dndDraggingItem?.hydratedId === hydratedId);\n\n React.useEffect(() => {\n if (isDraggingThisItem) {\n setDndDraggingItemMeta((prevItemMeta) => {\n if (prevItemMeta?.datumInternalMeta.hydratedId === hydratedId) return prevItemMeta;\n return itemMeta;\n });\n }\n }, [hydratedId, isDraggingThisItem, itemMeta, setDndDraggingItemMeta]);\n\n const { selectItem, onShiftMouseDownPreventTextSelection } = useSelectionLogic(itemMeta);\n const { onItemContainerKeyDown } = useItemArrowNavigation(itemMeta);\n const { onItemKeyDownSelection } = useItemKeyboardSelection(itemMeta);\n\n const handleItemKeyDown: React.KeyboardEventHandler<HTMLDivElement> = React.useCallback(\n (event) => {\n onItemKeyDownSelection(event);\n onItemContainerKeyDown(event);\n },\n [onItemKeyDownSelection, onItemContainerKeyDown],\n );\n const { innerRefHandlerParentItem } = useInnerRefHandlers(itemMeta);\n const { innerRefHandlerDnd } = useInnerRefActionHandlers(itemMeta);\n const overId = useInternalStore((state) => state.overId);\n const isDropValid = useInternalStore((state) => state.isDropValid);\n const dropIndicatorPosition = useInternalStore((state) => state.dropIndicatorPosition);\n\n const showDropIndicatorPosition = hydratedId === overId && dropIndicatorPosition;\n const sortableRef = useSortableHelpers?.setNodeRef ?? (() => {});\n\n const thisItemIsFocused = useThisItemIsFocused(itemMeta);\n const config = React.useMemo(() => ({ hasFocus: thisItemIsFocused }), [thisItemIsFocused]);\n\n const tooltipHelpers = useHeadlessTooltip(config);\n\n const idItem = useMemo(() => `${hydratedId}-wrapper${softDeleted ? '-soft-deleted' : ''}`, [hydratedId, softDeleted]);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => itemMeta, [itemMeta]);\n\n return (\n <ItemWrapper\n isDragging={isDraggingThisItem}\n isDndActive={getIsDragAndDropHappening()}\n cols={cols}\n alignItems=\"center\"\n onClick={selectItem}\n innerRef={sortableRef}\n onKeyDown={handleItemKeyDown}\n onMouseDown={onShiftMouseDownPreventTextSelection}\n onMouseEnter={tooltipHelpers.onMouseEnter}\n onMouseLeave={tooltipHelpers.onMouseLeave}\n onPointerEnter={tooltipHelpers.onMouseEnter}\n onPointerLeave={tooltipHelpers.onMouseLeave}\n hasFocusRing={thisItemIsFocused}\n tabIndex={-1}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <ItemSelectionWrapper\n role=\"checkbox\"\n aria-checked={isSelected}\n onFocus={tooltipHelpers.onFocus}\n onBlur={tooltipHelpers.onBlur}\n aria-labelledby={`${hydratedId}-text-section${softDeleted ? '-soft-deleted' : ''}`}\n id={idItem}\n innerRef={innerRefHandlerParentItem}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <ItemSelection {...itemMeta} />\n </ItemSelectionWrapper>\n {withDragNDrop && useSortableHelpers ? (\n <DragHandle\n id={hydratedId}\n useSortableHelpers={useSortableHelpers}\n isDndActive={getIsDragAndDropHappening()}\n isDragging={isDraggingThisItem}\n innerRef={innerRefHandlerDnd}\n disabled={hasMultipleSelection}\n />\n ) : null}\n <ItemMiddleSection {...itemMeta} tooltipHelpers={tooltipHelpers} />\n {!hasMultipleSelection ? <ItemActions {...itemMeta} /> : null}\n <DropIndicator vertical={false} dropIndicatorPosition={showDropIndicatorPosition} isDropValid={isDropValid} />\n </ItemWrapper>\n );\n});\n\nconst ItemSortable = withConditionalUseSortable(Item);\nexport { ItemSortable };\nexport default ItemSortable;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC+JnB,SA6BI,KA7BJ;AA7JJ,OAAOA,UAAS,eAAe;AAC/B,SAAS,0BAA0B;AACnC,SAAS,QAAQ,WAAW;AAC5B,SAAS,YAAY;AAGrB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,kBAAkB,qBAAqB;AAChD,SAAS,qBAAqB;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,yBAAyB;AAClC,SAAS,yBAAyB;AAClC,SAAS,8BAA8B;AACvC,SAAS,uBAAuB;AAChC,SAAS,kBAAkB;AAC3B,SAAS,qBAAqB;AAC9B,SAAS,kCAAkC;AAC3C,SAAS,uBAAuB,iCAAiC;AACjE,SAAS,gCAAgC;AACzC,SAAS,4BAA4B;AAGrC,MAAM,cAAc;AAAA,sBACE,CAAC,EAAE,MAAM,MAAM,MAAM,OAAO,QAAQ,KAAK;AAAA,
|
|
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/Item/ItemActions/ItemActions.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSButtonV3, BUTTON_SIZES } from '@elliemae/ds-button-v2';\nimport { ArrowShortReturn, ArrowShortRight, CloseMedium } from '@elliemae/ds-icons';\nimport { type DSShuttleV2T } from '../../../react-desc-prop-types.js';\nimport { useActionsHandlers } from './useActionsHandlers.js';\nimport { useInnerRefHandlers } from './useInnerRefHandlers.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../../config/DSShuttleV2Definitions.js';\nimport { usePropsStore } from '../../../config/useStore/useStore.js';\n\nconst StyledItemActions = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ACTIONS_WRAPPER })``;\nconst StyledItemActionWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ACTION_WRAPPER })``;\nconst StyledButton = styled(DSButtonV3, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ACTION_BTN })`\n height: 1.692rem !important;\n svg {\n fill: brand-600;\n }\n :disabled svg {\n fill: neutral-200 !important;\n }\n`;\nconst StyledDrilldownIcon = styled(ArrowShortReturn, {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.ITEM_ACTION_BTN_DRILLDOWN_ICON,\n})``;\nconst StyledCloseMediumIcon = styled(CloseMedium, {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.ITEM_ACTION_BTN_TO_SOURCE_ICON,\n})``;\nconst StyledArrowShortRightIcon = styled(ArrowShortRight, {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.ITEM_ACTION_BTN_TO_DESTINATION_ICON,\n})``;\n\nconst actionsCols = ['1.538rem', '1.538rem'];\n\nexport const ItemActions = React.memo((itemMeta: DSShuttleV2T.ItemMeta) => {\n const {\n datumHydratables,\n isDestinationPanel,\n datumRenderFlags,\n datumInternalMeta: { hydratedPreventMove },\n } = itemMeta;\n // withActions is calculated in /src/config/configureAutoCalculated.ts\n const { withActions, internallyDisabledDrilldown, internallyDisabledMove } = datumRenderFlags;\n const { preventDrilldown, label } = datumHydratables;\n const { innerRefHandlerDrilldown, innerRefHandlerMove } = useInnerRefHandlers(itemMeta);\n const { handleClickDrilldown, handleClickSingleMove, handleKeyDownSelectionBubbleUp } = useActionsHandlers(itemMeta);\n const drillDownAriaLabel = useMemo(() => `Drilldown into ${label} option`, [label]);\n const moveAriaLabel = useMemo(\n () => `Move option ${label} into ${isDestinationPanel ? 'source' : 'destination'} panel`,\n [label, isDestinationPanel],\n );\n\n const moveButtonProps = usePropsStore((state) => state.moveButtonProps);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => itemMeta, [itemMeta]);\n\n return (\n <StyledItemActions\n cols={actionsCols}\n gutter=\"xxs\"\n pl=\"xs\"\n pr=\"xxs\"\n alignItems=\"center\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {withActions ? (\n <>\n <StyledItemActionWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <StyledButton\n buttonType=\"icon\"\n aria-label={drillDownAriaLabel}\n onClick={handleClickDrilldown}\n onKeyDown={handleKeyDownSelectionBubbleUp}\n size={BUTTON_SIZES.S}\n innerRef={innerRefHandlerDrilldown}\n tabIndex={-1} // We overwrite it via vanilla js on the focus manager\n disabled={internallyDisabledDrilldown || preventDrilldown === true}\n >\n <StyledDrilldownIcon\n width=\"1.538rem\"\n height=\"1.538rem\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n </StyledButton>\n </StyledItemActionWrapper>\n <StyledItemActionWrapper getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <StyledButton\n buttonType=\"icon\"\n aria-label={moveAriaLabel}\n onClick={handleClickSingleMove}\n onKeyDown={handleKeyDownSelectionBubbleUp}\n size={BUTTON_SIZES.S}\n innerRef={innerRefHandlerMove}\n tabIndex={-1} // We overwrite it via vanilla js on the focus manager\n disabled={internallyDisabledMove || hydratedPreventMove === true}\n {...(moveButtonProps && moveButtonProps({ itemMeta, isDestinationPanel }))}\n >\n {isDestinationPanel ? (\n <StyledCloseMediumIcon\n width=\"1.538rem\"\n height=\"1.538rem\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n ) : (\n <StyledArrowShortRightIcon\n width=\"1.538rem\"\n height=\"1.538rem\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n )}\n </StyledButton>\n </StyledItemActionWrapper>\n </>\n ) : (\n // this is a place-holder used for mantainting the grid spacing when item has no actions (so when item is soft-deleted)\n <>\n <div />\n <div />\n </>\n )}\n </StyledItemActions>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACuEf,mBAYM,KAZN;AAvER,OAAOA,UAAS,eAAe;AAC/B,SAAS,cAAc;AACvB,SAAS,YAAY;AACrB,SAAS,YAAY,oBAAoB;AACzC,SAAS,kBAAkB,iBAAiB,mBAAmB;AAE/D,SAAS,0BAA0B;AACnC,SAAS,2BAA2B;AACpC,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAE9B,MAAM,oBAAoB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,qBAAqB,CAAC;AAC7G,MAAM,0BAA0B,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,oBAAoB,CAAC;AAClH,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASzG,MAAM,sBAAsB,OAAO,kBAAkB;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AACD,MAAM,wBAAwB,OAAO,aAAa;AAAA,EAChD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AACD,MAAM,4BAA4B,OAAO,iBAAiB;AAAA,EACxD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAED,MAAM,cAAc,CAAC,YAAY,UAAU;AAEpC,MAAM,cAAcA,OAAM,KAAK,CAAC,aAAoC;AACzE,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,mBAAmB,EAAE,oBAAoB;AAAA,EAC3C,IAAI;AAEJ,QAAM,EAAE,aAAa,6BAA6B,uBAAuB,IAAI;AAC7E,QAAM,EAAE,kBAAkB,MAAM,IAAI;AACpC,QAAM,EAAE,0BAA0B,oBAAoB,IAAI,oBAAoB,QAAQ;AACtF,QAAM,EAAE,sBAAsB,uBAAuB,+BAA+B,IAAI,mBAAmB,QAAQ;AACnH,QAAM,qBAAqB,QAAQ,MAAM,kBAAkB,
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -56,11 +56,9 @@ const ItemMiddleSection = React2.memo(
|
|
|
56
56
|
]
|
|
57
57
|
);
|
|
58
58
|
const cols = React2.useMemo(() => {
|
|
59
|
-
if (CustomRenderer)
|
|
60
|
-
return [];
|
|
59
|
+
if (CustomRenderer) return [];
|
|
61
60
|
const dynamicCols = [];
|
|
62
|
-
if (Icon)
|
|
63
|
-
dynamicCols.push("auto");
|
|
61
|
+
if (Icon) dynamicCols.push("auto");
|
|
64
62
|
dynamicCols.push("1fr");
|
|
65
63
|
return dynamicCols;
|
|
66
64
|
}, [CustomRenderer, Icon]);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/ItemMiddleSection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../config/DSShuttleV2Definitions.js';\nimport { TextSection } from './TextSection.js';\nimport { useThisItemIsFocused } from './useThisItemIsFocused.js';\nimport { usePropsStore } from '../../config/useStore/useStore.js';\n\nconst IconWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_ICON_WRAPPER })`\n min-height: 1rem;\n`;\n\nconst MidSection = styled(Grid, {\n name: DSShuttleV2Name,\n slot: DSShuttleV2Slots.ITEM_MIDSECTION_WRAPPER,\n})<{ $softDeleted: boolean }>`\n min-height: 1rem;\n ${(props) => {\n if (props.$softDeleted)\n return `\n color: ${props.theme.colors.neutral[500]};\n svg {\n fill: ${props.theme.colors.neutral[400]};\n }\n `;\n return '';\n }};\n`;\nconst customMidSectionCols = ['1fr'];\nconst customMidSectionRows = ['1fr'];\n\nexport const ItemMiddleSection = React.memo(\n (props: DSShuttleV2T.ItemMeta & { tooltipHelpers?: DSShuttleV2T.ComponentProps['tooltipHelpers'] }) => {\n const { tooltipHelpers, ...itemMeta } = props;\n const { datum, datumHydratables, datumInternalMeta, isDestinationPanel, hasMultipleSelection } = itemMeta;\n const { Icon, CustomRenderer, ...componentlessHydratables } = datumHydratables;\n const { softDeleted, hydratedId } = datumInternalMeta;\n const thisItemIsFocused = useThisItemIsFocused(itemMeta);\n const customComponentProps = React.useMemo<DSShuttleV2T.ComponentProps>(\n () => ({\n datum,\n tooltipHelpers,\n thisItemIsFocused,\n panelMetaInfo: { isDestinationPanel, hasMultipleSelection },\n datumInternalMeta,\n datumHydratables: { ...componentlessHydratables, id: hydratedId },\n }),\n [\n componentlessHydratables,\n datum,\n datumInternalMeta,\n hasMultipleSelection,\n hydratedId,\n isDestinationPanel,\n thisItemIsFocused,\n tooltipHelpers,\n ],\n );\n const cols = React.useMemo(() => {\n // if CustomRenderer is defined, shortcircuit\n if (CustomRenderer) return [];\n const dynamicCols = [];\n if (Icon) dynamicCols.push('auto');\n dynamicCols.push('1fr');\n return dynamicCols;\n }, [CustomRenderer, Icon]);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => props, [props]);\n\n if (CustomRenderer)\n return (\n <MidSection\n cols={customMidSectionCols}\n rows={customMidSectionRows}\n $softDeleted={Boolean(softDeleted)}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <CustomRenderer {...customComponentProps} />\n </MidSection>\n );\n\n // if we ever need to do something for truncation and showing a tooltip in the future,\n // check out what has been done in exported-related/ShuttleItem.tsx\n // also, be aware that we have the headless logic alread inside tooltipHelpers\n // when this comment has been written, the logic was working with keyboard and mouse as per tooltip-v3\n // integrated with all the shuttle-v2 custom focus navigation\n return (\n <MidSection\n cols={cols}\n alignItems=\"center\"\n ml=\"xxs\"\n $softDeleted={Boolean(softDeleted)}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {Icon ? (\n <IconWrapper\n alignItems=\"center\"\n mr=\"xxs\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <Icon {...customComponentProps} />\n </IconWrapper>\n ) : null}\n <TextSection {...itemMeta} />\n </MidSection>\n );\n },\n);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACgFb,cAUJ,YAVI;AAhFV,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,SAAS,qBAAqB;AAE9B,MAAM,cAAc,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,kBAAkB,CAAC;AAAA;AAAA;AAIpG,MAAM,aAAa,OAAO,MAAM;AAAA,EAC9B,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA,IAEG,CAAC,UAAU;AACX,MAAI,MAAM;AACR,WAAO;AAAA,eACE,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACgFb,cAUJ,YAVI;AAhFV,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,mBAAmB;AAC5B,SAAS,4BAA4B;AACrC,SAAS,qBAAqB;AAE9B,MAAM,cAAc,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,kBAAkB,CAAC;AAAA;AAAA;AAIpG,MAAM,aAAa,OAAO,MAAM;AAAA,EAC9B,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA,IAEG,CAAC,UAAU;AACX,MAAI,MAAM;AACR,WAAO;AAAA,eACE,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA,gBAE9B,MAAM,MAAM,OAAO,QAAQ,GAAG,CAAC;AAAA;AAAA;AAG3C,SAAO;AACT,CAAC;AAAA;AAEH,MAAM,uBAAuB,CAAC,KAAK;AACnC,MAAM,uBAAuB,CAAC,KAAK;AAE5B,MAAM,oBAAoBA,OAAM;AAAA,EACrC,CAAC,UAAsG;AACrG,UAAM,EAAE,gBAAgB,GAAG,SAAS,IAAI;AACxC,UAAM,EAAE,OAAO,kBAAkB,mBAAmB,oBAAoB,qBAAqB,IAAI;AACjG,UAAM,EAAE,MAAM,gBAAgB,GAAG,yBAAyB,IAAI;AAC9D,UAAM,EAAE,aAAa,WAAW,IAAI;AACpC,UAAM,oBAAoB,qBAAqB,QAAQ;AACvD,UAAM,uBAAuBA,OAAM;AAAA,MACjC,OAAO;AAAA,QACL;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe,EAAE,oBAAoB,qBAAqB;AAAA,QAC1D;AAAA,QACA,kBAAkB,EAAE,GAAG,0BAA0B,IAAI,WAAW;AAAA,MAClE;AAAA,MACA;AAAA,QACE;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AACA,UAAM,OAAOA,OAAM,QAAQ,MAAM;AAE/B,UAAI,eAAgB,QAAO,CAAC;AAC5B,YAAM,cAAc,CAAC;AACrB,UAAI,KAAM,aAAY,KAAK,MAAM;AACjC,kBAAY,KAAK,KAAK;AACtB,aAAO;AAAA,IACT,GAAG,CAAC,gBAAgB,IAAI,CAAC;AAEzB,UAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,UAAM,yBAAyBA,OAAM,YAAY,MAAM,OAAO,CAAC,KAAK,CAAC;AAErE,QAAI;AACF,aACE;AAAA,QAAC;AAAA;AAAA,UACC,MAAM;AAAA,UACN,MAAM;AAAA,UACN,cAAc,QAAQ,WAAW;AAAA,UACjC;AAAA,UACA;AAAA,UAEA,8BAAC,kBAAgB,GAAG,sBAAsB;AAAA;AAAA,MAC5C;AAQJ,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,YAAW;AAAA,QACX,IAAG;AAAA,QACH,cAAc,QAAQ,WAAW;AAAA,QACjC;AAAA,QACA;AAAA,QAEC;AAAA,iBACC;AAAA,YAAC;AAAA;AAAA,cACC,YAAW;AAAA,cACX,IAAG;AAAA,cACH;AAAA,cACA;AAAA,cAEA,8BAAC,QAAM,GAAG,sBAAsB;AAAA;AAAA,UAClC,IACE;AAAA,UACJ,oBAAC,eAAa,GAAG,UAAU;AAAA;AAAA;AAAA,IAC7B;AAAA,EAEJ;AACF;",
|
|
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/ItemOverlay.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { useInternalStore } from '../../config/useStore/index.js';\nimport { ItemMiddleSection } from './ItemMiddleSection.js';\nimport { DragOverlay } from '../Dnd/DragOverlay.js';\nimport { DSShuttleV2Name } from '../../config/DSShuttleV2Definitions.js';\n\n// we are using the class-name added via slot for the children `:hover` styling of icon colors\n\nconst ItemWrapper = styled(Grid, { name: DSShuttleV2Name, slot: 'item-wrapper-overlay' })`\n min-height: 2.769rem;\n position: relative;\n background-color: white;\n box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);\n padding-right: 5px;\n\n &:focus {\n outline: 2px solid brand-700;\n outline-offset: -2px;\n }\n border-bottom: 1px solid neutral-100;\n`;\n\nexport const ItemOverlay = React.memo(\n (itemMeta: DSShuttleV2T.ItemMeta & { tooltipHelpers?: DSShuttleV2T.ComponentProps['tooltipHelpers'] }) => {\n const { datumInternalMeta } = itemMeta;\n const { isSelected, hydratedId } = datumInternalMeta;\n\n const getIsDragAndDropHappening = useInternalStore((state) => state.getIsDragAndDropHappening);\n const isDragAndDropHappening = getIsDragAndDropHappening();\n const dndDraggingItem = useInternalStore((state) => state.dndDraggingItem);\n\n return (\n <ItemWrapper cols={['auto', 'auto']} alignItems=\"center\" role=\"checkbox\" aria-checked={isSelected}>\n <DragOverlay\n id={`${hydratedId}-overlay`}\n isDndActive={isDragAndDropHappening}\n isDragging={dndDraggingItem?.hydratedId === hydratedId}\n />\n <ItemMiddleSection {...itemMeta} />\n </ItemWrapper>\n );\n },\n);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACmCjB,SACE,KADF;AAnCN,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAIhC,MAAM,cAAc,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,uBAAuB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcjF,MAAM,cAAcA,OAAM;AAAA,EAC/B,CAAC,aAAyG;AACxG,UAAM,EAAE,kBAAkB,IAAI;AAC9B,UAAM,EAAE,YAAY,WAAW,IAAI;AAEnC,UAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAC7F,UAAM,yBAAyB,0BAA0B;AACzD,UAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,WACE,qBAAC,eAAY,MAAM,CAAC,QAAQ,MAAM,GAAG,YAAW,UAAS,MAAK,YAAW,gBAAc,YACrF;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,IAAI,GAAG;AAAA,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACmCjB,SACE,KADF;AAnCN,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,wBAAwB;AACjC,SAAS,yBAAyB;AAClC,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAIhC,MAAM,cAAc,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,uBAAuB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcjF,MAAM,cAAcA,OAAM;AAAA,EAC/B,CAAC,aAAyG;AACxG,UAAM,EAAE,kBAAkB,IAAI;AAC9B,UAAM,EAAE,YAAY,WAAW,IAAI;AAEnC,UAAM,4BAA4B,iBAAiB,CAAC,UAAU,MAAM,yBAAyB;AAC7F,UAAM,yBAAyB,0BAA0B;AACzD,UAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,WACE,qBAAC,eAAY,MAAM,CAAC,QAAQ,MAAM,GAAG,YAAW,UAAS,MAAK,YAAW,gBAAc,YACrF;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,IAAI,GAAG,UAAU;AAAA,UACjB,aAAa;AAAA,UACb,YAAY,iBAAiB,eAAe;AAAA;AAAA,MAC9C;AAAA,MACA,oBAAC,qBAAmB,GAAG,UAAU;AAAA,OACnC;AAAA,EAEJ;AACF;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -10,10 +10,8 @@ const StyledItemSelection = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttl
|
|
|
10
10
|
height: 100%;
|
|
11
11
|
box-sizing: border-box;
|
|
12
12
|
background-color: ${(props) => {
|
|
13
|
-
if (props.$isSelected)
|
|
14
|
-
|
|
15
|
-
if (props.$selectionPrevented === true)
|
|
16
|
-
return props.theme.colors.neutral["080"];
|
|
13
|
+
if (props.$isSelected) return props.theme.colors.brand[600];
|
|
14
|
+
if (props.$selectionPrevented === true) return props.theme.colors.neutral["080"];
|
|
17
15
|
return props.theme.colors.brand[300];
|
|
18
16
|
}};
|
|
19
17
|
`;
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Item/ItemSelection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../config/DSShuttleV2Definitions.js';\nimport { usePropsStore } from '../../config/useStore/useStore.js';\n\n// border-right: ${(props) => {\n// if (props.$selectionPrevented === true) return `1px solid ${props.theme.colors.neutral['200']}`;\n// return '';\n// }};\n// border-bottom: ${(props) => {\n// if (props.$selectionPrevented === true) return `1px solid ${props.theme.colors.neutral['200']}`;\n// return '';\n// }};\n\nconst StyledItemSelection = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_SELECTION })<{\n $isSelected: boolean;\n $selectionPrevented?: boolean;\n}>`\n width: 5px;\n height: 100%;\n box-sizing: border-box;\n background-color: ${(props) => {\n if (props.$isSelected) return props.theme.colors.brand[600];\n if (props.$selectionPrevented === true) return props.theme.colors.neutral['080'];\n return props.theme.colors.brand[300];\n }};\n`;\n\nexport const ItemSelection = React.memo((itemMeta: DSShuttleV2T.ItemMeta) => {\n const {\n datumInternalMeta: { isSelected },\n datumRenderFlags: { selectionPrevented },\n } = itemMeta;\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => itemMeta, [itemMeta]);\n\n return (\n <StyledItemSelection\n $isSelected={isSelected}\n $selectionPrevented={selectionPrevented}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACuCnB;AAvCJ,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAW9B,MAAM,sBAAsB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA,sBAOnF,CAAC,UAAU;AAC7B,MAAI,MAAM
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACuCnB;AAvCJ,OAAOA,YAAW;AAClB,SAAS,cAAc;AACvB,SAAS,YAAY;AAErB,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAW9B,MAAM,sBAAsB,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,eAAe,CAAC;AAAA;AAAA;AAAA;AAAA,sBAOnF,CAAC,UAAU;AAC7B,MAAI,MAAM,YAAa,QAAO,MAAM,MAAM,OAAO,MAAM,GAAG;AAC1D,MAAI,MAAM,wBAAwB,KAAM,QAAO,MAAM,MAAM,OAAO,QAAQ,KAAK;AAC/E,SAAO,MAAM,MAAM,OAAO,MAAM,GAAG;AACrC,CAAC;AAAA;AAGI,MAAM,gBAAgBA,OAAM,KAAK,CAAC,aAAoC;AAC3E,QAAM;AAAA,IACJ,mBAAmB,EAAE,WAAW;AAAA,IAChC,kBAAkB,EAAE,mBAAmB;AAAA,EACzC,IAAI;AACJ,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,UAAU,CAAC,QAAQ,CAAC;AAE3E,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAa;AAAA,MACb,qBAAqB;AAAA,MACrB;AAAA,MACA;AAAA;AAAA,EACF;AAEJ,CAAC;",
|
|
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/TextSection.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { styled } from '@elliemae/ds-system';\nimport { DSTypography } from '@elliemae/ds-typography';\nimport { DSShuttleV2Name, DSShuttleV2Slots } from '../../config/DSShuttleV2Definitions.js';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../config/useStore/useStore.js';\n\nconst withSubtitleRows = ['auto', 'auto'];\nconst LabelWrapper = styled(Grid, { name: DSShuttleV2Name, slot: DSShuttleV2Slots.ITEM_LABEL_WRAPPER })`\n min-height: 1rem;\n`;\nexport const TextSection = React.memo((props: DSShuttleV2T.ItemMeta) => {\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => props, [props]);\n\n const { label, subtitle, id } = props.datumHydratables;\n const { softDeleted } = props.datum;\n return (\n <Grid id={`${id}-text-section${softDeleted ? '-soft-deleted' : ''}`}>\n {subtitle === undefined ? (\n <LabelWrapper alignItems=\"center\" getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <DSTypography variant=\"b1\">{label}</DSTypography>\n </LabelWrapper>\n ) : (\n <Grid alignItems=\"center\" rows={withSubtitleRows} gutter=\"1px\">\n <DSTypography variant=\"b1\">{label}</DSTypography>\n <DSTypography variant=\"b4\">{subtitle}</DSTypography>\n </Grid>\n )}\n </Grid>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACsBb,cAGF,YAHE;AAtBV,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB,wBAAwB;AAElD,SAAS,qBAAqB;AAE9B,MAAM,mBAAmB,CAAC,QAAQ,MAAM;AACxC,MAAM,eAAe,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,mBAAmB,CAAC;AAAA;AAAA;AAG/F,MAAM,cAAcA,OAAM,KAAK,CAAC,UAAiC;AACtE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,OAAO,CAAC,KAAK,CAAC;AAErE,QAAM,EAAE,OAAO,UAAU,GAAG,IAAI,MAAM;AACtC,QAAM,EAAE,YAAY,IAAI,MAAM;AAC9B,SACE,oBAAC,QAAK,IAAI,GAAG,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACsBb,cAGF,YAHE;AAtBV,OAAOA,YAAW;AAClB,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB,wBAAwB;AAElD,SAAS,qBAAqB;AAE9B,MAAM,mBAAmB,CAAC,QAAQ,MAAM;AACxC,MAAM,eAAe,OAAO,MAAM,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,mBAAmB,CAAC;AAAA;AAAA;AAG/F,MAAM,cAAcA,OAAM,KAAK,CAAC,UAAiC;AACtE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyBA,OAAM,YAAY,MAAM,OAAO,CAAC,KAAK,CAAC;AAErE,QAAM,EAAE,OAAO,UAAU,GAAG,IAAI,MAAM;AACtC,QAAM,EAAE,YAAY,IAAI,MAAM;AAC9B,SACE,oBAAC,QAAK,IAAI,GAAG,EAAE,gBAAgB,cAAc,kBAAkB,EAAE,IAC9D,uBAAa,SACZ,oBAAC,gBAAa,YAAW,UAAS,eAA8B,wBAC9D,8BAAC,gBAAa,SAAQ,MAAM,iBAAM,GACpC,IAEA,qBAAC,QAAK,YAAW,UAAS,MAAM,kBAAkB,QAAO,OACvD;AAAA,wBAAC,gBAAa,SAAQ,MAAM,iBAAM;AAAA,IAClC,oBAAC,gBAAa,SAAQ,MAAM,oBAAS;AAAA,KACvC,GAEJ;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|