@elliemae/ds-drag-and-drop 2.3.0-alpha.2 → 2.3.0-alpha.3

package/cjs/hierarchy/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/hierarchy/types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "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"],
+  "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"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;",
   "names": []
 }

package/cjs/tree/customCollisionDetection.js

@@ -46,61 +46,64 @@ const RECT_DOWN = {
 };
 const thresholdRatio = 0.2;
 const insideThreshold = 0.7;
-const customCollisionDetection = (activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition) => ({ droppableContainers, collisionRect }) => {
-  const originalContainer = droppableContainers.find(({ id }) => id === activeId);
-  const originalRect = originalContainer?.rect?.current;
-  let isUp = lastPosition === "up";
-  if (originalRect) {
-    isUp = originalRect.offsetTop > collisionRect.top;
-  }
-  const threshold = collisionRect.height * thresholdRatio;
-  let collidingContainer = null;
-  if (isUp) {
-    collidingContainer = droppableContainers.reduce((firstRectDown, container) => {
-      const rect = container.rect.current;
-      if (rect && firstRectDown.rect.current) {
-        const { offsetTop: rectOffsetTop } = rect;
-        const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;
-        if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {
-          return container;
+const customCollisionDetection = (activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition) => {
+  const func = ({ droppableContainers, collisionRect }) => {
+    const originalContainer = droppableContainers.find(({ id }) => id === activeId);
+    const originalRect = originalContainer?.rect?.current;
+    let isUp = lastPosition === "up";
+    if (originalRect) {
+      isUp = originalRect.offsetTop > collisionRect.top;
+    }
+    const threshold = collisionRect.height * thresholdRatio;
+    let collidingContainer = null;
+    if (isUp) {
+      collidingContainer = droppableContainers.reduce((firstRectDown, container) => {
+        const rect = container.rect.current;
+        if (rect && firstRectDown.rect.current) {
+          const { offsetTop: rectOffsetTop } = rect;
+          const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;
+          if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {
+            return container;
+          }
         }
-      }
-      return firstRectDown;
-    }, { id: DUMMY_ID, rect: { current: RECT_DOWN } });
-  } else {
-    collidingContainer = droppableContainers.reduce((firstRectUp, container) => {
-      const rect = container.rect.current;
-      if (rect && firstRectUp.rect.current) {
-        const { offsetTop: rectOffsetTop } = rect;
-        const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;
-        if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {
-          return container;
+        return firstRectDown;
+      }, { id: DUMMY_ID, rect: { current: RECT_DOWN } });
+    } else {
+      collidingContainer = droppableContainers.reduce((firstRectUp, container) => {
+        const rect = container.rect.current;
+        if (rect && firstRectUp.rect.current) {
+          const { offsetTop: rectOffsetTop } = rect;
+          const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;
+          if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {
+            return container;
+          }
         }
-      }
-      return firstRectUp;
-    }, { id: DUMMY_ID, rect: { current: RECT_UP } });
-  }
-  if (collidingContainer.id === DUMMY_ID) {
-    return null;
-  }
-  const collidingRect = collidingContainer.rect.current;
-  if (!collidingRect)
-    return null;
-  const [top, bottom] = [
-    Math.max(collisionRect.top, collidingRect.offsetTop),
-    Math.min(collisionRect.bottom, collidingRect.offsetTop + collidingRect.height)
-  ];
-  const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;
-  if (intersectionPercentage > insideThreshold && visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel && collidingContainer.id !== activeId) {
-    setDropIndicatorPosition(import_constants.DropIndicatorPosition.Inside);
-  } else {
-    setDropIndicatorPosition(isUp ? import_constants.DropIndicatorPosition.Before : import_constants.DropIndicatorPosition.After);
-  }
-  if (isUp && lastPosition !== "up")
-    setLastPosition("up");
-  else if (!isUp && lastPosition !== "down")
-    setLastPosition("down");
-  return collidingContainer.id;
+        return firstRectUp;
+      }, { id: DUMMY_ID, rect: { current: RECT_UP } });
+    }
+    if (collidingContainer.id === DUMMY_ID) {
+      return null;
+    }
+    const collidingRect = collidingContainer.rect.current;
+    if (!collidingRect)
+      return null;
+    const [top, bottom] = [
+      Math.max(collisionRect.top, collidingRect.offsetTop),
+      Math.min(collisionRect.top + collisionRect.height, collidingRect.offsetTop + collidingRect.height)
+    ];
+    const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;
+    if (intersectionPercentage > insideThreshold && visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel && collidingContainer.id !== activeId) {
+      setDropIndicatorPosition(import_constants.DropIndicatorPosition.Inside);
+    } else {
+      setDropIndicatorPosition(isUp ? import_constants.DropIndicatorPosition.Before : import_constants.DropIndicatorPosition.After);
+    }
+    if (isUp && lastPosition !== "up")
+      setLastPosition("up");
+    else if (!isUp && lastPosition !== "down")
+      setLastPosition("down");
+    return collidingContainer.id;
+  };
+  return func;
 };
 module.exports = __toCommonJS(customCollisionDetection_exports);
 //# sourceMappingURL=customCollisionDetection.js.map

package/cjs/tree/customCollisionDetection.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/tree/customCollisionDetection.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* 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  (\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  ({ 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.bottom, 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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADIvB,uBAAsC;AAGtC,MAAM,WAAW;AACjB,MAAM,UAAsB;AAAA,EAC1B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAEV,MAAM,YAAwB;AAAA,EAC5B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAIV,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAEjB,MAAM,2BACX,CACE,UACA,wBACA,0BACA,qBACA,cACA,oBAEF,CAAC,EAAE,qBAAqB,oBAAoB;AAC1C,QAAM,oBAAoB,oBAAoB,KAAK,CAAC,EAAE,SAAS,OAAO;AACtE,QAAM,eAAe,mBAAmB,MAAM;AAI9C,MAAI,OAAO,iBAAiB;AAC5B,MAAI,cAAc;AAChB,WAAO,aAAa,YAAY,cAAc;AAAA;AAIhD,QAAM,YAAY,cAAc,SAAS;AAEzC,MAAI,qBAAgD;AAEpD,MAAI,MAAM;AAER,yBAAqB,oBAAoB,OACvC,CAAC,eAAe,cAAc;AAC5B,YAAM,OAAO,UAAU,KAAK;AAC5B,UAAI,QAAQ,cAAc,KAAK,SAAS;AACtC,cAAM,EAAE,WAAW,kBAAkB;AACrC,cAAM,EAAE,WAAW,2BAA2B,cAAc,KAAK;AACjE,YAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,wBAAwB;AAC3F,iBAAO;AAAA;AAAA;AAGX,aAAO;AAAA,OAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA,SAE9B;AAEL,yBAAqB,oBAAoB,OACvC,CAAC,aAAa,cAAc;AAC1B,YAAM,OAAO,UAAU,KAAK;AAC5B,UAAI,QAAQ,YAAY,KAAK,SAAS;AACpC,cAAM,EAAE,WAAW,kBAAkB;AACrC,cAAM,EAAE,WAAW,yBAAyB,YAAY,KAAK;AAC7D,YAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,sBAAsB;AACzF,iBAAO;AAAA;AAAA;AAGX,aAAO;AAAA,OAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA;AAKrC,MAAI,mBAAmB,OAAO,UAAU;AACtC,WAAO;AAAA;AAGT,QAAM,gBAAgB,mBAAmB,KAAK;AAE9C,MAAI,CAAC;AAAe,WAAO;AAG3B,QAAM,CAAC,KAAK,UAAU;AAAA,IACpB,KAAK,IAAI,cAAc,KAAK,cAAc;AAAA,IAC1C,KAAK,IAAI,cAAc,QAAQ,cAAc,YAAY,cAAc;AAAA;AAIzE,QAAM,yBAAyB,KAAK,IAAI,SAAS,OAAO,cAAc;AAEtE,MACE,yBAAyB,mBACzB,uBAAuB,mBAAmB,IAAI,QAAQ,KAAK,uBAC3D,mBAAmB,OAAO,UAC1B;AACA,6BAAyB,uCAAsB;AAAA,SAC1C;AACL,6BAAyB,OAAO,uCAAsB,SAAS,uCAAsB;AAAA;AAGvF,MAAI,QAAQ,iBAAiB;AAAM,oBAAgB;AAAA,WAC1C,CAAC,QAAQ,iBAAiB;AAAQ,oBAAgB;AAG3D,SAAO,mBAAmB;AAAA;",
+  "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"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;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;AAAA;AAEV,MAAM,YAAwB;AAAA,EAC5B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAIV,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;AACtE,UAAM,eAAe,mBAAmB,MAAM;AAI9C,QAAI,OAAO,iBAAiB;AAC5B,QAAI,cAAc;AAChB,aAAO,aAAa,YAAY,cAAc;AAAA;AAIhD,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;AAAA;AAGX,eAAO;AAAA,SAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA,WAE9B;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;AAAA;AAGX,eAAO;AAAA,SAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA;AAKrC,QAAI,mBAAmB,OAAO,UAAU;AACtC,aAAO;AAAA;AAGT,UAAM,gBAAgB,mBAAmB,KAAK;AAE9C,QAAI,CAAC;AAAe,aAAO;AAG3B,UAAM,CAAC,KAAK,UAAU;AAAA,MACpB,KAAK,IAAI,cAAc,KAAK,cAAc;AAAA,MAC1C,KAAK,IAAI,cAAc,MAAM,cAAc,QAAQ,cAAc,YAAY,cAAc;AAAA;AAI7F,UAAM,yBAAyB,KAAK,IAAI,SAAS,OAAO,cAAc;AAEtE,QACE,yBAAyB,mBACzB,uBAAuB,mBAAmB,IAAI,QAAQ,KAAK,uBAC3D,mBAAmB,OAAO,UAC1B;AACA,+BAAyB,uCAAsB;AAAA,WAC1C;AACL,+BAAyB,OAAO,uCAAsB,SAAS,uCAAsB;AAAA;AAGvF,QAAI,QAAQ,iBAAiB;AAAM,sBAAgB;AAAA,aAC1C,CAAC,QAAQ,iBAAiB;AAAQ,sBAAgB;AAG3D,WAAO,mBAAmB;AAAA;AAE5B,SAAO;AAAA;",
   "names": []
 }

package/cjs/tree/getTreeKeyboardCoordinates.js

@@ -34,7 +34,6 @@ var import_core = require("@dnd-kit/core");
 var import_constants = require("./constants");
 const directions = [import_core.KeyboardCode.Down, import_core.KeyboardCode.Right, import_core.KeyboardCode.Up, import_core.KeyboardCode.Left];
 const horizontal = [import_core.KeyboardCode.Left, import_core.KeyboardCode.Right];
-const vertical = [import_core.KeyboardCode.Up, import_core.KeyboardCode.Down];
 const getVerticalKeyboardCoordinates = ({
   items,
   active,

package/cjs/tree/getTreeKeyboardCoordinates.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/tree/getTreeKeyboardCoordinates.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { 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];\nconst vertical: string[] = [KeyboardCode.Up, KeyboardCode.Down];\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"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,kBAAwG;AAGxG,uBAAsC;AAEtC,MAAM,aAAuB,CAAC,yBAAa,MAAM,yBAAa,OAAO,yBAAa,IAAI,yBAAa;AAEnG,MAAM,aAAuB,CAAC,yBAAa,MAAM,yBAAa;AAC9D,MAAM,WAAqB,CAAC,yBAAa,IAAI,yBAAa;AAE1D,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;AAAA,WACF;AAAA,QACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,WAAO;AAAA,SACF;AAAA,MACH,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;AAAA,SACF;AAAA,MACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,SAAO;AAAA,OACF;AAAA,IACH,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;",
+  "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"],
+  "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;AAAA,WACF;AAAA,QACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,WAAO;AAAA,SACF;AAAA,MACH,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;AAAA,SACF;AAAA,MACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,SAAO;AAAA,OACF;AAAA,IACH,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;",
   "names": []
 }

package/cjs/tree/types.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/tree/types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "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 = {\n  uid: string;\n  depth: number;\n  parentId: string;\n  realIndex: number;\n  original: Record<string, Record<string, any>>;\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\nexport type useTreeActionHandlersArgs = useTreePreviewHandlersReturn & {\n  dropIndicatorPosition: DropIndicatorPosition;\n  flattenedItems: Item[];\n  projected: {\n    depth: number;\n    parentId: string;\n  } | null;\n  onReorder: (newData: Item[], indexes: { targetIndex: number; fromIndex: number }, considerExpanding: string) => void;\n};\n\nexport type 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 useTreeDndkitConfigArgs = {\n  flattenedItems: Item[];\n  visibleItems: Item[];\n  isHorizontalDnD?: boolean;\n  isExpandable: boolean;\n  onReorder: (newData: Item[], indexes: { targetIndex: number; fromIndex: number }, considerExpanding: string) => void;\n  maxDragAndDropLevel: number;\n};\n\nexport type useTreeDndkitConfigReturn = {\n  dndContextProps: DndContextPropsType;\n  sortableContextProps: SortableContextPropsType;\n  activeId: string;\n  activeIndex: number;\n  overId: string;\n  depth: number;\n  dropIndicatorPosition: DropIndicatorPosition;\n  visibleItems: Item[];\n};\n\nexport type useTreeDndkitConfigType = (args: useTreeDndkitConfigArgs) => useTreeDndkitConfigReturn;\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}>;\n", "import * as React from 'react';\nexport { React };\n"],
+  "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\nexport type UseTreeActionHandlersArgs<T = unknown> = UseTreePreviewHandlersReturn & {\n  dropIndicatorPosition: DropIndicatorPosition;\n  flattenedItems: Item[];\n  projected: {\n    depth: number;\n    parentId: string;\n  } | null;\n  onReorder: <S = T>(\n    newData: Item<S>[],\n    indexes: { targetIndex: number; fromIndex: number },\n    considerExpanding: string,\n  ) => void;\n  isDropValid: boolean;\n};\n\nexport type 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 UseTreeDndkitConfigArgs<T> = {\n  flattenedItems: Item[];\n  visibleItems: Item[];\n  isHorizontalDnD?: boolean;\n  isExpandable: boolean;\n  onReorder: <S = T>(\n    newData: Item<S>[],\n    indexes: { targetIndex: number; fromIndex: number },\n    considerExpanding: string,\n  ) => void;\n  getIsDropValid: <S = T>(\n    active: Item<S>,\n    over: Item<S>,\n    dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside',\n  ) => boolean;\n  maxDragAndDropLevel: number;\n};\n\nexport type UseTreeDndkitConfigReturn = {\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[];\n};\n\nexport type UseTreeDndkitConfigType = <T = unknown>(args: UseTreeDndkitConfigArgs<T>) => UseTreeDndkitConfigReturn;\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}>;\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAAA;ACAA,YAAuB;",
   "names": []
 }

package/cjs/tree/useTreeActionHandlers.js

@@ -43,7 +43,8 @@ const useTreeActionHandlers = ({
   onReorder,
   flattenedItems,
   projected,
-  dropIndicatorPosition
+  dropIndicatorPosition,
+  isDropValid
 }) => {
   const onDragStart = (0, import_react.useCallback)((e) => {
     handlePreviewDragStart(e);
@@ -57,14 +58,14 @@ const useTreeActionHandlers = ({
   const onDragEnd = (0, import_react.useCallback)((e) => {
     handlePreviewDragEnd(e);
     const { active, over } = e;
-    if (over === null)
+    if (over === null || !isDropValid)
       return;
     const activeIndex = flattenedItems.findIndex((item) => item.uid === active.id);
     let considerExpanding = null;
     let overIndex = flattenedItems.findIndex((item) => item.uid === over.id);
     if (dropIndicatorPosition === import_constants.DropIndicatorPosition.Inside) {
       considerExpanding = over.id;
-      overIndex = flattenedItems[overIndex].realIndex + (flattenedItems[overIndex].original.subRows?.length ?? 0) + 1;
+      overIndex = flattenedItems[overIndex].realIndex + flattenedItems[overIndex].childrenCount + 1;
     }
     if (projected && (activeIndex !== overIndex || flattenedItems[activeIndex].depth !== projected.depth)) {
       flattenedItems[activeIndex].parentId = projected.parentId;
@@ -75,7 +76,7 @@ const useTreeActionHandlers = ({
         fromIndex: activeIndex
       }, considerExpanding || "");
     }
-  }, [handlePreviewDragEnd, flattenedItems, projected, onReorder, dropIndicatorPosition]);
+  }, [handlePreviewDragEnd, isDropValid, flattenedItems, dropIndicatorPosition, projected, onReorder]);
   const onDragCancel = (0, import_react.useCallback)((e) => {
     handlePreviewDragCancel(e);
   }, [handlePreviewDragCancel]);

package/cjs/tree/useTreeActionHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/tree/useTreeActionHandlers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { arrayMove } from '@dnd-kit/sortable';\nimport { cloneDeep } from 'lodash';\nimport { useCallback } from 'react';\nimport type { DragStartEvent, DragMoveEvent, DragEndEvent, DragOverEvent, DragCancelEvent } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport type { useTreeActionHandlersReturn, useTreeActionHandlersArgs } from './types';\n\nexport const useTreeActionHandlers = ({\n  handlePreviewDragStart,\n  handlePreviewDragMove,\n  handlePreviewDragOver,\n  handlePreviewDragEnd,\n  handlePreviewDragCancel,\n  onReorder,\n  flattenedItems,\n  projected,\n  dropIndicatorPosition,\n}: useTreeActionHandlersArgs): useTreeActionHandlersReturn => {\n  const onDragStart = useCallback(\n    (e: DragStartEvent) => {\n      handlePreviewDragStart(e);\n    },\n    [handlePreviewDragStart],\n  );\n\n  const onDragMove = useCallback(\n    (e: DragMoveEvent) => {\n      handlePreviewDragMove(e);\n    },\n    [handlePreviewDragMove],\n  );\n\n  const onDragOver = useCallback(\n    (e: DragOverEvent) => {\n      handlePreviewDragOver(e);\n    },\n    [handlePreviewDragOver],\n  );\n\n  const onDragEnd = useCallback(\n    (e: DragEndEvent) => {\n      handlePreviewDragEnd(e);\n      const { active, over } = e;\n\n      if (over === null) return;\n\n      const activeIndex = flattenedItems.findIndex((item) => item.uid === active.id);\n\n      let considerExpanding = null;\n\n      let overIndex = flattenedItems.findIndex((item) => item.uid === over.id);\n      // If drop indicator is inside, then put it last,\n      // It will be reconstructed well later\n      if (dropIndicatorPosition === DropIndicatorPosition.Inside) {\n        considerExpanding = over.id;\n        overIndex = flattenedItems[overIndex].realIndex + (flattenedItems[overIndex].original.subRows?.length ?? 0) + 1;\n      }\n\n      // If we are dropping the item in a new position, or new depth\n      if (projected && (activeIndex !== overIndex || flattenedItems[activeIndex].depth !== projected.depth)) {\n        // Change parent and depth from projected data\n        flattenedItems[activeIndex].parentId = projected.parentId;\n        flattenedItems[activeIndex].depth = projected.depth;\n\n        // If same index, don't move the array, just copy it\n        const newFlattenedData =\n          activeIndex !== overIndex ? arrayMove(flattenedItems, activeIndex, overIndex) : cloneDeep(flattenedItems);\n\n        onReorder(\n          newFlattenedData,\n          {\n            targetIndex: overIndex,\n            fromIndex: activeIndex,\n          },\n          considerExpanding || '',\n        );\n      }\n    },\n    [handlePreviewDragEnd, flattenedItems, projected, onReorder, dropIndicatorPosition],\n  );\n\n  const onDragCancel = useCallback(\n    (e: DragCancelEvent) => {\n      handlePreviewDragCancel(e);\n    },\n    [handlePreviewDragCancel],\n  );\n\n  return { onDragStart, onDragMove, onDragOver, onDragEnd, onDragCancel };\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,sBAA0B;AAC1B,oBAA0B;AAC1B,mBAA4B;AAE5B,uBAAsC;AAG/B,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAC4D;AAC5D,QAAM,cAAc,8BAClB,CAAC,MAAsB;AACrB,2BAAuB;AAAA,KAEzB,CAAC;AAGH,QAAM,aAAa,8BACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,aAAa,8BACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,YAAY,8BAChB,CAAC,MAAoB;AACnB,yBAAqB;AACrB,UAAM,EAAE,QAAQ,SAAS;AAEzB,QAAI,SAAS;AAAM;AAEnB,UAAM,cAAc,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,OAAO;AAE3E,QAAI,oBAAoB;AAExB,QAAI,YAAY,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,KAAK;AAGrE,QAAI,0BAA0B,uCAAsB,QAAQ;AAC1D,0BAAoB,KAAK;AACzB,kBAAY,eAAe,WAAW,YAAa,gBAAe,WAAW,SAAS,SAAS,UAAU,KAAK;AAAA;AAIhH,QAAI,aAAc,iBAAgB,aAAa,eAAe,aAAa,UAAU,UAAU,QAAQ;AAErG,qBAAe,aAAa,WAAW,UAAU;AACjD,qBAAe,aAAa,QAAQ,UAAU;AAG9C,YAAM,mBACJ,gBAAgB,YAAY,+BAAU,gBAAgB,aAAa,aAAa,6BAAU;AAE5F,gBACE,kBACA;AAAA,QACE,aAAa;AAAA,QACb,WAAW;AAAA,SAEb,qBAAqB;AAAA;AAAA,KAI3B,CAAC,sBAAsB,gBAAgB,WAAW,WAAW;AAG/D,QAAM,eAAe,8BACnB,CAAC,MAAuB;AACtB,4BAAwB;AAAA,KAE1B,CAAC;AAGH,SAAO,EAAE,aAAa,YAAY,YAAY,WAAW;AAAA;",
+  "sourcesContent": ["import { arrayMove } from '@dnd-kit/sortable';\nimport { cloneDeep } from 'lodash';\nimport { useCallback } from 'react';\nimport type { DragStartEvent, DragMoveEvent, DragEndEvent, DragOverEvent, DragCancelEvent } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport type { UseTreeActionHandlersReturn, UseTreeActionHandlersArgs } from './types';\n\nexport const useTreeActionHandlers = ({\n  handlePreviewDragStart,\n  handlePreviewDragMove,\n  handlePreviewDragOver,\n  handlePreviewDragEnd,\n  handlePreviewDragCancel,\n  onReorder,\n  flattenedItems,\n  projected,\n  dropIndicatorPosition,\n  isDropValid,\n}: UseTreeActionHandlersArgs): UseTreeActionHandlersReturn => {\n  const onDragStart = useCallback(\n    (e: DragStartEvent) => {\n      handlePreviewDragStart(e);\n    },\n    [handlePreviewDragStart],\n  );\n\n  const onDragMove = useCallback(\n    (e: DragMoveEvent) => {\n      handlePreviewDragMove(e);\n    },\n    [handlePreviewDragMove],\n  );\n\n  const onDragOver = useCallback(\n    (e: DragOverEvent) => {\n      handlePreviewDragOver(e);\n    },\n    [handlePreviewDragOver],\n  );\n\n  const onDragEnd = useCallback(\n    (e: DragEndEvent) => {\n      handlePreviewDragEnd(e);\n      const { active, over } = e;\n\n      if (over === null || !isDropValid) return;\n\n      const activeIndex = flattenedItems.findIndex((item) => item.uid === active.id);\n\n      let considerExpanding = null;\n\n      let overIndex = flattenedItems.findIndex((item) => item.uid === over.id);\n      // If drop indicator is inside, then put it last,\n      // It will be reconstructed well later\n      if (dropIndicatorPosition === DropIndicatorPosition.Inside) {\n        considerExpanding = over.id;\n        overIndex = flattenedItems[overIndex].realIndex + flattenedItems[overIndex].childrenCount + 1;\n      }\n\n      // If we are dropping the item in a new position, or new depth\n      if (projected && (activeIndex !== overIndex || flattenedItems[activeIndex].depth !== projected.depth)) {\n        // Change parent and depth from projected data\n        flattenedItems[activeIndex].parentId = projected.parentId;\n        flattenedItems[activeIndex].depth = projected.depth;\n\n        // If same index, don't move the array, just copy it\n        const newFlattenedData =\n          activeIndex !== overIndex ? arrayMove(flattenedItems, activeIndex, overIndex) : cloneDeep(flattenedItems);\n\n        onReorder(\n          newFlattenedData,\n          {\n            targetIndex: overIndex,\n            fromIndex: activeIndex,\n          },\n          considerExpanding || '',\n        );\n      }\n    },\n    [handlePreviewDragEnd, isDropValid, flattenedItems, dropIndicatorPosition, projected, onReorder],\n  );\n\n  const onDragCancel = useCallback(\n    (e: DragCancelEvent) => {\n      handlePreviewDragCancel(e);\n    },\n    [handlePreviewDragCancel],\n  );\n\n  return { onDragStart, onDragMove, onDragOver, onDragEnd, onDragCancel };\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,sBAA0B;AAC1B,oBAA0B;AAC1B,mBAA4B;AAE5B,uBAAsC;AAG/B,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAC4D;AAC5D,QAAM,cAAc,8BAClB,CAAC,MAAsB;AACrB,2BAAuB;AAAA,KAEzB,CAAC;AAGH,QAAM,aAAa,8BACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,aAAa,8BACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,YAAY,8BAChB,CAAC,MAAoB;AACnB,yBAAqB;AACrB,UAAM,EAAE,QAAQ,SAAS;AAEzB,QAAI,SAAS,QAAQ,CAAC;AAAa;AAEnC,UAAM,cAAc,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,OAAO;AAE3E,QAAI,oBAAoB;AAExB,QAAI,YAAY,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,KAAK;AAGrE,QAAI,0BAA0B,uCAAsB,QAAQ;AAC1D,0BAAoB,KAAK;AACzB,kBAAY,eAAe,WAAW,YAAY,eAAe,WAAW,gBAAgB;AAAA;AAI9F,QAAI,aAAc,iBAAgB,aAAa,eAAe,aAAa,UAAU,UAAU,QAAQ;AAErG,qBAAe,aAAa,WAAW,UAAU;AACjD,qBAAe,aAAa,QAAQ,UAAU;AAG9C,YAAM,mBACJ,gBAAgB,YAAY,+BAAU,gBAAgB,aAAa,aAAa,6BAAU;AAE5F,gBACE,kBACA;AAAA,QACE,aAAa;AAAA,QACb,WAAW;AAAA,SAEb,qBAAqB;AAAA;AAAA,KAI3B,CAAC,sBAAsB,aAAa,gBAAgB,uBAAuB,WAAW;AAGxF,QAAM,eAAe,8BACnB,CAAC,MAAuB;AACtB,4BAAwB;AAAA,KAE1B,CAAC;AAGH,SAAO,EAAE,aAAa,YAAY,YAAY,WAAW;AAAA;",
   "names": []
 }

package/cjs/tree/useTreeDndkitConfig.js

@@ -32,7 +32,6 @@ __export(useTreeDndkitConfig_exports, {
 var React = __toESM(require("react"));
 var import_react = require("react");
 var import_core = require("@dnd-kit/core");
-var import_sortable = require("@dnd-kit/sortable");
 var import_useTreePreviewHandlers = require("./useTreePreviewHandlers");
 var import_getTreeKeyboardCoordinates = require("./getTreeKeyboardCoordinates");
 var import_utilities = require("./utilities");
@@ -40,20 +39,23 @@ var import_useTreeActionHandlers = require("./useTreeActionHandlers");
 var import_constants = require("./constants");
 var import_customCollisionDetection = require("./customCollisionDetection");
 var import_useTreeAnnouncements = require("./useTreeAnnouncements");
-const adjustTranslate = (isHorizontalDnD) => ({ transform }) => {
-  const newTransform = {
-    ...transform
+const adjustTranslate = (isHorizontalDnD) => {
+  const func = ({ transform }) => {
+    const newTransform = {
+      ...transform
+    };
+    if (isHorizontalDnD) {
+      newTransform.x = transform.x + 25;
+    } else {
+      newTransform.x = transform.x + 15;
+    }
+    return newTransform;
   };
-  if (isHorizontalDnD) {
-    newTransform.x = transform.x + 25;
-  } else {
-    newTransform.x = transform.x + 15;
-  }
-  return newTransform;
+  return func;
 };
 const measuring = {
   droppable: {
-    strategy: import_core.MeasuringStrategy.BeforeDragging
+    strategy: import_core.MeasuringStrategy.Always
   }
 };
 const useTreeDndkitConfig = ({
@@ -62,6 +64,7 @@ const useTreeDndkitConfig = ({
   isHorizontalDnD = false,
   isExpandable = false,
   onReorder,
+  getIsDropValid = () => true,
   maxDragAndDropLevel
 }) => {
   const [activeId, setActiveId] = (0, import_react.useState)("");
@@ -77,6 +80,11 @@ const useTreeDndkitConfig = ({
     });
     return dictionary;
   }, [visibleItems]);
+  const isDropValid = (0, import_react.useMemo)(() => {
+    if (!activeId || !overId)
+      return true;
+    return getIsDropValid(visibleItemsDictionary[activeId], visibleItemsDictionary[overId], ["none", "before", "after", "inside"][dropIndicatorPosition]);
+  }, [getIsDropValid, visibleItemsDictionary, activeId, overId, dropIndicatorPosition]);
   const modifiers = (0, import_react.useMemo)(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);
   const sensorContext = (0, import_react.useRef)({
     items: visibleItems,
@@ -105,7 +113,8 @@ const useTreeDndkitConfig = ({
     onReorder,
     projected,
     flattenedItems,
-    dropIndicatorPosition
+    dropIndicatorPosition,
+    isDropValid
   });
   const announcements = (0, import_useTreeAnnouncements.useTreeAnnouncements)(visibleItemsDictionary, dropIndicatorPosition);
   const dndContextProps = (0, import_react.useMemo)(() => ({
@@ -129,11 +138,12 @@ const useTreeDndkitConfig = ({
   ]);
   const sortableContextProps = (0, import_react.useMemo)(() => ({
     items: sortedIds,
-    strategy: isHorizontalDnD ? import_sortable.horizontalListSortingStrategy : import_sortable.verticalListSortingStrategy
-  }), [sortedIds, isHorizontalDnD]);
+    strategy: () => null
+  }), [sortedIds]);
   return {
     dndContextProps,
     sortableContextProps,
+    isDropValid,
     activeId,
     activeIndex: visibleItemsDictionary[activeId]?.realIndex ?? -1,
     overId,

package/cjs/tree/useTreeDndkitConfig.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/tree/useTreeDndkitConfig.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "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 { horizontalListSortingStrategy, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { useTreePreviewHandlers } from './useTreePreviewHandlers';\nimport { getTreeKeyboardCoordinates } from './getTreeKeyboardCoordinates';\nimport { getProjection, removeChildrenOf } from './utilities';\nimport { useTreeActionHandlers } from './useTreeActionHandlers';\nimport type { useTreeDndkitConfigType, SensorContext, Item } 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 =\n  (isHorizontalDnD: boolean): Modifier =>\n  ({ 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\nconst measuring: Partial<MeasuringConfiguration> = {\n  droppable: {\n    strategy: MeasuringStrategy.BeforeDragging,\n  },\n};\n\nexport const useTreeDndkitConfig: useTreeDndkitConfigType = ({\n  flattenedItems,\n  visibleItems: preVisibleItems,\n  isHorizontalDnD = false,\n  isExpandable = false,\n  onReorder,\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, Item> = {};\n    visibleItems.forEach((item) => {\n      dictionary[item.uid] = item;\n    });\n    return dictionary;\n  }, [visibleItems]);\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  });\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: isHorizontalDnD ? horizontalListSortingStrategy : verticalListSortingStrategy,\n    }),\n    [sortedIds, isHorizontalDnD],\n  );\n\n  return {\n    dndContextProps,\n    sortableContextProps,\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"],
-  "mappings": "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",
+  "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"],
+  "mappings": "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",
   "names": []
 }

package/cjs/tree/useTreePreviewHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/tree/useTreePreviewHandlers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useCallback } from 'react';\nimport { DragStartEvent, DragOverEvent } from '@dnd-kit/core';\nimport type { useTreePreviewHandlersReturn, useTreePreviewHandlersArgs } from './types';\nimport { DropIndicatorPosition } from './constants';\n\nexport const useTreePreviewHandlers = ({\n  setOverId,\n  setActiveId,\n  setDropIndicatorPosition,\n}: useTreePreviewHandlersArgs): useTreePreviewHandlersReturn => {\n  const resetState = useCallback(() => {\n    setOverId('');\n    setActiveId('');\n\n    document.body.style.setProperty('cursor', '');\n  }, [setOverId, setActiveId]);\n\n  const handlePreviewDragStart = useCallback(\n    ({ active: { id } }: DragStartEvent) => {\n      setActiveId(id);\n      setOverId(id);\n      setDropIndicatorPosition(DropIndicatorPosition.Inside);\n\n      document.body.style.setProperty('cursor', 'grabbing');\n    },\n    [setActiveId, setDropIndicatorPosition, setOverId],\n  );\n\n  const handlePreviewDragMove = useCallback(() => null, []);\n\n  const handlePreviewDragOver = useCallback(\n    ({ over }: DragOverEvent) => {\n      setOverId(over?.id ?? '');\n    },\n    [setOverId],\n  );\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    handlePreviewDragOver,\n    handlePreviewDragEnd,\n    handlePreviewDragCancel,\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "sourcesContent": ["import { useCallback } from 'react';\nimport { DragStartEvent, DragOverEvent } from '@dnd-kit/core';\nimport type { UseTreePreviewHandlersReturn, UseTreePreviewHandlersArgs } from './types';\nimport { DropIndicatorPosition } from './constants';\n\nexport const useTreePreviewHandlers = ({\n  setOverId,\n  setActiveId,\n  setDropIndicatorPosition,\n}: UseTreePreviewHandlersArgs): UseTreePreviewHandlersReturn => {\n  const resetState = useCallback(() => {\n    setOverId('');\n    setActiveId('');\n\n    document.body.style.setProperty('cursor', '');\n  }, [setOverId, setActiveId]);\n\n  const handlePreviewDragStart = useCallback(\n    ({ active: { id } }: DragStartEvent) => {\n      setActiveId(id);\n      setOverId(id);\n      setDropIndicatorPosition(DropIndicatorPosition.Inside);\n\n      document.body.style.setProperty('cursor', 'grabbing');\n    },\n    [setActiveId, setDropIndicatorPosition, setOverId],\n  );\n\n  const handlePreviewDragMove = useCallback(() => null, []);\n\n  const handlePreviewDragOver = useCallback(\n    ({ over }: DragOverEvent) => {\n      setOverId(over?.id ?? '');\n    },\n    [setOverId],\n  );\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    handlePreviewDragOver,\n    handlePreviewDragEnd,\n    handlePreviewDragCancel,\n  };\n};\n", "import * as React from 'react';\nexport { React };\n"],
   "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA4B;AAG5B,uBAAsC;AAE/B,MAAM,yBAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,MAC8D;AAC9D,QAAM,aAAa,8BAAY,MAAM;AACnC,cAAU;AACV,gBAAY;AAEZ,aAAS,KAAK,MAAM,YAAY,UAAU;AAAA,KACzC,CAAC,WAAW;AAEf,QAAM,yBAAyB,8BAC7B,CAAC,EAAE,QAAQ,EAAE,WAA2B;AACtC,gBAAY;AACZ,cAAU;AACV,6BAAyB,uCAAsB;AAE/C,aAAS,KAAK,MAAM,YAAY,UAAU;AAAA,KAE5C,CAAC,aAAa,0BAA0B;AAG1C,QAAM,wBAAwB,8BAAY,MAAM,MAAM;AAEtD,QAAM,wBAAwB,8BAC5B,CAAC,EAAE,WAA0B;AAC3B,cAAU,MAAM,MAAM;AAAA,KAExB,CAAC;AAGH,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,IACA;AAAA;AAAA;",
   "names": []
 }

package/esm/tree/customCollisionDetection.js

@@ -15,61 +15,64 @@ const RECT_DOWN = {
 };
 const thresholdRatio = 0.2;
 const insideThreshold = 0.7;
-const customCollisionDetection = (activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition) => ({ droppableContainers, collisionRect }) => {
-  const originalContainer = droppableContainers.find(({ id }) => id === activeId);
-  const originalRect = originalContainer?.rect?.current;
-  let isUp = lastPosition === "up";
-  if (originalRect) {
-    isUp = originalRect.offsetTop > collisionRect.top;
-  }
-  const threshold = collisionRect.height * thresholdRatio;
-  let collidingContainer = null;
-  if (isUp) {
-    collidingContainer = droppableContainers.reduce((firstRectDown, container) => {
-      const rect = container.rect.current;
-      if (rect && firstRectDown.rect.current) {
-        const { offsetTop: rectOffsetTop } = rect;
-        const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;
-        if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {
-          return container;
+const customCollisionDetection = (activeId, visibleItemsDictionary, setDropIndicatorPosition, maxDragAndDropLevel, lastPosition, setLastPosition) => {
+  const func = ({ droppableContainers, collisionRect }) => {
+    const originalContainer = droppableContainers.find(({ id }) => id === activeId);
+    const originalRect = originalContainer?.rect?.current;
+    let isUp = lastPosition === "up";
+    if (originalRect) {
+      isUp = originalRect.offsetTop > collisionRect.top;
+    }
+    const threshold = collisionRect.height * thresholdRatio;
+    let collidingContainer = null;
+    if (isUp) {
+      collidingContainer = droppableContainers.reduce((firstRectDown, container) => {
+        const rect = container.rect.current;
+        if (rect && firstRectDown.rect.current) {
+          const { offsetTop: rectOffsetTop } = rect;
+          const { offsetTop: firstRectDownOffsetTop } = firstRectDown.rect.current;
+          if (rectOffsetTop + threshold > collisionRect.top && rectOffsetTop < firstRectDownOffsetTop) {
+            return container;
+          }
         }
-      }
-      return firstRectDown;
-    }, { id: DUMMY_ID, rect: { current: RECT_DOWN } });
-  } else {
-    collidingContainer = droppableContainers.reduce((firstRectUp, container) => {
-      const rect = container.rect.current;
-      if (rect && firstRectUp.rect.current) {
-        const { offsetTop: rectOffsetTop } = rect;
-        const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;
-        if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {
-          return container;
+        return firstRectDown;
+      }, { id: DUMMY_ID, rect: { current: RECT_DOWN } });
+    } else {
+      collidingContainer = droppableContainers.reduce((firstRectUp, container) => {
+        const rect = container.rect.current;
+        if (rect && firstRectUp.rect.current) {
+          const { offsetTop: rectOffsetTop } = rect;
+          const { offsetTop: firstRectUpOffsetTop } = firstRectUp.rect.current;
+          if (rectOffsetTop - threshold < collisionRect.top && rectOffsetTop > firstRectUpOffsetTop) {
+            return container;
+          }
         }
-      }
-      return firstRectUp;
-    }, { id: DUMMY_ID, rect: { current: RECT_UP } });
-  }
-  if (collidingContainer.id === DUMMY_ID) {
-    return null;
-  }
-  const collidingRect = collidingContainer.rect.current;
-  if (!collidingRect)
-    return null;
-  const [top, bottom] = [
-    Math.max(collisionRect.top, collidingRect.offsetTop),
-    Math.min(collisionRect.bottom, collidingRect.offsetTop + collidingRect.height)
-  ];
-  const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;
-  if (intersectionPercentage > insideThreshold && visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel && collidingContainer.id !== activeId) {
-    setDropIndicatorPosition(DropIndicatorPosition.Inside);
-  } else {
-    setDropIndicatorPosition(isUp ? DropIndicatorPosition.Before : DropIndicatorPosition.After);
-  }
-  if (isUp && lastPosition !== "up")
-    setLastPosition("up");
-  else if (!isUp && lastPosition !== "down")
-    setLastPosition("down");
-  return collidingContainer.id;
+        return firstRectUp;
+      }, { id: DUMMY_ID, rect: { current: RECT_UP } });
+    }
+    if (collidingContainer.id === DUMMY_ID) {
+      return null;
+    }
+    const collidingRect = collidingContainer.rect.current;
+    if (!collidingRect)
+      return null;
+    const [top, bottom] = [
+      Math.max(collisionRect.top, collidingRect.offsetTop),
+      Math.min(collisionRect.top + collisionRect.height, collidingRect.offsetTop + collidingRect.height)
+    ];
+    const intersectionPercentage = Math.abs(bottom - top) / collidingRect.height;
+    if (intersectionPercentage > insideThreshold && visibleItemsDictionary[collidingContainer.id].depth + 1 <= maxDragAndDropLevel && collidingContainer.id !== activeId) {
+      setDropIndicatorPosition(DropIndicatorPosition.Inside);
+    } else {
+      setDropIndicatorPosition(isUp ? DropIndicatorPosition.Before : DropIndicatorPosition.After);
+    }
+    if (isUp && lastPosition !== "up")
+      setLastPosition("up");
+    else if (!isUp && lastPosition !== "down")
+      setLastPosition("down");
+    return collidingContainer.id;
+  };
+  return func;
 };
 export {
   customCollisionDetection

package/esm/tree/customCollisionDetection.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/customCollisionDetection.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\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  (\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  ({ 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.bottom, 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"],
-  "mappings": "AAAA;ACIA;AAGA,MAAM,WAAW;AACjB,MAAM,UAAsB;AAAA,EAC1B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAEV,MAAM,YAAwB;AAAA,EAC5B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAIV,MAAM,iBAAiB;AAEvB,MAAM,kBAAkB;AAEjB,MAAM,2BACX,CACE,UACA,wBACA,0BACA,qBACA,cACA,oBAEF,CAAC,EAAE,qBAAqB,oBAAoB;AAC1C,QAAM,oBAAoB,oBAAoB,KAAK,CAAC,EAAE,SAAS,OAAO;AACtE,QAAM,eAAe,mBAAmB,MAAM;AAI9C,MAAI,OAAO,iBAAiB;AAC5B,MAAI,cAAc;AAChB,WAAO,aAAa,YAAY,cAAc;AAAA;AAIhD,QAAM,YAAY,cAAc,SAAS;AAEzC,MAAI,qBAAgD;AAEpD,MAAI,MAAM;AAER,yBAAqB,oBAAoB,OACvC,CAAC,eAAe,cAAc;AAC5B,YAAM,OAAO,UAAU,KAAK;AAC5B,UAAI,QAAQ,cAAc,KAAK,SAAS;AACtC,cAAM,EAAE,WAAW,kBAAkB;AACrC,cAAM,EAAE,WAAW,2BAA2B,cAAc,KAAK;AACjE,YAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,wBAAwB;AAC3F,iBAAO;AAAA;AAAA;AAGX,aAAO;AAAA,OAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA,SAE9B;AAEL,yBAAqB,oBAAoB,OACvC,CAAC,aAAa,cAAc;AAC1B,YAAM,OAAO,UAAU,KAAK;AAC5B,UAAI,QAAQ,YAAY,KAAK,SAAS;AACpC,cAAM,EAAE,WAAW,kBAAkB;AACrC,cAAM,EAAE,WAAW,yBAAyB,YAAY,KAAK;AAC7D,YAAI,gBAAgB,YAAY,cAAc,OAAO,gBAAgB,sBAAsB;AACzF,iBAAO;AAAA;AAAA;AAGX,aAAO;AAAA,OAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA;AAKrC,MAAI,mBAAmB,OAAO,UAAU;AACtC,WAAO;AAAA;AAGT,QAAM,gBAAgB,mBAAmB,KAAK;AAE9C,MAAI,CAAC;AAAe,WAAO;AAG3B,QAAM,CAAC,KAAK,UAAU;AAAA,IACpB,KAAK,IAAI,cAAc,KAAK,cAAc;AAAA,IAC1C,KAAK,IAAI,cAAc,QAAQ,cAAc,YAAY,cAAc;AAAA;AAIzE,QAAM,yBAAyB,KAAK,IAAI,SAAS,OAAO,cAAc;AAEtE,MACE,yBAAyB,mBACzB,uBAAuB,mBAAmB,IAAI,QAAQ,KAAK,uBAC3D,mBAAmB,OAAO,UAC1B;AACA,6BAAyB,sBAAsB;AAAA,SAC1C;AACL,6BAAyB,OAAO,sBAAsB,SAAS,sBAAsB;AAAA;AAGvF,MAAI,QAAQ,iBAAiB;AAAM,oBAAgB;AAAA,WAC1C,CAAC,QAAQ,iBAAiB;AAAQ,oBAAgB;AAG3D,SAAO,mBAAmB;AAAA;",
+  "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"],
+  "mappings": "AAAA;ACKA;AAGA,MAAM,WAAW;AACjB,MAAM,UAAsB;AAAA,EAC1B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAEV,MAAM,YAAwB;AAAA,EAC5B,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,QAAQ;AAAA;AAIV,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;AACtE,UAAM,eAAe,mBAAmB,MAAM;AAI9C,QAAI,OAAO,iBAAiB;AAC5B,QAAI,cAAc;AAChB,aAAO,aAAa,YAAY,cAAc;AAAA;AAIhD,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;AAAA;AAGX,eAAO;AAAA,SAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA,WAE9B;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;AAAA;AAGX,eAAO;AAAA,SAET,EAAE,IAAI,UAAU,MAAM,EAAE,SAAS;AAAA;AAKrC,QAAI,mBAAmB,OAAO,UAAU;AACtC,aAAO;AAAA;AAGT,UAAM,gBAAgB,mBAAmB,KAAK;AAE9C,QAAI,CAAC;AAAe,aAAO;AAG3B,UAAM,CAAC,KAAK,UAAU;AAAA,MACpB,KAAK,IAAI,cAAc,KAAK,cAAc;AAAA,MAC1C,KAAK,IAAI,cAAc,MAAM,cAAc,QAAQ,cAAc,YAAY,cAAc;AAAA;AAI7F,UAAM,yBAAyB,KAAK,IAAI,SAAS,OAAO,cAAc;AAEtE,QACE,yBAAyB,mBACzB,uBAAuB,mBAAmB,IAAI,QAAQ,KAAK,uBAC3D,mBAAmB,OAAO,UAC1B;AACA,+BAAyB,sBAAsB;AAAA,WAC1C;AACL,+BAAyB,OAAO,sBAAsB,SAAS,sBAAsB;AAAA;AAGvF,QAAI,QAAQ,iBAAiB;AAAM,sBAAgB;AAAA,aAC1C,CAAC,QAAQ,iBAAiB;AAAQ,sBAAgB;AAG3D,WAAO,mBAAmB;AAAA;AAE5B,SAAO;AAAA;",
   "names": []
 }

package/esm/tree/getTreeKeyboardCoordinates.js

@@ -3,7 +3,6 @@ import { closestCorners, getViewRect, KeyboardCode } from "@dnd-kit/core";
 import { DropIndicatorPosition } from "./constants";
 const directions = [KeyboardCode.Down, KeyboardCode.Right, KeyboardCode.Up, KeyboardCode.Left];
 const horizontal = [KeyboardCode.Left, KeyboardCode.Right];
-const vertical = [KeyboardCode.Up, KeyboardCode.Down];
 const getVerticalKeyboardCoordinates = ({
   items,
   active,

package/esm/tree/getTreeKeyboardCoordinates.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/getTreeKeyboardCoordinates.tsx"],
-  "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';\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];\nconst vertical: string[] = [KeyboardCode.Up, KeyboardCode.Down];\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"],
-  "mappings": "AAAA;ACAA;AAGA;AAEA,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa,OAAO,aAAa,IAAI,aAAa;AAEnG,MAAM,aAAuB,CAAC,aAAa,MAAM,aAAa;AAC9D,MAAM,WAAqB,CAAC,aAAa,IAAI,aAAa;AAE1D,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;AAAA,WACF;AAAA,QACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,WAAO;AAAA,SACF;AAAA,MACH,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;AAAA,SACF;AAAA,MACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,SAAO;AAAA,OACF;AAAA,IACH,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;",
+  "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"],
+  "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;AAAA,WACF;AAAA,QACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,WAAO;AAAA,SACF;AAAA,MACH,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;AAAA,SACF;AAAA,MACH,GAAG,YAAY,MAAM,cAAc,SAAS;AAAA;AAAA;AAGhD,SAAO;AAAA,OACF;AAAA,IACH,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;",
   "names": []
 }

package/esm/tree/useTreeActionHandlers.js

@@ -12,7 +12,8 @@ const useTreeActionHandlers = ({
   onReorder,
   flattenedItems,
   projected,
-  dropIndicatorPosition
+  dropIndicatorPosition,
+  isDropValid
 }) => {
   const onDragStart = useCallback((e) => {
     handlePreviewDragStart(e);
@@ -26,14 +27,14 @@ const useTreeActionHandlers = ({
   const onDragEnd = useCallback((e) => {
     handlePreviewDragEnd(e);
     const { active, over } = e;
-    if (over === null)
+    if (over === null || !isDropValid)
       return;
     const activeIndex = flattenedItems.findIndex((item) => item.uid === active.id);
     let considerExpanding = null;
     let overIndex = flattenedItems.findIndex((item) => item.uid === over.id);
     if (dropIndicatorPosition === DropIndicatorPosition.Inside) {
       considerExpanding = over.id;
-      overIndex = flattenedItems[overIndex].realIndex + (flattenedItems[overIndex].original.subRows?.length ?? 0) + 1;
+      overIndex = flattenedItems[overIndex].realIndex + flattenedItems[overIndex].childrenCount + 1;
     }
     if (projected && (activeIndex !== overIndex || flattenedItems[activeIndex].depth !== projected.depth)) {
       flattenedItems[activeIndex].parentId = projected.parentId;
@@ -44,7 +45,7 @@ const useTreeActionHandlers = ({
         fromIndex: activeIndex
       }, considerExpanding || "");
     }
-  }, [handlePreviewDragEnd, flattenedItems, projected, onReorder, dropIndicatorPosition]);
+  }, [handlePreviewDragEnd, isDropValid, flattenedItems, dropIndicatorPosition, projected, onReorder]);
   const onDragCancel = useCallback((e) => {
     handlePreviewDragCancel(e);
   }, [handlePreviewDragCancel]);

package/esm/tree/useTreeActionHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/useTreeActionHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { arrayMove } from '@dnd-kit/sortable';\nimport { cloneDeep } from 'lodash';\nimport { useCallback } from 'react';\nimport type { DragStartEvent, DragMoveEvent, DragEndEvent, DragOverEvent, DragCancelEvent } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport type { useTreeActionHandlersReturn, useTreeActionHandlersArgs } from './types';\n\nexport const useTreeActionHandlers = ({\n  handlePreviewDragStart,\n  handlePreviewDragMove,\n  handlePreviewDragOver,\n  handlePreviewDragEnd,\n  handlePreviewDragCancel,\n  onReorder,\n  flattenedItems,\n  projected,\n  dropIndicatorPosition,\n}: useTreeActionHandlersArgs): useTreeActionHandlersReturn => {\n  const onDragStart = useCallback(\n    (e: DragStartEvent) => {\n      handlePreviewDragStart(e);\n    },\n    [handlePreviewDragStart],\n  );\n\n  const onDragMove = useCallback(\n    (e: DragMoveEvent) => {\n      handlePreviewDragMove(e);\n    },\n    [handlePreviewDragMove],\n  );\n\n  const onDragOver = useCallback(\n    (e: DragOverEvent) => {\n      handlePreviewDragOver(e);\n    },\n    [handlePreviewDragOver],\n  );\n\n  const onDragEnd = useCallback(\n    (e: DragEndEvent) => {\n      handlePreviewDragEnd(e);\n      const { active, over } = e;\n\n      if (over === null) return;\n\n      const activeIndex = flattenedItems.findIndex((item) => item.uid === active.id);\n\n      let considerExpanding = null;\n\n      let overIndex = flattenedItems.findIndex((item) => item.uid === over.id);\n      // If drop indicator is inside, then put it last,\n      // It will be reconstructed well later\n      if (dropIndicatorPosition === DropIndicatorPosition.Inside) {\n        considerExpanding = over.id;\n        overIndex = flattenedItems[overIndex].realIndex + (flattenedItems[overIndex].original.subRows?.length ?? 0) + 1;\n      }\n\n      // If we are dropping the item in a new position, or new depth\n      if (projected && (activeIndex !== overIndex || flattenedItems[activeIndex].depth !== projected.depth)) {\n        // Change parent and depth from projected data\n        flattenedItems[activeIndex].parentId = projected.parentId;\n        flattenedItems[activeIndex].depth = projected.depth;\n\n        // If same index, don't move the array, just copy it\n        const newFlattenedData =\n          activeIndex !== overIndex ? arrayMove(flattenedItems, activeIndex, overIndex) : cloneDeep(flattenedItems);\n\n        onReorder(\n          newFlattenedData,\n          {\n            targetIndex: overIndex,\n            fromIndex: activeIndex,\n          },\n          considerExpanding || '',\n        );\n      }\n    },\n    [handlePreviewDragEnd, flattenedItems, projected, onReorder, dropIndicatorPosition],\n  );\n\n  const onDragCancel = useCallback(\n    (e: DragCancelEvent) => {\n      handlePreviewDragCancel(e);\n    },\n    [handlePreviewDragCancel],\n  );\n\n  return { onDragStart, onDragMove, onDragOver, onDragEnd, onDragCancel };\n};\n"],
-  "mappings": "AAAA;ACAA;AACA;AACA;AAEA;AAGO,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAC4D;AAC5D,QAAM,cAAc,YAClB,CAAC,MAAsB;AACrB,2BAAuB;AAAA,KAEzB,CAAC;AAGH,QAAM,aAAa,YACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,aAAa,YACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,YAAY,YAChB,CAAC,MAAoB;AACnB,yBAAqB;AACrB,UAAM,EAAE,QAAQ,SAAS;AAEzB,QAAI,SAAS;AAAM;AAEnB,UAAM,cAAc,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,OAAO;AAE3E,QAAI,oBAAoB;AAExB,QAAI,YAAY,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,KAAK;AAGrE,QAAI,0BAA0B,sBAAsB,QAAQ;AAC1D,0BAAoB,KAAK;AACzB,kBAAY,eAAe,WAAW,YAAa,gBAAe,WAAW,SAAS,SAAS,UAAU,KAAK;AAAA;AAIhH,QAAI,aAAc,iBAAgB,aAAa,eAAe,aAAa,UAAU,UAAU,QAAQ;AAErG,qBAAe,aAAa,WAAW,UAAU;AACjD,qBAAe,aAAa,QAAQ,UAAU;AAG9C,YAAM,mBACJ,gBAAgB,YAAY,UAAU,gBAAgB,aAAa,aAAa,UAAU;AAE5F,gBACE,kBACA;AAAA,QACE,aAAa;AAAA,QACb,WAAW;AAAA,SAEb,qBAAqB;AAAA;AAAA,KAI3B,CAAC,sBAAsB,gBAAgB,WAAW,WAAW;AAG/D,QAAM,eAAe,YACnB,CAAC,MAAuB;AACtB,4BAAwB;AAAA,KAE1B,CAAC;AAGH,SAAO,EAAE,aAAa,YAAY,YAAY,WAAW;AAAA;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { arrayMove } from '@dnd-kit/sortable';\nimport { cloneDeep } from 'lodash';\nimport { useCallback } from 'react';\nimport type { DragStartEvent, DragMoveEvent, DragEndEvent, DragOverEvent, DragCancelEvent } from '@dnd-kit/core';\nimport { DropIndicatorPosition } from './constants';\nimport type { UseTreeActionHandlersReturn, UseTreeActionHandlersArgs } from './types';\n\nexport const useTreeActionHandlers = ({\n  handlePreviewDragStart,\n  handlePreviewDragMove,\n  handlePreviewDragOver,\n  handlePreviewDragEnd,\n  handlePreviewDragCancel,\n  onReorder,\n  flattenedItems,\n  projected,\n  dropIndicatorPosition,\n  isDropValid,\n}: UseTreeActionHandlersArgs): UseTreeActionHandlersReturn => {\n  const onDragStart = useCallback(\n    (e: DragStartEvent) => {\n      handlePreviewDragStart(e);\n    },\n    [handlePreviewDragStart],\n  );\n\n  const onDragMove = useCallback(\n    (e: DragMoveEvent) => {\n      handlePreviewDragMove(e);\n    },\n    [handlePreviewDragMove],\n  );\n\n  const onDragOver = useCallback(\n    (e: DragOverEvent) => {\n      handlePreviewDragOver(e);\n    },\n    [handlePreviewDragOver],\n  );\n\n  const onDragEnd = useCallback(\n    (e: DragEndEvent) => {\n      handlePreviewDragEnd(e);\n      const { active, over } = e;\n\n      if (over === null || !isDropValid) return;\n\n      const activeIndex = flattenedItems.findIndex((item) => item.uid === active.id);\n\n      let considerExpanding = null;\n\n      let overIndex = flattenedItems.findIndex((item) => item.uid === over.id);\n      // If drop indicator is inside, then put it last,\n      // It will be reconstructed well later\n      if (dropIndicatorPosition === DropIndicatorPosition.Inside) {\n        considerExpanding = over.id;\n        overIndex = flattenedItems[overIndex].realIndex + flattenedItems[overIndex].childrenCount + 1;\n      }\n\n      // If we are dropping the item in a new position, or new depth\n      if (projected && (activeIndex !== overIndex || flattenedItems[activeIndex].depth !== projected.depth)) {\n        // Change parent and depth from projected data\n        flattenedItems[activeIndex].parentId = projected.parentId;\n        flattenedItems[activeIndex].depth = projected.depth;\n\n        // If same index, don't move the array, just copy it\n        const newFlattenedData =\n          activeIndex !== overIndex ? arrayMove(flattenedItems, activeIndex, overIndex) : cloneDeep(flattenedItems);\n\n        onReorder(\n          newFlattenedData,\n          {\n            targetIndex: overIndex,\n            fromIndex: activeIndex,\n          },\n          considerExpanding || '',\n        );\n      }\n    },\n    [handlePreviewDragEnd, isDropValid, flattenedItems, dropIndicatorPosition, projected, onReorder],\n  );\n\n  const onDragCancel = useCallback(\n    (e: DragCancelEvent) => {\n      handlePreviewDragCancel(e);\n    },\n    [handlePreviewDragCancel],\n  );\n\n  return { onDragStart, onDragMove, onDragOver, onDragEnd, onDragCancel };\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AAEA;AAGO,MAAM,wBAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MAC4D;AAC5D,QAAM,cAAc,YAClB,CAAC,MAAsB;AACrB,2BAAuB;AAAA,KAEzB,CAAC;AAGH,QAAM,aAAa,YACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,aAAa,YACjB,CAAC,MAAqB;AACpB,0BAAsB;AAAA,KAExB,CAAC;AAGH,QAAM,YAAY,YAChB,CAAC,MAAoB;AACnB,yBAAqB;AACrB,UAAM,EAAE,QAAQ,SAAS;AAEzB,QAAI,SAAS,QAAQ,CAAC;AAAa;AAEnC,UAAM,cAAc,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,OAAO;AAE3E,QAAI,oBAAoB;AAExB,QAAI,YAAY,eAAe,UAAU,CAAC,SAAS,KAAK,QAAQ,KAAK;AAGrE,QAAI,0BAA0B,sBAAsB,QAAQ;AAC1D,0BAAoB,KAAK;AACzB,kBAAY,eAAe,WAAW,YAAY,eAAe,WAAW,gBAAgB;AAAA;AAI9F,QAAI,aAAc,iBAAgB,aAAa,eAAe,aAAa,UAAU,UAAU,QAAQ;AAErG,qBAAe,aAAa,WAAW,UAAU;AACjD,qBAAe,aAAa,QAAQ,UAAU;AAG9C,YAAM,mBACJ,gBAAgB,YAAY,UAAU,gBAAgB,aAAa,aAAa,UAAU;AAE5F,gBACE,kBACA;AAAA,QACE,aAAa;AAAA,QACb,WAAW;AAAA,SAEb,qBAAqB;AAAA;AAAA,KAI3B,CAAC,sBAAsB,aAAa,gBAAgB,uBAAuB,WAAW;AAGxF,QAAM,eAAe,YACnB,CAAC,MAAuB;AACtB,4BAAwB;AAAA,KAE1B,CAAC;AAGH,SAAO,EAAE,aAAa,YAAY,YAAY,WAAW;AAAA;",
   "names": []
 }

package/esm/tree/useTreeDndkitConfig.js

@@ -7,7 +7,6 @@ import {
   PointerSensor,
   MeasuringStrategy
 } from "@dnd-kit/core";
-import { horizontalListSortingStrategy, verticalListSortingStrategy } from "@dnd-kit/sortable";
 import { useTreePreviewHandlers } from "./useTreePreviewHandlers";
 import { getTreeKeyboardCoordinates } from "./getTreeKeyboardCoordinates";
 import { getProjection, removeChildrenOf } from "./utilities";
@@ -15,20 +14,23 @@ import { useTreeActionHandlers } from "./useTreeActionHandlers";
 import { DropIndicatorPosition } from "./constants";
 import { customCollisionDetection } from "./customCollisionDetection";
 import { useTreeAnnouncements } from "./useTreeAnnouncements";
-const adjustTranslate = (isHorizontalDnD) => ({ transform }) => {
-  const newTransform = {
-    ...transform
+const adjustTranslate = (isHorizontalDnD) => {
+  const func = ({ transform }) => {
+    const newTransform = {
+      ...transform
+    };
+    if (isHorizontalDnD) {
+      newTransform.x = transform.x + 25;
+    } else {
+      newTransform.x = transform.x + 15;
+    }
+    return newTransform;
   };
-  if (isHorizontalDnD) {
-    newTransform.x = transform.x + 25;
-  } else {
-    newTransform.x = transform.x + 15;
-  }
-  return newTransform;
+  return func;
 };
 const measuring = {
   droppable: {
-    strategy: MeasuringStrategy.BeforeDragging
+    strategy: MeasuringStrategy.Always
   }
 };
 const useTreeDndkitConfig = ({
@@ -37,6 +39,7 @@ const useTreeDndkitConfig = ({
   isHorizontalDnD = false,
   isExpandable = false,
   onReorder,
+  getIsDropValid = () => true,
   maxDragAndDropLevel
 }) => {
   const [activeId, setActiveId] = useState("");
@@ -52,6 +55,11 @@ const useTreeDndkitConfig = ({
     });
     return dictionary;
   }, [visibleItems]);
+  const isDropValid = useMemo(() => {
+    if (!activeId || !overId)
+      return true;
+    return getIsDropValid(visibleItemsDictionary[activeId], visibleItemsDictionary[overId], ["none", "before", "after", "inside"][dropIndicatorPosition]);
+  }, [getIsDropValid, visibleItemsDictionary, activeId, overId, dropIndicatorPosition]);
   const modifiers = useMemo(() => [adjustTranslate(isHorizontalDnD)], [isHorizontalDnD]);
   const sensorContext = useRef({
     items: visibleItems,
@@ -80,7 +88,8 @@ const useTreeDndkitConfig = ({
     onReorder,
     projected,
     flattenedItems,
-    dropIndicatorPosition
+    dropIndicatorPosition,
+    isDropValid
   });
   const announcements = useTreeAnnouncements(visibleItemsDictionary, dropIndicatorPosition);
   const dndContextProps = useMemo(() => ({
@@ -104,11 +113,12 @@ const useTreeDndkitConfig = ({
   ]);
   const sortableContextProps = useMemo(() => ({
     items: sortedIds,
-    strategy: isHorizontalDnD ? horizontalListSortingStrategy : verticalListSortingStrategy
-  }), [sortedIds, isHorizontalDnD]);
+    strategy: () => null
+  }), [sortedIds]);
   return {
     dndContextProps,
     sortableContextProps,
+    isDropValid,
     activeId,
     activeIndex: visibleItemsDictionary[activeId]?.realIndex ?? -1,
     overId,

package/esm/tree/useTreeDndkitConfig.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/useTreeDndkitConfig.tsx"],
-  "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 { horizontalListSortingStrategy, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { useTreePreviewHandlers } from './useTreePreviewHandlers';\nimport { getTreeKeyboardCoordinates } from './getTreeKeyboardCoordinates';\nimport { getProjection, removeChildrenOf } from './utilities';\nimport { useTreeActionHandlers } from './useTreeActionHandlers';\nimport type { useTreeDndkitConfigType, SensorContext, Item } 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 =\n  (isHorizontalDnD: boolean): Modifier =>\n  ({ 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\nconst measuring: Partial<MeasuringConfiguration> = {\n  droppable: {\n    strategy: MeasuringStrategy.BeforeDragging,\n  },\n};\n\nexport const useTreeDndkitConfig: useTreeDndkitConfigType = ({\n  flattenedItems,\n  visibleItems: preVisibleItems,\n  isHorizontalDnD = false,\n  isExpandable = false,\n  onReorder,\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, Item> = {};\n    visibleItems.forEach((item) => {\n      dictionary[item.uid] = item;\n    });\n    return dictionary;\n  }, [visibleItems]);\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  });\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: isHorizontalDnD ? horizontalListSortingStrategy : verticalListSortingStrategy,\n    }),\n    [sortedIds, isHorizontalDnD],\n  );\n\n  return {\n    dndContextProps,\n    sortableContextProps,\n    activeId,\n    activeIndex: visibleItemsDictionary[activeId]?.realIndex ?? -1,\n    overId,\n    depth: projected ? projected.depth : 0,\n    dropIndicatorPosition,\n    visibleItems,\n  };\n};\n"],
-  "mappings": "AAAA;ACCA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASA;AACA;AACA;AACA;AACA;AAEA;AACA;AACA;AAIA,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,kBAAkB;AAAA;AAAA;AAIzB,MAAM,sBAA+C,CAAC;AAAA,EAC3D;AAAA,EACA,cAAc;AAAA,EACd,kBAAkB;AAAA,EAClB,eAAe;AAAA,EACf;AAAA,EACA;AAAA,MACI;AACJ,QAAM,CAAC,UAAU,eAAe,SAAiB;AACjD,QAAM,CAAC,QAAQ,aAAa,SAAiB;AAC7C,QAAM,CAAC,uBAAuB,4BAA4B,SAAgC,sBAAsB;AAChH,QAAM,CAAC,cAAc,mBAAmB,SAAiB;AAGzD,QAAM,eAAe,QAAQ,MAAM,iBAAiB,iBAAiB,WAAW,CAAC,iBAAiB;AAGlG,QAAM,YAAY,QAAQ,MAAM,aAAa,IAAI,CAAC,SAAS,KAAK,MAAM,CAAC;AAOvE,QAAM,yBAAyB,QAAQ,MAAM;AAE3C,UAAM,aAAmC;AACzC,iBAAa,QAAQ,CAAC,SAAS;AAC7B,iBAAW,KAAK,OAAO;AAAA;AAEzB,WAAO;AAAA,KACN,CAAC;AAEJ,QAAM,YAAwB,QAAQ,MAAM,CAAC,gBAAgB,mBAAmB,CAAC;AAEjF,QAAM,gBAA+B,OAAO;AAAA,IAC1C,OAAO;AAAA,IACP;AAAA,IACA;AAAA;AAGF,YAAU,MAAM;AACd,kBAAc,UAAU;AAAA,MACtB,OAAO;AAAA,MACP;AAAA,MACA;AAAA;AAAA,KAED,CAAC,cAAc,uBAAuB;AAEzC,QAAM,mBAAmB,QACvB,MAAM,2BAA2B,eAAe,iBAAiB,sBACjE,CAAC,eAAe,iBAAiB;AAGnC,QAAM,UAAU,WACd,UAAU,gBACV,UAAU,gBAAgB;AAAA,IACxB;AAAA;AAKJ,QAAM,YAAY,QAChB,MACE,SAAS,cAAc,cAAc,wBAAwB,QAAQ,uBAAuB,gBAAgB,MAC9G,CAAC,QAAQ,cAAc,wBAAwB,uBAAuB;AAGxE,QAAM,sBAAsB,uBAAuB;AAAA,IACjD;AAAA,IACA;AAAA,IACA;AAAA;AAGF,QAAM,qBAAqB,sBAAsB;AAAA,OAC5C;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGF,QAAM,gBAAgB,qBAAqB,wBAAwB;AAEnE,QAAM,kBAAkB,QACtB,MAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,oBAAoB,yBAClB,UACA,wBACA,0BACA,qBACA,cACA;AAAA,OAEC;AAAA,MAEL;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,QAAM,uBAAuB,QAC3B,MAAO;AAAA,IACL,OAAO;AAAA,IACP,UAAU,kBAAkB,gCAAgC;AAAA,MAE9D,CAAC,WAAW;AAGd,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa,uBAAuB,WAAW,aAAa;AAAA,IAC5D;AAAA,IACA,OAAO,YAAY,UAAU,QAAQ;AAAA,IACrC;AAAA,IACA;AAAA;AAAA;",
+  "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"],
+  "mappings": "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",
   "names": []
 }

package/esm/tree/useTreePreviewHandlers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/tree/useTreePreviewHandlers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback } from 'react';\nimport { DragStartEvent, DragOverEvent } from '@dnd-kit/core';\nimport type { useTreePreviewHandlersReturn, useTreePreviewHandlersArgs } from './types';\nimport { DropIndicatorPosition } from './constants';\n\nexport const useTreePreviewHandlers = ({\n  setOverId,\n  setActiveId,\n  setDropIndicatorPosition,\n}: useTreePreviewHandlersArgs): useTreePreviewHandlersReturn => {\n  const resetState = useCallback(() => {\n    setOverId('');\n    setActiveId('');\n\n    document.body.style.setProperty('cursor', '');\n  }, [setOverId, setActiveId]);\n\n  const handlePreviewDragStart = useCallback(\n    ({ active: { id } }: DragStartEvent) => {\n      setActiveId(id);\n      setOverId(id);\n      setDropIndicatorPosition(DropIndicatorPosition.Inside);\n\n      document.body.style.setProperty('cursor', 'grabbing');\n    },\n    [setActiveId, setDropIndicatorPosition, setOverId],\n  );\n\n  const handlePreviewDragMove = useCallback(() => null, []);\n\n  const handlePreviewDragOver = useCallback(\n    ({ over }: DragOverEvent) => {\n      setOverId(over?.id ?? '');\n    },\n    [setOverId],\n  );\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    handlePreviewDragOver,\n    handlePreviewDragEnd,\n    handlePreviewDragCancel,\n  };\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useCallback } from 'react';\nimport { DragStartEvent, DragOverEvent } from '@dnd-kit/core';\nimport type { UseTreePreviewHandlersReturn, UseTreePreviewHandlersArgs } from './types';\nimport { DropIndicatorPosition } from './constants';\n\nexport const useTreePreviewHandlers = ({\n  setOverId,\n  setActiveId,\n  setDropIndicatorPosition,\n}: UseTreePreviewHandlersArgs): UseTreePreviewHandlersReturn => {\n  const resetState = useCallback(() => {\n    setOverId('');\n    setActiveId('');\n\n    document.body.style.setProperty('cursor', '');\n  }, [setOverId, setActiveId]);\n\n  const handlePreviewDragStart = useCallback(\n    ({ active: { id } }: DragStartEvent) => {\n      setActiveId(id);\n      setOverId(id);\n      setDropIndicatorPosition(DropIndicatorPosition.Inside);\n\n      document.body.style.setProperty('cursor', 'grabbing');\n    },\n    [setActiveId, setDropIndicatorPosition, setOverId],\n  );\n\n  const handlePreviewDragMove = useCallback(() => null, []);\n\n  const handlePreviewDragOver = useCallback(\n    ({ over }: DragOverEvent) => {\n      setOverId(over?.id ?? '');\n    },\n    [setOverId],\n  );\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    handlePreviewDragOver,\n    handlePreviewDragEnd,\n    handlePreviewDragCancel,\n  };\n};\n"],
   "mappings": "AAAA;ACAA;AAGA;AAEO,MAAM,yBAAyB,CAAC;AAAA,EACrC;AAAA,EACA;AAAA,EACA;AAAA,MAC8D;AAC9D,QAAM,aAAa,YAAY,MAAM;AACnC,cAAU;AACV,gBAAY;AAEZ,aAAS,KAAK,MAAM,YAAY,UAAU;AAAA,KACzC,CAAC,WAAW;AAEf,QAAM,yBAAyB,YAC7B,CAAC,EAAE,QAAQ,EAAE,WAA2B;AACtC,gBAAY;AACZ,cAAU;AACV,6BAAyB,sBAAsB;AAE/C,aAAS,KAAK,MAAM,YAAY,UAAU;AAAA,KAE5C,CAAC,aAAa,0BAA0B;AAG1C,QAAM,wBAAwB,YAAY,MAAM,MAAM;AAEtD,QAAM,wBAAwB,YAC5B,CAAC,EAAE,WAA0B;AAC3B,cAAU,MAAM,MAAM;AAAA,KAExB,CAAC;AAGH,QAAM,uBAAuB,YAAY,MAAM;AAC7C;AAAA,KACC,CAAC;AAEJ,QAAM,0BAA0B,YAAY,MAAM;AAChD;AAAA,KACC,CAAC;AAEJ,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA;",
   "names": []
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-drag-and-drop",
-  "version": "2.3.0-alpha.2",
+  "version": "2.3.0-alpha.3",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Drag And Drop",
   "module": "./esm/index.js",

package/types/hierarchy/types.d.ts

@@ -64,7 +64,7 @@ export declare type useHierarchyDndkitConfigReturn = {
     overId: string | null;
     activeIndex: number | undefined;
 };
-export declare type getKeyboardCoordinatesArgs = {
+export declare type GetKeyboardCoordinatesArgs = {
     items: Item[];
     active: Active | null;
     over: Over | null;

package/types/tree/types.d.ts

@@ -4,12 +4,13 @@ import type { SortingStrategy } from '@dnd-kit/sortable';
 import { Coordinates } from '@dnd-kit/core/dist/types';
 import React, { MutableRefObject } from 'react';
 import { DropIndicatorPosition } from './constants';
-export declare type Item = {
+export declare type Item<T = unknown> = {
     uid: string;
     depth: number;
-    parentId: string;
+    parentId: string | null;
     realIndex: number;
-    original: Record<string, Record<string, any>>;
+    childrenCount: number;
+    original: T;
 };
 export declare type DndContextPropsType = {
     announcements: Announcements;
@@ -27,49 +28,51 @@ export declare type SortableContextPropsType = {
     items: string[];
     strategy: SortingStrategy;
 };
-export declare type useTreePreviewHandlersReturn = {
+export declare type UseTreePreviewHandlersReturn = {
     handlePreviewDragStart: (e: DragStartEvent) => void;
     handlePreviewDragMove: (e: DragMoveEvent) => void;
     handlePreviewDragOver: (e: DragOverEvent) => void;
     handlePreviewDragEnd: (e: DragEndEvent) => void;
     handlePreviewDragCancel: (e: DragCancelEvent) => void;
 };
-export declare type useTreePreviewHandlersArgs = {
+export declare type UseTreePreviewHandlersArgs = {
     setOverId: React.Dispatch<React.SetStateAction<string>>;
     setActiveId: React.Dispatch<React.SetStateAction<string>>;
     setDropIndicatorPosition: React.Dispatch<React.SetStateAction<DropIndicatorPosition>>;
 };
-export declare type useTreeActionHandlersArgs = useTreePreviewHandlersReturn & {
+export declare type UseTreeActionHandlersArgs<T = unknown> = UseTreePreviewHandlersReturn & {
     dropIndicatorPosition: DropIndicatorPosition;
     flattenedItems: Item[];
     projected: {
         depth: number;
         parentId: string;
     } | null;
-    onReorder: (newData: Item[], indexes: {
+    onReorder: <S = T>(newData: Item<S>[], indexes: {
         targetIndex: number;
         fromIndex: number;
     }, considerExpanding: string) => void;
+    isDropValid: boolean;
 };
-export declare type useTreeActionHandlersReturn = {
+export declare type UseTreeActionHandlersReturn = {
     onDragStart: (e: DragStartEvent) => void;
     onDragMove: (e: DragMoveEvent) => void;
     onDragOver: (e: DragOverEvent) => void;
     onDragEnd: (e: DragEndEvent) => void;
     onDragCancel: (e: DragCancelEvent) => void;
 };
-export declare type useTreeDndkitConfigArgs = {
+export declare type UseTreeDndkitConfigArgs<T> = {
     flattenedItems: Item[];
     visibleItems: Item[];
     isHorizontalDnD?: boolean;
     isExpandable: boolean;
-    onReorder: (newData: Item[], indexes: {
+    onReorder: <S = T>(newData: Item<S>[], indexes: {
         targetIndex: number;
         fromIndex: number;
     }, considerExpanding: string) => void;
+    getIsDropValid: <S = T>(active: Item<S>, over: Item<S>, dropIndicatorPosition: 'none' | 'before' | 'after' | 'inside') => boolean;
     maxDragAndDropLevel: number;
 };
-export declare type useTreeDndkitConfigReturn = {
+export declare type UseTreeDndkitConfigReturn = {
     dndContextProps: DndContextPropsType;
     sortableContextProps: SortableContextPropsType;
     activeId: string;
@@ -77,10 +80,11 @@ export declare type useTreeDndkitConfigReturn = {
     overId: string;
     depth: number;
     dropIndicatorPosition: DropIndicatorPosition;
+    isDropValid: boolean;
     visibleItems: Item[];
 };
-export declare type useTreeDndkitConfigType = (args: useTreeDndkitConfigArgs) => useTreeDndkitConfigReturn;
-export declare type getKeyboardCoordinatesArgs = {
+export declare type UseTreeDndkitConfigType = <T = unknown>(args: UseTreeDndkitConfigArgs<T>) => UseTreeDndkitConfigReturn;
+export declare type GetKeyboardCoordinatesArgs = {
     items: Item[];
     active: Active;
     over: Over;

package/types/tree/useTreeActionHandlers.d.ts

@@ -1,2 +1,2 @@
-import type { useTreeActionHandlersReturn, useTreeActionHandlersArgs } from './types';
-export declare const useTreeActionHandlers: ({ handlePreviewDragStart, handlePreviewDragMove, handlePreviewDragOver, handlePreviewDragEnd, handlePreviewDragCancel, onReorder, flattenedItems, projected, dropIndicatorPosition, }: useTreeActionHandlersArgs) => useTreeActionHandlersReturn;
+import type { UseTreeActionHandlersReturn, UseTreeActionHandlersArgs } from './types';
+export declare const useTreeActionHandlers: ({ handlePreviewDragStart, handlePreviewDragMove, handlePreviewDragOver, handlePreviewDragEnd, handlePreviewDragCancel, onReorder, flattenedItems, projected, dropIndicatorPosition, isDropValid, }: UseTreeActionHandlersArgs) => UseTreeActionHandlersReturn;

package/types/tree/useTreeDndkitConfig.d.ts

@@ -1,2 +1,2 @@
-import type { useTreeDndkitConfigType } from './types';
-export declare const useTreeDndkitConfig: useTreeDndkitConfigType;
+import type { UseTreeDndkitConfigType } from './types';
+export declare const useTreeDndkitConfig: UseTreeDndkitConfigType;

package/types/tree/useTreePreviewHandlers.d.ts

@@ -1,2 +1,2 @@
-import type { useTreePreviewHandlersReturn, useTreePreviewHandlersArgs } from './types';
-export declare const useTreePreviewHandlers: ({ setOverId, setActiveId, setDropIndicatorPosition, }: useTreePreviewHandlersArgs) => useTreePreviewHandlersReturn;
+import type { UseTreePreviewHandlersReturn, UseTreePreviewHandlersArgs } from './types';
+export declare const useTreePreviewHandlers: ({ setOverId, setActiveId, setDropIndicatorPosition, }: UseTreePreviewHandlersArgs) => UseTreePreviewHandlersReturn;