@elliemae/ds-drag-and-drop 3.1.0-next.13 → 3.1.0-next.16
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/customCollisionDetection.js.map +2 -2
- package/dist/cjs/hierarchy/types.js.map +1 -1
- package/dist/cjs/hierarchy/useHierarchyPreviewHandlers.js.map +1 -1
- package/dist/cjs/tree/customCollisionDetection.js.map +1 -1
- package/dist/cjs/tree/types.js.map +1 -1
- package/dist/esm/hierarchy/customCollisionDetection.js.map +2 -2
- package/dist/esm/hierarchy/useHierarchyPreviewHandlers.js.map +1 -1
- package/dist/esm/tree/customCollisionDetection.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hierarchy/customCollisionDetection.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable indent, react/function-component-definition, complexity */\nimport { type CollisionDetection, type DroppableContainer } from '@dnd-kit/core';\nimport { Item } from './types';\n\nexport const customCollisionDetection =\n (activeId: string | null, activeParent: string | undefined, dndItems: Item[]): CollisionDetection =>\n ({ droppableContainers, collisionRect }) => {\n const entriesWithSameParent = droppableContainers.filter(\n ({ id }) => dndItems.find((item) => item.id === id)?.parentId === activeParent,\n );\n\n const originalContainer = entriesWithSameParent.find(({ id }) => id === activeId);\n const originalRect = originalContainer?.rect?.current;\n\n if (!originalRect) return null;\n\n if (\n originalRect.offsetLeft <= collisionRect.offsetLeft &&\n collisionRect.offsetLeft <= originalRect.offsetLeft + originalRect.width\n ) {\n return originalContainer.id;\n }\n\n const isLeft = collisionRect.offsetLeft <= originalRect.offsetLeft + collisionRect.width / 2 + 5;\n\n let match: DroppableContainer | null = null;\n // If going to the left, search the closest offset left\n // Otherwise, get the closest offset right\n const collisionPoint = collisionRect.offsetLeft + collisionRect.width / 2;\n entriesWithSameParent.forEach((entry) => {\n const {\n rect: { current: rect },\n } = entry;\n\n if (rect !== null) {\n const offsetRight = rect.offsetLeft + rect.width;\n\n if (!match) {\n match = entry;\n } else if (\n match &&\n match.rect.current &&\n isLeft &&\n Math.abs(collisionPoint - rect.offsetLeft) <= Math.abs(collisionPoint - match.rect.current.offsetLeft)\n ) {\n match = entry;\n } else if (\n match &&\n match.rect.current &&\n !isLeft &&\n Math.abs(collisionPoint - offsetRight) <=\n Math.abs(collisionPoint - match.rect.current.offsetLeft - match.rect.current.width)\n ) {\n match = entry;\n }\n }\n });\n // Typescript believes match is always null for some reason\n const matchCastedForSomeReason = match as DroppableContainer | null;\n return matchCastedForSomeReason === null ? null : matchCastedForSomeReason.id;\n };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIhB,MAAM,2BACX,CAAC,UAAyB,cAAkC,aAC5D,CAAC,EAAE,qBAAqB,oBAAoB;AAC1C,QAAM,wBAAwB,oBAAoB,OAChD,CAAC,EAAE,SAAS,SAAS,KAAK,CAAC,SAAS,KAAK,OAAO,EAAE,GAAG,aAAa,YACpE;AAEA,QAAM,oBAAoB,sBAAsB,KAAK,CAAC,EAAE,SAAS,OAAO,QAAQ;AAChF,QAAM,eAAe,mBAAmB,MAAM;AAE9C,MAAI,CAAC;AAAc,WAAO;AAE1B,MACE,aAAa,cAAc,cAAc,cACzC,cAAc,cAAc,aAAa,aAAa,aAAa,OACnE;AACA,WAAO,kBAAkB;AAAA,EAC3B;AAEA,QAAM,SAAS,cAAc,cAAc,aAAa,aAAa,cAAc,QAAQ,IAAI;AAE/F,MAAI,QAAmC;AAGvC,QAAM,iBAAiB,cAAc,aAAa,cAAc,QAAQ;AACxE,wBAAsB,QAAQ,CAAC,UAAU;AACvC,UAAM;AAAA,MACJ,MAAM,EAAE,SAAS;AAAA,QACf;AAEJ,QAAI,SAAS,MAAM;AACjB,YAAM,cAAc,KAAK,aAAa,KAAK;AAE3C,UAAI,CAAC,OAAO;AACV,gBAAQ;AAAA,MACV,WACE,SACA,MAAM,KAAK,WACX,UACA,KAAK,IAAI,iBAAiB,KAAK,UAAU,KAAK,KAAK,IAAI,iBAAiB,MAAM,KAAK,QAAQ,UAAU,GACrG;AACA,gBAAQ;AAAA,MACV,WACE,SACA,MAAM,KAAK,WACX,CAAC,UACD,KAAK,IAAI,iBAAiB,WAAW,KACnC,KAAK,IAAI,iBAAiB,MAAM,KAAK,QAAQ,aAAa,MAAM,KAAK,QAAQ,KAAK,GACpF;AACA,gBAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF,CAAC;AAED,QAAM,2BAA2B;AACjC,SAAO,6BAA6B,OAAO,OAAO,yBAAyB;AAC7E;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/hierarchy/types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type {\n Active,\n Announcements,\n CollisionDetection,\n DragEndEvent,\n DragMoveEvent,\n DragOverEvent,\n DragStartEvent,\n MeasuringConfiguration,\n Modifier,\n Over,\n SensorDescriptor,\n SensorOptions,\n} from '@dnd-kit/core';\nimport { DroppableContainers } from '@dnd-kit/core/dist/store';\nimport { Coordinates, DragCancelEvent, ViewRect } from '@dnd-kit/core/dist/types';\nimport { MutableRefObject } from 'react';\n\nexport type Item = {\n id: string;\n depth: number;\n parentId: string;\n index: number;\n};\n\nexport type DndContextPropsType = {\n announcements: Announcements;\n modifiers: Modifier[];\n sensors: SensorDescriptor<SensorOptions>[];\n measuring: Partial<MeasuringConfiguration>;\n collisionDetection: CollisionDetection;\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type
|
|
4
|
+
"sourcesContent": ["import type {\n Active,\n Announcements,\n CollisionDetection,\n DragEndEvent,\n DragMoveEvent,\n DragOverEvent,\n DragStartEvent,\n MeasuringConfiguration,\n Modifier,\n Over,\n SensorDescriptor,\n SensorOptions,\n} from '@dnd-kit/core';\nimport { DroppableContainers } from '@dnd-kit/core/dist/store';\nimport { Coordinates, DragCancelEvent, ViewRect } from '@dnd-kit/core/dist/types';\nimport { MutableRefObject } from 'react';\n\nexport type Item = {\n id: string;\n depth: number;\n parentId: string;\n index: number;\n};\n\nexport type DndContextPropsType = {\n announcements: Announcements;\n modifiers: Modifier[];\n sensors: SensorDescriptor<SensorOptions>[];\n measuring: Partial<MeasuringConfiguration>;\n collisionDetection: CollisionDetection;\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type UseHierarchyPreviewHandlersReturn = {\n handlePreviewDragStart: (e: DragStartEvent) => void;\n handlePreviewDragMove: (e: DragMoveEvent) => void;\n handlePreviewDragEnd: (e: DragEndEvent) => void;\n handlePreviewDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type UseHierarchyPreviewHandlersArgs = {\n setActiveId: React.Dispatch<React.SetStateAction<string>>;\n onPreviewResetState: () => void;\n onPreviewDragStart: () => void;\n};\n\nexport type UseHierarchyActionHandlersArgs = UseHierarchyPreviewHandlersReturn & {\n dndItems: Item[];\n onReorder: (movedItem: Item, indexes: { targetIndex: number; fromIndex: number }) => void;\n};\n\nexport type UseHierarchyActionHandlersReturn = {\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type UseHierarchyDndkitConfigArgs = {\n indentationWidth?: number;\n dragOverlayDataTestid: string;\n flattenedItems: [Item, unknown][];\n isHorizontalDnD?: boolean;\n onReorder: (movedItem: Item, indexes: { targetIndex: number; fromIndex: number }) => void;\n onPreviewResetState: () => void;\n onPreviewDragStart: () => void;\n};\n\nexport type UseHierarchyDndkitConfigType = (args: UseHierarchyDndkitConfigArgs) => UseHierarchyDndkitConfigReturn;\n\nexport type UseHierarchyDndkitConfigReturn = {\n dndContextProps: DndContextPropsType;\n activeId: string | null;\n overId: string | null;\n activeIndex: number | undefined;\n};\n\nexport type GetKeyboardCoordinatesArgs = {\n items: Item[];\n active: Active | null;\n over: Over | null;\n event: KeyboardEvent;\n currentCoordinates: Coordinates;\n droppableContainers: DroppableContainers;\n collisionRect: ViewRect;\n dragOverlayDataTestid: string;\n};\n\nexport type SensorContext = MutableRefObject<{\n items: Item[];\n offset?: number;\n}>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
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 {
|
|
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
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;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,EAAE;AACd,wBAAoB;AAEpB,aAAS,KAAK,MAAM,YAAY,UAAU,EAAE;AAAA,EAC9C,GAAG,CAAC,aAAa,mBAAmB,CAAC;AAErC,QAAM,yBAAyB,8BAC7B,CAAC,EAAE,QAAQ,EAAE,WAA2B;AACtC,gBAAY,EAAE;AACd,aAAS,KAAK,MAAM,YAAY,UAAU,UAAU;AACpD,uBAAmB;AAAA,EACrB,GACA,CAAC,aAAa,kBAAkB,CAClC;AAEA,QAAM,wBAAwB,8BAAY,MAAM,MAAM,CAAC,CAAC;AAExD,QAAM,uBAAuB,8BAAY,MAAM;AAC7C,eAAW;AAAA,EACb,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,0BAA0B,8BAAY,MAAM;AAChD,eAAW;AAAA,EACb,GAAG,CAAC,UAAU,CAAC;AAEf,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/tree/customCollisionDetection.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable @typescript-eslint/indent */\n/* eslint-disable max-params */\nimport { CollisionDetection, DroppableContainer, LayoutRect } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport { Item } from './types';\n\nconst DUMMY_ID = 'DUMMY_ID_INTERNAL_USE_ONLY';\nconst RECT_UP: LayoutRect = {\n offsetTop: -Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\nconst RECT_DOWN: LayoutRect = {\n offsetTop: Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\n\n// Percentage of height to take into consideration when looking for colliding rects\nconst thresholdRatio = 0.2;\n// Percentage to be inside\nconst insideThreshold = 0.7;\n\nexport const customCollisionDetection = (\n activeId: string,\n visibleItemsDictionary: Record<string, Item>,\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>,\n maxDragAndDropLevel: number,\n lastPosition: string,\n setLastPosition: React.Dispatch<React.SetStateAction<string>>,\n): CollisionDetection => {\n const func: CollisionDetection = ({ droppableContainers, collisionRect }) => {\n const originalContainer = droppableContainers.find(({ id }) => id === activeId);\n const originalRect = originalContainer?.rect?.current;\n\n // We first check if the item was moved up or down\n // This modifies how to search the matching colliding rect\n let isUp = lastPosition === 'up';\n if (originalRect) {\n isUp = originalRect.offsetTop > collisionRect.top;\n }\n\n // Threshold\n const threshold = collisionRect.height * thresholdRatio;\n\n let collidingContainer: DroppableContainer | null = null;\n\n if (isUp) {\n // Up -- We need to find the first rectangle downwards\n collidingContainer = droppableContainers.reduce(\n (firstRectDown, container) => {\n const rect = container.rect.current;\n if (rect && firstRectDown.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;\n if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {\n return container;\n }\n }\n return firstRectDown;\n },\n { id: DUMMY_ID, rect: { current: RECT_DOWN } } as DroppableContainer,\n );\n } else {\n // Down -- We need to find the first rectangle upwards\n collidingContainer = droppableContainers.reduce(\n (firstRectUp, container) => {\n const rect = container.rect.current;\n if (rect && firstRectUp.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;\n if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {\n return container;\n }\n }\n return firstRectUp;\n },\n { id: DUMMY_ID, rect: { current: RECT_UP } } as DroppableContainer,\n );\n }\n\n // If we didn't find a match, return null\n if (collidingContainer.id === DUMMY_ID) {\n return null;\n }\n\n const collidingRect = collidingContainer.rect.current;\n\n if (!collidingRect) return null;\n\n // Calculate the intersection interval\n const [top, bottom] = [\n Math.max(collisionRect.top, collidingRect.offsetTop),\n Math.min(collisionRect.top + collisionRect.height, collidingRect.offsetTop + collidingRect.height),\n ];\n\n // Calculate the percentage of intersection\n const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;\n\n if (\n intersectionPercentage > insideThreshold &&\n visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel &&\n collidingContainer.id !== activeId\n ) {\n setDropIndicatorPosition(DropIndicatorPosition.Inside);\n } else {\n setDropIndicatorPosition(isUp ? DropIndicatorPosition.Before : DropIndicatorPosition.After);\n }\n\n if (isUp && lastPosition !== 'up') setLastPosition('up');\n else if (!isUp && lastPosition !== 'down') setLastPosition('down');\n\n // Return the id of the match rectangle\n return collidingContainer.id;\n };\n return func;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable @typescript-eslint/indent */\n/* eslint-disable max-params */\nimport { type CollisionDetection, type DroppableContainer, type LayoutRect } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport { Item } from './types';\n\nconst DUMMY_ID = 'DUMMY_ID_INTERNAL_USE_ONLY';\nconst RECT_UP: LayoutRect = {\n offsetTop: -Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\nconst RECT_DOWN: LayoutRect = {\n offsetTop: Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\n\n// Percentage of height to take into consideration when looking for colliding rects\nconst thresholdRatio = 0.2;\n// Percentage to be inside\nconst insideThreshold = 0.7;\n\nexport const customCollisionDetection = (\n activeId: string,\n visibleItemsDictionary: Record<string, Item>,\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>,\n maxDragAndDropLevel: number,\n lastPosition: string,\n setLastPosition: React.Dispatch<React.SetStateAction<string>>,\n): CollisionDetection => {\n const func: CollisionDetection = ({ droppableContainers, collisionRect }) => {\n const originalContainer = droppableContainers.find(({ id }) => id === activeId);\n const originalRect = originalContainer?.rect?.current;\n\n // We first check if the item was moved up or down\n // This modifies how to search the matching colliding rect\n let isUp = lastPosition === 'up';\n if (originalRect) {\n isUp = originalRect.offsetTop > collisionRect.top;\n }\n\n // Threshold\n const threshold = collisionRect.height * thresholdRatio;\n\n let collidingContainer: DroppableContainer | null = null;\n\n if (isUp) {\n // Up -- We need to find the first rectangle downwards\n collidingContainer = droppableContainers.reduce(\n (firstRectDown, container) => {\n const rect = container.rect.current;\n if (rect && firstRectDown.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;\n if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {\n return container;\n }\n }\n return firstRectDown;\n },\n { id: DUMMY_ID, rect: { current: RECT_DOWN } } as DroppableContainer,\n );\n } else {\n // Down -- We need to find the first rectangle upwards\n collidingContainer = droppableContainers.reduce(\n (firstRectUp, container) => {\n const rect = container.rect.current;\n if (rect && firstRectUp.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;\n if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {\n return container;\n }\n }\n return firstRectUp;\n },\n { id: DUMMY_ID, rect: { current: RECT_UP } } as DroppableContainer,\n );\n }\n\n // If we didn't find a match, return null\n if (collidingContainer.id === DUMMY_ID) {\n return null;\n }\n\n const collidingRect = collidingContainer.rect.current;\n\n if (!collidingRect) return null;\n\n // Calculate the intersection interval\n const [top, bottom] = [\n Math.max(collisionRect.top, collidingRect.offsetTop),\n Math.min(collisionRect.top + collisionRect.height, collidingRect.offsetTop + collidingRect.height),\n ];\n\n // Calculate the percentage of intersection\n const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;\n\n if (\n intersectionPercentage > insideThreshold &&\n visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel &&\n collidingContainer.id !== activeId\n ) {\n setDropIndicatorPosition(DropIndicatorPosition.Inside);\n } else {\n setDropIndicatorPosition(isUp ? DropIndicatorPosition.Before : DropIndicatorPosition.After);\n }\n\n if (isUp && lastPosition !== 'up') setLastPosition('up');\n else if (!isUp && lastPosition !== 'down') setLastPosition('down');\n\n // Return the id of the match rectangle\n return collidingContainer.id;\n };\n return func;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,uBAAsC;AAGtC,MAAM,WAAW;AACjB,MAAM,UAAsB;AAAA,EAC1B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AACV;AACA,MAAM,YAAwB;AAAA,EAC5B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AACV;AAGA,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAEjB,MAAM,2BAA2B,CACtC,UACA,wBACA,0BACA,qBACA,cACA,oBACuB;AACvB,QAAM,OAA2B,CAAC,EAAE,qBAAqB,oBAAoB;AAC3E,UAAM,oBAAoB,oBAAoB,KAAK,CAAC,EAAE,SAAS,OAAO,QAAQ;AAC9E,UAAM,eAAe,mBAAmB,MAAM;AAI9C,QAAI,OAAO,iBAAiB;AAC5B,QAAI,cAAc;AAChB,aAAO,aAAa,YAAY,cAAc;AAAA,IAChD;AAGA,UAAM,YAAY,cAAc,SAAS;AAEzC,QAAI,qBAAgD;AAEpD,QAAI,MAAM;AAER,2BAAqB,oBAAoB,OACvC,CAAC,eAAe,cAAc;AAC5B,cAAM,OAAO,UAAU,KAAK;AAC5B,YAAI,QAAQ,cAAc,KAAK,SAAS;AACtC,gBAAM,EAAE,WAAW,kBAAkB;AACrC,gBAAM,EAAE,WAAW,2BAA2B,cAAc,KAAK;AACjE,cAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,wBAAwB;AAC3F,mBAAO;AAAA,UACT;AAAA,QACF;AACA,eAAO;AAAA,MACT,GACA,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS,UAAU,EAAE,CAC/C;AAAA,IACF,OAAO;AAEL,2BAAqB,oBAAoB,OACvC,CAAC,aAAa,cAAc;AAC1B,cAAM,OAAO,UAAU,KAAK;AAC5B,YAAI,QAAQ,YAAY,KAAK,SAAS;AACpC,gBAAM,EAAE,WAAW,kBAAkB;AACrC,gBAAM,EAAE,WAAW,yBAAyB,YAAY,KAAK;AAC7D,cAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,sBAAsB;AACzF,mBAAO;AAAA,UACT;AAAA,QACF;AACA,eAAO;AAAA,MACT,GACA,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS,QAAQ,EAAE,CAC7C;AAAA,IACF;AAGA,QAAI,mBAAmB,OAAO,UAAU;AACtC,aAAO;AAAA,IACT;AAEA,UAAM,gBAAgB,mBAAmB,KAAK;AAE9C,QAAI,CAAC;AAAe,aAAO;AAG3B,UAAM,CAAC,KAAK,UAAU;AAAA,MACpB,KAAK,IAAI,cAAc,KAAK,cAAc,SAAS;AAAA,MACnD,KAAK,IAAI,cAAc,MAAM,cAAc,QAAQ,cAAc,YAAY,cAAc,MAAM;AAAA,IACnG;AAGA,UAAM,yBAAyB,KAAK,IAAI,SAAS,GAAG,IAAI,cAAc;AAEtE,QACE,yBAAyB,mBACzB,uBAAuB,mBAAmB,IAAI,QAAQ,KAAK,uBAC3D,mBAAmB,OAAO,UAC1B;AACA,+BAAyB,uCAAsB,MAAM;AAAA,IACvD,OAAO;AACL,+BAAyB,OAAO,uCAAsB,SAAS,uCAAsB,KAAK;AAAA,IAC5F;AAEA,QAAI,QAAQ,iBAAiB;AAAM,sBAAgB,IAAI;AAAA,aAC9C,CAAC,QAAQ,iBAAiB;AAAQ,sBAAgB,MAAM;AAGjE,WAAO,mBAAmB;AAAA,EAC5B;AACA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/tree/types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import {\n Active,\n Announcements,\n CollisionDetection,\n DragCancelEvent,\n DragEndEvent,\n DragMoveEvent,\n DragOverEvent,\n DragStartEvent,\n DroppableContainers,\n MeasuringConfiguration,\n Modifier,\n Over,\n ViewRect,\n} from '@dnd-kit/core';\nimport type { SensorDescriptor, SensorOptions } from '@dnd-kit/core/dist/sensors';\nimport type { SortingStrategy } from '@dnd-kit/sortable';\nimport { Coordinates } from '@dnd-kit/core/dist/types';\nimport React, { MutableRefObject } from 'react';\nimport { DropIndicatorPosition } from './constants';\n\nexport type Item<T = unknown> = {\n uid: string;\n depth: number;\n parentId: string | null;\n realIndex: number;\n childrenCount: number;\n original: T;\n};\n\nexport type DndContextPropsType = {\n announcements: Announcements;\n modifiers: Modifier[];\n sensors: SensorDescriptor<SensorOptions>[];\n measuring: Partial<MeasuringConfiguration>;\n collisionDetection: CollisionDetection;\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type SortableContextPropsType = {\n items: string[];\n strategy: SortingStrategy;\n};\n\nexport type UseTreePreviewHandlersReturn = {\n handlePreviewDragStart: (e: DragStartEvent) => void;\n handlePreviewDragMove: (e: DragMoveEvent) => void;\n handlePreviewDragOver: (e: DragOverEvent) => void;\n handlePreviewDragEnd: (e: DragEndEvent) => void;\n handlePreviewDragCancel: (e: DragCancelEvent) => void;\n};\nexport type UseTreePreviewHandlersArgs = {\n setOverId: React.Dispatch<React.SetStateAction<string>>;\n setActiveId: React.Dispatch<React.SetStateAction<string>>;\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;\n};\n\ntype UseTreeActionHandlersArgs<T = unknown> = UseTreePreviewHandlersReturn & {\n dropIndicatorPosition: DropIndicatorPosition;\n flattenedItems: Item<T>[];\n projected: {\n depth: number;\n parentId: string | null;\n } | null;\n onReorder: (\n newData: Item<T>[],\n indexes: { targetIndex: number; fromIndex: number },\n considerExpanding: string,\n ) => void;\n isDropValid: boolean;\n};\n\ntype UseTreeActionHandlersReturn = {\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type UseTreeActionHandlersType = <T = unknown>(\n args: UseTreeActionHandlersArgs<T>,\n) => UseTreeActionHandlersReturn;\n\nexport type UseTreeDndkitConfigArgs<T> = {\n flattenedItems: Item<T>[];\n visibleItems: Item<T>[];\n isHorizontalDnD?: boolean;\n isExpandable: boolean;\n onReorder: (\n newData: Item<T>[],\n indexes: { targetIndex: number; fromIndex: number },\n considerExpanding: string,\n ) => void;\n getIsDropValid: (\n active: Item<T>,\n over: Item<T>,\n dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n ) => boolean;\n maxDragAndDropLevel: number;\n};\n\nexport type UseTreeDndkitConfigReturn<T> = {\n dndContextProps: DndContextPropsType;\n sortableContextProps: SortableContextPropsType;\n activeId: string;\n activeIndex: number;\n overId: string;\n depth: number;\n dropIndicatorPosition: DropIndicatorPosition;\n isDropValid: boolean;\n visibleItems: Item<T>[];\n};\n\nexport type UseTreeDndkitConfigType = <T = unknown>(args: UseTreeDndkitConfigArgs<T>) => UseTreeDndkitConfigReturn<T>;\n\nexport type GetKeyboardCoordinatesArgs = {\n items: Item[];\n active: Active;\n over: Over;\n event: KeyboardEvent;\n currentCoordinates: Coordinates;\n droppableContainers: DroppableContainers;\n collisionRect: ViewRect;\n dropIndicatorPosition: DropIndicatorPosition;\n maxDragAndDropLevel: number;\n};\n\nexport type SensorContext = MutableRefObject<{\n items: Item[];\n dropIndicatorPosition: DropIndicatorPosition;\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;\n keyboardTranslate: number;\n}>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["import type {\n Active,\n Announcements,\n CollisionDetection,\n DragCancelEvent,\n DragEndEvent,\n DragMoveEvent,\n DragOverEvent,\n DragStartEvent,\n DroppableContainers,\n MeasuringConfiguration,\n Modifier,\n Over,\n ViewRect,\n} from '@dnd-kit/core';\nimport type { SensorDescriptor, SensorOptions } from '@dnd-kit/core/dist/sensors';\nimport type { SortingStrategy } from '@dnd-kit/sortable';\nimport type { Coordinates } from '@dnd-kit/core/dist/types';\nimport React, { MutableRefObject } from 'react';\nimport type { DropIndicatorPosition } from './constants';\n\nexport type Item<T = unknown> = {\n uid: string;\n depth: number;\n parentId: string | null;\n realIndex: number;\n childrenCount: number;\n original: T;\n};\n\nexport type DndContextPropsType = {\n announcements: Announcements;\n modifiers: Modifier[];\n sensors: SensorDescriptor<SensorOptions>[];\n measuring: Partial<MeasuringConfiguration>;\n collisionDetection: CollisionDetection;\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type SortableContextPropsType = {\n items: string[];\n strategy: SortingStrategy;\n};\n\nexport type UseTreePreviewHandlersReturn = {\n handlePreviewDragStart: (e: DragStartEvent) => void;\n handlePreviewDragMove: (e: DragMoveEvent) => void;\n handlePreviewDragOver: (e: DragOverEvent) => void;\n handlePreviewDragEnd: (e: DragEndEvent) => void;\n handlePreviewDragCancel: (e: DragCancelEvent) => void;\n};\nexport type UseTreePreviewHandlersArgs = {\n setOverId: React.Dispatch<React.SetStateAction<string>>;\n setActiveId: React.Dispatch<React.SetStateAction<string>>;\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;\n};\n\ntype UseTreeActionHandlersArgs<T = unknown> = UseTreePreviewHandlersReturn & {\n dropIndicatorPosition: DropIndicatorPosition;\n flattenedItems: Item<T>[];\n projected: {\n depth: number;\n parentId: string | null;\n } | null;\n onReorder: (\n newData: Item<T>[],\n indexes: { targetIndex: number; fromIndex: number },\n considerExpanding: string,\n ) => void;\n isDropValid: boolean;\n};\n\ntype UseTreeActionHandlersReturn = {\n onDragStart: (e: DragStartEvent) => void;\n onDragMove: (e: DragMoveEvent) => void;\n onDragOver: (e: DragOverEvent) => void;\n onDragEnd: (e: DragEndEvent) => void;\n onDragCancel: (e: DragCancelEvent) => void;\n};\n\nexport type UseTreeActionHandlersType = <T = unknown>(\n args: UseTreeActionHandlersArgs<T>,\n) => UseTreeActionHandlersReturn;\n\nexport type UseTreeDndkitConfigArgs<T> = {\n flattenedItems: Item<T>[];\n visibleItems: Item<T>[];\n isHorizontalDnD?: boolean;\n isExpandable: boolean;\n onReorder: (\n newData: Item<T>[],\n indexes: { targetIndex: number; fromIndex: number },\n considerExpanding: string,\n ) => void;\n getIsDropValid: (\n active: Item<T>,\n over: Item<T>,\n dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n ) => boolean;\n maxDragAndDropLevel: number;\n};\n\nexport type UseTreeDndkitConfigReturn<T> = {\n dndContextProps: DndContextPropsType;\n sortableContextProps: SortableContextPropsType;\n activeId: string;\n activeIndex: number;\n overId: string;\n depth: number;\n dropIndicatorPosition: DropIndicatorPosition;\n isDropValid: boolean;\n visibleItems: Item<T>[];\n};\n\nexport type UseTreeDndkitConfigType = <T = unknown>(args: UseTreeDndkitConfigArgs<T>) => UseTreeDndkitConfigReturn<T>;\n\nexport type GetKeyboardCoordinatesArgs = {\n items: Item[];\n active: Active;\n over: Over;\n event: KeyboardEvent;\n currentCoordinates: Coordinates;\n droppableContainers: DroppableContainers;\n collisionRect: ViewRect;\n dropIndicatorPosition: DropIndicatorPosition;\n maxDragAndDropLevel: number;\n};\n\nexport type SensorContext = MutableRefObject<{\n items: Item[];\n dropIndicatorPosition: DropIndicatorPosition;\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;\n keyboardTranslate: number;\n}>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hierarchy/customCollisionDetection.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "
|
|
5
|
-
"mappings": "AAAA;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable indent, react/function-component-definition, complexity */\nimport { type CollisionDetection, type DroppableContainer } from '@dnd-kit/core';\nimport { Item } from './types';\n\nexport const customCollisionDetection =\n (activeId: string | null, activeParent: string | undefined, dndItems: Item[]): CollisionDetection =>\n ({ droppableContainers, collisionRect }) => {\n const entriesWithSameParent = droppableContainers.filter(\n ({ id }) => dndItems.find((item) => item.id === id)?.parentId === activeParent,\n );\n\n const originalContainer = entriesWithSameParent.find(({ id }) => id === activeId);\n const originalRect = originalContainer?.rect?.current;\n\n if (!originalRect) return null;\n\n if (\n originalRect.offsetLeft <= collisionRect.offsetLeft &&\n collisionRect.offsetLeft <= originalRect.offsetLeft + originalRect.width\n ) {\n return originalContainer.id;\n }\n\n const isLeft = collisionRect.offsetLeft <= originalRect.offsetLeft + collisionRect.width / 2 + 5;\n\n let match: DroppableContainer | null = null;\n // If going to the left, search the closest offset left\n // Otherwise, get the closest offset right\n const collisionPoint = collisionRect.offsetLeft + collisionRect.width / 2;\n entriesWithSameParent.forEach((entry) => {\n const {\n rect: { current: rect },\n } = entry;\n\n if (rect !== null) {\n const offsetRight = rect.offsetLeft + rect.width;\n\n if (!match) {\n match = entry;\n } else if (\n match &&\n match.rect.current &&\n isLeft &&\n Math.abs(collisionPoint - rect.offsetLeft) <= Math.abs(collisionPoint - match.rect.current.offsetLeft)\n ) {\n match = entry;\n } else if (\n match &&\n match.rect.current &&\n !isLeft &&\n Math.abs(collisionPoint - offsetRight) <=\n Math.abs(collisionPoint - match.rect.current.offsetLeft - match.rect.current.width)\n ) {\n match = entry;\n }\n }\n });\n // Typescript believes match is always null for some reason\n const matchCastedForSomeReason = match as DroppableContainer | null;\n return matchCastedForSomeReason === null ? null : matchCastedForSomeReason.id;\n };\n"],
|
|
5
|
+
"mappings": "AAAA;ACIO,MAAM,2BACX,CAAC,UAAyB,cAAkC,aAC5D,CAAC,EAAE,qBAAqB,oBAAoB;AAC1C,QAAM,wBAAwB,oBAAoB,OAChD,CAAC,EAAE,SAAS,SAAS,KAAK,CAAC,SAAS,KAAK,OAAO,EAAE,GAAG,aAAa,YACpE;AAEA,QAAM,oBAAoB,sBAAsB,KAAK,CAAC,EAAE,SAAS,OAAO,QAAQ;AAChF,QAAM,eAAe,mBAAmB,MAAM;AAE9C,MAAI,CAAC;AAAc,WAAO;AAE1B,MACE,aAAa,cAAc,cAAc,cACzC,cAAc,cAAc,aAAa,aAAa,aAAa,OACnE;AACA,WAAO,kBAAkB;AAAA,EAC3B;AAEA,QAAM,SAAS,cAAc,cAAc,aAAa,aAAa,cAAc,QAAQ,IAAI;AAE/F,MAAI,QAAmC;AAGvC,QAAM,iBAAiB,cAAc,aAAa,cAAc,QAAQ;AACxE,wBAAsB,QAAQ,CAAC,UAAU;AACvC,UAAM;AAAA,MACJ,MAAM,EAAE,SAAS;AAAA,QACf;AAEJ,QAAI,SAAS,MAAM;AACjB,YAAM,cAAc,KAAK,aAAa,KAAK;AAE3C,UAAI,CAAC,OAAO;AACV,gBAAQ;AAAA,MACV,WACE,SACA,MAAM,KAAK,WACX,UACA,KAAK,IAAI,iBAAiB,KAAK,UAAU,KAAK,KAAK,IAAI,iBAAiB,MAAM,KAAK,QAAQ,UAAU,GACrG;AACA,gBAAQ;AAAA,MACV,WACE,SACA,MAAM,KAAK,WACX,CAAC,UACD,KAAK,IAAI,iBAAiB,WAAW,KACnC,KAAK,IAAI,iBAAiB,MAAM,KAAK,QAAQ,aAAa,MAAM,KAAK,QAAQ,KAAK,GACpF;AACA,gBAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF,CAAC;AAED,QAAM,2BAA2B;AACjC,SAAO,6BAA6B,OAAO,OAAO,yBAAyB;AAC7E;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/hierarchy/useHierarchyPreviewHandlers.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback } from 'react';\nimport { DragStartEvent, DragOverEvent } from '@dnd-kit/core';\nimport type {
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
|
|
5
5
|
"mappings": "AAAA;ACAA;AAIO,MAAM,8BAA8B,CAAC;AAAA,EAC1C;AAAA,EACA;AAAA,EACA;AAAA,MACwE;AACxE,QAAM,aAAa,YAAY,MAAM;AACnC,gBAAY,EAAE;AACd,wBAAoB;AAEpB,aAAS,KAAK,MAAM,YAAY,UAAU,EAAE;AAAA,EAC9C,GAAG,CAAC,aAAa,mBAAmB,CAAC;AAErC,QAAM,yBAAyB,YAC7B,CAAC,EAAE,QAAQ,EAAE,WAA2B;AACtC,gBAAY,EAAE;AACd,aAAS,KAAK,MAAM,YAAY,UAAU,UAAU;AACpD,uBAAmB;AAAA,EACrB,GACA,CAAC,aAAa,kBAAkB,CAClC;AAEA,QAAM,wBAAwB,YAAY,MAAM,MAAM,CAAC,CAAC;AAExD,QAAM,uBAAuB,YAAY,MAAM;AAC7C,eAAW;AAAA,EACb,GAAG,CAAC,UAAU,CAAC;AAEf,QAAM,0BAA0B,YAAY,MAAM;AAChD,eAAW;AAAA,EACb,GAAG,CAAC,UAAU,CAAC;AAEf,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/customCollisionDetection.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable @typescript-eslint/indent */\n/* eslint-disable max-params */\nimport { CollisionDetection, DroppableContainer, LayoutRect } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport { Item } from './types';\n\nconst DUMMY_ID = 'DUMMY_ID_INTERNAL_USE_ONLY';\nconst RECT_UP: LayoutRect = {\n offsetTop: -Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\nconst RECT_DOWN: LayoutRect = {\n offsetTop: Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\n\n// Percentage of height to take into consideration when looking for colliding rects\nconst thresholdRatio = 0.2;\n// Percentage to be inside\nconst insideThreshold = 0.7;\n\nexport const customCollisionDetection = (\n activeId: string,\n visibleItemsDictionary: Record<string, Item>,\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>,\n maxDragAndDropLevel: number,\n lastPosition: string,\n setLastPosition: React.Dispatch<React.SetStateAction<string>>,\n): CollisionDetection => {\n const func: CollisionDetection = ({ droppableContainers, collisionRect }) => {\n const originalContainer = droppableContainers.find(({ id }) => id === activeId);\n const originalRect = originalContainer?.rect?.current;\n\n // We first check if the item was moved up or down\n // This modifies how to search the matching colliding rect\n let isUp = lastPosition === 'up';\n if (originalRect) {\n isUp = originalRect.offsetTop > collisionRect.top;\n }\n\n // Threshold\n const threshold = collisionRect.height * thresholdRatio;\n\n let collidingContainer: DroppableContainer | null = null;\n\n if (isUp) {\n // Up -- We need to find the first rectangle downwards\n collidingContainer = droppableContainers.reduce(\n (firstRectDown, container) => {\n const rect = container.rect.current;\n if (rect && firstRectDown.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;\n if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {\n return container;\n }\n }\n return firstRectDown;\n },\n { id: DUMMY_ID, rect: { current: RECT_DOWN } } as DroppableContainer,\n );\n } else {\n // Down -- We need to find the first rectangle upwards\n collidingContainer = droppableContainers.reduce(\n (firstRectUp, container) => {\n const rect = container.rect.current;\n if (rect && firstRectUp.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;\n if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {\n return container;\n }\n }\n return firstRectUp;\n },\n { id: DUMMY_ID, rect: { current: RECT_UP } } as DroppableContainer,\n );\n }\n\n // If we didn't find a match, return null\n if (collidingContainer.id === DUMMY_ID) {\n return null;\n }\n\n const collidingRect = collidingContainer.rect.current;\n\n if (!collidingRect) return null;\n\n // Calculate the intersection interval\n const [top, bottom] = [\n Math.max(collisionRect.top, collidingRect.offsetTop),\n Math.min(collisionRect.top + collisionRect.height, collidingRect.offsetTop + collidingRect.height),\n ];\n\n // Calculate the percentage of intersection\n const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;\n\n if (\n intersectionPercentage > insideThreshold &&\n visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel &&\n collidingContainer.id !== activeId\n ) {\n setDropIndicatorPosition(DropIndicatorPosition.Inside);\n } else {\n setDropIndicatorPosition(isUp ? DropIndicatorPosition.Before : DropIndicatorPosition.After);\n }\n\n if (isUp && lastPosition !== 'up') setLastPosition('up');\n else if (!isUp && lastPosition !== 'down') setLastPosition('down');\n\n // Return the id of the match rectangle\n return collidingContainer.id;\n };\n return func;\n};\n"],
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\n/* eslint-disable complexity */\n/* eslint-disable @typescript-eslint/indent */\n/* eslint-disable max-params */\nimport { type CollisionDetection, type DroppableContainer, type LayoutRect } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport { Item } from './types';\n\nconst DUMMY_ID = 'DUMMY_ID_INTERNAL_USE_ONLY';\nconst RECT_UP: LayoutRect = {\n offsetTop: -Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\nconst RECT_DOWN: LayoutRect = {\n offsetTop: Infinity,\n offsetLeft: 0, // Doesn't matter,\n width: 0, // Doesn't matter\n height: 0, // Doesn't matter\n};\n\n// Percentage of height to take into consideration when looking for colliding rects\nconst thresholdRatio = 0.2;\n// Percentage to be inside\nconst insideThreshold = 0.7;\n\nexport const customCollisionDetection = (\n activeId: string,\n visibleItemsDictionary: Record<string, Item>,\n setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>,\n maxDragAndDropLevel: number,\n lastPosition: string,\n setLastPosition: React.Dispatch<React.SetStateAction<string>>,\n): CollisionDetection => {\n const func: CollisionDetection = ({ droppableContainers, collisionRect }) => {\n const originalContainer = droppableContainers.find(({ id }) => id === activeId);\n const originalRect = originalContainer?.rect?.current;\n\n // We first check if the item was moved up or down\n // This modifies how to search the matching colliding rect\n let isUp = lastPosition === 'up';\n if (originalRect) {\n isUp = originalRect.offsetTop > collisionRect.top;\n }\n\n // Threshold\n const threshold = collisionRect.height * thresholdRatio;\n\n let collidingContainer: DroppableContainer | null = null;\n\n if (isUp) {\n // Up -- We need to find the first rectangle downwards\n collidingContainer = droppableContainers.reduce(\n (firstRectDown, container) => {\n const rect = container.rect.current;\n if (rect && firstRectDown.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;\n if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {\n return container;\n }\n }\n return firstRectDown;\n },\n { id: DUMMY_ID, rect: { current: RECT_DOWN } } as DroppableContainer,\n );\n } else {\n // Down -- We need to find the first rectangle upwards\n collidingContainer = droppableContainers.reduce(\n (firstRectUp, container) => {\n const rect = container.rect.current;\n if (rect && firstRectUp.rect.current) {\n const { offsetTop: rectOffsetTop } = rect;\n const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;\n if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {\n return container;\n }\n }\n return firstRectUp;\n },\n { id: DUMMY_ID, rect: { current: RECT_UP } } as DroppableContainer,\n );\n }\n\n // If we didn't find a match, return null\n if (collidingContainer.id === DUMMY_ID) {\n return null;\n }\n\n const collidingRect = collidingContainer.rect.current;\n\n if (!collidingRect) return null;\n\n // Calculate the intersection interval\n const [top, bottom] = [\n Math.max(collisionRect.top, collidingRect.offsetTop),\n Math.min(collisionRect.top + collisionRect.height, collidingRect.offsetTop + collidingRect.height),\n ];\n\n // Calculate the percentage of intersection\n const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;\n\n if (\n intersectionPercentage > insideThreshold &&\n visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel &&\n collidingContainer.id !== activeId\n ) {\n setDropIndicatorPosition(DropIndicatorPosition.Inside);\n } else {\n setDropIndicatorPosition(isUp ? DropIndicatorPosition.Before : DropIndicatorPosition.After);\n }\n\n if (isUp && lastPosition !== 'up') setLastPosition('up');\n else if (!isUp && lastPosition !== 'down') setLastPosition('down');\n\n // Return the id of the match rectangle\n return collidingContainer.id;\n };\n return func;\n};\n"],
|
|
5
5
|
"mappings": "AAAA;ACKA;AAGA,MAAM,WAAW;AACjB,MAAM,UAAsB;AAAA,EAC1B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AACV;AACA,MAAM,YAAwB;AAAA,EAC5B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AACV;AAGA,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAEjB,MAAM,2BAA2B,CACtC,UACA,wBACA,0BACA,qBACA,cACA,oBACuB;AACvB,QAAM,OAA2B,CAAC,EAAE,qBAAqB,oBAAoB;AAC3E,UAAM,oBAAoB,oBAAoB,KAAK,CAAC,EAAE,SAAS,OAAO,QAAQ;AAC9E,UAAM,eAAe,mBAAmB,MAAM;AAI9C,QAAI,OAAO,iBAAiB;AAC5B,QAAI,cAAc;AAChB,aAAO,aAAa,YAAY,cAAc;AAAA,IAChD;AAGA,UAAM,YAAY,cAAc,SAAS;AAEzC,QAAI,qBAAgD;AAEpD,QAAI,MAAM;AAER,2BAAqB,oBAAoB,OACvC,CAAC,eAAe,cAAc;AAC5B,cAAM,OAAO,UAAU,KAAK;AAC5B,YAAI,QAAQ,cAAc,KAAK,SAAS;AACtC,gBAAM,EAAE,WAAW,kBAAkB;AACrC,gBAAM,EAAE,WAAW,2BAA2B,cAAc,KAAK;AACjE,cAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,wBAAwB;AAC3F,mBAAO;AAAA,UACT;AAAA,QACF;AACA,eAAO;AAAA,MACT,GACA,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS,UAAU,EAAE,CAC/C;AAAA,IACF,OAAO;AAEL,2BAAqB,oBAAoB,OACvC,CAAC,aAAa,cAAc;AAC1B,cAAM,OAAO,UAAU,KAAK;AAC5B,YAAI,QAAQ,YAAY,KAAK,SAAS;AACpC,gBAAM,EAAE,WAAW,kBAAkB;AACrC,gBAAM,EAAE,WAAW,yBAAyB,YAAY,KAAK;AAC7D,cAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,sBAAsB;AACzF,mBAAO;AAAA,UACT;AAAA,QACF;AACA,eAAO;AAAA,MACT,GACA,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS,QAAQ,EAAE,CAC7C;AAAA,IACF;AAGA,QAAI,mBAAmB,OAAO,UAAU;AACtC,aAAO;AAAA,IACT;AAEA,UAAM,gBAAgB,mBAAmB,KAAK;AAE9C,QAAI,CAAC;AAAe,aAAO;AAG3B,UAAM,CAAC,KAAK,UAAU;AAAA,MACpB,KAAK,IAAI,cAAc,KAAK,cAAc,SAAS;AAAA,MACnD,KAAK,IAAI,cAAc,MAAM,cAAc,QAAQ,cAAc,YAAY,cAAc,MAAM;AAAA,IACnG;AAGA,UAAM,yBAAyB,KAAK,IAAI,SAAS,GAAG,IAAI,cAAc;AAEtE,QACE,yBAAyB,mBACzB,uBAAuB,mBAAmB,IAAI,QAAQ,KAAK,uBAC3D,mBAAmB,OAAO,UAC1B;AACA,+BAAyB,sBAAsB,MAAM;AAAA,IACvD,OAAO;AACL,+BAAyB,OAAO,sBAAsB,SAAS,sBAAsB,KAAK;AAAA,IAC5F;AAEA,QAAI,QAAQ,iBAAiB;AAAM,sBAAgB,IAAI;AAAA,aAC9C,CAAC,QAAQ,iBAAiB;AAAQ,sBAAgB,MAAM;AAGjE,WAAO,mBAAmB;AAAA,EAC5B;AACA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|