@elliemae/ds-drag-and-drop 3.0.0-alpha.0 → 3.0.0-alpha.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/hierarchy/getHierarchyKeyboardCoordinates.js +19 -3
- package/dist/cjs/hierarchy/getHierarchyKeyboardCoordinates.js.map +1 -1
- package/dist/cjs/hierarchy/useHierarchyDndkitConfig.js +23 -10
- package/dist/cjs/hierarchy/useHierarchyDndkitConfig.js.map +1 -1
- package/dist/cjs/tree/getTreeKeyboardCoordinates.js +25 -12
- package/dist/cjs/tree/getTreeKeyboardCoordinates.js.map +1 -1
- package/dist/cjs/tree/useTreeDndkitConfig.js +23 -10
- package/dist/cjs/tree/useTreeDndkitConfig.js.map +1 -1
- package/dist/esm/hierarchy/getHierarchyKeyboardCoordinates.js +21 -3
- package/dist/esm/hierarchy/getHierarchyKeyboardCoordinates.js.map +1 -1
- package/dist/esm/hierarchy/useHierarchyDndkitConfig.js +25 -10
- package/dist/esm/hierarchy/useHierarchyDndkitConfig.js.map +1 -1
- package/dist/esm/tree/getTreeKeyboardCoordinates.js +27 -12
- package/dist/esm/tree/getTreeKeyboardCoordinates.js.map +1 -1
- package/dist/esm/tree/useTreeDndkitConfig.js +25 -10
- package/dist/esm/tree/useTreeDndkitConfig.js.map +1 -1
- package/package.json +2 -1
- package/dist/types/hierarchy/customCollisionDetection.d.ts +0 -3
- package/dist/types/hierarchy/getHierarchyKeyboardCoordinates.d.ts +0 -3
- package/dist/types/hierarchy/index.d.ts +0 -1
- package/dist/types/hierarchy/types.d.ts +0 -80
- package/dist/types/hierarchy/useHierarchyActionHandlers.d.ts +0 -1
- package/dist/types/hierarchy/useHierarchyAnnouncements.d.ts +0 -3
- package/dist/types/hierarchy/useHierarchyDndkitConfig.d.ts +0 -2
- package/dist/types/hierarchy/useHierarchyPreviewHandlers.d.ts +0 -2
- package/dist/types/index.d.ts +0 -2
- package/dist/types/tree/constants.d.ts +0 -6
- package/dist/types/tree/customCollisionDetection.d.ts +0 -4
- package/dist/types/tree/getTreeKeyboardCoordinates.d.ts +0 -3
- package/dist/types/tree/index.d.ts +0 -1
- package/dist/types/tree/types.d.ts +0 -102
- package/dist/types/tree/useTreeActionHandlers.d.ts +0 -2
- package/dist/types/tree/useTreeAnnouncements.d.ts +0 -4
- package/dist/types/tree/useTreeDndkitConfig.d.ts +0 -2
- package/dist/types/tree/useTreePreviewHandlers.d.ts +0 -2
- package/dist/types/tree/utilities.d.ts +0 -7
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -74,10 +91,9 @@ const getHorizontalKeyboardCoordinates = ({
|
|
|
74
91
|
return void 0;
|
|
75
92
|
const closestRect = (0, import_core.getViewRect)(closestDroppableContainer);
|
|
76
93
|
const activeRect = (0, import_core.getViewRect)(activeDroppableContainer);
|
|
77
|
-
return {
|
|
78
|
-
...currentCoordinates,
|
|
94
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
79
95
|
x: closestRect.left + (closestRect.width - collisionRect.width) / 2 + (closestRect.offsetLeft < activeRect.left ? -1 : 1)
|
|
80
|
-
};
|
|
96
|
+
});
|
|
81
97
|
};
|
|
82
98
|
const getHierarchyKeyboardCoordinates = (context, dragOverlayDataTestid, isHorizontalDnD) => (event, { currentCoordinates, context: { active, over, collisionRect, droppableContainers } }) => {
|
|
83
99
|
if (directions.includes(event.code)) {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hierarchy/getHierarchyKeyboardCoordinates.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { closestCorners, getViewRect, KeyboardCode, KeyboardCoordinateGetter, DroppableContainer } from '@dnd-kit/core';\nimport { Coordinates } from '@dnd-kit/core/dist/types';\n\nimport { GetKeyboardCoordinatesArgs, SensorContext } from './types';\n\nconst directions: string[] = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];\n\nconst vertical: string[] = [KeyboardCode.Up, KeyboardCode.Down];\n\nconst getHorizontalKeyboardCoordinates = ({\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n}: GetKeyboardCoordinatesArgs): Coordinates | undefined => {\n if (vertical.includes(event.code) || !active || !over) return undefined;\n\n const activeItem = items.find((item) => item.id === active.id);\n\n const overRect = over.rect;\n\n const layoutRects: DroppableContainer[] = [];\n\n // Get the reacheable rects depending on the arrow key pressed\n droppableContainers.forEach((container) => {\n if (container?.disabled || !overRect) {\n return;\n }\n const node = container?.node.current;\n if (!node) {\n return;\n }\n const itemParent = items.find((item) => item.id === container.id)?.parentId;\n if (itemParent !== activeItem?.parentId) return;\n const rect = getViewRect(node);\n if (event.code === KeyboardCode.Left && collisionRect.left > rect.right - 10) {\n layoutRects.push(container);\n } else if (event.code === KeyboardCode.Right && collisionRect.left < rect.left) {\n layoutRects.push(container);\n }\n });\n\n const closestId = closestCorners({ droppableContainers: layoutRects, collisionRect, active });\n\n if (!closestId) return undefined;\n\n const closestDroppableContainer = droppableContainers.get(closestId)?.node?.current;\n const activeDroppableContainer = droppableContainers.get(active?.id)?.node?.current;\n\n if (!closestDroppableContainer || !activeDroppableContainer) return undefined;\n\n const closestRect = getViewRect(closestDroppableContainer);\n const activeRect = getViewRect(activeDroppableContainer);\n return {\n ...currentCoordinates,\n x:\n closestRect.left +\n (closestRect.width - collisionRect.width) / 2 +\n (closestRect.offsetLeft < activeRect.left ? -1 : 1),\n };\n};\n\nexport const getHierarchyKeyboardCoordinates: (\n context: SensorContext,\n dragOverlayDataTestid: string,\n isHorizontalDnD: boolean,\n) => KeyboardCoordinateGetter =\n (context, dragOverlayDataTestid, isHorizontalDnD) =>\n (event, { currentCoordinates, context: { active, over, collisionRect, droppableContainers } }) => {\n if (directions.includes(event.code)) {\n event.preventDefault();\n if (!collisionRect) {\n return undefined;\n }\n\n const {\n current: { items },\n } = context;\n\n const args = {\n dragOverlayDataTestid,\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n };\n\n if (isHorizontalDnD) return getHorizontalKeyboardCoordinates(args);\n return undefined;\n }\n return undefined;\n };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,kBAAwG;AAKxG,MAAM,aAAuB,CAAC,yBAAa,MAAM,yBAAa,OAAO,yBAAa,IAAI,yBAAa;AAEnG,MAAM,WAAqB,CAAC,yBAAa,IAAI,yBAAa;AAE1D,MAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACyD;AACzD,MAAI,SAAS,SAAS,MAAM,SAAS,CAAC,UAAU,CAAC;AAAM,WAAO;AAE9D,QAAM,aAAa,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,OAAO;AAE3D,QAAM,WAAW,KAAK;AAEtB,QAAM,cAAoC;AAG1C,sBAAoB,QAAQ,CAAC,cAAc;AACzC,QAAI,WAAW,YAAY,CAAC,UAAU;AACpC;AAAA;AAEF,UAAM,OAAO,WAAW,KAAK;AAC7B,QAAI,CAAC,MAAM;AACT;AAAA;AAEF,UAAM,aAAa,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,UAAU,KAAK;AACnE,QAAI,eAAe,YAAY;AAAU;AACzC,UAAM,OAAO,6BAAY;AACzB,QAAI,MAAM,SAAS,yBAAa,QAAQ,cAAc,OAAO,KAAK,QAAQ,IAAI;AAC5E,kBAAY,KAAK;AAAA,eACR,MAAM,SAAS,yBAAa,SAAS,cAAc,OAAO,KAAK,MAAM;AAC9E,kBAAY,KAAK;AAAA;AAAA;AAIrB,QAAM,YAAY,gCAAe,EAAE,qBAAqB,aAAa,eAAe;AAEpF,MAAI,CAAC;AAAW,WAAO;AAEvB,QAAM,4BAA4B,oBAAoB,IAAI,YAAY,MAAM;AAC5E,QAAM,2BAA2B,oBAAoB,IAAI,QAAQ,KAAK,MAAM;AAE5E,MAAI,CAAC,6BAA6B,CAAC;AAA0B,WAAO;AAEpE,QAAM,cAAc,6BAAY;AAChC,QAAM,aAAa,6BAAY;AAC/B,SAAO,iCACF,qBADE;AAAA,IAEL,GACE,YAAY,OACX,aAAY,QAAQ,cAAc,SAAS,IAC3C,aAAY,aAAa,WAAW,OAAO,KAAK;AAAA;AAAA;AAIhD,MAAM,kCAKX,CAAC,SAAS,uBAAuB,oBACjC,CAAC,OAAO,EAAE,oBAAoB,SAAS,EAAE,QAAQ,MAAM,eAAe,4BAA4B;AAChG,MAAI,WAAW,SAAS,MAAM,OAAO;AACnC,UAAM;AACN,QAAI,CAAC,eAAe;AAClB,aAAO;AAAA;AAGT,UAAM;AAAA,MACJ,SAAS,EAAE;AAAA,QACT;AAEJ,UAAM,OAAO;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAGF,QAAI;AAAiB,aAAO,iCAAiC;AAC7D,WAAO;AAAA;AAET,SAAO;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -38,9 +55,7 @@ var import_getHierarchyKeyboardCoordinates = require("./getHierarchyKeyboardCoor
|
|
|
38
55
|
var import_customCollisionDetection = require("./customCollisionDetection");
|
|
39
56
|
var import_useHierarchyAnnouncements = require("./useHierarchyAnnouncements");
|
|
40
57
|
const adjustTranslate = (isHorizontalDnD) => ({ transform }) => {
|
|
41
|
-
const newTransform = {
|
|
42
|
-
...transform
|
|
43
|
-
};
|
|
58
|
+
const newTransform = __spreadValues({}, transform);
|
|
44
59
|
if (isHorizontalDnD) {
|
|
45
60
|
newTransform.y = transform.y + 15;
|
|
46
61
|
} else {
|
|
@@ -89,20 +104,18 @@ const useHierarchyDndkitConfig = ({
|
|
|
89
104
|
onPreviewResetState,
|
|
90
105
|
onPreviewDragStart
|
|
91
106
|
});
|
|
92
|
-
const dragActionHandlers = (0, import_useHierarchyActionHandlers.useHierarchyActionHandlers)({
|
|
93
|
-
...dragPreviewHandlers,
|
|
107
|
+
const dragActionHandlers = (0, import_useHierarchyActionHandlers.useHierarchyActionHandlers)(__spreadProps(__spreadValues({}, dragPreviewHandlers), {
|
|
94
108
|
dndItems,
|
|
95
109
|
onReorder
|
|
96
|
-
});
|
|
110
|
+
}));
|
|
97
111
|
const announcements = (0, import_useHierarchyAnnouncements.useHierarchyAnnouncements)(itemsDictionary);
|
|
98
|
-
const dndContextProps = (0, import_react.useMemo)(() => ({
|
|
112
|
+
const dndContextProps = (0, import_react.useMemo)(() => __spreadValues({
|
|
99
113
|
announcements,
|
|
100
114
|
modifiers,
|
|
101
115
|
sensors,
|
|
102
116
|
measuring,
|
|
103
|
-
collisionDetection: (0, import_customCollisionDetection.customCollisionDetection)(activeId, itemsDictionary[activeId ?? ""]?.parentId, dndItems)
|
|
104
|
-
|
|
105
|
-
}), [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers]);
|
|
117
|
+
collisionDetection: (0, import_customCollisionDetection.customCollisionDetection)(activeId, itemsDictionary[activeId ?? ""]?.parentId, dndItems)
|
|
118
|
+
}, dragActionHandlers), [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers]);
|
|
106
119
|
return {
|
|
107
120
|
dndContextProps,
|
|
108
121
|
activeId,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hierarchy/useHierarchyDndkitConfig.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport { useState, useEffect, useMemo, useRef } from 'react';\nimport {\n useSensor,\n useSensors,\n KeyboardSensor,\n PointerSensor,\n MeasuringConfiguration,\n MeasuringStrategy,\n Modifier,\n} from '@dnd-kit/core';\nimport { useHierarchyActionHandlers } from './useHierarchyActionHandlers';\nimport { useHierarchyPreviewHandlers } from './useHierarchyPreviewHandlers';\nimport type { UseHierarchyDndkitConfigType, SensorContext, Item } from './types';\nimport { getHierarchyKeyboardCoordinates } from './getHierarchyKeyboardCoordinates';\nimport { customCollisionDetection } from './customCollisionDetection';\nimport { useHierarchyAnnouncements } from './useHierarchyAnnouncements';\n\n// we make space for the drop indicator\n// if second parameter is true, the space will be done on the horizontal axis\nconst adjustTranslate =\n (isHorizontalDnD: boolean): Modifier =>\n ({ transform }) => {\n const newTransform = {\n ...transform,\n };\n if (isHorizontalDnD) {\n newTransform.y = transform.y + 15;\n } else {\n newTransform.y = transform.y - 35;\n }\n return newTransform;\n };\n\nconst measuring: Partial<MeasuringConfiguration> = {\n droppable: {\n strategy: MeasuringStrategy.Always,\n },\n};\n\nconst noop = () => null;\n\nexport const useHierarchyDndkitConfig: UseHierarchyDndkitConfigType = ({\n flattenedItems,\n dragOverlayDataTestid,\n isHorizontalDnD = false,\n onReorder,\n onPreviewResetState = noop,\n onPreviewDragStart = noop,\n}) => {\n const [activeId, setActiveId] = useState('');\n\n const dndItems = useMemo(() => flattenedItems.map(([item]) => item), [flattenedItems]);\n\n const itemsDictionary = useMemo(() => {\n const dictionary: Record<string, Item> = {};\n dndItems.forEach((item) => {\n dictionary[item.id] = item;\n });\n return dictionary;\n }, [dndItems]);\n\n const modifiers: Modifier[] = useMemo(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);\n\n const sensorContext: SensorContext = useRef({\n items: dndItems,\n });\n\n useEffect(() => {\n sensorContext.current = {\n items: dndItems,\n };\n }, [dndItems]);\n\n const coordinateGetter = useMemo(\n () => getHierarchyKeyboardCoordinates(sensorContext, dragOverlayDataTestid, isHorizontalDnD),\n [isHorizontalDnD],\n );\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter,\n }),\n );\n\n const dragPreviewHandlers = useHierarchyPreviewHandlers({\n setActiveId,\n onPreviewResetState,\n onPreviewDragStart,\n });\n\n const dragActionHandlers = useHierarchyActionHandlers({\n ...dragPreviewHandlers,\n dndItems,\n onReorder,\n });\n\n const announcements = useHierarchyAnnouncements(itemsDictionary);\n\n const dndContextProps = useMemo(\n () => ({\n announcements,\n modifiers,\n sensors,\n measuring,\n collisionDetection: customCollisionDetection(activeId, itemsDictionary[activeId ?? '']?.parentId, dndItems),\n ...dragActionHandlers,\n }),\n [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers],\n );\n\n return {\n dndContextProps,\n activeId,\n activeIndex: activeId ? itemsDictionary[activeId]?.index : -1,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAqD;AACrD,kBAQO;AACP,wCAA2C;AAC3C,yCAA4C;AAE5C,6CAAgD;AAChD,sCAAyC;AACzC,uCAA0C;AAI1C,MAAM,kBACJ,CAAC,oBACD,CAAC,EAAE,gBAAgB;AACjB,QAAM,eAAe,mBAChB;AAEL,MAAI,iBAAiB;AACnB,iBAAa,IAAI,UAAU,IAAI;AAAA,SAC1B;AACL,iBAAa,IAAI,UAAU,IAAI;AAAA;AAEjC,SAAO;AAAA;AAGX,MAAM,YAA6C;AAAA,EACjD,WAAW;AAAA,IACT,UAAU,8BAAkB;AAAA;AAAA;AAIhC,MAAM,OAAO,MAAM;AAEZ,MAAM,2BAAyD,CAAC;AAAA,EACrE;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,MACjB;AACJ,QAAM,CAAC,UAAU,eAAe,2BAAS;AAEzC,QAAM,WAAW,0BAAQ,MAAM,eAAe,IAAI,CAAC,CAAC,UAAU,OAAO,CAAC;AAEtE,QAAM,kBAAkB,0BAAQ,MAAM;AACpC,UAAM,aAAmC;AACzC,aAAS,QAAQ,CAAC,SAAS;AACzB,iBAAW,KAAK,MAAM;AAAA;AAExB,WAAO;AAAA,KACN,CAAC;AAEJ,QAAM,YAAwB,0BAAQ,MAAM,CAAC,gBAAgB,mBAAmB,CAAC;AAEjF,QAAM,gBAA+B,yBAAO;AAAA,IAC1C,OAAO;AAAA;AAGT,8BAAU,MAAM;AACd,kBAAc,UAAU;AAAA,MACtB,OAAO;AAAA;AAAA,KAER,CAAC;AAEJ,QAAM,mBAAmB,0BACvB,MAAM,4EAAgC,eAAe,uBAAuB,kBAC5E,CAAC;AAGH,QAAM,UAAU,4BACd,2BAAU,4BACV,2BAAU,4BAAgB;AAAA,IACxB;AAAA;AAIJ,QAAM,sBAAsB,oEAA4B;AAAA,IACtD;AAAA,IACA;AAAA,IACA;AAAA;AAGF,QAAM,qBAAqB,kEAA2B,iCACjD,sBADiD;AAAA,IAEpD;AAAA,IACA;AAAA;AAGF,QAAM,gBAAgB,gEAA0B;AAEhD,QAAM,kBAAkB,0BACtB,MAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB,8DAAyB,UAAU,gBAAgB,YAAY,KAAK,UAAU;AAAA,KAC/F,qBAEL,CAAC,eAAe,WAAW,SAAS,UAAU,iBAAiB,UAAU;AAG3E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,aAAa,WAAW,gBAAgB,WAAW,QAAQ;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -72,26 +89,22 @@ const getVerticalKeyboardCoordinates = ({
|
|
|
72
89
|
const closestRect = (0, import_core.getViewRect)(closestElement);
|
|
73
90
|
if (event.code === import_core.KeyboardCode.Up) {
|
|
74
91
|
if (dropIndicatorPosition === import_constants.DropIndicatorPosition.Inside || closestId === active.id || closestItem.depth + 1 > maxDragAndDropLevel) {
|
|
75
|
-
return {
|
|
76
|
-
...currentCoordinates,
|
|
92
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
77
93
|
y: closestRect.top - collisionRect.height / 2
|
|
78
|
-
};
|
|
94
|
+
});
|
|
79
95
|
}
|
|
80
|
-
return {
|
|
81
|
-
...currentCoordinates,
|
|
96
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
82
97
|
y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2
|
|
83
|
-
};
|
|
98
|
+
});
|
|
84
99
|
}
|
|
85
100
|
if (dropIndicatorPosition === import_constants.DropIndicatorPosition.Inside || closestId === active.id || closestItem.depth + 1 > maxDragAndDropLevel) {
|
|
86
|
-
return {
|
|
87
|
-
...currentCoordinates,
|
|
101
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
88
102
|
y: closestRect.top + collisionRect.height / 2
|
|
89
|
-
};
|
|
103
|
+
});
|
|
90
104
|
}
|
|
91
|
-
return {
|
|
92
|
-
...currentCoordinates,
|
|
105
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
93
106
|
y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2
|
|
94
|
-
};
|
|
107
|
+
});
|
|
95
108
|
};
|
|
96
109
|
const getTreeKeyboardCoordinates = (context, isHorizontalDnD, maxDragAndDropLevel) => (event, { currentCoordinates, context: { over, translatedRect, droppableContainers, active, collisionRect } }) => {
|
|
97
110
|
if (directions.includes(event.code)) {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/tree/getTreeKeyboardCoordinates.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable complexity */\nimport { closestCorners, getViewRect, KeyboardCode, KeyboardCoordinateGetter, DroppableContainer } from '@dnd-kit/core';\nimport { Coordinates } from '@dnd-kit/core/dist/types';\nimport type { GetKeyboardCoordinatesArgs, SensorContext } from './types';\nimport { DropIndicatorPosition } from './constants';\n\nconst directions: string[] = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];\n\nconst horizontal: string[] = [KeyboardCode.Left, KeyboardCode.Right];\n\nconst getVerticalKeyboardCoordinates = ({\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n dropIndicatorPosition,\n maxDragAndDropLevel,\n}: GetKeyboardCoordinatesArgs): Coordinates | undefined => {\n if (horizontal.includes(event.code)) return undefined;\n\n const overRect = over.rect;\n\n const layoutRects: DroppableContainer[] = [];\n\n // Get the reacheable rects depending on the arrow key pressed\n droppableContainers.forEach((container) => {\n if (container?.disabled || !overRect) {\n return;\n }\n const rect = container.rect.current;\n if (rect && event.code === KeyboardCode.Down && collisionRect.top - 2 <= rect.offsetTop) {\n layoutRects.push(container);\n } else if (rect && event.code === KeyboardCode.Up && collisionRect.top >= rect.offsetTop) {\n layoutRects.push(container);\n }\n });\n\n const closestId = closestCorners({\n collisionRect,\n droppableContainers: layoutRects,\n active,\n });\n\n const closestItem = items.find((item) => item.uid === closestId);\n\n const closestElement = droppableContainers.get(closestId)?.node?.current;\n\n if (!closestId || !closestItem || !closestElement) return undefined;\n\n const closestRect = getViewRect(closestElement);\n\n if (event.code === KeyboardCode.Up) {\n // If the drop indicator is inside (or over ourselves)\n // We are gonna go to the before position\n // Else we are gonna go inside the over rect\n if (\n dropIndicatorPosition === DropIndicatorPosition.Inside ||\n closestId === active.id ||\n closestItem.depth + 1 > maxDragAndDropLevel\n ) {\n return {\n ...currentCoordinates,\n y: closestRect.top - collisionRect.height / 2,\n };\n }\n return {\n ...currentCoordinates,\n y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2,\n };\n }\n // If the drop indicator is inside (or over ourselves)\n // We are gonna go to the after position\n // Else we are gonna go inside the over rect\n if (\n dropIndicatorPosition === DropIndicatorPosition.Inside ||\n closestId === active.id ||\n closestItem.depth + 1 > maxDragAndDropLevel\n ) {\n return {\n ...currentCoordinates,\n y: closestRect.top + collisionRect.height / 2,\n };\n }\n return {\n ...currentCoordinates,\n y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2,\n };\n};\n\nexport const getTreeKeyboardCoordinates: (\n context: SensorContext,\n isHorizontalDnD: boolean,\n maxDragAndDropLevel: number,\n) => KeyboardCoordinateGetter =\n (context, isHorizontalDnD, maxDragAndDropLevel) =>\n (event, { currentCoordinates, context: { over, translatedRect, droppableContainers, active, collisionRect } }) => {\n if (directions.includes(event.code)) {\n if (!translatedRect) {\n return undefined;\n }\n\n const {\n current: { items, dropIndicatorPosition },\n } = context;\n\n if (!over || !active || !collisionRect) return undefined;\n\n const args = {\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n dropIndicatorPosition,\n maxDragAndDropLevel,\n };\n\n if (isHorizontalDnD) return undefined;\n return getVerticalKeyboardCoordinates(args);\n }\n return undefined;\n };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,kBAAwG;AAGxG,uBAAsC;AAEtC,MAAM,aAAuB,CAAC,yBAAa,MAAM,yBAAa,OAAO,yBAAa,IAAI,yBAAa;AAEnG,MAAM,aAAuB,CAAC,yBAAa,MAAM,yBAAa;AAE9D,MAAM,iCAAiC,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACyD;AACzD,MAAI,WAAW,SAAS,MAAM;AAAO,WAAO;AAE5C,QAAM,WAAW,KAAK;AAEtB,QAAM,cAAoC;AAG1C,sBAAoB,QAAQ,CAAC,cAAc;AACzC,QAAI,WAAW,YAAY,CAAC,UAAU;AACpC;AAAA;AAEF,UAAM,OAAO,UAAU,KAAK;AAC5B,QAAI,QAAQ,MAAM,SAAS,yBAAa,QAAQ,cAAc,MAAM,KAAK,KAAK,WAAW;AACvF,kBAAY,KAAK;AAAA,eACR,QAAQ,MAAM,SAAS,yBAAa,MAAM,cAAc,OAAO,KAAK,WAAW;AACxF,kBAAY,KAAK;AAAA;AAAA;AAIrB,QAAM,YAAY,gCAAe;AAAA,IAC/B;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA;AAGF,QAAM,cAAc,MAAM,KAAK,CAAC,SAAS,KAAK,QAAQ;AAEtD,QAAM,iBAAiB,oBAAoB,IAAI,YAAY,MAAM;AAEjE,MAAI,CAAC,aAAa,CAAC,eAAe,CAAC;AAAgB,WAAO;AAE1D,QAAM,cAAc,6BAAY;AAEhC,MAAI,MAAM,SAAS,yBAAa,IAAI;AAIlC,QACE,0BAA0B,uCAAsB,UAChD,cAAc,OAAO,MACrB,YAAY,QAAQ,IAAI,qBACxB;AACA,aAAO,iCACF,qBADE;AAAA,QAEL,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,WAAO,iCACF,qBADE;AAAA,MAEL,GAAG,YAAY,MAAM,KAAK,IAAI,YAAY,SAAS,cAAc,UAAU;AAAA;AAAA;AAM/E,MACE,0BAA0B,uCAAsB,UAChD,cAAc,OAAO,MACrB,YAAY,QAAQ,IAAI,qBACxB;AACA,WAAO,iCACF,qBADE;AAAA,MAEL,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,SAAO,iCACF,qBADE;AAAA,IAEL,GAAG,YAAY,MAAM,KAAK,IAAI,YAAY,SAAS,cAAc,UAAU;AAAA;AAAA;AAIxE,MAAM,6BAKX,CAAC,SAAS,iBAAiB,wBAC3B,CAAC,OAAO,EAAE,oBAAoB,SAAS,EAAE,MAAM,gBAAgB,qBAAqB,QAAQ,sBAAsB;AAChH,MAAI,WAAW,SAAS,MAAM,OAAO;AACnC,QAAI,CAAC,gBAAgB;AACnB,aAAO;AAAA;AAGT,UAAM;AAAA,MACJ,SAAS,EAAE,OAAO;AAAA,QAChB;AAEJ,QAAI,CAAC,QAAQ,CAAC,UAAU,CAAC;AAAe,aAAO;AAE/C,UAAM,OAAO;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAGF,QAAI;AAAiB,aAAO;AAC5B,WAAO,+BAA+B;AAAA;AAExC,SAAO;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -41,9 +58,7 @@ var import_customCollisionDetection = require("./customCollisionDetection");
|
|
|
41
58
|
var import_useTreeAnnouncements = require("./useTreeAnnouncements");
|
|
42
59
|
const adjustTranslate = (isHorizontalDnD) => {
|
|
43
60
|
const func = ({ transform }) => {
|
|
44
|
-
const newTransform = {
|
|
45
|
-
...transform
|
|
46
|
-
};
|
|
61
|
+
const newTransform = __spreadValues({}, transform);
|
|
47
62
|
if (isHorizontalDnD) {
|
|
48
63
|
newTransform.x = transform.x + 25;
|
|
49
64
|
} else {
|
|
@@ -108,23 +123,21 @@ const useTreeDndkitConfig = ({
|
|
|
108
123
|
setOverId,
|
|
109
124
|
setDropIndicatorPosition
|
|
110
125
|
});
|
|
111
|
-
const dragActionHandlers = (0, import_useTreeActionHandlers.useTreeActionHandlers)({
|
|
112
|
-
...dragPreviewHandlers,
|
|
126
|
+
const dragActionHandlers = (0, import_useTreeActionHandlers.useTreeActionHandlers)(__spreadProps(__spreadValues({}, dragPreviewHandlers), {
|
|
113
127
|
onReorder,
|
|
114
128
|
projected,
|
|
115
129
|
flattenedItems,
|
|
116
130
|
dropIndicatorPosition,
|
|
117
131
|
isDropValid
|
|
118
|
-
});
|
|
132
|
+
}));
|
|
119
133
|
const announcements = (0, import_useTreeAnnouncements.useTreeAnnouncements)(visibleItemsDictionary, dropIndicatorPosition);
|
|
120
|
-
const dndContextProps = (0, import_react.useMemo)(() => ({
|
|
134
|
+
const dndContextProps = (0, import_react.useMemo)(() => __spreadValues({
|
|
121
135
|
announcements,
|
|
122
136
|
modifiers,
|
|
123
137
|
sensors,
|
|
124
138
|
measuring,
|
|
125
|
-
collisionDetection: (0, import_customCollisionDetection.customCollisionDetection)(activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition)
|
|
126
|
-
|
|
127
|
-
}), [
|
|
139
|
+
collisionDetection: (0, import_customCollisionDetection.customCollisionDetection)(activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition)
|
|
140
|
+
}, dragActionHandlers), [
|
|
128
141
|
announcements,
|
|
129
142
|
modifiers,
|
|
130
143
|
sensors,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/tree/useTreeDndkitConfig.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport { useState, useEffect, useMemo, useRef } from 'react';\nimport {\n useSensor,\n useSensors,\n KeyboardSensor,\n PointerSensor,\n MeasuringConfiguration,\n MeasuringStrategy,\n Modifier,\n} from '@dnd-kit/core';\nimport { useTreePreviewHandlers } from './useTreePreviewHandlers';\nimport { getTreeKeyboardCoordinates } from './getTreeKeyboardCoordinates';\nimport { getProjection, removeChildrenOf } from './utilities';\nimport { useTreeActionHandlers } from './useTreeActionHandlers';\nimport type { UseTreeDndkitConfigType, SensorContext } from './types';\nimport { DropIndicatorPosition } from './constants';\nimport { customCollisionDetection } from './customCollisionDetection';\nimport { useTreeAnnouncements } from './useTreeAnnouncements';\n\n// we make space for the drop indicator\n// if second parameter is true, the space will be done on the horizontal axis\nconst adjustTranslate = (isHorizontalDnD: boolean): Modifier => {\n const func: Modifier = ({ transform }) => {\n const newTransform = {\n ...transform,\n };\n if (isHorizontalDnD) {\n newTransform.x = transform.x + 25;\n } else {\n newTransform.x = transform.x + 15;\n }\n return newTransform;\n };\n return func;\n};\n\nconst measuring: Partial<MeasuringConfiguration> = {\n droppable: {\n strategy: MeasuringStrategy.Always,\n },\n};\n\nexport const useTreeDndkitConfig: UseTreeDndkitConfigType = ({\n flattenedItems,\n visibleItems: preVisibleItems,\n isHorizontalDnD = false,\n isExpandable = false,\n onReorder,\n getIsDropValid = () => true,\n maxDragAndDropLevel,\n}) => {\n const [activeId, setActiveId] = useState<string>('');\n const [overId, setOverId] = useState<string>('');\n const [dropIndicatorPosition, setDropIndicatorPosition] = useState<DropIndicatorPosition>(DropIndicatorPosition.None);\n const [lastPosition, setLastPosition] = useState<string>('');\n\n // Remove activeId's children\n const visibleItems = useMemo(() => removeChildrenOf(preVisibleItems, activeId), [preVisibleItems, activeId]);\n\n // Sorted ids for the library\n const sortedIds = useMemo(() => visibleItems.map((item) => item.uid), [visibleItems]);\n\n /**\n * Dictionary from UID to ITEM\n * This dictionary is computed since on every DnD move, I need to know the\n * depth of a particular row, so O(1) per DnD move instead of O(#ITEMS)\n */\n const visibleItemsDictionary = useMemo(() => {\n // Using plain for to achieve O(#ITEMS) performance\n const dictionary: Record<string, typeof visibleItems[0]> = {};\n visibleItems.forEach((item) => {\n dictionary[item.uid] = item;\n });\n return dictionary;\n }, [visibleItems]);\n\n const isDropValid = useMemo(() => {\n if (!activeId || !overId) return true;\n return getIsDropValid(\n visibleItemsDictionary[activeId],\n visibleItemsDictionary[overId],\n ['none', 'before', 'after', 'inside'][dropIndicatorPosition] as Parameters<typeof getIsDropValid>[2],\n );\n }, [getIsDropValid, visibleItemsDictionary, activeId, overId, dropIndicatorPosition]);\n\n const modifiers: Modifier[] = useMemo(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);\n\n const sensorContext: SensorContext = useRef({\n items: visibleItems,\n dropIndicatorPosition,\n setDropIndicatorPosition,\n });\n\n useEffect(() => {\n sensorContext.current = {\n items: visibleItems,\n dropIndicatorPosition,\n setDropIndicatorPosition,\n };\n }, [visibleItems, dropIndicatorPosition, setDropIndicatorPosition]);\n\n const coordinateGetter = useMemo(\n () => getTreeKeyboardCoordinates(sensorContext, isHorizontalDnD, maxDragAndDropLevel),\n [sensorContext, isHorizontalDnD, maxDragAndDropLevel],\n );\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter,\n }),\n );\n\n // where is the activeItem being positioned (depth and parent)\n const projected = useMemo(\n () =>\n overId ? getProjection(visibleItems, visibleItemsDictionary, overId, dropIndicatorPosition, isExpandable) : null,\n [overId, visibleItems, visibleItemsDictionary, dropIndicatorPosition, isExpandable],\n );\n\n const dragPreviewHandlers = useTreePreviewHandlers({\n setActiveId,\n setOverId,\n setDropIndicatorPosition,\n });\n\n const dragActionHandlers = useTreeActionHandlers({\n ...dragPreviewHandlers,\n onReorder,\n projected,\n flattenedItems,\n dropIndicatorPosition,\n isDropValid,\n });\n\n const announcements = useTreeAnnouncements(visibleItemsDictionary, dropIndicatorPosition);\n\n const dndContextProps = useMemo(\n () => ({\n announcements,\n modifiers,\n sensors,\n measuring,\n collisionDetection: customCollisionDetection(\n activeId,\n visibleItemsDictionary,\n setDropIndicatorPosition,\n maxDragAndDropLevel,\n lastPosition,\n setLastPosition,\n ),\n ...dragActionHandlers,\n }),\n [\n announcements,\n modifiers,\n sensors,\n dragActionHandlers,\n visibleItemsDictionary,\n setDropIndicatorPosition,\n activeId,\n maxDragAndDropLevel,\n lastPosition,\n setLastPosition,\n ],\n );\n\n const sortableContextProps = useMemo(\n () => ({\n items: sortedIds,\n strategy: () => null,\n }),\n [sortedIds],\n );\n\n return {\n dndContextProps,\n sortableContextProps,\n isDropValid,\n activeId,\n activeIndex: visibleItemsDictionary[activeId]?.realIndex ?? -1,\n overId,\n depth: projected ? projected.depth : 0,\n dropIndicatorPosition,\n visibleItems,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,22 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
1
20
|
import * as React from "react";
|
|
2
21
|
import { closestCorners, getViewRect, KeyboardCode } from "@dnd-kit/core";
|
|
3
22
|
const directions = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];
|
|
@@ -43,10 +62,9 @@ const getHorizontalKeyboardCoordinates = ({
|
|
|
43
62
|
return void 0;
|
|
44
63
|
const closestRect = getViewRect(closestDroppableContainer);
|
|
45
64
|
const activeRect = getViewRect(activeDroppableContainer);
|
|
46
|
-
return {
|
|
47
|
-
...currentCoordinates,
|
|
65
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
48
66
|
x: closestRect.left + (closestRect.width - collisionRect.width) / 2 + (closestRect.offsetLeft < activeRect.left ? -1 : 1)
|
|
49
|
-
};
|
|
67
|
+
});
|
|
50
68
|
};
|
|
51
69
|
const getHierarchyKeyboardCoordinates = (context, dragOverlayDataTestid, isHorizontalDnD) => (event, { currentCoordinates, context: { active, over, collisionRect, droppableContainers } }) => {
|
|
52
70
|
if (directions.includes(event.code)) {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hierarchy/getHierarchyKeyboardCoordinates.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { closestCorners, getViewRect, KeyboardCode, KeyboardCoordinateGetter, DroppableContainer } from '@dnd-kit/core';\nimport { Coordinates } from '@dnd-kit/core/dist/types';\n\nimport { GetKeyboardCoordinatesArgs, SensorContext } from './types';\n\nconst directions: string[] = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];\n\nconst vertical: string[] = [KeyboardCode.Up, KeyboardCode.Down];\n\nconst getHorizontalKeyboardCoordinates = ({\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n}: GetKeyboardCoordinatesArgs): Coordinates | undefined => {\n if (vertical.includes(event.code) || !active || !over) return undefined;\n\n const activeItem = items.find((item) => item.id === active.id);\n\n const overRect = over.rect;\n\n const layoutRects: DroppableContainer[] = [];\n\n // Get the reacheable rects depending on the arrow key pressed\n droppableContainers.forEach((container) => {\n if (container?.disabled || !overRect) {\n return;\n }\n const node = container?.node.current;\n if (!node) {\n return;\n }\n const itemParent = items.find((item) => item.id === container.id)?.parentId;\n if (itemParent !== activeItem?.parentId) return;\n const rect = getViewRect(node);\n if (event.code === KeyboardCode.Left && collisionRect.left > rect.right - 10) {\n layoutRects.push(container);\n } else if (event.code === KeyboardCode.Right && collisionRect.left < rect.left) {\n layoutRects.push(container);\n }\n });\n\n const closestId = closestCorners({ droppableContainers: layoutRects, collisionRect, active });\n\n if (!closestId) return undefined;\n\n const closestDroppableContainer = droppableContainers.get(closestId)?.node?.current;\n const activeDroppableContainer = droppableContainers.get(active?.id)?.node?.current;\n\n if (!closestDroppableContainer || !activeDroppableContainer) return undefined;\n\n const closestRect = getViewRect(closestDroppableContainer);\n const activeRect = getViewRect(activeDroppableContainer);\n return {\n ...currentCoordinates,\n x:\n closestRect.left +\n (closestRect.width - collisionRect.width) / 2 +\n (closestRect.offsetLeft < activeRect.left ? -1 : 1),\n };\n};\n\nexport const getHierarchyKeyboardCoordinates: (\n context: SensorContext,\n dragOverlayDataTestid: string,\n isHorizontalDnD: boolean,\n) => KeyboardCoordinateGetter =\n (context, dragOverlayDataTestid, isHorizontalDnD) =>\n (event, { currentCoordinates, context: { active, over, collisionRect, droppableContainers } }) => {\n if (directions.includes(event.code)) {\n event.preventDefault();\n if (!collisionRect) {\n return undefined;\n }\n\n const {\n current: { items },\n } = context;\n\n const args = {\n dragOverlayDataTestid,\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n };\n\n if (isHorizontalDnD) return getHorizontalKeyboardCoordinates(args);\n return undefined;\n }\n return undefined;\n };\n"],
|
|
5
|
-
"mappings": "AAAA;ACAA;AAKA,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa,OAAO,aAAa,IAAI,aAAa;AAEnG,MAAM,WAAqB,CAAC,aAAa,IAAI,aAAa;AAE1D,MAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACyD;AACzD,MAAI,SAAS,SAAS,MAAM,SAAS,CAAC,UAAU,CAAC;AAAM,WAAO;AAE9D,QAAM,aAAa,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,OAAO;AAE3D,QAAM,WAAW,KAAK;AAEtB,QAAM,cAAoC;AAG1C,sBAAoB,QAAQ,CAAC,cAAc;AACzC,QAAI,WAAW,YAAY,CAAC,UAAU;AACpC;AAAA;AAEF,UAAM,OAAO,WAAW,KAAK;AAC7B,QAAI,CAAC,MAAM;AACT;AAAA;AAEF,UAAM,aAAa,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,UAAU,KAAK;AACnE,QAAI,eAAe,YAAY;AAAU;AACzC,UAAM,OAAO,YAAY;AACzB,QAAI,MAAM,SAAS,aAAa,QAAQ,cAAc,OAAO,KAAK,QAAQ,IAAI;AAC5E,kBAAY,KAAK;AAAA,eACR,MAAM,SAAS,aAAa,SAAS,cAAc,OAAO,KAAK,MAAM;AAC9E,kBAAY,KAAK;AAAA;AAAA;AAIrB,QAAM,YAAY,eAAe,EAAE,qBAAqB,aAAa,eAAe;AAEpF,MAAI,CAAC;AAAW,WAAO;AAEvB,QAAM,4BAA4B,oBAAoB,IAAI,YAAY,MAAM;AAC5E,QAAM,2BAA2B,oBAAoB,IAAI,QAAQ,KAAK,MAAM;AAE5E,MAAI,CAAC,6BAA6B,CAAC;AAA0B,WAAO;AAEpE,QAAM,cAAc,YAAY;AAChC,QAAM,aAAa,YAAY;AAC/B,SAAO
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACAA;AAKA,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa,OAAO,aAAa,IAAI,aAAa;AAEnG,MAAM,WAAqB,CAAC,aAAa,IAAI,aAAa;AAE1D,MAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACyD;AACzD,MAAI,SAAS,SAAS,MAAM,SAAS,CAAC,UAAU,CAAC;AAAM,WAAO;AAE9D,QAAM,aAAa,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,OAAO;AAE3D,QAAM,WAAW,KAAK;AAEtB,QAAM,cAAoC;AAG1C,sBAAoB,QAAQ,CAAC,cAAc;AACzC,QAAI,WAAW,YAAY,CAAC,UAAU;AACpC;AAAA;AAEF,UAAM,OAAO,WAAW,KAAK;AAC7B,QAAI,CAAC,MAAM;AACT;AAAA;AAEF,UAAM,aAAa,MAAM,KAAK,CAAC,SAAS,KAAK,OAAO,UAAU,KAAK;AACnE,QAAI,eAAe,YAAY;AAAU;AACzC,UAAM,OAAO,YAAY;AACzB,QAAI,MAAM,SAAS,aAAa,QAAQ,cAAc,OAAO,KAAK,QAAQ,IAAI;AAC5E,kBAAY,KAAK;AAAA,eACR,MAAM,SAAS,aAAa,SAAS,cAAc,OAAO,KAAK,MAAM;AAC9E,kBAAY,KAAK;AAAA;AAAA;AAIrB,QAAM,YAAY,eAAe,EAAE,qBAAqB,aAAa,eAAe;AAEpF,MAAI,CAAC;AAAW,WAAO;AAEvB,QAAM,4BAA4B,oBAAoB,IAAI,YAAY,MAAM;AAC5E,QAAM,2BAA2B,oBAAoB,IAAI,QAAQ,KAAK,MAAM;AAE5E,MAAI,CAAC,6BAA6B,CAAC;AAA0B,WAAO;AAEpE,QAAM,cAAc,YAAY;AAChC,QAAM,aAAa,YAAY;AAC/B,SAAO,iCACF,qBADE;AAAA,IAEL,GACE,YAAY,OACX,aAAY,QAAQ,cAAc,SAAS,IAC3C,aAAY,aAAa,WAAW,OAAO,KAAK;AAAA;AAAA;AAIhD,MAAM,kCAKX,CAAC,SAAS,uBAAuB,oBACjC,CAAC,OAAO,EAAE,oBAAoB,SAAS,EAAE,QAAQ,MAAM,eAAe,4BAA4B;AAChG,MAAI,WAAW,SAAS,MAAM,OAAO;AACnC,UAAM;AACN,QAAI,CAAC,eAAe;AAClB,aAAO;AAAA;AAGT,UAAM;AAAA,MACJ,SAAS,EAAE;AAAA,QACT;AAEJ,UAAM,OAAO;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAGF,QAAI;AAAiB,aAAO,iCAAiC;AAC7D,WAAO;AAAA;AAET,SAAO;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,22 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
1
20
|
import * as React from "react";
|
|
2
21
|
import { useState, useEffect, useMemo, useRef } from "react";
|
|
3
22
|
import {
|
|
@@ -13,9 +32,7 @@ import { getHierarchyKeyboardCoordinates } from "./getHierarchyKeyboardCoordinat
|
|
|
13
32
|
import { customCollisionDetection } from "./customCollisionDetection";
|
|
14
33
|
import { useHierarchyAnnouncements } from "./useHierarchyAnnouncements";
|
|
15
34
|
const adjustTranslate = (isHorizontalDnD) => ({ transform }) => {
|
|
16
|
-
const newTransform = {
|
|
17
|
-
...transform
|
|
18
|
-
};
|
|
35
|
+
const newTransform = __spreadValues({}, transform);
|
|
19
36
|
if (isHorizontalDnD) {
|
|
20
37
|
newTransform.y = transform.y + 15;
|
|
21
38
|
} else {
|
|
@@ -64,20 +81,18 @@ const useHierarchyDndkitConfig = ({
|
|
|
64
81
|
onPreviewResetState,
|
|
65
82
|
onPreviewDragStart
|
|
66
83
|
});
|
|
67
|
-
const dragActionHandlers = useHierarchyActionHandlers({
|
|
68
|
-
...dragPreviewHandlers,
|
|
84
|
+
const dragActionHandlers = useHierarchyActionHandlers(__spreadProps(__spreadValues({}, dragPreviewHandlers), {
|
|
69
85
|
dndItems,
|
|
70
86
|
onReorder
|
|
71
|
-
});
|
|
87
|
+
}));
|
|
72
88
|
const announcements = useHierarchyAnnouncements(itemsDictionary);
|
|
73
|
-
const dndContextProps = useMemo(() => ({
|
|
89
|
+
const dndContextProps = useMemo(() => __spreadValues({
|
|
74
90
|
announcements,
|
|
75
91
|
modifiers,
|
|
76
92
|
sensors,
|
|
77
93
|
measuring,
|
|
78
|
-
collisionDetection: customCollisionDetection(activeId, itemsDictionary[activeId ?? ""]?.parentId, dndItems)
|
|
79
|
-
|
|
80
|
-
}), [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers]);
|
|
94
|
+
collisionDetection: customCollisionDetection(activeId, itemsDictionary[activeId ?? ""]?.parentId, dndItems)
|
|
95
|
+
}, dragActionHandlers), [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers]);
|
|
81
96
|
return {
|
|
82
97
|
dndContextProps,
|
|
83
98
|
activeId,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hierarchy/useHierarchyDndkitConfig.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { useState, useEffect, useMemo, useRef } from 'react';\nimport {\n useSensor,\n useSensors,\n KeyboardSensor,\n PointerSensor,\n MeasuringConfiguration,\n MeasuringStrategy,\n Modifier,\n} from '@dnd-kit/core';\nimport { useHierarchyActionHandlers } from './useHierarchyActionHandlers';\nimport { useHierarchyPreviewHandlers } from './useHierarchyPreviewHandlers';\nimport type { UseHierarchyDndkitConfigType, SensorContext, Item } from './types';\nimport { getHierarchyKeyboardCoordinates } from './getHierarchyKeyboardCoordinates';\nimport { customCollisionDetection } from './customCollisionDetection';\nimport { useHierarchyAnnouncements } from './useHierarchyAnnouncements';\n\n// we make space for the drop indicator\n// if second parameter is true, the space will be done on the horizontal axis\nconst adjustTranslate =\n (isHorizontalDnD: boolean): Modifier =>\n ({ transform }) => {\n const newTransform = {\n ...transform,\n };\n if (isHorizontalDnD) {\n newTransform.y = transform.y + 15;\n } else {\n newTransform.y = transform.y - 35;\n }\n return newTransform;\n };\n\nconst measuring: Partial<MeasuringConfiguration> = {\n droppable: {\n strategy: MeasuringStrategy.Always,\n },\n};\n\nconst noop = () => null;\n\nexport const useHierarchyDndkitConfig: UseHierarchyDndkitConfigType = ({\n flattenedItems,\n dragOverlayDataTestid,\n isHorizontalDnD = false,\n onReorder,\n onPreviewResetState = noop,\n onPreviewDragStart = noop,\n}) => {\n const [activeId, setActiveId] = useState('');\n\n const dndItems = useMemo(() => flattenedItems.map(([item]) => item), [flattenedItems]);\n\n const itemsDictionary = useMemo(() => {\n const dictionary: Record<string, Item> = {};\n dndItems.forEach((item) => {\n dictionary[item.id] = item;\n });\n return dictionary;\n }, [dndItems]);\n\n const modifiers: Modifier[] = useMemo(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);\n\n const sensorContext: SensorContext = useRef({\n items: dndItems,\n });\n\n useEffect(() => {\n sensorContext.current = {\n items: dndItems,\n };\n }, [dndItems]);\n\n const coordinateGetter = useMemo(\n () => getHierarchyKeyboardCoordinates(sensorContext, dragOverlayDataTestid, isHorizontalDnD),\n [isHorizontalDnD],\n );\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter,\n }),\n );\n\n const dragPreviewHandlers = useHierarchyPreviewHandlers({\n setActiveId,\n onPreviewResetState,\n onPreviewDragStart,\n });\n\n const dragActionHandlers = useHierarchyActionHandlers({\n ...dragPreviewHandlers,\n dndItems,\n onReorder,\n });\n\n const announcements = useHierarchyAnnouncements(itemsDictionary);\n\n const dndContextProps = useMemo(\n () => ({\n announcements,\n modifiers,\n sensors,\n measuring,\n collisionDetection: customCollisionDetection(activeId, itemsDictionary[activeId ?? '']?.parentId, dndItems),\n ...dragActionHandlers,\n }),\n [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers],\n );\n\n return {\n dndContextProps,\n activeId,\n activeIndex: activeId ? itemsDictionary[activeId]?.index : -1,\n };\n};\n"],
|
|
5
|
-
"mappings": "AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AAEA;AACA;AACA;AAIA,MAAM,kBACJ,CAAC,oBACD,CAAC,EAAE,gBAAgB;AACjB,QAAM,eAAe
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AAEA;AACA;AACA;AAIA,MAAM,kBACJ,CAAC,oBACD,CAAC,EAAE,gBAAgB;AACjB,QAAM,eAAe,mBAChB;AAEL,MAAI,iBAAiB;AACnB,iBAAa,IAAI,UAAU,IAAI;AAAA,SAC1B;AACL,iBAAa,IAAI,UAAU,IAAI;AAAA;AAEjC,SAAO;AAAA;AAGX,MAAM,YAA6C;AAAA,EACjD,WAAW;AAAA,IACT,UAAU,kBAAkB;AAAA;AAAA;AAIhC,MAAM,OAAO,MAAM;AAEZ,MAAM,2BAAyD,CAAC;AAAA,EACrE;AAAA,EACA;AAAA,EACA,kBAAkB;AAAA,EAClB;AAAA,EACA,sBAAsB;AAAA,EACtB,qBAAqB;AAAA,MACjB;AACJ,QAAM,CAAC,UAAU,eAAe,SAAS;AAEzC,QAAM,WAAW,QAAQ,MAAM,eAAe,IAAI,CAAC,CAAC,UAAU,OAAO,CAAC;AAEtE,QAAM,kBAAkB,QAAQ,MAAM;AACpC,UAAM,aAAmC;AACzC,aAAS,QAAQ,CAAC,SAAS;AACzB,iBAAW,KAAK,MAAM;AAAA;AAExB,WAAO;AAAA,KACN,CAAC;AAEJ,QAAM,YAAwB,QAAQ,MAAM,CAAC,gBAAgB,mBAAmB,CAAC;AAEjF,QAAM,gBAA+B,OAAO;AAAA,IAC1C,OAAO;AAAA;AAGT,YAAU,MAAM;AACd,kBAAc,UAAU;AAAA,MACtB,OAAO;AAAA;AAAA,KAER,CAAC;AAEJ,QAAM,mBAAmB,QACvB,MAAM,gCAAgC,eAAe,uBAAuB,kBAC5E,CAAC;AAGH,QAAM,UAAU,WACd,UAAU,gBACV,UAAU,gBAAgB;AAAA,IACxB;AAAA;AAIJ,QAAM,sBAAsB,4BAA4B;AAAA,IACtD;AAAA,IACA;AAAA,IACA;AAAA;AAGF,QAAM,qBAAqB,2BAA2B,iCACjD,sBADiD;AAAA,IAEpD;AAAA,IACA;AAAA;AAGF,QAAM,gBAAgB,0BAA0B;AAEhD,QAAM,kBAAkB,QACtB,MAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB,yBAAyB,UAAU,gBAAgB,YAAY,KAAK,UAAU;AAAA,KAC/F,qBAEL,CAAC,eAAe,WAAW,SAAS,UAAU,iBAAiB,UAAU;AAG3E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,aAAa,WAAW,gBAAgB,WAAW,QAAQ;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,22 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
1
20
|
import * as React from "react";
|
|
2
21
|
import { closestCorners, getViewRect, KeyboardCode } from "@dnd-kit/core";
|
|
3
22
|
import { DropIndicatorPosition } from "./constants";
|
|
@@ -41,26 +60,22 @@ const getVerticalKeyboardCoordinates = ({
|
|
|
41
60
|
const closestRect = getViewRect(closestElement);
|
|
42
61
|
if (event.code === KeyboardCode.Up) {
|
|
43
62
|
if (dropIndicatorPosition === DropIndicatorPosition.Inside || closestId === active.id || closestItem.depth + 1 > maxDragAndDropLevel) {
|
|
44
|
-
return {
|
|
45
|
-
...currentCoordinates,
|
|
63
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
46
64
|
y: closestRect.top - collisionRect.height / 2
|
|
47
|
-
};
|
|
65
|
+
});
|
|
48
66
|
}
|
|
49
|
-
return {
|
|
50
|
-
...currentCoordinates,
|
|
67
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
51
68
|
y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2
|
|
52
|
-
};
|
|
69
|
+
});
|
|
53
70
|
}
|
|
54
71
|
if (dropIndicatorPosition === DropIndicatorPosition.Inside || closestId === active.id || closestItem.depth + 1 > maxDragAndDropLevel) {
|
|
55
|
-
return {
|
|
56
|
-
...currentCoordinates,
|
|
72
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
57
73
|
y: closestRect.top + collisionRect.height / 2
|
|
58
|
-
};
|
|
74
|
+
});
|
|
59
75
|
}
|
|
60
|
-
return {
|
|
61
|
-
...currentCoordinates,
|
|
76
|
+
return __spreadProps(__spreadValues({}, currentCoordinates), {
|
|
62
77
|
y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2
|
|
63
|
-
};
|
|
78
|
+
});
|
|
64
79
|
};
|
|
65
80
|
const getTreeKeyboardCoordinates = (context, isHorizontalDnD, maxDragAndDropLevel) => (event, { currentCoordinates, context: { over, translatedRect, droppableContainers, active, collisionRect } }) => {
|
|
66
81
|
if (directions.includes(event.code)) {
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/getTreeKeyboardCoordinates.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\nimport { closestCorners, getViewRect, KeyboardCode, KeyboardCoordinateGetter, DroppableContainer } from '@dnd-kit/core';\nimport { Coordinates } from '@dnd-kit/core/dist/types';\nimport type { GetKeyboardCoordinatesArgs, SensorContext } from './types';\nimport { DropIndicatorPosition } from './constants';\n\nconst directions: string[] = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];\n\nconst horizontal: string[] = [KeyboardCode.Left, KeyboardCode.Right];\n\nconst getVerticalKeyboardCoordinates = ({\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n dropIndicatorPosition,\n maxDragAndDropLevel,\n}: GetKeyboardCoordinatesArgs): Coordinates | undefined => {\n if (horizontal.includes(event.code)) return undefined;\n\n const overRect = over.rect;\n\n const layoutRects: DroppableContainer[] = [];\n\n // Get the reacheable rects depending on the arrow key pressed\n droppableContainers.forEach((container) => {\n if (container?.disabled || !overRect) {\n return;\n }\n const rect = container.rect.current;\n if (rect && event.code === KeyboardCode.Down && collisionRect.top - 2 <= rect.offsetTop) {\n layoutRects.push(container);\n } else if (rect && event.code === KeyboardCode.Up && collisionRect.top >= rect.offsetTop) {\n layoutRects.push(container);\n }\n });\n\n const closestId = closestCorners({\n collisionRect,\n droppableContainers: layoutRects,\n active,\n });\n\n const closestItem = items.find((item) => item.uid === closestId);\n\n const closestElement = droppableContainers.get(closestId)?.node?.current;\n\n if (!closestId || !closestItem || !closestElement) return undefined;\n\n const closestRect = getViewRect(closestElement);\n\n if (event.code === KeyboardCode.Up) {\n // If the drop indicator is inside (or over ourselves)\n // We are gonna go to the before position\n // Else we are gonna go inside the over rect\n if (\n dropIndicatorPosition === DropIndicatorPosition.Inside ||\n closestId === active.id ||\n closestItem.depth + 1 > maxDragAndDropLevel\n ) {\n return {\n ...currentCoordinates,\n y: closestRect.top - collisionRect.height / 2,\n };\n }\n return {\n ...currentCoordinates,\n y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2,\n };\n }\n // If the drop indicator is inside (or over ourselves)\n // We are gonna go to the after position\n // Else we are gonna go inside the over rect\n if (\n dropIndicatorPosition === DropIndicatorPosition.Inside ||\n closestId === active.id ||\n closestItem.depth + 1 > maxDragAndDropLevel\n ) {\n return {\n ...currentCoordinates,\n y: closestRect.top + collisionRect.height / 2,\n };\n }\n return {\n ...currentCoordinates,\n y: closestRect.top + Math.abs(closestRect.height - collisionRect.height) / 2,\n };\n};\n\nexport const getTreeKeyboardCoordinates: (\n context: SensorContext,\n isHorizontalDnD: boolean,\n maxDragAndDropLevel: number,\n) => KeyboardCoordinateGetter =\n (context, isHorizontalDnD, maxDragAndDropLevel) =>\n (event, { currentCoordinates, context: { over, translatedRect, droppableContainers, active, collisionRect } }) => {\n if (directions.includes(event.code)) {\n if (!translatedRect) {\n return undefined;\n }\n\n const {\n current: { items, dropIndicatorPosition },\n } = context;\n\n if (!over || !active || !collisionRect) return undefined;\n\n const args = {\n items,\n active,\n over,\n event,\n currentCoordinates,\n droppableContainers,\n collisionRect,\n dropIndicatorPosition,\n maxDragAndDropLevel,\n };\n\n if (isHorizontalDnD) return undefined;\n return getVerticalKeyboardCoordinates(args);\n }\n return undefined;\n };\n"],
|
|
5
|
-
"mappings": "AAAA;ACCA;AAGA;AAEA,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa,OAAO,aAAa,IAAI,aAAa;AAEnG,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa;AAE9D,MAAM,iCAAiC,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACyD;AACzD,MAAI,WAAW,SAAS,MAAM;AAAO,WAAO;AAE5C,QAAM,WAAW,KAAK;AAEtB,QAAM,cAAoC;AAG1C,sBAAoB,QAAQ,CAAC,cAAc;AACzC,QAAI,WAAW,YAAY,CAAC,UAAU;AACpC;AAAA;AAEF,UAAM,OAAO,UAAU,KAAK;AAC5B,QAAI,QAAQ,MAAM,SAAS,aAAa,QAAQ,cAAc,MAAM,KAAK,KAAK,WAAW;AACvF,kBAAY,KAAK;AAAA,eACR,QAAQ,MAAM,SAAS,aAAa,MAAM,cAAc,OAAO,KAAK,WAAW;AACxF,kBAAY,KAAK;AAAA;AAAA;AAIrB,QAAM,YAAY,eAAe;AAAA,IAC/B;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA;AAGF,QAAM,cAAc,MAAM,KAAK,CAAC,SAAS,KAAK,QAAQ;AAEtD,QAAM,iBAAiB,oBAAoB,IAAI,YAAY,MAAM;AAEjE,MAAI,CAAC,aAAa,CAAC,eAAe,CAAC;AAAgB,WAAO;AAE1D,QAAM,cAAc,YAAY;AAEhC,MAAI,MAAM,SAAS,aAAa,IAAI;AAIlC,QACE,0BAA0B,sBAAsB,UAChD,cAAc,OAAO,MACrB,YAAY,QAAQ,IAAI,qBACxB;AACA,aAAO
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACCA;AAGA;AAEA,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa,OAAO,aAAa,IAAI,aAAa;AAEnG,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa;AAE9D,MAAM,iCAAiC,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACyD;AACzD,MAAI,WAAW,SAAS,MAAM;AAAO,WAAO;AAE5C,QAAM,WAAW,KAAK;AAEtB,QAAM,cAAoC;AAG1C,sBAAoB,QAAQ,CAAC,cAAc;AACzC,QAAI,WAAW,YAAY,CAAC,UAAU;AACpC;AAAA;AAEF,UAAM,OAAO,UAAU,KAAK;AAC5B,QAAI,QAAQ,MAAM,SAAS,aAAa,QAAQ,cAAc,MAAM,KAAK,KAAK,WAAW;AACvF,kBAAY,KAAK;AAAA,eACR,QAAQ,MAAM,SAAS,aAAa,MAAM,cAAc,OAAO,KAAK,WAAW;AACxF,kBAAY,KAAK;AAAA;AAAA;AAIrB,QAAM,YAAY,eAAe;AAAA,IAC/B;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA;AAGF,QAAM,cAAc,MAAM,KAAK,CAAC,SAAS,KAAK,QAAQ;AAEtD,QAAM,iBAAiB,oBAAoB,IAAI,YAAY,MAAM;AAEjE,MAAI,CAAC,aAAa,CAAC,eAAe,CAAC;AAAgB,WAAO;AAE1D,QAAM,cAAc,YAAY;AAEhC,MAAI,MAAM,SAAS,aAAa,IAAI;AAIlC,QACE,0BAA0B,sBAAsB,UAChD,cAAc,OAAO,MACrB,YAAY,QAAQ,IAAI,qBACxB;AACA,aAAO,iCACF,qBADE;AAAA,QAEL,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,WAAO,iCACF,qBADE;AAAA,MAEL,GAAG,YAAY,MAAM,KAAK,IAAI,YAAY,SAAS,cAAc,UAAU;AAAA;AAAA;AAM/E,MACE,0BAA0B,sBAAsB,UAChD,cAAc,OAAO,MACrB,YAAY,QAAQ,IAAI,qBACxB;AACA,WAAO,iCACF,qBADE;AAAA,MAEL,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,SAAO,iCACF,qBADE;AAAA,IAEL,GAAG,YAAY,MAAM,KAAK,IAAI,YAAY,SAAS,cAAc,UAAU;AAAA;AAAA;AAIxE,MAAM,6BAKX,CAAC,SAAS,iBAAiB,wBAC3B,CAAC,OAAO,EAAE,oBAAoB,SAAS,EAAE,MAAM,gBAAgB,qBAAqB,QAAQ,sBAAsB;AAChH,MAAI,WAAW,SAAS,MAAM,OAAO;AACnC,QAAI,CAAC,gBAAgB;AACnB,aAAO;AAAA;AAGT,UAAM;AAAA,MACJ,SAAS,EAAE,OAAO;AAAA,QAChB;AAEJ,QAAI,CAAC,QAAQ,CAAC,UAAU,CAAC;AAAe,aAAO;AAE/C,UAAM,OAAO;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAGF,QAAI;AAAiB,aAAO;AAC5B,WAAO,+BAA+B;AAAA;AAExC,SAAO;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,3 +1,22 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
1
20
|
import * as React from "react";
|
|
2
21
|
import { useState, useEffect, useMemo, useRef } from "react";
|
|
3
22
|
import {
|
|
@@ -16,9 +35,7 @@ import { customCollisionDetection } from "./customCollisionDetection";
|
|
|
16
35
|
import { useTreeAnnouncements } from "./useTreeAnnouncements";
|
|
17
36
|
const adjustTranslate = (isHorizontalDnD) => {
|
|
18
37
|
const func = ({ transform }) => {
|
|
19
|
-
const newTransform = {
|
|
20
|
-
...transform
|
|
21
|
-
};
|
|
38
|
+
const newTransform = __spreadValues({}, transform);
|
|
22
39
|
if (isHorizontalDnD) {
|
|
23
40
|
newTransform.x = transform.x + 25;
|
|
24
41
|
} else {
|
|
@@ -83,23 +100,21 @@ const useTreeDndkitConfig = ({
|
|
|
83
100
|
setOverId,
|
|
84
101
|
setDropIndicatorPosition
|
|
85
102
|
});
|
|
86
|
-
const dragActionHandlers = useTreeActionHandlers({
|
|
87
|
-
...dragPreviewHandlers,
|
|
103
|
+
const dragActionHandlers = useTreeActionHandlers(__spreadProps(__spreadValues({}, dragPreviewHandlers), {
|
|
88
104
|
onReorder,
|
|
89
105
|
projected,
|
|
90
106
|
flattenedItems,
|
|
91
107
|
dropIndicatorPosition,
|
|
92
108
|
isDropValid
|
|
93
|
-
});
|
|
109
|
+
}));
|
|
94
110
|
const announcements = useTreeAnnouncements(visibleItemsDictionary, dropIndicatorPosition);
|
|
95
|
-
const dndContextProps = useMemo(() => ({
|
|
111
|
+
const dndContextProps = useMemo(() => __spreadValues({
|
|
96
112
|
announcements,
|
|
97
113
|
modifiers,
|
|
98
114
|
sensors,
|
|
99
115
|
measuring,
|
|
100
|
-
collisionDetection: customCollisionDetection(activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition)
|
|
101
|
-
|
|
102
|
-
}), [
|
|
116
|
+
collisionDetection: customCollisionDetection(activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition)
|
|
117
|
+
}, dragActionHandlers), [
|
|
103
118
|
announcements,
|
|
104
119
|
modifiers,
|
|
105
120
|
sensors,
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/useTreeDndkitConfig.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { useState, useEffect, useMemo, useRef } from 'react';\nimport {\n useSensor,\n useSensors,\n KeyboardSensor,\n PointerSensor,\n MeasuringConfiguration,\n MeasuringStrategy,\n Modifier,\n} from '@dnd-kit/core';\nimport { useTreePreviewHandlers } from './useTreePreviewHandlers';\nimport { getTreeKeyboardCoordinates } from './getTreeKeyboardCoordinates';\nimport { getProjection, removeChildrenOf } from './utilities';\nimport { useTreeActionHandlers } from './useTreeActionHandlers';\nimport type { UseTreeDndkitConfigType, SensorContext } from './types';\nimport { DropIndicatorPosition } from './constants';\nimport { customCollisionDetection } from './customCollisionDetection';\nimport { useTreeAnnouncements } from './useTreeAnnouncements';\n\n// we make space for the drop indicator\n// if second parameter is true, the space will be done on the horizontal axis\nconst adjustTranslate = (isHorizontalDnD: boolean): Modifier => {\n const func: Modifier = ({ transform }) => {\n const newTransform = {\n ...transform,\n };\n if (isHorizontalDnD) {\n newTransform.x = transform.x + 25;\n } else {\n newTransform.x = transform.x + 15;\n }\n return newTransform;\n };\n return func;\n};\n\nconst measuring: Partial<MeasuringConfiguration> = {\n droppable: {\n strategy: MeasuringStrategy.Always,\n },\n};\n\nexport const useTreeDndkitConfig: UseTreeDndkitConfigType = ({\n flattenedItems,\n visibleItems: preVisibleItems,\n isHorizontalDnD = false,\n isExpandable = false,\n onReorder,\n getIsDropValid = () => true,\n maxDragAndDropLevel,\n}) => {\n const [activeId, setActiveId] = useState<string>('');\n const [overId, setOverId] = useState<string>('');\n const [dropIndicatorPosition, setDropIndicatorPosition] = useState<DropIndicatorPosition>(DropIndicatorPosition.None);\n const [lastPosition, setLastPosition] = useState<string>('');\n\n // Remove activeId's children\n const visibleItems = useMemo(() => removeChildrenOf(preVisibleItems, activeId), [preVisibleItems, activeId]);\n\n // Sorted ids for the library\n const sortedIds = useMemo(() => visibleItems.map((item) => item.uid), [visibleItems]);\n\n /**\n * Dictionary from UID to ITEM\n * This dictionary is computed since on every DnD move, I need to know the\n * depth of a particular row, so O(1) per DnD move instead of O(#ITEMS)\n */\n const visibleItemsDictionary = useMemo(() => {\n // Using plain for to achieve O(#ITEMS) performance\n const dictionary: Record<string, typeof visibleItems[0]> = {};\n visibleItems.forEach((item) => {\n dictionary[item.uid] = item;\n });\n return dictionary;\n }, [visibleItems]);\n\n const isDropValid = useMemo(() => {\n if (!activeId || !overId) return true;\n return getIsDropValid(\n visibleItemsDictionary[activeId],\n visibleItemsDictionary[overId],\n ['none', 'before', 'after', 'inside'][dropIndicatorPosition] as Parameters<typeof getIsDropValid>[2],\n );\n }, [getIsDropValid, visibleItemsDictionary, activeId, overId, dropIndicatorPosition]);\n\n const modifiers: Modifier[] = useMemo(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);\n\n const sensorContext: SensorContext = useRef({\n items: visibleItems,\n dropIndicatorPosition,\n setDropIndicatorPosition,\n });\n\n useEffect(() => {\n sensorContext.current = {\n items: visibleItems,\n dropIndicatorPosition,\n setDropIndicatorPosition,\n };\n }, [visibleItems, dropIndicatorPosition, setDropIndicatorPosition]);\n\n const coordinateGetter = useMemo(\n () => getTreeKeyboardCoordinates(sensorContext, isHorizontalDnD, maxDragAndDropLevel),\n [sensorContext, isHorizontalDnD, maxDragAndDropLevel],\n );\n\n const sensors = useSensors(\n useSensor(PointerSensor),\n useSensor(KeyboardSensor, {\n coordinateGetter,\n }),\n );\n\n // where is the activeItem being positioned (depth and parent)\n const projected = useMemo(\n () =>\n overId ? getProjection(visibleItems, visibleItemsDictionary, overId, dropIndicatorPosition, isExpandable) : null,\n [overId, visibleItems, visibleItemsDictionary, dropIndicatorPosition, isExpandable],\n );\n\n const dragPreviewHandlers = useTreePreviewHandlers({\n setActiveId,\n setOverId,\n setDropIndicatorPosition,\n });\n\n const dragActionHandlers = useTreeActionHandlers({\n ...dragPreviewHandlers,\n onReorder,\n projected,\n flattenedItems,\n dropIndicatorPosition,\n isDropValid,\n });\n\n const announcements = useTreeAnnouncements(visibleItemsDictionary, dropIndicatorPosition);\n\n const dndContextProps = useMemo(\n () => ({\n announcements,\n modifiers,\n sensors,\n measuring,\n collisionDetection: customCollisionDetection(\n activeId,\n visibleItemsDictionary,\n setDropIndicatorPosition,\n maxDragAndDropLevel,\n lastPosition,\n setLastPosition,\n ),\n ...dragActionHandlers,\n }),\n [\n announcements,\n modifiers,\n sensors,\n dragActionHandlers,\n visibleItemsDictionary,\n setDropIndicatorPosition,\n activeId,\n maxDragAndDropLevel,\n lastPosition,\n setLastPosition,\n ],\n );\n\n const sortableContextProps = useMemo(\n () => ({\n items: sortedIds,\n strategy: () => null,\n }),\n [sortedIds],\n );\n\n return {\n dndContextProps,\n sortableContextProps,\n isDropValid,\n activeId,\n activeIndex: visibleItemsDictionary[activeId]?.realIndex ?? -1,\n overId,\n depth: projected ? projected.depth : 0,\n dropIndicatorPosition,\n visibleItems,\n };\n};\n"],
|
|
5
|
-
"mappings": "AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AACA;AACA;AAEA;AACA;AACA;AAIA,MAAM,kBAAkB,CAAC,oBAAuC;AAC9D,QAAM,OAAiB,CAAC,EAAE,gBAAgB;AACxC,UAAM,eAAe
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-drag-and-drop",
|
|
3
|
-
"version": "3.0.0-alpha.
|
|
3
|
+
"version": "3.0.0-alpha.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Drag And Drop",
|
|
6
6
|
"files": [
|
|
@@ -128,6 +128,7 @@
|
|
|
128
128
|
"dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch",
|
|
129
129
|
"test": "node ../../scripts/testing/test.mjs",
|
|
130
130
|
"lint": "node ../../scripts/lint.mjs",
|
|
131
|
+
"dts": "node ../../scripts/dts.mjs",
|
|
131
132
|
"build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs"
|
|
132
133
|
}
|
|
133
134
|
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './useHierarchyDndkitConfig';
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import type { Active, Announcements, CollisionDetection, DragEndEvent, DragMoveEvent, DragOverEvent, DragStartEvent, MeasuringConfiguration, Modifier, Over, SensorDescriptor, SensorOptions } from '@dnd-kit/core';
|
|
2
|
-
import { DroppableContainers } from '@dnd-kit/core/dist/store';
|
|
3
|
-
import { Coordinates, DragCancelEvent, ViewRect } from '@dnd-kit/core/dist/types';
|
|
4
|
-
import { MutableRefObject } from 'react';
|
|
5
|
-
export declare type Item = {
|
|
6
|
-
id: string;
|
|
7
|
-
depth: number;
|
|
8
|
-
parentId: string;
|
|
9
|
-
index: number;
|
|
10
|
-
};
|
|
11
|
-
export declare type DndContextPropsType = {
|
|
12
|
-
announcements: Announcements;
|
|
13
|
-
modifiers: Modifier[];
|
|
14
|
-
sensors: SensorDescriptor<SensorOptions>[];
|
|
15
|
-
measuring: Partial<MeasuringConfiguration>;
|
|
16
|
-
collisionDetection: CollisionDetection;
|
|
17
|
-
onDragStart: (e: DragStartEvent) => void;
|
|
18
|
-
onDragMove: (e: DragMoveEvent) => void;
|
|
19
|
-
onDragOver: (e: DragOverEvent) => void;
|
|
20
|
-
onDragEnd: (e: DragEndEvent) => void;
|
|
21
|
-
onDragCancel: (e: DragCancelEvent) => void;
|
|
22
|
-
};
|
|
23
|
-
export declare type useHierarchyPreviewHandlersReturn = {
|
|
24
|
-
handlePreviewDragStart: (e: DragStartEvent) => void;
|
|
25
|
-
handlePreviewDragMove: (e: DragMoveEvent) => void;
|
|
26
|
-
handlePreviewDragEnd: (e: DragEndEvent) => void;
|
|
27
|
-
handlePreviewDragCancel: (e: DragCancelEvent) => void;
|
|
28
|
-
};
|
|
29
|
-
export declare type useHierarchyPreviewHandlersArgs = {
|
|
30
|
-
setActiveId: React.Dispatch<React.SetStateAction<string>>;
|
|
31
|
-
onPreviewResetState: () => void;
|
|
32
|
-
onPreviewDragStart: () => void;
|
|
33
|
-
};
|
|
34
|
-
export declare type useHierarchyActionHandlersArgs = useHierarchyPreviewHandlersReturn & {
|
|
35
|
-
dndItems: Item[];
|
|
36
|
-
onReorder: (movedItem: Item, indexes: {
|
|
37
|
-
targetIndex: number;
|
|
38
|
-
fromIndex: number;
|
|
39
|
-
}) => void;
|
|
40
|
-
};
|
|
41
|
-
export declare type useHierarchyActionHandlersReturn = {
|
|
42
|
-
onDragStart: (e: DragStartEvent) => void;
|
|
43
|
-
onDragMove: (e: DragMoveEvent) => void;
|
|
44
|
-
onDragOver: (e: DragOverEvent) => void;
|
|
45
|
-
onDragEnd: (e: DragEndEvent) => void;
|
|
46
|
-
onDragCancel: (e: DragCancelEvent) => void;
|
|
47
|
-
};
|
|
48
|
-
export declare type useHierarchyDndkitConfigArgs = {
|
|
49
|
-
indentationWidth?: number;
|
|
50
|
-
dragOverlayDataTestid: string;
|
|
51
|
-
flattenedItems: [Item, unknown][];
|
|
52
|
-
isHorizontalDnD?: boolean;
|
|
53
|
-
onReorder: (movedItem: Item, indexes: {
|
|
54
|
-
targetIndex: number;
|
|
55
|
-
fromIndex: number;
|
|
56
|
-
}) => void;
|
|
57
|
-
onPreviewResetState: () => void;
|
|
58
|
-
onPreviewDragStart: () => void;
|
|
59
|
-
};
|
|
60
|
-
export declare type useHierarchyDndkitConfigType = (args: useHierarchyDndkitConfigArgs) => useHierarchyDndkitConfigReturn;
|
|
61
|
-
export declare type useHierarchyDndkitConfigReturn = {
|
|
62
|
-
dndContextProps: DndContextPropsType;
|
|
63
|
-
activeId: string | null;
|
|
64
|
-
overId: string | null;
|
|
65
|
-
activeIndex: number | undefined;
|
|
66
|
-
};
|
|
67
|
-
export declare type GetKeyboardCoordinatesArgs = {
|
|
68
|
-
items: Item[];
|
|
69
|
-
active: Active | null;
|
|
70
|
-
over: Over | null;
|
|
71
|
-
event: KeyboardEvent;
|
|
72
|
-
currentCoordinates: Coordinates;
|
|
73
|
-
droppableContainers: DroppableContainers;
|
|
74
|
-
collisionRect: ViewRect;
|
|
75
|
-
dragOverlayDataTestid: string;
|
|
76
|
-
};
|
|
77
|
-
export declare type SensorContext = MutableRefObject<{
|
|
78
|
-
items: Item[];
|
|
79
|
-
offset?: number;
|
|
80
|
-
}>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const useHierarchyActionHandlers: ({ handlePreviewDragStart, handlePreviewDragMove, handlePreviewDragEnd, handlePreviewDragCancel, onReorder, dndItems, }: UseHierarchyActionHandlersArgs) => UseHierarchyActionHandlersReturn;
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import type { useHierarchyPreviewHandlersReturn, useHierarchyPreviewHandlersArgs } from './types';
|
|
2
|
-
export declare const useHierarchyPreviewHandlers: ({ setActiveId, onPreviewResetState, onPreviewDragStart, }: useHierarchyPreviewHandlersArgs) => useHierarchyPreviewHandlersReturn;
|
package/dist/types/index.d.ts
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import { CollisionDetection } from '@dnd-kit/core';
|
|
2
|
-
import { DropIndicatorPosition } from './constants';
|
|
3
|
-
import { Item } from './types';
|
|
4
|
-
export declare const customCollisionDetection: (activeId: string, visibleItemsDictionary: Record<string, Item>, setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>, maxDragAndDropLevel: number, lastPosition: string, setLastPosition: React.Dispatch<React.SetStateAction<string>>) => CollisionDetection;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from './useTreeDndkitConfig';
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import { Active, Announcements, CollisionDetection, DragCancelEvent, DragEndEvent, DragMoveEvent, DragOverEvent, DragStartEvent, DroppableContainers, MeasuringConfiguration, Modifier, Over, ViewRect } from '@dnd-kit/core';
|
|
2
|
-
import type { SensorDescriptor, SensorOptions } from '@dnd-kit/core/dist/sensors';
|
|
3
|
-
import type { SortingStrategy } from '@dnd-kit/sortable';
|
|
4
|
-
import { Coordinates } from '@dnd-kit/core/dist/types';
|
|
5
|
-
import React, { MutableRefObject } from 'react';
|
|
6
|
-
import { DropIndicatorPosition } from './constants';
|
|
7
|
-
export declare type Item<T = unknown> = {
|
|
8
|
-
uid: string;
|
|
9
|
-
depth: number;
|
|
10
|
-
parentId: string | null;
|
|
11
|
-
realIndex: number;
|
|
12
|
-
childrenCount: number;
|
|
13
|
-
original: T;
|
|
14
|
-
};
|
|
15
|
-
export declare type DndContextPropsType = {
|
|
16
|
-
announcements: Announcements;
|
|
17
|
-
modifiers: Modifier[];
|
|
18
|
-
sensors: SensorDescriptor<SensorOptions>[];
|
|
19
|
-
measuring: Partial<MeasuringConfiguration>;
|
|
20
|
-
collisionDetection: CollisionDetection;
|
|
21
|
-
onDragStart: (e: DragStartEvent) => void;
|
|
22
|
-
onDragMove: (e: DragMoveEvent) => void;
|
|
23
|
-
onDragOver: (e: DragOverEvent) => void;
|
|
24
|
-
onDragEnd: (e: DragEndEvent) => void;
|
|
25
|
-
onDragCancel: (e: DragCancelEvent) => void;
|
|
26
|
-
};
|
|
27
|
-
export declare type SortableContextPropsType = {
|
|
28
|
-
items: string[];
|
|
29
|
-
strategy: SortingStrategy;
|
|
30
|
-
};
|
|
31
|
-
export declare type UseTreePreviewHandlersReturn = {
|
|
32
|
-
handlePreviewDragStart: (e: DragStartEvent) => void;
|
|
33
|
-
handlePreviewDragMove: (e: DragMoveEvent) => void;
|
|
34
|
-
handlePreviewDragOver: (e: DragOverEvent) => void;
|
|
35
|
-
handlePreviewDragEnd: (e: DragEndEvent) => void;
|
|
36
|
-
handlePreviewDragCancel: (e: DragCancelEvent) => void;
|
|
37
|
-
};
|
|
38
|
-
export declare type UseTreePreviewHandlersArgs = {
|
|
39
|
-
setOverId: React.Dispatch<React.SetStateAction<string>>;
|
|
40
|
-
setActiveId: React.Dispatch<React.SetStateAction<string>>;
|
|
41
|
-
setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;
|
|
42
|
-
};
|
|
43
|
-
export declare type UseTreeActionHandlersArgs<T = unknown> = UseTreePreviewHandlersReturn & {
|
|
44
|
-
dropIndicatorPosition: DropIndicatorPosition;
|
|
45
|
-
flattenedItems: Item[];
|
|
46
|
-
projected: {
|
|
47
|
-
depth: number;
|
|
48
|
-
parentId: string;
|
|
49
|
-
} | null;
|
|
50
|
-
onReorder: <S = T>(newData: Item<S>[], indexes: {
|
|
51
|
-
targetIndex: number;
|
|
52
|
-
fromIndex: number;
|
|
53
|
-
}, considerExpanding: string) => void;
|
|
54
|
-
isDropValid: boolean;
|
|
55
|
-
};
|
|
56
|
-
export declare type UseTreeActionHandlersReturn = {
|
|
57
|
-
onDragStart: (e: DragStartEvent) => void;
|
|
58
|
-
onDragMove: (e: DragMoveEvent) => void;
|
|
59
|
-
onDragOver: (e: DragOverEvent) => void;
|
|
60
|
-
onDragEnd: (e: DragEndEvent) => void;
|
|
61
|
-
onDragCancel: (e: DragCancelEvent) => void;
|
|
62
|
-
};
|
|
63
|
-
export declare type UseTreeDndkitConfigArgs<T> = {
|
|
64
|
-
flattenedItems: Item[];
|
|
65
|
-
visibleItems: Item[];
|
|
66
|
-
isHorizontalDnD?: boolean;
|
|
67
|
-
isExpandable: boolean;
|
|
68
|
-
onReorder: <S = T>(newData: Item<S>[], indexes: {
|
|
69
|
-
targetIndex: number;
|
|
70
|
-
fromIndex: number;
|
|
71
|
-
}, considerExpanding: string) => void;
|
|
72
|
-
getIsDropValid: <S = T>(active: Item<S>, over: Item<S>, dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside') => boolean;
|
|
73
|
-
maxDragAndDropLevel: number;
|
|
74
|
-
};
|
|
75
|
-
export declare type UseTreeDndkitConfigReturn = {
|
|
76
|
-
dndContextProps: DndContextPropsType;
|
|
77
|
-
sortableContextProps: SortableContextPropsType;
|
|
78
|
-
activeId: string;
|
|
79
|
-
activeIndex: number;
|
|
80
|
-
overId: string;
|
|
81
|
-
depth: number;
|
|
82
|
-
dropIndicatorPosition: DropIndicatorPosition;
|
|
83
|
-
isDropValid: boolean;
|
|
84
|
-
visibleItems: Item[];
|
|
85
|
-
};
|
|
86
|
-
export declare type UseTreeDndkitConfigType = <T = unknown>(args: UseTreeDndkitConfigArgs<T>) => UseTreeDndkitConfigReturn;
|
|
87
|
-
export declare type GetKeyboardCoordinatesArgs = {
|
|
88
|
-
items: Item[];
|
|
89
|
-
active: Active;
|
|
90
|
-
over: Over;
|
|
91
|
-
event: KeyboardEvent;
|
|
92
|
-
currentCoordinates: Coordinates;
|
|
93
|
-
droppableContainers: DroppableContainers;
|
|
94
|
-
collisionRect: ViewRect;
|
|
95
|
-
dropIndicatorPosition: DropIndicatorPosition;
|
|
96
|
-
maxDragAndDropLevel: number;
|
|
97
|
-
};
|
|
98
|
-
export declare type SensorContext = MutableRefObject<{
|
|
99
|
-
items: Item[];
|
|
100
|
-
dropIndicatorPosition: DropIndicatorPosition;
|
|
101
|
-
setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;
|
|
102
|
-
}>;
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import type { UseTreeActionHandlersReturn, UseTreeActionHandlersArgs } from './types';
|
|
2
|
-
export declare const useTreeActionHandlers: ({ handlePreviewDragStart, handlePreviewDragMove, handlePreviewDragOver, handlePreviewDragEnd, handlePreviewDragCancel, onReorder, flattenedItems, projected, dropIndicatorPosition, isDropValid, }: UseTreeActionHandlersArgs) => UseTreeActionHandlersReturn;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import { Announcements } from '@dnd-kit/core';
|
|
2
|
-
import { DropIndicatorPosition } from './constants';
|
|
3
|
-
import { Item } from './types';
|
|
4
|
-
export declare const useTreeAnnouncements: (visibleItemsDictionary: Record<string, Item>, dropIndicatorPosition: DropIndicatorPosition) => Announcements;
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import { DropIndicatorPosition } from './constants';
|
|
2
|
-
import { Item } from './types';
|
|
3
|
-
export declare const getProjection: (items: Item[], visibleItemsDictionary: Record<string, Item>, overId: string, dropIndicatorPosition: DropIndicatorPosition, isExpandable: boolean) => {
|
|
4
|
-
depth: number;
|
|
5
|
-
parentId: string;
|
|
6
|
-
};
|
|
7
|
-
export declare const removeChildrenOf: (items: Item[], id: string) => Item[];
|