@elliemae/ds-shuttle-v2 3.13.0-next.4 → 3.13.1-rc.0
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 +3 -2
- package/dist/cjs/DSShuttleV2.js.map +3 -3
- package/dist/cjs/config/{useAutoCalculated/useDataStructure.js → configureAutoCalculated.js} +12 -22
- package/dist/cjs/config/configureAutoCalculated.js.map +7 -0
- package/dist/cjs/config/itemMovementHelpers.js +1 -17
- package/dist/cjs/config/itemMovementHelpers.js.map +2 -2
- package/dist/cjs/config/useFocusTracker/useFocusActionTrackers.js +6 -6
- package/dist/cjs/config/useFocusTracker/useFocusActionTrackers.js.map +2 -2
- package/dist/cjs/config/useShuttleV2.js +5 -4
- package/dist/cjs/config/useShuttleV2.js.map +2 -2
- package/dist/cjs/config/useStore/useStore.js +5 -14
- package/dist/cjs/config/useStore/useStore.js.map +2 -2
- package/dist/cjs/constants/index.js +0 -4
- package/dist/cjs/constants/index.js.map +2 -2
- package/dist/cjs/index.js +1 -5
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/parts/Header.js +1 -2
- package/dist/cjs/parts/Header.js.map +2 -2
- package/dist/cjs/parts/Item/Item.js +11 -64
- package/dist/cjs/parts/Item/Item.js.map +3 -3
- package/dist/cjs/parts/Item/ItemActions/ItemActions.js +9 -10
- package/dist/cjs/parts/Item/ItemActions/ItemActions.js.map +2 -2
- package/dist/cjs/parts/Item/ItemActions/useActionsLogicHandlers.js +1 -16
- package/dist/cjs/parts/Item/ItemActions/useActionsLogicHandlers.js.map +2 -2
- package/dist/cjs/parts/Item/ItemActions/useInnerRefHandlers.js +4 -18
- package/dist/cjs/parts/Item/ItemActions/useInnerRefHandlers.js.map +2 -2
- package/dist/cjs/parts/Item/ItemMiddleSection.js +3 -4
- package/dist/cjs/parts/Item/ItemMiddleSection.js.map +2 -2
- package/dist/cjs/parts/Item/ItemSelection.js +1 -2
- package/dist/cjs/parts/Item/ItemSelection.js.map +2 -2
- package/dist/cjs/parts/Item/useItemArrowNavigation.js +0 -7
- package/dist/cjs/parts/Item/useItemArrowNavigation.js.map +2 -2
- package/dist/cjs/parts/Item/useSelectionLogic.js +1 -12
- package/dist/cjs/parts/Item/useSelectionLogic.js.map +2 -2
- package/dist/cjs/parts/MainContent.js +1 -2
- package/dist/cjs/parts/MainContent.js.map +2 -2
- package/dist/cjs/parts/Panel/bottom/LoadMoreBtn.js +1 -5
- package/dist/cjs/parts/Panel/bottom/LoadMoreBtn.js.map +2 -2
- package/dist/cjs/parts/Panel/bottom/LoadingMore.js +1 -5
- package/dist/cjs/parts/Panel/bottom/LoadingMore.js.map +2 -2
- package/dist/cjs/parts/Panel/bottom/PanelContentBottomSection.js +1 -2
- package/dist/cjs/parts/Panel/bottom/PanelContentBottomSection.js.map +2 -2
- package/dist/cjs/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js +1 -14
- package/dist/cjs/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/EmptyItems.js +1 -2
- package/dist/cjs/parts/Panel/middle/EmptyItems.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/ItemListWrapper.js +102 -48
- package/dist/cjs/parts/Panel/middle/ItemListWrapper.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/LoadingItems.js +1 -2
- package/dist/cjs/parts/Panel/middle/LoadingItems.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/MultipleSelectionAction.js +7 -9
- package/dist/cjs/parts/Panel/middle/MultipleSelectionAction.js.map +2 -2
- package/dist/cjs/parts/Panel/middle/PanelContentMiddleSection.js +7 -120
- package/dist/cjs/parts/Panel/middle/PanelContentMiddleSection.js.map +2 -2
- package/dist/cjs/parts/Panel/top/PanelContentTopSection.js +1 -2
- package/dist/cjs/parts/Panel/top/PanelContentTopSection.js.map +2 -2
- package/dist/cjs/parts/Panel/top/PanelFilterSection.js +2 -3
- package/dist/cjs/parts/Panel/top/PanelFilterSection.js.map +2 -2
- package/dist/cjs/parts/Panel/top/SelectionHeader.js +3 -7
- package/dist/cjs/parts/Panel/top/SelectionHeader.js.map +2 -2
- package/dist/cjs/parts/PanelWrapper.js +2 -3
- package/dist/cjs/parts/PanelWrapper.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js +2 -14
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/esm/DSShuttleV2.js +3 -2
- package/dist/esm/DSShuttleV2.js.map +3 -3
- package/dist/esm/config/{useAutoCalculated/useDataStructure.js → configureAutoCalculated.js} +9 -19
- package/dist/esm/config/configureAutoCalculated.js.map +7 -0
- package/dist/esm/config/itemMovementHelpers.js +1 -17
- package/dist/esm/config/itemMovementHelpers.js.map +2 -2
- package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js +6 -6
- package/dist/esm/config/useFocusTracker/useFocusActionTrackers.js.map +2 -2
- package/dist/esm/config/useShuttleV2.js +5 -4
- package/dist/esm/config/useShuttleV2.js.map +2 -2
- package/dist/esm/config/useStore/useStore.js +5 -14
- package/dist/esm/config/useStore/useStore.js.map +2 -2
- package/dist/esm/constants/index.js +0 -4
- package/dist/esm/constants/index.js.map +2 -2
- package/dist/esm/index.js +1 -5
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/parts/Header.js +1 -2
- package/dist/esm/parts/Header.js.map +2 -2
- package/dist/esm/parts/Item/Item.js +13 -66
- package/dist/esm/parts/Item/Item.js.map +2 -2
- package/dist/esm/parts/Item/ItemActions/ItemActions.js +9 -10
- package/dist/esm/parts/Item/ItemActions/ItemActions.js.map +2 -2
- package/dist/esm/parts/Item/ItemActions/useActionsLogicHandlers.js +1 -16
- package/dist/esm/parts/Item/ItemActions/useActionsLogicHandlers.js.map +2 -2
- package/dist/esm/parts/Item/ItemActions/useInnerRefHandlers.js +4 -18
- package/dist/esm/parts/Item/ItemActions/useInnerRefHandlers.js.map +2 -2
- package/dist/esm/parts/Item/ItemMiddleSection.js +3 -4
- package/dist/esm/parts/Item/ItemMiddleSection.js.map +2 -2
- package/dist/esm/parts/Item/ItemSelection.js +1 -2
- package/dist/esm/parts/Item/ItemSelection.js.map +2 -2
- package/dist/esm/parts/Item/useItemArrowNavigation.js +0 -7
- package/dist/esm/parts/Item/useItemArrowNavigation.js.map +2 -2
- package/dist/esm/parts/Item/useSelectionLogic.js +2 -13
- package/dist/esm/parts/Item/useSelectionLogic.js.map +2 -2
- package/dist/esm/parts/MainContent.js +1 -2
- package/dist/esm/parts/MainContent.js.map +2 -2
- package/dist/esm/parts/Panel/bottom/LoadMoreBtn.js +1 -5
- package/dist/esm/parts/Panel/bottom/LoadMoreBtn.js.map +2 -2
- package/dist/esm/parts/Panel/bottom/LoadingMore.js +1 -5
- package/dist/esm/parts/Panel/bottom/LoadingMore.js.map +2 -2
- package/dist/esm/parts/Panel/bottom/PanelContentBottomSection.js +1 -2
- package/dist/esm/parts/Panel/bottom/PanelContentBottomSection.js.map +2 -2
- package/dist/esm/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js +1 -14
- package/dist/esm/parts/Panel/bottom/useLoadMoreBtnArrowNavigation.js.map +2 -2
- package/dist/esm/parts/Panel/middle/EmptyItems.js +1 -2
- package/dist/esm/parts/Panel/middle/EmptyItems.js.map +2 -2
- package/dist/esm/parts/Panel/middle/ItemListWrapper.js +104 -50
- package/dist/esm/parts/Panel/middle/ItemListWrapper.js.map +2 -2
- package/dist/esm/parts/Panel/middle/LoadingItems.js +1 -2
- package/dist/esm/parts/Panel/middle/LoadingItems.js.map +2 -2
- package/dist/esm/parts/Panel/middle/MultipleSelectionAction.js +7 -9
- package/dist/esm/parts/Panel/middle/MultipleSelectionAction.js.map +2 -2
- package/dist/esm/parts/Panel/middle/PanelContentMiddleSection.js +9 -122
- package/dist/esm/parts/Panel/middle/PanelContentMiddleSection.js.map +2 -2
- package/dist/esm/parts/Panel/top/PanelContentTopSection.js +1 -2
- package/dist/esm/parts/Panel/top/PanelContentTopSection.js.map +2 -2
- package/dist/esm/parts/Panel/top/PanelFilterSection.js +2 -3
- package/dist/esm/parts/Panel/top/PanelFilterSection.js.map +2 -2
- package/dist/esm/parts/Panel/top/SelectionHeader.js +3 -7
- package/dist/esm/parts/Panel/top/SelectionHeader.js.map +2 -2
- package/dist/esm/parts/PanelWrapper.js +2 -3
- package/dist/esm/parts/PanelWrapper.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js +2 -14
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/package.json +11 -12
- package/dist/cjs/config/DSShuttleV2Definitions.js +0 -67
- package/dist/cjs/config/DSShuttleV2Definitions.js.map +0 -7
- package/dist/cjs/config/useAutoCalculated/index.js +0 -39
- package/dist/cjs/config/useAutoCalculated/index.js.map +0 -7
- package/dist/cjs/config/useAutoCalculated/useDataStructure.js.map +0 -7
- package/dist/cjs/config/useAutoCalculated/useShuttleVirtualized.js +0 -98
- package/dist/cjs/config/useAutoCalculated/useShuttleVirtualized.js.map +0 -7
- package/dist/cjs/parts/Dnd/DndHandle.js +0 -64
- package/dist/cjs/parts/Dnd/DndHandle.js.map +0 -7
- package/dist/cjs/parts/Dnd/DropIndicator.js +0 -88
- package/dist/cjs/parts/Dnd/DropIndicator.js.map +0 -7
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js +0 -90
- package/dist/cjs/parts/HoC/withConditionalDnDRowContext.js.map +0 -7
- package/dist/cjs/parts/HoC/withConditionalUseSortable.js +0 -38
- package/dist/cjs/parts/HoC/withConditionalUseSortable.js.map +0 -7
- package/dist/cjs/parts/Item/ItemOverlay.js +0 -61
- package/dist/cjs/parts/Item/ItemOverlay.js.map +0 -7
- package/dist/esm/config/DSShuttleV2Definitions.js +0 -41
- package/dist/esm/config/DSShuttleV2Definitions.js.map +0 -7
- package/dist/esm/config/useAutoCalculated/index.js +0 -13
- package/dist/esm/config/useAutoCalculated/index.js.map +0 -7
- package/dist/esm/config/useAutoCalculated/useDataStructure.js.map +0 -7
- package/dist/esm/config/useAutoCalculated/useShuttleVirtualized.js +0 -72
- package/dist/esm/config/useAutoCalculated/useShuttleVirtualized.js.map +0 -7
- package/dist/esm/parts/Dnd/DndHandle.js +0 -38
- package/dist/esm/parts/Dnd/DndHandle.js.map +0 -7
- package/dist/esm/parts/Dnd/DropIndicator.js +0 -62
- package/dist/esm/parts/Dnd/DropIndicator.js.map +0 -7
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js +0 -64
- package/dist/esm/parts/HoC/withConditionalDnDRowContext.js.map +0 -7
- package/dist/esm/parts/HoC/withConditionalUseSortable.js +0 -12
- package/dist/esm/parts/HoC/withConditionalUseSortable.js.map +0 -7
- package/dist/esm/parts/Item/ItemOverlay.js +0 -35
- package/dist/esm/parts/Item/ItemOverlay.js.map +0 -7
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/parts/Dnd/DropIndicator.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\n\nenum DropIndicatorPosition {\n None = 0,\n Before = 1,\n After = 2,\n}\n\ninterface DropIndicatorProps {\n vertical: boolean;\n dropIndicatorPosition: false | DropIndicatorPosition;\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 (\n dropIndicatorPosition === false ||\n ![DropIndicatorPosition.After, DropIndicatorPosition.Before].includes(dropIndicatorPosition)\n ) {\n return null;\n }\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", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADiDnB;AAhDJ,uBAAuB;AAEvB,IAAK,wBAAL,kBAAKA,2BAAL;AACE,EAAAA,8CAAA,UAAO,KAAP;AACA,EAAAA,8CAAA,YAAS,KAAT;AACA,EAAAA,8CAAA,WAAQ,KAAR;AAHG,SAAAA;AAAA,GAAA;AAaL,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,iBAA+B,MAAM;AAAA,eAC9D,0BAA0B,gBAA8B,MAAM;AAAA;AAAA,EAE3E;AACA,SAAO;AAAA,aACI,0BAA0B,iBAA+B,MAAM;AAAA,gBAC5D,0BAA0B,gBAA8B,MAAM;AAAA;AAE9E;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,KAAK,YAAY,0BAA0B,gBAA8B,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,iBAA+B,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,gBAA8B,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,iBAA+B,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,wBAAO;AAAA;AAAA,IAE3B;AAAA;AAAA,WAEO,CAAC,UAAW,MAAM,WAAW,QAAQ;AAAA,YACpC,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA,sBAC5B,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,OAAO,MAAM,OAAO,OAAO;AAAA;AAG/G,MAAM,kBAAkB,CAAC,OAAgC,gBACvD,4CAAC,SAAI,QAAO,KAAI,OAAM,KAAI,OACxB,sDAAC,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,MACE,0BAA0B,SAC1B,CAAC,CAAC,eAA6B,cAA4B,EAAE,SAAS,qBAAqB,GAC3F;AACA,WAAO;AAAA,EACT;AAEA,QAAM,4BAA4B,SAAS,iBAA+B;AAC1E,SACE,4EACG;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
|
-
"names": ["DropIndicatorPosition"]
|
|
7
|
-
}
|
|
@@ -1,90 +0,0 @@
|
|
|
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 withConditionalDnDRowContext_exports = {};
|
|
26
|
-
__export(withConditionalDnDRowContext_exports, {
|
|
27
|
-
withConditionalDnDRowContext: () => withConditionalDnDRowContext
|
|
28
|
-
});
|
|
29
|
-
module.exports = __toCommonJS(withConditionalDnDRowContext_exports);
|
|
30
|
-
var React = __toESM(require("react"));
|
|
31
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
-
var import_react = require("react");
|
|
33
|
-
var import_ds_drag_and_drop = require("@elliemae/ds-drag-and-drop");
|
|
34
|
-
var import_react_dom = require("react-dom");
|
|
35
|
-
var import_useStore = require("../../config/useStore");
|
|
36
|
-
var import_ItemOverlay = require("../Item/ItemOverlay");
|
|
37
|
-
const withConditionalDnDRowContext = (Component) => (props) => {
|
|
38
|
-
const { isDestinationPanel } = props;
|
|
39
|
-
const itemList = (0, import_useStore.useInternalStore)(
|
|
40
|
-
(state) => isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData
|
|
41
|
-
);
|
|
42
|
-
const withDragNDrop = (0, import_useStore.usePropsStore)(
|
|
43
|
-
(state) => isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource
|
|
44
|
-
);
|
|
45
|
-
const setOverId = (0, import_useStore.useInternalStore)((state) => state.setOverId);
|
|
46
|
-
const setIsDropValid = (0, import_useStore.useInternalStore)((state) => state.setIsDropValid);
|
|
47
|
-
const setLastActiveId = (0, import_useStore.useInternalStore)((state) => state.setLastActiveId);
|
|
48
|
-
const setDropIndicatorPosition = (0, import_useStore.useInternalStore)((state) => state.setDropIndicatorPosition);
|
|
49
|
-
const onItemsReorder = (0, import_useStore.usePropsStore)(
|
|
50
|
-
(state) => isDestinationPanel ? state.onDestinationReorder : state.onSourceReorder
|
|
51
|
-
);
|
|
52
|
-
const onReorder = (0, import_react.useCallback)(
|
|
53
|
-
(newData, metadata) => {
|
|
54
|
-
onItemsReorder(newData, { active: metadata.active.original, targetIndex: metadata.targetIndex });
|
|
55
|
-
},
|
|
56
|
-
[onItemsReorder]
|
|
57
|
-
);
|
|
58
|
-
const { dndContextProps, sortableContextProps, activeId, overId, dropIndicatorPosition, isDropValid } = (0, import_ds_drag_and_drop.useTreeDndkitConfig)({
|
|
59
|
-
flattenedItems: itemList,
|
|
60
|
-
visibleItems: itemList,
|
|
61
|
-
isHorizontalDnD: false,
|
|
62
|
-
isExpandable: false,
|
|
63
|
-
onReorder,
|
|
64
|
-
maxDragAndDropLevel: 0,
|
|
65
|
-
getIsDropValid: () => true
|
|
66
|
-
});
|
|
67
|
-
(0, import_react.useEffect)(() => {
|
|
68
|
-
setLastActiveId(activeId);
|
|
69
|
-
}, [activeId, setLastActiveId]);
|
|
70
|
-
(0, import_react.useEffect)(() => {
|
|
71
|
-
setOverId(overId);
|
|
72
|
-
}, [overId, setOverId]);
|
|
73
|
-
(0, import_react.useEffect)(() => {
|
|
74
|
-
setIsDropValid(isDropValid);
|
|
75
|
-
}, [isDropValid, setIsDropValid]);
|
|
76
|
-
(0, import_react.useEffect)(() => {
|
|
77
|
-
setDropIndicatorPosition(dropIndicatorPosition);
|
|
78
|
-
}, [dropIndicatorPosition, setDropIndicatorPosition]);
|
|
79
|
-
const item = itemList.find((currentItem) => currentItem.original.id === activeId);
|
|
80
|
-
if (withDragNDrop)
|
|
81
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_drag_and_drop.DndContext, { ...dndContextProps, children: [
|
|
82
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_drag_and_drop.SortableContext, { ...sortableContextProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props }) }),
|
|
83
|
-
(0, import_react_dom.createPortal)(
|
|
84
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_drag_and_drop.DragOverlay, { style: { width: "auto" }, children: activeId ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ItemOverlay.ItemOverlay, { item, ...props }) : null }),
|
|
85
|
-
document.body
|
|
86
|
-
)
|
|
87
|
-
] });
|
|
88
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props });
|
|
89
|
-
};
|
|
90
|
-
//# sourceMappingURL=withConditionalDnDRowContext.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/parts/HoC/withConditionalDnDRowContext.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-params */\n/* eslint-disable react/function-component-definition */\nimport React, { useCallback, useEffect } from 'react';\nimport { DndContext, DragOverlay, SortableContext, useTreeDndkitConfig } from '@elliemae/ds-drag-and-drop';\nimport { createPortal } from 'react-dom';\nimport { useInternalStore, usePropsStore } from '../../config/useStore';\nimport { ItemOverlay } from '../Item/ItemOverlay';\n\ntype FunctionalHOC = <T = any>(Component: React.ComponentType<T>, ...other: any[]) => (props: T) => JSX.Element;\n\n// only wraps in \"DnDContext\" and \"DnDTreeContext\" if any Drag and Drop functionality is requested\nexport const withConditionalDnDRowContext: FunctionalHOC = (Component) => (props) => {\n const { isDestinationPanel } = props;\n const itemList = useInternalStore((state) =>\n isDestinationPanel ? state.destinationConfiguredData : state.sourceConfiguredData,\n );\n\n const withDragNDrop = usePropsStore((state) =>\n isDestinationPanel ? !state.removeDragAndDropFromDestination : state.addDragAndDropFromSource,\n );\n\n const setOverId = useInternalStore((state) => state.setOverId);\n const setIsDropValid = useInternalStore((state) => state.setIsDropValid);\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 = useCallback(\n (newData: unknown, metadata: { targetIndex: number; active: unknown }) => {\n onItemsReorder(newData, { active: metadata.active.original, targetIndex: metadata.targetIndex });\n },\n [onItemsReorder],\n );\n\n const { dndContextProps, sortableContextProps, activeId, overId, dropIndicatorPosition, isDropValid } =\n useTreeDndkitConfig({\n flattenedItems: itemList,\n visibleItems: itemList,\n isHorizontalDnD: false,\n isExpandable: false,\n onReorder,\n maxDragAndDropLevel: 0,\n getIsDropValid: () => true,\n });\n\n useEffect(() => {\n setLastActiveId(activeId);\n }, [activeId, setLastActiveId]);\n\n useEffect(() => {\n setOverId(overId);\n }, [overId, setOverId]);\n\n useEffect(() => {\n setIsDropValid(isDropValid);\n }, [isDropValid, setIsDropValid]);\n\n useEffect(() => {\n setDropIndicatorPosition(dropIndicatorPosition);\n }, [dropIndicatorPosition, setDropIndicatorPosition]);\n\n const item = itemList.find((currentItem) => currentItem.original.id === activeId);\n if (withDragNDrop)\n return (\n <DndContext {...dndContextProps}>\n <SortableContext {...sortableContextProps}>\n <Component {...props} />\n </SortableContext>\n {createPortal(\n <DragOverlay style={{ width: 'auto' }}>\n {activeId ? <ItemOverlay item={item} {...props} /> : null}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n );\n return <Component {...props} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmEjB;AAjEN,mBAA8C;AAC9C,8BAA8E;AAC9E,uBAA6B;AAC7B,sBAAgD;AAChD,yBAA4B;AAKrB,MAAM,+BAA8C,CAAC,cAAc,CAAC,UAAU;AACnF,QAAM,EAAE,mBAAmB,IAAI;AAC/B,QAAM,eAAW;AAAA,IAAiB,CAAC,UACjC,qBAAqB,MAAM,4BAA4B,MAAM;AAAA,EAC/D;AAEA,QAAM,oBAAgB;AAAA,IAAc,CAAC,UACnC,qBAAqB,CAAC,MAAM,mCAAmC,MAAM;AAAA,EACvE;AAEA,QAAM,gBAAY,kCAAiB,CAAC,UAAU,MAAM,SAAS;AAC7D,QAAM,qBAAiB,kCAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,QAAM,sBAAkB,kCAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,+BAA2B,kCAAiB,CAAC,UAAU,MAAM,wBAAwB;AAE3F,QAAM,qBAAiB;AAAA,IAAc,CAAC,UACpC,qBAAqB,MAAM,uBAAuB,MAAM;AAAA,EAC1D;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,SAAkB,aAAuD;AACxE,qBAAe,SAAS,EAAE,QAAQ,SAAS,OAAO,UAAU,aAAa,SAAS,YAAY,CAAC;AAAA,IACjG;AAAA,IACA,CAAC,cAAc;AAAA,EACjB;AAEA,QAAM,EAAE,iBAAiB,sBAAsB,UAAU,QAAQ,uBAAuB,YAAY,QAClG,6CAAoB;AAAA,IAClB,gBAAgB;AAAA,IAChB,cAAc;AAAA,IACd,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd;AAAA,IACA,qBAAqB;AAAA,IACrB,gBAAgB,MAAM;AAAA,EACxB,CAAC;AAEH,8BAAU,MAAM;AACd,oBAAgB,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,8BAAU,MAAM;AACd,cAAU,MAAM;AAAA,EAClB,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,8BAAU,MAAM;AACd,mBAAe,WAAW;AAAA,EAC5B,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,8BAAU,MAAM;AACd,6BAAyB,qBAAqB;AAAA,EAChD,GAAG,CAAC,uBAAuB,wBAAwB,CAAC;AAEpD,QAAM,OAAO,SAAS,KAAK,CAAC,gBAAgB,YAAY,SAAS,OAAO,QAAQ;AAChF,MAAI;AACF,WACE,6CAAC,sCAAY,GAAG,iBACd;AAAA,kDAAC,2CAAiB,GAAG,sBACnB,sDAAC,aAAW,GAAG,OAAO,GACxB;AAAA,UACC;AAAA,QACC,4CAAC,uCAAY,OAAO,EAAE,OAAO,OAAO,GACjC,qBAAW,4CAAC,kCAAY,MAAa,GAAG,OAAO,IAAK,MACvD;AAAA,QACA,SAAS;AAAA,MACX;AAAA,OACF;AAEJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,38 +0,0 @@
|
|
|
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 withConditionalUseSortable_exports = {};
|
|
26
|
-
__export(withConditionalUseSortable_exports, {
|
|
27
|
-
withConditionalUseSortable: () => withConditionalUseSortable
|
|
28
|
-
});
|
|
29
|
-
module.exports = __toCommonJS(withConditionalUseSortable_exports);
|
|
30
|
-
var React = __toESM(require("react"));
|
|
31
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
-
var import_ds_drag_and_drop = require("@elliemae/ds-drag-and-drop");
|
|
33
|
-
const withConditionalUseSortable = (Component) => (props) => {
|
|
34
|
-
const { id } = props.item.original;
|
|
35
|
-
const useSortableHelpers = (0, import_ds_drag_and_drop.useSortable)({ id });
|
|
36
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, { ...props, useSortableHelpers });
|
|
37
|
-
};
|
|
38
|
-
//# sourceMappingURL=withConditionalUseSortable.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/parts/HoC/withConditionalUseSortable.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { useSortable } from '@elliemae/ds-drag-and-drop';\n\nexport const withConditionalUseSortable = (Component) => (props) => {\n const { id } = props.item.original;\n const useSortableHelpers = useSortable({ id });\n\n return <Component {...props} useSortableHelpers={useSortableHelpers} />;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADOd;AANT,8BAA4B;AAErB,MAAM,6BAA6B,CAAC,cAAc,CAAC,UAAU;AAClE,QAAM,EAAE,GAAG,IAAI,MAAM,KAAK;AAC1B,QAAM,yBAAqB,qCAAY,EAAE,GAAG,CAAC;AAE7C,SAAO,4CAAC,aAAW,GAAG,OAAO,oBAAwC;AACvE;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,61 +0,0 @@
|
|
|
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 ItemOverlay_exports = {};
|
|
26
|
-
__export(ItemOverlay_exports, {
|
|
27
|
-
ItemOverlay: () => ItemOverlay
|
|
28
|
-
});
|
|
29
|
-
module.exports = __toCommonJS(ItemOverlay_exports);
|
|
30
|
-
var React = __toESM(require("react"));
|
|
31
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
32
|
-
var import_react = __toESM(require("react"));
|
|
33
|
-
var import_ds_system = require("@elliemae/ds-system");
|
|
34
|
-
var import_ds_grid = require("@elliemae/ds-grid");
|
|
35
|
-
var import_useStore = require("../../config/useStore");
|
|
36
|
-
var import_ItemMiddleSection = require("./ItemMiddleSection");
|
|
37
|
-
var import_DndHandle = require("../Dnd/DndHandle");
|
|
38
|
-
const ItemWrapper = (0, import_ds_system.styled)(import_ds_grid.Grid, { name: "ds-shuttle-v2", slot: "item-wrapper-overlay" })`
|
|
39
|
-
min-height: 36px;
|
|
40
|
-
position: relative;
|
|
41
|
-
background-color: white;
|
|
42
|
-
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5);
|
|
43
|
-
padding-right: 5px;
|
|
44
|
-
|
|
45
|
-
&:focus {
|
|
46
|
-
outline: 2px solid brand-700;
|
|
47
|
-
outline-offset: -2px;
|
|
48
|
-
}
|
|
49
|
-
border-bottom: 1px solid neutral-100;
|
|
50
|
-
`;
|
|
51
|
-
const ItemOverlay = import_react.default.memo((itemMeta) => {
|
|
52
|
-
const { item } = itemMeta;
|
|
53
|
-
const { original, isSelected } = item;
|
|
54
|
-
const { id } = original;
|
|
55
|
-
const isActive = (0, import_useStore.useInternalStore)((state) => state.lastActiveId);
|
|
56
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(ItemWrapper, { cols: ["auto", "auto"], alignItems: "center", role: "checkbox", "aria-checked": isSelected, children: [
|
|
57
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_DndHandle.DragHandle, { id: `${id}-overlay`, isDragOverlay: true, isDndActive: !!isActive, isDragging: isActive === id }),
|
|
58
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ItemMiddleSection.ItemMiddleSection, { ...itemMeta })
|
|
59
|
-
] });
|
|
60
|
-
});
|
|
61
|
-
//# sourceMappingURL=ItemOverlay.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../src/parts/Item/ItemOverlay.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\n\nimport { Grid } from '@elliemae/ds-grid';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { useInternalStore } from '../../config/useStore';\n\nimport { ItemMiddleSection } from './ItemMiddleSection';\n\nimport { DragHandle } from '../Dnd/DndHandle';\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: 'ds-shuttle-v2', slot: 'item-wrapper-overlay' })`\n min-height: 36px;\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((itemMeta: DSShuttleV2T.ItemMeta) => {\n const { item } = itemMeta;\n const { original, isSelected } = item;\n const { id } = original;\n\n const isActive = useInternalStore((state) => state.lastActiveId);\n\n return (\n <ItemWrapper cols={['auto', 'auto']} alignItems=\"center\" role=\"checkbox\" aria-checked={isSelected}>\n <DragHandle id={`${id}-overlay`} isDragOverlay isDndActive={!!isActive} isDragging={isActive === id} />\n <ItemMiddleSection {...itemMeta} />\n </ItemWrapper>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmCnB;AAnCJ,mBAAkB;AAClB,uBAAuB;AAEvB,qBAAqB;AAErB,sBAAiC;AAEjC,+BAAkC;AAElC,uBAA2B;AAI3B,MAAM,kBAAc,yBAAO,qBAAM,EAAE,MAAM,iBAAiB,MAAM,uBAAuB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAcjF,MAAM,cAAc,aAAAA,QAAM,KAAK,CAAC,aAAoC;AACzE,QAAM,EAAE,KAAK,IAAI;AACjB,QAAM,EAAE,UAAU,WAAW,IAAI;AACjC,QAAM,EAAE,GAAG,IAAI;AAEf,QAAM,eAAW,kCAAiB,CAAC,UAAU,MAAM,YAAY;AAE/D,SACE,6CAAC,eAAY,MAAM,CAAC,QAAQ,MAAM,GAAG,YAAW,UAAS,MAAK,YAAW,gBAAc,YACrF;AAAA,gDAAC,+BAAW,IAAI,GAAG,cAAc,eAAa,MAAC,aAAa,CAAC,CAAC,UAAU,YAAY,aAAa,IAAI;AAAA,IACrG,4CAAC,8CAAmB,GAAG,UAAU;AAAA,KACnC;AAEJ,CAAC;",
|
|
6
|
-
"names": ["React"]
|
|
7
|
-
}
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { slotObjectToDataTestIds } from "@elliemae/ds-system";
|
|
3
|
-
const DSShuttleV2Name = "DSShuttleV2";
|
|
4
|
-
const DSShuttleV2Slots = {
|
|
5
|
-
HEADER_SEARCH_ICON: "header-search-icon",
|
|
6
|
-
WRAPPER: "wrapper",
|
|
7
|
-
PANEL_WRAPPER: "panel-wrapper",
|
|
8
|
-
LIST_WRAPPER: "list-wrapper",
|
|
9
|
-
ITEM_WRAPPER: "item-wrapper",
|
|
10
|
-
ITEM_ICON_WRAPPER: "item-icon-wrapper",
|
|
11
|
-
ITEM_LABEL_WRAPPER: "item-label-wrapper",
|
|
12
|
-
ITEM_MIDSECTION_WRAPPER: "item-midsection-wrapper",
|
|
13
|
-
ITEM_SELECTION: "item-selection",
|
|
14
|
-
ITEM_ACTIONS_WRAPPER: "item-actions-wrapper",
|
|
15
|
-
ITEM_ACTION_WRAPPER: "item-action-wrapper",
|
|
16
|
-
ITEM_ACTION_BTN: "item-action-btn",
|
|
17
|
-
ITEM_ACTION_BTN_DRILLDOWN_ICON: "item-action-btn-drilldown-icon",
|
|
18
|
-
ITEM_ACTION_BTN_TO_SOURCE_ICON: "item-action-btn-to-source-icon",
|
|
19
|
-
ITEM_ACTION_BTN_TO_DESTINATION_ICON: "item-action-btn-to-destination-icon",
|
|
20
|
-
LIST_BOTTOM_LOADING_MORE: "list-bottom-loading-more",
|
|
21
|
-
LIST_BOTTOM_LOAD_MORE_BTN: "list-bottom-load-more-btn",
|
|
22
|
-
LIST_WRAPPER_BOTTOM: "list-wrapper-bottom",
|
|
23
|
-
EMPTY_LIST_WRAPPER: "empty-list-wrapper",
|
|
24
|
-
ITEMS_WRAPPER: "items-wrapper",
|
|
25
|
-
LOADING_LIST_WRAPPER: "loading-list-wrapper",
|
|
26
|
-
MOVE_MULTIPLE_WRAPPER: "move-multiple-wrapper",
|
|
27
|
-
MOVE_MULTIPLE_BTN: "move-multiple-btn",
|
|
28
|
-
LIST_WRAPPER_MID: "list-wrapper-mid",
|
|
29
|
-
LIST_WRAPPER_TOP: "list-wrapper-top",
|
|
30
|
-
AREA_SEARCH_WRAPPER: "area-search-wrapper",
|
|
31
|
-
AREA_SEARCH_BAR: "area-search-bar",
|
|
32
|
-
AREA_SELECTION_HEADER: "area-selection-header",
|
|
33
|
-
AREA_SELECTION_HEADER_COUNT_LABEL: "area-selection-header-count-label"
|
|
34
|
-
};
|
|
35
|
-
const DSShuttleV2DataTestIds = slotObjectToDataTestIds(DSShuttleV2Name, DSShuttleV2Slots);
|
|
36
|
-
export {
|
|
37
|
-
DSShuttleV2DataTestIds,
|
|
38
|
-
DSShuttleV2Name,
|
|
39
|
-
DSShuttleV2Slots
|
|
40
|
-
};
|
|
41
|
-
//# sourceMappingURL=DSShuttleV2Definitions.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/DSShuttleV2Definitions.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\n\nexport const DSShuttleV2Name = 'DSShuttleV2';\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_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};\n\nexport const DSShuttleV2DataTestIds = slotObjectToDataTestIds(DSShuttleV2Name, DSShuttleV2Slots);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;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,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,iBAAiB;AAAA,EACjB,uBAAuB;AAAA,EACvB,mCAAmC;AACrC;AAEO,MAAM,yBAAyB,wBAAwB,iBAAiB,gBAAgB;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { useMemo } from "react";
|
|
3
|
-
import { useDataStructure } from "./useDataStructure";
|
|
4
|
-
import { useShuttleVirtualized } from "./useShuttleVirtualized";
|
|
5
|
-
const useAutoCalculated = (propsWithDefaults) => {
|
|
6
|
-
const dataScructured = useDataStructure(propsWithDefaults);
|
|
7
|
-
const virtualData = useShuttleVirtualized(propsWithDefaults);
|
|
8
|
-
return useMemo(() => ({ ...dataScructured, ...virtualData }), [dataScructured, virtualData]);
|
|
9
|
-
};
|
|
10
|
-
export {
|
|
11
|
-
useAutoCalculated
|
|
12
|
-
};
|
|
13
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useAutoCalculated/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\n\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\nimport { useDataStructure } from './useDataStructure';\nimport { useShuttleVirtualized } from './useShuttleVirtualized';\n\nexport const useAutoCalculated = (propsWithDefaults: DSShuttleV2T.InternalProps) => {\n const dataScructured = useDataStructure(propsWithDefaults);\n const virtualData = useShuttleVirtualized(propsWithDefaults);\n\n return useMemo(() => ({ ...dataScructured, ...virtualData }), [dataScructured, virtualData]);\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AAGxB,SAAS,wBAAwB;AACjC,SAAS,6BAA6B;AAE/B,MAAM,oBAAoB,CAAC,sBAAkD;AAClF,QAAM,iBAAiB,iBAAiB,iBAAiB;AACzD,QAAM,cAAc,sBAAsB,iBAAiB;AAE3D,SAAO,QAAQ,OAAO,EAAE,GAAG,gBAAgB,GAAG,YAAY,IAAI,CAAC,gBAAgB,WAAW,CAAC;AAC7F;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useAutoCalculated/useDataStructure.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// import { useRef } from 'react';\n// import { useVirtual } from 'react-virtual';\nimport { useMemo } from 'react';\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\n\nconst getDatumFlags = (datum: DSShuttleV2T.Datum) => ({\n selectionPrevented: Boolean(datum.softDeleted || datum.preventMove),\n withActions: !datum.softDeleted,\n withMoveBtn: !datum.softDeleted && !datum.preventMove,\n withDrilldownBtn: !datum.softDeleted && !datum.preventDrilldown,\n});\n\ntype ConfigureDestinationConfig = {\n destinationData: DSShuttleV2T.Datum[];\n destinationSelectedItems: Record<DSShuttleV2T.Datum['id'], boolean>;\n};\nconst configureDestination = ({ destinationData, destinationSelectedItems }: ConfigureDestinationConfig) => {\n const destinationSelectedItemsMap: Record<string, { datum: DSShuttleV2T.Datum; index: number }> = {};\n const destinationSelectionItemArray: DSShuttleV2T.Datum[] = [];\n const destinationSelectionArray: DSShuttleV2T.Datum['id'][] = [];\n const destinationConfiguredData: DSShuttleV2T.ConfiguredDatum[] = [];\n const destinationSelectionableData: DSShuttleV2T.ConfiguredDatum[] = [];\n const destinationSelectionableDataIds: DSShuttleV2T.Datum['id'][] = [];\n destinationData.forEach((datum, i) => {\n let isSelected = false;\n if (destinationSelectedItems[datum.id] === true) {\n destinationSelectionItemArray.push(datum);\n destinationSelectionArray.push(datum.id);\n isSelected = true;\n }\n destinationSelectedItemsMap[datum.id] = { datum, index: i };\n const configuredItem = {\n isSelected,\n ...getDatumFlags(datum),\n original: datum,\n localIndex: i,\n isFirst: i === 0,\n isLast: i === destinationData.length - 1,\n uid: datum.id,\n depth: 0,\n realIndex: datum.id,\n };\n destinationConfiguredData.push(configuredItem);\n if (!datum.preventMove) {\n destinationSelectionableData.push(configuredItem);\n destinationSelectionableDataIds.push(datum.id);\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: Record<DSShuttleV2T.Datum['id'], boolean>;\n};\n\nconst configureSource = ({ sourceData, sourceSelectedItems }: ConfigureSourceConfig) => {\n const sourceSelectedItemsMap: Record<string, { datum: DSShuttleV2T.Datum; index: number }> = {};\n const sourceSelectionItemArray: DSShuttleV2T.Datum[] = [];\n const sourceSelectionArray: DSShuttleV2T.Datum['id'][] = [];\n const sourceConfiguredData: DSShuttleV2T.ConfiguredDatum[] = [];\n const sourceSelectionableData: DSShuttleV2T.ConfiguredDatum[] = [];\n const sourceSelectionableDataIds: DSShuttleV2T.Datum['id'][] = [];\n sourceData.forEach((datum, i) => {\n let isSelected = false;\n if (sourceSelectedItems[datum.id] === true) {\n sourceSelectionItemArray.push(datum);\n sourceSelectionArray.push(datum.id);\n isSelected = true;\n }\n\n sourceSelectedItemsMap[datum.id] = { datum, index: i };\n const configuredItem = {\n isSelected,\n ...getDatumFlags(datum),\n original: datum,\n localIndex: i,\n isFirst: i === 0,\n isLast: i === sourceData.length - 1,\n // dnd\n uid: datum.id,\n depth: 0,\n realIndex: datum.id,\n };\n sourceConfiguredData.push(configuredItem);\n if (!datum.preventMove) {\n sourceSelectionableData.push(configuredItem);\n sourceSelectionableDataIds.push(datum.id);\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 { sourceData, sourceSelectedItems, destinationData, destinationSelectedItems } = propsFromUser;\n return useMemo(\n () => ({\n ...configureSource({ sourceData, sourceSelectedItems }),\n ...configureDestination({ destinationData, destinationSelectedItems }),\n }),\n [destinationData, destinationSelectedItems, sourceData, sourceSelectedItems],\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,eAAe;AAGxB,MAAM,gBAAgB,CAAC,WAA+B;AAAA,EACpD,oBAAoB,QAAQ,MAAM,eAAe,MAAM,WAAW;AAAA,EAClE,aAAa,CAAC,MAAM;AAAA,EACpB,aAAa,CAAC,MAAM,eAAe,CAAC,MAAM;AAAA,EAC1C,kBAAkB,CAAC,MAAM,eAAe,CAAC,MAAM;AACjD;AAMA,MAAM,uBAAuB,CAAC,EAAE,iBAAiB,yBAAyB,MAAkC;AAC1G,QAAM,8BAA4F,CAAC;AACnG,QAAM,gCAAsD,CAAC;AAC7D,QAAM,4BAAwD,CAAC;AAC/D,QAAM,4BAA4D,CAAC;AACnE,QAAM,+BAA+D,CAAC;AACtE,QAAM,kCAA8D,CAAC;AACrE,kBAAgB,QAAQ,CAAC,OAAO,MAAM;AACpC,QAAI,aAAa;AACjB,QAAI,yBAAyB,MAAM,QAAQ,MAAM;AAC/C,oCAA8B,KAAK,KAAK;AACxC,gCAA0B,KAAK,MAAM,EAAE;AACvC,mBAAa;AAAA,IACf;AACA,gCAA4B,MAAM,MAAM,EAAE,OAAO,OAAO,EAAE;AAC1D,UAAM,iBAAiB;AAAA,MACrB;AAAA,MACA,GAAG,cAAc,KAAK;AAAA,MACtB,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,SAAS,MAAM;AAAA,MACf,QAAQ,MAAM,gBAAgB,SAAS;AAAA,MACvC,KAAK,MAAM;AAAA,MACX,OAAO;AAAA,MACP,WAAW,MAAM;AAAA,IACnB;AACA,8BAA0B,KAAK,cAAc;AAC7C,QAAI,CAAC,MAAM,aAAa;AACtB,mCAA6B,KAAK,cAAc;AAChD,sCAAgC,KAAK,MAAM,EAAE;AAAA,IAC/C;AAAA,EACF,CAAC;AACD,QAAM,sCAAsC,0BAA0B,UAAU;AAChF,QAAM,8BAA8B,gCAAgC,KAAK,GAAG;AAE5E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAMA,MAAM,kBAAkB,CAAC,EAAE,YAAY,oBAAoB,MAA6B;AACtF,QAAM,yBAAuF,CAAC;AAC9F,QAAM,2BAAiD,CAAC;AACxD,QAAM,uBAAmD,CAAC;AAC1D,QAAM,uBAAuD,CAAC;AAC9D,QAAM,0BAA0D,CAAC;AACjE,QAAM,6BAAyD,CAAC;AAChE,aAAW,QAAQ,CAAC,OAAO,MAAM;AAC/B,QAAI,aAAa;AACjB,QAAI,oBAAoB,MAAM,QAAQ,MAAM;AAC1C,+BAAyB,KAAK,KAAK;AACnC,2BAAqB,KAAK,MAAM,EAAE;AAClC,mBAAa;AAAA,IACf;AAEA,2BAAuB,MAAM,MAAM,EAAE,OAAO,OAAO,EAAE;AACrD,UAAM,iBAAiB;AAAA,MACrB;AAAA,MACA,GAAG,cAAc,KAAK;AAAA,MACtB,UAAU;AAAA,MACV,YAAY;AAAA,MACZ,SAAS,MAAM;AAAA,MACf,QAAQ,MAAM,WAAW,SAAS;AAAA,MAElC,KAAK,MAAM;AAAA,MACX,OAAO;AAAA,MACP,WAAW,MAAM;AAAA,IACnB;AACA,yBAAqB,KAAK,cAAc;AACxC,QAAI,CAAC,MAAM,aAAa;AACtB,8BAAwB,KAAK,cAAc;AAC3C,iCAA2B,KAAK,MAAM,EAAE;AAAA,IAC1C;AAAA,EACF,CAAC;AACD,QAAM,iCAAiC,qBAAqB,UAAU;AACtE,QAAM,yBAAyB,2BAA2B,KAAK,GAAG;AAClE,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAEO,MAAM,mBAAmB,CAAC,kBAA8C;AAC7E,QAAM,EAAE,YAAY,qBAAqB,iBAAiB,yBAAyB,IAAI;AACvF,SAAO;AAAA,IACL,OAAO;AAAA,MACL,GAAG,gBAAgB,EAAE,YAAY,oBAAoB,CAAC;AAAA,MACtD,GAAG,qBAAqB,EAAE,iBAAiB,yBAAyB,CAAC;AAAA,IACvE;AAAA,IACA,CAAC,iBAAiB,0BAA0B,YAAY,mBAAmB;AAAA,EAC7E;AACF;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { useMemo, useCallback, useRef } from "react";
|
|
3
|
-
import { useVirtual } from "react-virtual";
|
|
4
|
-
const useShuttleVirtualized = (propsWithDefaults) => {
|
|
5
|
-
const destinationVirtualRef = useRef(null);
|
|
6
|
-
const sourceVirtualRef = useRef(null);
|
|
7
|
-
const estimatedSize = useCallback(() => 36, []);
|
|
8
|
-
const destinationVirtualConfig = useMemo(
|
|
9
|
-
() => ({
|
|
10
|
-
size: propsWithDefaults.destinationData.length,
|
|
11
|
-
parentRef: destinationVirtualRef,
|
|
12
|
-
overscan: 30,
|
|
13
|
-
estimateSize: estimatedSize
|
|
14
|
-
}),
|
|
15
|
-
[propsWithDefaults.destinationData.length, destinationVirtualRef, estimatedSize]
|
|
16
|
-
);
|
|
17
|
-
const {
|
|
18
|
-
virtualItems: destinationVirtualItems,
|
|
19
|
-
measure: destinationMeasure,
|
|
20
|
-
scrollToIndex: destinationScrollToIndex,
|
|
21
|
-
scrollToOffset: destinationScrollToOffset,
|
|
22
|
-
totalSize: destinationTotalSize
|
|
23
|
-
} = useVirtual(destinationVirtualConfig);
|
|
24
|
-
const sourceVirtualConfig = useMemo(
|
|
25
|
-
() => ({
|
|
26
|
-
size: propsWithDefaults.sourceData.length,
|
|
27
|
-
parentRef: sourceVirtualRef,
|
|
28
|
-
overscan: 30,
|
|
29
|
-
estimateSize: estimatedSize
|
|
30
|
-
}),
|
|
31
|
-
[propsWithDefaults.sourceData.length, sourceVirtualRef, estimatedSize]
|
|
32
|
-
);
|
|
33
|
-
const {
|
|
34
|
-
virtualItems: sourceVirtualItems,
|
|
35
|
-
measure: sourceMeasure,
|
|
36
|
-
scrollToIndex: sourceScrollToIndex,
|
|
37
|
-
scrollToOffset: sourceScrollToOffset,
|
|
38
|
-
totalSize: sourceTotalSize
|
|
39
|
-
} = useVirtual(sourceVirtualConfig);
|
|
40
|
-
return useMemo(
|
|
41
|
-
() => ({
|
|
42
|
-
destinationVirtualRef,
|
|
43
|
-
destinationVirtualItems,
|
|
44
|
-
destinationMeasure,
|
|
45
|
-
destinationScrollToIndex,
|
|
46
|
-
destinationScrollToOffset,
|
|
47
|
-
destinationTotalSize,
|
|
48
|
-
sourceVirtualRef,
|
|
49
|
-
sourceVirtualItems,
|
|
50
|
-
sourceMeasure,
|
|
51
|
-
sourceScrollToIndex,
|
|
52
|
-
sourceScrollToOffset,
|
|
53
|
-
sourceTotalSize
|
|
54
|
-
}),
|
|
55
|
-
[
|
|
56
|
-
destinationVirtualItems,
|
|
57
|
-
destinationMeasure,
|
|
58
|
-
destinationScrollToIndex,
|
|
59
|
-
destinationScrollToOffset,
|
|
60
|
-
destinationTotalSize,
|
|
61
|
-
sourceVirtualItems,
|
|
62
|
-
sourceMeasure,
|
|
63
|
-
sourceScrollToIndex,
|
|
64
|
-
sourceScrollToOffset,
|
|
65
|
-
sourceTotalSize
|
|
66
|
-
]
|
|
67
|
-
);
|
|
68
|
-
};
|
|
69
|
-
export {
|
|
70
|
-
useShuttleVirtualized
|
|
71
|
-
};
|
|
72
|
-
//# sourceMappingURL=useShuttleVirtualized.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/config/useAutoCalculated/useShuttleVirtualized.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useCallback, useRef } from 'react';\nimport { useVirtual } from 'react-virtual';\n\nimport { type DSShuttleV2T } from '../../react-desc-prop-types';\n\ntype UseVirtualT = ReturnType<typeof useVirtual>;\ninterface UseVirtualizedT {\n destinationVirtualItems: UseVirtualT['virtualItems'];\n destinationMeasure: UseVirtualT['measure'];\n destinationScrollToIndex: UseVirtualT['scrollToIndex'];\n destinationScrollToOffset: UseVirtualT['scrollToOffset'];\n destinationTotalSize: UseVirtualT['totalSize'];\n destinationVirtualRef: React.Ref<HTMLDivElement>;\n sourceVirtualItems: UseVirtualT['virtualItems'];\n sourceMeasure: UseVirtualT['measure'];\n sourceScrollToIndex: UseVirtualT['scrollToIndex'];\n sourceScrollToOffset: UseVirtualT['scrollToOffset'];\n sourceTotalSize: UseVirtualT['totalSize'];\n sourceVirtualRef: React.Ref<HTMLDivElement>;\n}\nexport const useShuttleVirtualized = (propsWithDefaults: DSShuttleV2T.InternalProps): UseVirtualizedT => {\n const destinationVirtualRef = useRef<HTMLDivElement>(null);\n const sourceVirtualRef = useRef<HTMLDivElement>(null);\n\n const estimatedSize = useCallback(() => 36, []);\n\n const destinationVirtualConfig = useMemo(\n () => ({\n size: propsWithDefaults.destinationData.length,\n parentRef: destinationVirtualRef,\n overscan: 30,\n estimateSize: estimatedSize,\n }),\n [propsWithDefaults.destinationData.length, destinationVirtualRef, estimatedSize],\n );\n\n const {\n virtualItems: destinationVirtualItems,\n measure: destinationMeasure,\n scrollToIndex: destinationScrollToIndex,\n scrollToOffset: destinationScrollToOffset,\n totalSize: destinationTotalSize,\n }: ReturnType<typeof useVirtual> = useVirtual(destinationVirtualConfig);\n\n const sourceVirtualConfig = useMemo(\n () => ({\n size: propsWithDefaults.sourceData.length,\n parentRef: sourceVirtualRef,\n overscan: 30,\n estimateSize: estimatedSize,\n }),\n [propsWithDefaults.sourceData.length, sourceVirtualRef, estimatedSize],\n );\n\n const {\n virtualItems: sourceVirtualItems,\n measure: sourceMeasure,\n scrollToIndex: sourceScrollToIndex,\n scrollToOffset: sourceScrollToOffset,\n totalSize: sourceTotalSize,\n }: ReturnType<typeof useVirtual> = useVirtual(sourceVirtualConfig);\n\n return useMemo(\n () => ({\n destinationVirtualRef,\n destinationVirtualItems,\n destinationMeasure,\n destinationScrollToIndex,\n destinationScrollToOffset,\n destinationTotalSize,\n sourceVirtualRef,\n sourceVirtualItems,\n sourceMeasure,\n sourceScrollToIndex,\n sourceScrollToOffset,\n sourceTotalSize,\n }),\n [\n destinationVirtualItems,\n destinationMeasure,\n destinationScrollToIndex,\n destinationScrollToOffset,\n destinationTotalSize,\n sourceVirtualItems,\n sourceMeasure,\n sourceScrollToIndex,\n sourceScrollToOffset,\n sourceTotalSize,\n ],\n );\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,SAAS,aAAa,cAAc;AAC7C,SAAS,kBAAkB;AAmBpB,MAAM,wBAAwB,CAAC,sBAAmE;AACvG,QAAM,wBAAwB,OAAuB,IAAI;AACzD,QAAM,mBAAmB,OAAuB,IAAI;AAEpD,QAAM,gBAAgB,YAAY,MAAM,IAAI,CAAC,CAAC;AAE9C,QAAM,2BAA2B;AAAA,IAC/B,OAAO;AAAA,MACL,MAAM,kBAAkB,gBAAgB;AAAA,MACxC,WAAW;AAAA,MACX,UAAU;AAAA,MACV,cAAc;AAAA,IAChB;AAAA,IACA,CAAC,kBAAkB,gBAAgB,QAAQ,uBAAuB,aAAa;AAAA,EACjF;AAEA,QAAM;AAAA,IACJ,cAAc;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb,IAAmC,WAAW,wBAAwB;AAEtE,QAAM,sBAAsB;AAAA,IAC1B,OAAO;AAAA,MACL,MAAM,kBAAkB,WAAW;AAAA,MACnC,WAAW;AAAA,MACX,UAAU;AAAA,MACV,cAAc;AAAA,IAChB;AAAA,IACA,CAAC,kBAAkB,WAAW,QAAQ,kBAAkB,aAAa;AAAA,EACvE;AAEA,QAAM;AAAA,IACJ,cAAc;AAAA,IACd,SAAS;AAAA,IACT,eAAe;AAAA,IACf,gBAAgB;AAAA,IAChB,WAAW;AAAA,EACb,IAAmC,WAAW,mBAAmB;AAEjE,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACF;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { createElement } from "react";
|
|
4
|
-
import { GripperVertical } from "@elliemae/ds-icons";
|
|
5
|
-
import { styled } from "@elliemae/ds-system";
|
|
6
|
-
import { mergeRefs } from "@elliemae/ds-utilities";
|
|
7
|
-
import { DATA_TESTID } from "../../constants";
|
|
8
|
-
const StyledGripperButton = styled.div`
|
|
9
|
-
cursor: ${({ isActive, isDragOverlay }) => isActive || isDragOverlay ? "grabbing" : "grab"};
|
|
10
|
-
outline: none;
|
|
11
|
-
display: flex;
|
|
12
|
-
align-items: center;
|
|
13
|
-
touch-action: none;
|
|
14
|
-
&:focus {
|
|
15
|
-
outline: 1px solid brand-700;
|
|
16
|
-
}
|
|
17
|
-
`;
|
|
18
|
-
const DragHandle = ({ id, isDndActive, isDragging, isDragOverlay, innerRef, useSortableHelpers }) => /* @__PURE__ */ createElement(
|
|
19
|
-
StyledGripperButton,
|
|
20
|
-
{
|
|
21
|
-
...useSortableHelpers && {
|
|
22
|
-
...useSortableHelpers.listeners,
|
|
23
|
-
...useSortableHelpers.attributes
|
|
24
|
-
},
|
|
25
|
-
isActive: isDndActive,
|
|
26
|
-
isDragOverlay,
|
|
27
|
-
ref: mergeRefs(innerRef, useSortableHelpers?.setActivatorNodeRef),
|
|
28
|
-
tabIndex: -1,
|
|
29
|
-
"data-testid": DATA_TESTID.SHUTTLE_DRAG_HANDLE,
|
|
30
|
-
id: `${id}-drag-handle`,
|
|
31
|
-
key: `${id}-drag-handle`
|
|
32
|
-
},
|
|
33
|
-
/* @__PURE__ */ jsx(GripperVertical, { size: "s", color: isDragging ? ["neutral", "500"] : ["brand-primary", "800"] })
|
|
34
|
-
);
|
|
35
|
-
export {
|
|
36
|
-
DragHandle
|
|
37
|
-
};
|
|
38
|
-
//# sourceMappingURL=DndHandle.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Dnd/DndHandle.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { GripperVertical } from '@elliemae/ds-icons';\nimport type { useSortable } from '@elliemae/ds-drag-and-drop';\n\nimport { styled } from '@elliemae/ds-system';\nimport { mergeRefs } from '@elliemae/ds-utilities';\nimport { DATA_TESTID } from '../../constants';\n\nconst StyledGripperButton = styled.div<{\n isActive: boolean;\n isDragOverlay: boolean;\n}>`\n cursor: ${({ isActive, isDragOverlay }) => (isActive || isDragOverlay ? 'grabbing' : 'grab')};\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 isDragOverlay?: boolean;\n innerRef: React.RefObject<HTMLDivElement> | React.RefCallback<HTMLDivElement>;\n useSortableHelpers: ReturnType<typeof useSortable>;\n isDndActive: boolean;\n isDragging: boolean;\n}> = ({ id, isDndActive, isDragging, isDragOverlay, innerRef, useSortableHelpers }) => (\n <StyledGripperButton\n {...(useSortableHelpers && {\n ...useSortableHelpers.listeners,\n ...useSortableHelpers.attributes,\n })}\n isActive={isDndActive}\n isDragOverlay={isDragOverlay}\n ref={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 >\n <GripperVertical size=\"s\" color={isDragging ? ['neutral', '500'] : ['brand-primary', '800']} />\n </StyledGripperButton>\n);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC2CnB;AAbF;AA7BF,SAAS,uBAAuB;AAGhC,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAE5B,MAAM,sBAAsB,OAAO;AAAA,YAIvB,CAAC,EAAE,UAAU,cAAc,MAAO,YAAY,gBAAgB,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUhF,MAAM,aAOR,CAAC,EAAE,IAAI,aAAa,YAAY,eAAe,UAAU,mBAAmB,MAC/E;AAAA,EAAC;AAAA;AAAA,IACE,GAAI,sBAAsB;AAAA,MACzB,GAAG,mBAAmB;AAAA,MACtB,GAAG,mBAAmB;AAAA,IACxB;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA,KAAK,UAAU,UAAU,oBAAoB,mBAAmB;AAAA,IAChE,UAAU;AAAA,IACV,eAAa,YAAY;AAAA,IACzB,IAAI,GAAG;AAAA,IACP,KAAK,GAAG;AAAA;AAAA,EAER,oBAAC,mBAAgB,MAAK,KAAI,OAAO,aAAa,CAAC,WAAW,KAAK,IAAI,CAAC,iBAAiB,KAAK,GAAG;AAC/F;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
import { styled } from "@elliemae/ds-system";
|
|
4
|
-
var DropIndicatorPosition = /* @__PURE__ */ ((DropIndicatorPosition2) => {
|
|
5
|
-
DropIndicatorPosition2[DropIndicatorPosition2["None"] = 0] = "None";
|
|
6
|
-
DropIndicatorPosition2[DropIndicatorPosition2["Before"] = 1] = "Before";
|
|
7
|
-
DropIndicatorPosition2[DropIndicatorPosition2["After"] = 2] = "After";
|
|
8
|
-
return DropIndicatorPosition2;
|
|
9
|
-
})(DropIndicatorPosition || {});
|
|
10
|
-
const getPositionStyles = ({ dropIndicatorPosition, vertical }) => {
|
|
11
|
-
if (vertical) {
|
|
12
|
-
return `
|
|
13
|
-
left: ${dropIndicatorPosition === 1 /* Before */ ? "0" : "unset"};
|
|
14
|
-
right: ${dropIndicatorPosition === 2 /* After */ ? "0" : "unset"};
|
|
15
|
-
`;
|
|
16
|
-
}
|
|
17
|
-
return `
|
|
18
|
-
top: ${dropIndicatorPosition === 1 /* Before */ ? "0" : "unset"};
|
|
19
|
-
bottom: ${dropIndicatorPosition === 2 /* After */ ? "0" : "unset"};
|
|
20
|
-
`;
|
|
21
|
-
};
|
|
22
|
-
const getCircleStyles = ({ dropIndicatorPosition, vertical }) => ({
|
|
23
|
-
position: "absolute",
|
|
24
|
-
top: vertical || dropIndicatorPosition === 2 /* After */ ? "unset" : "-2px",
|
|
25
|
-
bottom: vertical || dropIndicatorPosition === 1 /* Before */ ? "unset" : "-2px",
|
|
26
|
-
left: !vertical || dropIndicatorPosition === 2 /* After */ ? "unset" : "-2px",
|
|
27
|
-
right: !vertical || dropIndicatorPosition === 1 /* Before */ ? "unset" : "-2px",
|
|
28
|
-
opacity: 1
|
|
29
|
-
});
|
|
30
|
-
const StyledIndicator = styled.div`
|
|
31
|
-
position: absolute;
|
|
32
|
-
${getPositionStyles}
|
|
33
|
-
box-sizing: border-box;
|
|
34
|
-
width: ${(props) => props.vertical ? "2px" : "100%"};
|
|
35
|
-
height: ${(props) => props.vertical ? "100%" : "2px"};
|
|
36
|
-
background-color: ${({ isDropValid, theme }) => isDropValid ? theme.colors.brand[600] : theme.colors.danger[900]};
|
|
37
|
-
`;
|
|
38
|
-
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" }) });
|
|
39
|
-
const DropIndicator = (props) => {
|
|
40
|
-
const { vertical, dropIndicatorPosition, isLast, isDropValid } = props;
|
|
41
|
-
if (dropIndicatorPosition === false || ![2 /* After */, 1 /* Before */].includes(dropIndicatorPosition)) {
|
|
42
|
-
return null;
|
|
43
|
-
}
|
|
44
|
-
const safeDropIndicatorPosition = isLast ? 1 /* Before */ : dropIndicatorPosition;
|
|
45
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
46
|
-
CircleIndicator(getCircleStyles({ ...props, dropIndicatorPosition: safeDropIndicatorPosition }), isDropValid),
|
|
47
|
-
/* @__PURE__ */ jsx(
|
|
48
|
-
StyledIndicator,
|
|
49
|
-
{
|
|
50
|
-
vertical,
|
|
51
|
-
dropIndicatorPosition: safeDropIndicatorPosition,
|
|
52
|
-
isDropValid
|
|
53
|
-
}
|
|
54
|
-
)
|
|
55
|
-
] });
|
|
56
|
-
};
|
|
57
|
-
var DropIndicator_default = DropIndicator;
|
|
58
|
-
export {
|
|
59
|
-
DropIndicator,
|
|
60
|
-
DropIndicator_default as default
|
|
61
|
-
};
|
|
62
|
-
//# sourceMappingURL=DropIndicator.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Dnd/DropIndicator.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { styled } from '@elliemae/ds-system';\n\nenum DropIndicatorPosition {\n None = 0,\n Before = 1,\n After = 2,\n}\n\ninterface DropIndicatorProps {\n vertical: boolean;\n dropIndicatorPosition: false | DropIndicatorPosition;\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 (\n dropIndicatorPosition === false ||\n ![DropIndicatorPosition.After, DropIndicatorPosition.Before].includes(dropIndicatorPosition)\n ) {\n return null;\n }\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;ACiDnB,SAeA,UAfA,KAeA,YAfA;AAhDJ,SAAS,cAAc;AAEvB,IAAK,wBAAL,kBAAKA,2BAAL;AACE,EAAAA,8CAAA,UAAO,KAAP;AACA,EAAAA,8CAAA,YAAS,KAAT;AACA,EAAAA,8CAAA,WAAQ,KAAR;AAHG,SAAAA;AAAA,GAAA;AAaL,MAAM,oBAAoB,CAAC,EAAE,uBAAuB,SAAS,MAA0B;AACrF,MAAI,UAAU;AACZ,WAAO;AAAA,cACG,0BAA0B,iBAA+B,MAAM;AAAA,eAC9D,0BAA0B,gBAA8B,MAAM;AAAA;AAAA,EAE3E;AACA,SAAO;AAAA,aACI,0BAA0B,iBAA+B,MAAM;AAAA,gBAC5D,0BAA0B,gBAA8B,MAAM;AAAA;AAE9E;AAEA,MAAM,kBAAkB,CAAC,EAAE,uBAAuB,SAAS,OAA2B;AAAA,EACpF,UAAU;AAAA,EACV,KAAK,YAAY,0BAA0B,gBAA8B,UAAU;AAAA,EACnF,QAAQ,YAAY,0BAA0B,iBAA+B,UAAU;AAAA,EACvF,MAAM,CAAC,YAAY,0BAA0B,gBAA8B,UAAU;AAAA,EACrF,OAAO,CAAC,YAAY,0BAA0B,iBAA+B,UAAU;AAAA,EACvF,SAAS;AACX;AAEA,MAAM,kBAAkB,OAAO;AAAA;AAAA,IAE3B;AAAA;AAAA,WAEO,CAAC,UAAW,MAAM,WAAW,QAAQ;AAAA,YACpC,CAAC,UAAW,MAAM,WAAW,SAAS;AAAA,sBAC5B,CAAC,EAAE,aAAa,MAAM,MAAO,cAAc,MAAM,OAAO,MAAM,OAAO,MAAM,OAAO,OAAO;AAAA;AAG/G,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,MACE,0BAA0B,SAC1B,CAAC,CAAC,eAA6B,cAA4B,EAAE,SAAS,qBAAqB,GAC3F;AACA,WAAO;AAAA,EACT;AAEA,QAAM,4BAA4B,SAAS,iBAA+B;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
|
-
"names": ["DropIndicatorPosition"]
|
|
7
|
-
}
|