@elliemae/ds-drag-and-drop 2.2.0 → 2.3.0-alpha.3
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/cjs/hierarchy/customCollisionDetection.js +44 -50
- package/cjs/hierarchy/customCollisionDetection.js.map +7 -0
- package/cjs/hierarchy/getHierarchyKeyboardCoordinates.js +78 -91
- package/cjs/hierarchy/getHierarchyKeyboardCoordinates.js.map +7 -0
- package/cjs/hierarchy/index.js +28 -9
- package/cjs/hierarchy/index.js.map +7 -0
- package/cjs/hierarchy/types.js +27 -2
- package/cjs/hierarchy/types.js.map +7 -0
- package/cjs/hierarchy/useHierarchyActionHandlers.js +53 -35
- package/cjs/hierarchy/useHierarchyActionHandlers.js.map +7 -0
- package/cjs/hierarchy/useHierarchyAnnouncements.js +45 -26
- package/cjs/hierarchy/useHierarchyAnnouncements.js.map +7 -0
- package/cjs/hierarchy/useHierarchyDndkitConfig.js +77 -83
- package/cjs/hierarchy/useHierarchyDndkitConfig.js.map +7 -0
- package/cjs/hierarchy/useHierarchyPreviewHandlers.js +48 -27
- package/cjs/hierarchy/useHierarchyPreviewHandlers.js.map +7 -0
- package/cjs/index.js +29 -11
- package/cjs/index.js.map +7 -0
- package/cjs/tree/constants.js +41 -12
- package/cjs/tree/constants.js.map +7 -0
- package/cjs/tree/customCollisionDetection.js +96 -124
- package/cjs/tree/customCollisionDetection.js.map +7 -0
- package/cjs/tree/getTreeKeyboardCoordinates.js +86 -101
- package/cjs/tree/getTreeKeyboardCoordinates.js.map +7 -0
- package/cjs/tree/index.js +28 -9
- package/cjs/tree/index.js.map +7 -0
- package/cjs/tree/types.js +27 -2
- package/cjs/tree/types.js.map +7 -0
- package/cjs/tree/useTreeActionHandlers.js +68 -57
- package/cjs/tree/useTreeActionHandlers.js.map +7 -0
- package/cjs/tree/useTreeAnnouncements.js +53 -40
- package/cjs/tree/useTreeAnnouncements.js.map +7 -0
- package/cjs/tree/useTreeDndkitConfig.js +112 -98
- package/cjs/tree/useTreeDndkitConfig.js.map +7 -0
- package/cjs/tree/useTreePreviewHandlers.js +53 -37
- package/cjs/tree/useTreePreviewHandlers.js.map +7 -0
- package/cjs/tree/utilities.js +44 -30
- package/cjs/tree/utilities.js.map +7 -0
- package/esm/hierarchy/customCollisionDetection.js +15 -46
- package/esm/hierarchy/customCollisionDetection.js.map +7 -0
- package/esm/hierarchy/getHierarchyKeyboardCoordinates.js +42 -76
- package/esm/hierarchy/getHierarchyKeyboardCoordinates.js.map +7 -0
- package/esm/hierarchy/index.js +3 -1
- package/esm/hierarchy/index.js.map +7 -0
- package/esm/hierarchy/types.js +2 -1
- package/esm/hierarchy/types.js.map +7 -0
- package/esm/hierarchy/useHierarchyActionHandlers.js +24 -31
- package/esm/hierarchy/useHierarchyActionHandlers.js.map +7 -0
- package/esm/hierarchy/useHierarchyAnnouncements.js +14 -20
- package/esm/hierarchy/useHierarchyAnnouncements.js.map +7 -0
- package/esm/hierarchy/useHierarchyDndkitConfig.js +45 -66
- package/esm/hierarchy/useHierarchyDndkitConfig.js.map +7 -0
- package/esm/hierarchy/useHierarchyPreviewHandlers.js +15 -19
- package/esm/hierarchy/useHierarchyPreviewHandlers.js.map +7 -0
- package/esm/index.js +4 -2
- package/esm/index.js.map +7 -0
- package/esm/tree/constants.js +12 -10
- package/esm/tree/constants.js.map +7 -0
- package/esm/tree/customCollisionDetection.js +67 -120
- package/esm/tree/customCollisionDetection.js.map +7 -0
- package/esm/tree/getTreeKeyboardCoordinates.js +48 -84
- package/esm/tree/getTreeKeyboardCoordinates.js.map +7 -0
- package/esm/tree/index.js +3 -1
- package/esm/tree/index.js.map +7 -0
- package/esm/tree/types.js +2 -1
- package/esm/tree/types.js.map +7 -0
- package/esm/tree/useTreeActionHandlers.js +37 -51
- package/esm/tree/useTreeActionHandlers.js.map +7 -0
- package/esm/tree/useTreeAnnouncements.js +18 -30
- package/esm/tree/useTreeAnnouncements.js.map +7 -0
- package/esm/tree/useTreeDndkitConfig.js +79 -80
- package/esm/tree/useTreeDndkitConfig.js.map +7 -0
- package/esm/tree/useTreePreviewHandlers.js +19 -28
- package/esm/tree/useTreePreviewHandlers.js.map +7 -0
- package/esm/tree/utilities.js +13 -23
- package/esm/tree/utilities.js.map +7 -0
- package/package.json +1 -1
- package/types/hierarchy/types.d.ts +1 -1
- package/types/tree/types.d.ts +17 -13
- package/types/tree/useTreeActionHandlers.d.ts +2 -2
- package/types/tree/useTreeDndkitConfig.d.ts +2 -2
- package/types/tree/useTreePreviewHandlers.d.ts +2 -2
|
@@ -1,36 +1,55 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var useHierarchyAnnouncements_exports = {};
|
|
29
|
+
__export(useHierarchyAnnouncements_exports, {
|
|
30
|
+
useHierarchyAnnouncements: () => useHierarchyAnnouncements
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var import_react = require("react");
|
|
34
|
+
const useHierarchyAnnouncements = (visibleItemsDictionary) => {
|
|
35
|
+
const onDragStart = (0, import_react.useCallback)((id) => `Picked up draggable item from position ${visibleItemsDictionary[id].index + 1}.`, [visibleItemsDictionary]);
|
|
36
|
+
const onDragMove = (0, import_react.useCallback)((id, overId) => {
|
|
10
37
|
if (overId) {
|
|
11
38
|
const overIndex = visibleItemsDictionary[overId].index + 1;
|
|
12
|
-
return
|
|
39
|
+
return `Draggable item was moved to position ${overIndex}.`;
|
|
13
40
|
}
|
|
14
|
-
|
|
15
|
-
return "Draggable item is no longer over a droppable area.";
|
|
41
|
+
return `Draggable item is no longer over a droppable area.`;
|
|
16
42
|
}, [visibleItemsDictionary]);
|
|
17
43
|
const onDragOver = onDragMove;
|
|
18
|
-
const onDragEnd =
|
|
44
|
+
const onDragEnd = (0, import_react.useCallback)((id, overId) => {
|
|
19
45
|
if (overId) {
|
|
20
46
|
const overIndex = visibleItemsDictionary[overId].index + 1;
|
|
21
|
-
return
|
|
47
|
+
return `Draggable item was dropped over position ${overIndex}.`;
|
|
22
48
|
}
|
|
23
|
-
|
|
24
|
-
return "Draggable item was dropped at it's original position.";
|
|
49
|
+
return `Draggable item was dropped at it's original position.`;
|
|
25
50
|
}, [visibleItemsDictionary]);
|
|
26
|
-
const onDragCancel =
|
|
27
|
-
return {
|
|
28
|
-
onDragStart,
|
|
29
|
-
onDragOver,
|
|
30
|
-
onDragMove,
|
|
31
|
-
onDragEnd,
|
|
32
|
-
onDragCancel
|
|
33
|
-
};
|
|
51
|
+
const onDragCancel = (0, import_react.useCallback)((id) => `Dragging was cancelled. Draggable item from position ${visibleItemsDictionary[id].index + 1} was dropped at it's initial position.`, [visibleItemsDictionary]);
|
|
52
|
+
return { onDragStart, onDragOver, onDragMove, onDragEnd, onDragCancel };
|
|
34
53
|
};
|
|
35
|
-
|
|
36
|
-
|
|
54
|
+
module.exports = __toCommonJS(useHierarchyAnnouncements_exports);
|
|
55
|
+
//# sourceMappingURL=useHierarchyAnnouncements.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/hierarchy/useHierarchyAnnouncements.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { Announcements } from '@dnd-kit/core';\nimport { useCallback } from 'react';\nimport { Item } from './types';\n\nexport const useHierarchyAnnouncements = (visibleItemsDictionary: Record<string, Item>): Announcements => {\n const onDragStart = useCallback(\n (id: string) => `Picked up draggable item from position ${visibleItemsDictionary[id].index + 1}.`,\n [visibleItemsDictionary],\n );\n\n const onDragMove = useCallback(\n (id: string, overId: string) => {\n if (overId) {\n const overIndex = visibleItemsDictionary[overId].index + 1;\n return `Draggable item was moved to position ${overIndex}.`;\n }\n\n return `Draggable item is no longer over a droppable area.`;\n },\n [visibleItemsDictionary],\n );\n\n const onDragOver = onDragMove;\n\n const onDragEnd = useCallback(\n (id: string, overId: string) => {\n if (overId) {\n const overIndex = visibleItemsDictionary[overId].index + 1;\n return `Draggable item was dropped over position ${overIndex}.`;\n }\n\n return `Draggable item was dropped at it's original position.`;\n },\n [visibleItemsDictionary],\n );\n\n const onDragCancel = useCallback(\n (id: string) =>\n `Dragging was cancelled. Draggable item from position ${\n visibleItemsDictionary[id].index + 1\n } was dropped at it's initial position.`,\n [visibleItemsDictionary],\n );\n\n return { onDragStart, onDragOver, onDragMove, onDragEnd, onDragCancel };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA4B;AAGrB,MAAM,4BAA4B,CAAC,2BAAgE;AACxG,QAAM,cAAc,8BAClB,CAAC,OAAe,0CAA0C,uBAAuB,IAAI,QAAQ,MAC7F,CAAC;AAGH,QAAM,aAAa,8BACjB,CAAC,IAAY,WAAmB;AAC9B,QAAI,QAAQ;AACV,YAAM,YAAY,uBAAuB,QAAQ,QAAQ;AACzD,aAAO,wCAAwC;AAAA;AAGjD,WAAO;AAAA,KAET,CAAC;AAGH,QAAM,aAAa;AAEnB,QAAM,YAAY,8BAChB,CAAC,IAAY,WAAmB;AAC9B,QAAI,QAAQ;AACV,YAAM,YAAY,uBAAuB,QAAQ,QAAQ;AACzD,aAAO,4CAA4C;AAAA;AAGrD,WAAO;AAAA,KAET,CAAC;AAGH,QAAM,eAAe,8BACnB,CAAC,OACC,wDACE,uBAAuB,IAAI,QAAQ,2CAEvC,CAAC;AAGH,SAAO,EAAE,aAAa,YAAY,YAAY,WAAW;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,119 +1,113 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var useHierarchyDndkitConfig_exports = {};
|
|
29
|
+
__export(useHierarchyDndkitConfig_exports, {
|
|
30
|
+
useHierarchyDndkitConfig: () => useHierarchyDndkitConfig
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var import_react = require("react");
|
|
34
|
+
var import_core = require("@dnd-kit/core");
|
|
35
|
+
var import_useHierarchyActionHandlers = require("./useHierarchyActionHandlers");
|
|
36
|
+
var import_useHierarchyPreviewHandlers = require("./useHierarchyPreviewHandlers");
|
|
37
|
+
var import_getHierarchyKeyboardCoordinates = require("./getHierarchyKeyboardCoordinates");
|
|
38
|
+
var import_customCollisionDetection = require("./customCollisionDetection");
|
|
39
|
+
var import_useHierarchyAnnouncements = require("./useHierarchyAnnouncements");
|
|
40
|
+
const adjustTranslate = (isHorizontalDnD) => ({ transform }) => {
|
|
41
|
+
const newTransform = {
|
|
42
|
+
...transform
|
|
43
|
+
};
|
|
38
44
|
if (isHorizontalDnD) {
|
|
39
45
|
newTransform.y = transform.y + 15;
|
|
40
46
|
} else {
|
|
41
47
|
newTransform.y = transform.y - 35;
|
|
42
48
|
}
|
|
43
|
-
|
|
44
49
|
return newTransform;
|
|
45
50
|
};
|
|
46
|
-
|
|
47
51
|
const measuring = {
|
|
48
52
|
droppable: {
|
|
49
|
-
strategy:
|
|
53
|
+
strategy: import_core.MeasuringStrategy.Always
|
|
50
54
|
}
|
|
51
55
|
};
|
|
52
|
-
|
|
53
56
|
const noop = () => null;
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
} = _ref2;
|
|
66
|
-
const [activeId, setActiveId] = react.useState('');
|
|
67
|
-
const dndItems = react.useMemo(() => flattenedItems.map(_ref3 => {
|
|
68
|
-
let [item] = _ref3;
|
|
69
|
-
return item;
|
|
70
|
-
}), [flattenedItems]);
|
|
71
|
-
const itemsDictionary = react.useMemo(() => {
|
|
57
|
+
const useHierarchyDndkitConfig = ({
|
|
58
|
+
flattenedItems,
|
|
59
|
+
dragOverlayDataTestid,
|
|
60
|
+
isHorizontalDnD = false,
|
|
61
|
+
onReorder,
|
|
62
|
+
onPreviewResetState = noop,
|
|
63
|
+
onPreviewDragStart = noop
|
|
64
|
+
}) => {
|
|
65
|
+
const [activeId, setActiveId] = (0, import_react.useState)("");
|
|
66
|
+
const dndItems = (0, import_react.useMemo)(() => flattenedItems.map(([item]) => item), [flattenedItems]);
|
|
67
|
+
const itemsDictionary = (0, import_react.useMemo)(() => {
|
|
72
68
|
const dictionary = {};
|
|
73
|
-
dndItems.forEach(item => {
|
|
69
|
+
dndItems.forEach((item) => {
|
|
74
70
|
dictionary[item.id] = item;
|
|
75
71
|
});
|
|
76
72
|
return dictionary;
|
|
77
73
|
}, [dndItems]);
|
|
78
|
-
const modifiers =
|
|
79
|
-
const sensorContext =
|
|
74
|
+
const modifiers = (0, import_react.useMemo)(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);
|
|
75
|
+
const sensorContext = (0, import_react.useRef)({
|
|
80
76
|
items: dndItems
|
|
81
77
|
});
|
|
82
|
-
|
|
78
|
+
(0, import_react.useEffect)(() => {
|
|
83
79
|
sensorContext.current = {
|
|
84
80
|
items: dndItems
|
|
85
81
|
};
|
|
86
82
|
}, [dndItems]);
|
|
87
|
-
const coordinateGetter =
|
|
88
|
-
const sensors =
|
|
83
|
+
const coordinateGetter = (0, import_react.useMemo)(() => (0, import_getHierarchyKeyboardCoordinates.getHierarchyKeyboardCoordinates)(sensorContext, dragOverlayDataTestid, isHorizontalDnD), [isHorizontalDnD]);
|
|
84
|
+
const sensors = (0, import_core.useSensors)((0, import_core.useSensor)(import_core.PointerSensor), (0, import_core.useSensor)(import_core.KeyboardSensor, {
|
|
89
85
|
coordinateGetter
|
|
90
86
|
}));
|
|
91
|
-
const dragPreviewHandlers =
|
|
87
|
+
const dragPreviewHandlers = (0, import_useHierarchyPreviewHandlers.useHierarchyPreviewHandlers)({
|
|
92
88
|
setActiveId,
|
|
93
89
|
onPreviewResetState,
|
|
94
90
|
onPreviewDragStart
|
|
95
91
|
});
|
|
96
|
-
const dragActionHandlers =
|
|
92
|
+
const dragActionHandlers = (0, import_useHierarchyActionHandlers.useHierarchyActionHandlers)({
|
|
93
|
+
...dragPreviewHandlers,
|
|
97
94
|
dndItems,
|
|
98
95
|
onReorder
|
|
99
|
-
})
|
|
100
|
-
const announcements =
|
|
101
|
-
const dndContextProps =
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
collisionDetection: customCollisionDetection.customCollisionDetection(activeId, (_itemsDictionary = itemsDictionary[activeId !== null && activeId !== void 0 ? activeId : '']) === null || _itemsDictionary === void 0 ? void 0 : _itemsDictionary.parentId, dndItems)
|
|
110
|
-
}, dragActionHandlers);
|
|
111
|
-
}, [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers]);
|
|
96
|
+
});
|
|
97
|
+
const announcements = (0, import_useHierarchyAnnouncements.useHierarchyAnnouncements)(itemsDictionary);
|
|
98
|
+
const dndContextProps = (0, import_react.useMemo)(() => ({
|
|
99
|
+
announcements,
|
|
100
|
+
modifiers,
|
|
101
|
+
sensors,
|
|
102
|
+
measuring,
|
|
103
|
+
collisionDetection: (0, import_customCollisionDetection.customCollisionDetection)(activeId, itemsDictionary[activeId ?? ""]?.parentId, dndItems),
|
|
104
|
+
...dragActionHandlers
|
|
105
|
+
}), [announcements, modifiers, sensors, activeId, itemsDictionary, dndItems, dragActionHandlers]);
|
|
112
106
|
return {
|
|
113
107
|
dndContextProps,
|
|
114
108
|
activeId,
|
|
115
|
-
activeIndex: activeId ?
|
|
109
|
+
activeIndex: activeId ? itemsDictionary[activeId]?.index : -1
|
|
116
110
|
};
|
|
117
111
|
};
|
|
118
|
-
|
|
119
|
-
|
|
112
|
+
module.exports = __toCommonJS(useHierarchyDndkitConfig_exports);
|
|
113
|
+
//# sourceMappingURL=useHierarchyDndkitConfig.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/hierarchy/useHierarchyDndkitConfig.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;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;AAAA,OAChB;AAAA;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;AAAA,OACjD;AAAA,IACH;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,OAC/F;AAAA,MAEL,CAAC,eAAe,WAAW,SAAS,UAAU,iBAAiB,UAAU;AAG3E,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,aAAa,WAAW,gBAAgB,WAAW,QAAQ;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,35 +1,56 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var useHierarchyPreviewHandlers_exports = {};
|
|
29
|
+
__export(useHierarchyPreviewHandlers_exports, {
|
|
30
|
+
useHierarchyPreviewHandlers: () => useHierarchyPreviewHandlers
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var import_react = require("react");
|
|
34
|
+
const useHierarchyPreviewHandlers = ({
|
|
35
|
+
setActiveId,
|
|
36
|
+
onPreviewResetState,
|
|
37
|
+
onPreviewDragStart
|
|
38
|
+
}) => {
|
|
39
|
+
const resetState = (0, import_react.useCallback)(() => {
|
|
40
|
+
setActiveId("");
|
|
15
41
|
onPreviewResetState();
|
|
16
|
-
document.body.style.setProperty(
|
|
42
|
+
document.body.style.setProperty("cursor", "");
|
|
17
43
|
}, [setActiveId, onPreviewResetState]);
|
|
18
|
-
const handlePreviewDragStart =
|
|
19
|
-
let {
|
|
20
|
-
active: {
|
|
21
|
-
id
|
|
22
|
-
}
|
|
23
|
-
} = _ref2;
|
|
44
|
+
const handlePreviewDragStart = (0, import_react.useCallback)(({ active: { id } }) => {
|
|
24
45
|
setActiveId(id);
|
|
25
|
-
document.body.style.setProperty(
|
|
46
|
+
document.body.style.setProperty("cursor", "grabbing");
|
|
26
47
|
onPreviewDragStart();
|
|
27
48
|
}, [setActiveId, onPreviewDragStart]);
|
|
28
|
-
const handlePreviewDragMove =
|
|
29
|
-
const handlePreviewDragEnd =
|
|
49
|
+
const handlePreviewDragMove = (0, import_react.useCallback)(() => null, []);
|
|
50
|
+
const handlePreviewDragEnd = (0, import_react.useCallback)(() => {
|
|
30
51
|
resetState();
|
|
31
52
|
}, [resetState]);
|
|
32
|
-
const handlePreviewDragCancel =
|
|
53
|
+
const handlePreviewDragCancel = (0, import_react.useCallback)(() => {
|
|
33
54
|
resetState();
|
|
34
55
|
}, [resetState]);
|
|
35
56
|
return {
|
|
@@ -39,5 +60,5 @@ const useHierarchyPreviewHandlers = _ref => {
|
|
|
39
60
|
handlePreviewDragCancel
|
|
40
61
|
};
|
|
41
62
|
};
|
|
42
|
-
|
|
43
|
-
|
|
63
|
+
module.exports = __toCommonJS(useHierarchyPreviewHandlers_exports);
|
|
64
|
+
//# sourceMappingURL=useHierarchyPreviewHandlers.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/hierarchy/useHierarchyPreviewHandlers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { useCallback } from 'react';\nimport { DragStartEvent, DragOverEvent } from '@dnd-kit/core';\nimport type { useHierarchyPreviewHandlersReturn, useHierarchyPreviewHandlersArgs } from './types';\n\nexport const useHierarchyPreviewHandlers = ({\n setActiveId,\n onPreviewResetState,\n onPreviewDragStart,\n}: useHierarchyPreviewHandlersArgs): useHierarchyPreviewHandlersReturn => {\n const resetState = useCallback(() => {\n setActiveId('');\n onPreviewResetState();\n\n document.body.style.setProperty('cursor', '');\n }, [setActiveId, onPreviewResetState]);\n\n const handlePreviewDragStart = useCallback(\n ({ active: { id } }: DragStartEvent) => {\n setActiveId(id);\n document.body.style.setProperty('cursor', 'grabbing');\n onPreviewDragStart();\n },\n [setActiveId, onPreviewDragStart],\n );\n\n const handlePreviewDragMove = useCallback(() => null, []);\n\n const handlePreviewDragEnd = useCallback(() => {\n resetState();\n }, [resetState]);\n\n const handlePreviewDragCancel = useCallback(() => {\n resetState();\n }, [resetState]);\n\n return {\n handlePreviewDragStart,\n handlePreviewDragMove,\n handlePreviewDragEnd,\n handlePreviewDragCancel,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA4B;AAIrB,MAAM,8BAA8B,CAAC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,MACwE;AACxE,QAAM,aAAa,8BAAY,MAAM;AACnC,gBAAY;AACZ;AAEA,aAAS,KAAK,MAAM,YAAY,UAAU;AAAA,KACzC,CAAC,aAAa;AAEjB,QAAM,yBAAyB,8BAC7B,CAAC,EAAE,QAAQ,EAAE,WAA2B;AACtC,gBAAY;AACZ,aAAS,KAAK,MAAM,YAAY,UAAU;AAC1C;AAAA,KAEF,CAAC,aAAa;AAGhB,QAAM,wBAAwB,8BAAY,MAAM,MAAM;AAEtD,QAAM,uBAAuB,8BAAY,MAAM;AAC7C;AAAA,KACC,CAAC;AAEJ,QAAM,0BAA0B,8BAAY,MAAM;AAChD;AAAA,KACC,CAAC;AAEJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/index.js
CHANGED
|
@@ -1,11 +1,29 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
9
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
10
|
+
for (let key of __getOwnPropNames(module2))
|
|
11
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
12
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
13
|
+
}
|
|
14
|
+
return target;
|
|
15
|
+
};
|
|
16
|
+
var __toESM = (module2, isNodeMode) => {
|
|
17
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
20
|
+
return (module2, temp) => {
|
|
21
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
22
|
+
};
|
|
23
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
24
|
+
var src_exports = {};
|
|
25
|
+
var React = __toESM(require("react"));
|
|
26
|
+
__reExport(src_exports, require("./hierarchy"));
|
|
27
|
+
__reExport(src_exports, require("./tree"));
|
|
28
|
+
module.exports = __toCommonJS(src_exports);
|
|
29
|
+
//# sourceMappingURL=index.js.map
|
package/cjs/index.js.map
ADDED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export * from './hierarchy';\nexport * from './tree';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,wBAAc;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
package/cjs/tree/constants.js
CHANGED
|
@@ -1,12 +1,41 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __reExport = (target, module2, copyDefault, desc) => {
|
|
13
|
+
if (module2 && typeof module2 === "object" || typeof module2 === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(module2))
|
|
15
|
+
if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
|
|
16
|
+
__defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return target;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (module2, isNodeMode) => {
|
|
21
|
+
return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
|
|
22
|
+
};
|
|
23
|
+
var __toCommonJS = /* @__PURE__ */ ((cache) => {
|
|
24
|
+
return (module2, temp) => {
|
|
25
|
+
return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
|
|
26
|
+
};
|
|
27
|
+
})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
|
|
28
|
+
var constants_exports = {};
|
|
29
|
+
__export(constants_exports, {
|
|
30
|
+
DropIndicatorPosition: () => DropIndicatorPosition
|
|
31
|
+
});
|
|
32
|
+
var React = __toESM(require("react"));
|
|
33
|
+
var DropIndicatorPosition = /* @__PURE__ */ ((DropIndicatorPosition2) => {
|
|
34
|
+
DropIndicatorPosition2[DropIndicatorPosition2["None"] = 0] = "None";
|
|
35
|
+
DropIndicatorPosition2[DropIndicatorPosition2["Before"] = 1] = "Before";
|
|
36
|
+
DropIndicatorPosition2[DropIndicatorPosition2["After"] = 2] = "After";
|
|
37
|
+
DropIndicatorPosition2[DropIndicatorPosition2["Inside"] = 3] = "Inside";
|
|
38
|
+
return DropIndicatorPosition2;
|
|
39
|
+
})(DropIndicatorPosition || {});
|
|
40
|
+
module.exports = __toCommonJS(constants_exports);
|
|
41
|
+
//# sourceMappingURL=constants.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../src/tree/constants.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["export enum DropIndicatorPosition {\n None = 0,\n Before = 1,\n After = 2,\n Inside = 3,\n}", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,IAAK,wBAAL,kBAAK,2BAAL;AACL,0DAAO,KAAP;AACA,4DAAS,KAAT;AACA,2DAAQ,KAAR;AACA,4DAAS,KAAT;AAJU;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|