@elliemae/ds-treeview 2.3.0-alpha.2 → 2.3.0-alpha.3

package/esm/utils/dnd-helpers.js

@@ -1,117 +0,0 @@
-import * as React from "react";
-import { getItemsParentNode, itemsShareSameParent } from "./tree-helpers";
-const keyCodes = {
-  lift: [32, 13],
-  drop: [32, 13],
-  cancel: [27],
-  up: [38, 37],
-  down: [40, 39]
-};
-const sameParentAsHoverItemDrop = ({
-  isBefore,
-  isAfter,
-  draggedItem,
-  overItem,
-  movementDirection
-}) => {
-  const hoveredItemNodeNestedIndex = overItem.node.getIndex();
-  let newParentNode = getItemsParentNode([overItem], true);
-  const { treeDepth: draggedItemTreeDepth } = draggedItem;
-  const { treeDepth: overItemTreeDepth } = overItem;
-  const directionOffset = draggedItemTreeDepth <= overItemTreeDepth && movementDirection === "topToBottom" ? -1 : 0;
-  let newNestedIndex;
-  if (isBefore)
-    newNestedIndex = hoveredItemNodeNestedIndex + directionOffset;
-  else if (isAfter)
-    newNestedIndex = hoveredItemNodeNestedIndex + 1 + directionOffset;
-  else {
-    newNestedIndex = overItem.children.length;
-    newParentNode = overItem.node;
-  }
-  if (newNestedIndex < 0)
-    newNestedIndex = 0;
-  return {
-    newNestedIndex,
-    newParentNode
-  };
-};
-const inferHoverItemKinshipDrop = ({
-  isBefore,
-  isAfter,
-  draggedItem,
-  overItem,
-  movementDirection
-}) => {
-  const hoverItemModel = overItem.node.model;
-  const isGroupAndIsExpanded = hoverItemModel.isExpanded && hoverItemModel.children.length > 0;
-  if (isAfter && isGroupAndIsExpanded) {
-    return {
-      newNestedIndex: 0,
-      newParentNode: overItem.node
-    };
-  }
-  if (isBefore || isAfter && !isGroupAndIsExpanded) {
-    return sameParentAsHoverItemDrop({
-      isBefore,
-      isAfter,
-      draggedItem,
-      overItem,
-      movementDirection
-    });
-  }
-  return {
-    newNestedIndex: overItem.children.length,
-    newParentNode: overItem.node
-  };
-};
-const isDropValid = ({
-  isBefore,
-  isAfter,
-  draggedItem,
-  overItem,
-  restrictDragAndDrop
-}) => {
-  const { id: movedId } = draggedItem;
-  const { id: hoverId } = overItem;
-  const isInside = !isBefore && !isAfter;
-  if (movedId === hoverId)
-    return false;
-  if (isInside && !overItem.isGroup) {
-    return false;
-  }
-  if (restrictDragAndDrop) {
-    if (isInside)
-      return false;
-    const sameParent = itemsShareSameParent([draggedItem, overItem]);
-    if (overItem.node.model.isExpanded && isAfter)
-      return false;
-    if (!sameParent)
-      return false;
-  }
-  return true;
-};
-const inferKeyboardKinshipDrop = ({
-  items,
-  newIndex
-}) => {
-  const kinship = {};
-  const itemBefore = items[newIndex];
-  const itemBeforeModel = itemBefore.node.model;
-  const isGroupAndIsExpanded = itemBeforeModel.isExpanded && itemBeforeModel.children.length > 0;
-  if (isGroupAndIsExpanded) {
-    kinship.newParentNode = itemBefore.node;
-    kinship.newNestedIndex = 0;
-  } else {
-    kinship.newParentNode = getItemsParentNode([itemBefore], true);
-    kinship.newNestedIndex = itemBefore.node.getIndex();
-  }
-  return kinship;
-};
-export {
-  inferHoverItemKinshipDrop,
-  inferKeyboardKinshipDrop,
-  isDropValid,
-  keyCodes,
-  sameParentAsHoverItemDrop
-};
-//# sourceMappingURL=dnd-helpers.js.map

package/esm/utils/dnd-helpers.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/dnd-helpers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { getItemsParentNode, itemsShareSameParent } from './tree-helpers';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nimport type { DSTreeviewInternalsT } from '../sharedTypes';\n\ninterface MetaInfoT {\n  isBefore: boolean;\n  isAfter: boolean;\n  draggedItem: DSTreeviewT.Item;\n  overItem: DSTreeviewT.Item;\n}\ninterface KinshipT {\n  newParentNode: DSTreeviewT.Item['node'];\n  newNestedIndex: number;\n}\n\nexport const keyCodes = {\n  lift: [32, 13],\n  drop: [32, 13],\n  cancel: [27],\n  up: [38, 37],\n  down: [40, 39],\n};\n\nexport const sameParentAsHoverItemDrop = ({\n  isBefore,\n  isAfter,\n\n  draggedItem,\n  overItem,\n  movementDirection,\n}: MetaInfoT & { movementDirection: DSTreeviewInternalsT.DnDMovementDirectionT }) => {\n  const hoveredItemNodeNestedIndex = overItem.node.getIndex();\n  let newParentNode = getItemsParentNode([overItem], true);\n\n  const { treeDepth: draggedItemTreeDepth } = draggedItem;\n  const { treeDepth: overItemTreeDepth } = overItem;\n  const directionOffset =\n    // we don't apply the offset for direction\n    //  if moving from less nested to more nested\n    //  or moving bottom to top\n    // the offset is required when moving elemnts down in their nest level\n    (draggedItemTreeDepth as number) <= (overItemTreeDepth as number) && movementDirection === 'topToBottom' ? -1 : 0;\n  let newNestedIndex;\n\n  if (isBefore) newNestedIndex = hoveredItemNodeNestedIndex + directionOffset;\n  else if (isAfter) newNestedIndex = hoveredItemNodeNestedIndex + 1 + directionOffset;\n  else {\n    newNestedIndex = overItem.children.length; // append as last child of the group\n    newParentNode = overItem.node;\n  }\n  if (newNestedIndex < 0) newNestedIndex = 0;\n  return {\n    newNestedIndex,\n    newParentNode,\n  };\n};\n\nexport const inferHoverItemKinshipDrop = ({\n  isBefore,\n  isAfter,\n\n  draggedItem,\n  overItem,\n  movementDirection,\n}: MetaInfoT & { movementDirection: DSTreeviewInternalsT.DnDMovementDirectionT }) => {\n  const hoverItemModel = overItem.node.model;\n  const isGroupAndIsExpanded = hoverItemModel.isExpanded && hoverItemModel.children.length > 0;\n\n  if (isAfter && isGroupAndIsExpanded) {\n    return {\n      newNestedIndex: 0, // append after the group, so basically as first child\n      newParentNode: overItem.node,\n    };\n  }\n\n  if (isBefore || (isAfter && !isGroupAndIsExpanded)) {\n    return sameParentAsHoverItemDrop({\n      isBefore,\n      isAfter,\n      draggedItem,\n      overItem,\n      movementDirection,\n    });\n  }\n\n  // drop inside\n  return {\n    newNestedIndex: overItem.children.length, // append as last child of the group\n    newParentNode: overItem.node,\n  };\n};\n\nexport const isDropValid = ({\n  isBefore,\n  isAfter,\n\n  draggedItem,\n  overItem,\n\n  restrictDragAndDrop,\n}: MetaInfoT & { restrictDragAndDrop: boolean }) => {\n  const { id: movedId } = draggedItem;\n  const { id: hoverId } = overItem;\n  const isInside = !isBefore && !isAfter;\n\n  if (movedId === hoverId) return false;\n\n  if (isInside && !overItem.isGroup) {\n    return false; // we can't drop inside an item that isn't a group\n  }\n\n  if (restrictDragAndDrop) {\n    if (isInside) return false; // in this mode we can't drop inside another element\n    const sameParent = itemsShareSameParent([draggedItem, overItem]);\n    if (overItem.node.model.isExpanded && isAfter) return false;\n    if (!sameParent) return false;\n  }\n\n  return true;\n};\n\nexport const inferKeyboardKinshipDrop = ({\n  items,\n\n  newIndex,\n}: {\n  items: DSTreeviewT.Item[];\n  newIndex: number;\n}) => {\n  const kinship: Partial<KinshipT> = {};\n\n  const itemBefore = items[newIndex];\n\n  const itemBeforeModel = itemBefore.node.model;\n  const isGroupAndIsExpanded = itemBeforeModel.isExpanded && itemBeforeModel.children.length > 0;\n\n  if (isGroupAndIsExpanded) {\n    kinship.newParentNode = itemBefore.node;\n    kinship.newNestedIndex = 0;\n  } else {\n    kinship.newParentNode = getItemsParentNode([itemBefore], true);\n    kinship.newNestedIndex = itemBefore.node.getIndex();\n  }\n\n  return kinship;\n};\n"],
-  "mappings": "AAAA;ACCA;AAeO,MAAM,WAAW;AAAA,EACtB,MAAM,CAAC,IAAI;AAAA,EACX,MAAM,CAAC,IAAI;AAAA,EACX,QAAQ,CAAC;AAAA,EACT,IAAI,CAAC,IAAI;AAAA,EACT,MAAM,CAAC,IAAI;AAAA;AAGN,MAAM,4BAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,MACmF;AACnF,QAAM,6BAA6B,SAAS,KAAK;AACjD,MAAI,gBAAgB,mBAAmB,CAAC,WAAW;AAEnD,QAAM,EAAE,WAAW,yBAAyB;AAC5C,QAAM,EAAE,WAAW,sBAAsB;AACzC,QAAM,kBAKH,wBAAoC,qBAAgC,sBAAsB,gBAAgB,KAAK;AAClH,MAAI;AAEJ,MAAI;AAAU,qBAAiB,6BAA6B;AAAA,WACnD;AAAS,qBAAiB,6BAA6B,IAAI;AAAA,OAC/D;AACH,qBAAiB,SAAS,SAAS;AACnC,oBAAgB,SAAS;AAAA;AAE3B,MAAI,iBAAiB;AAAG,qBAAiB;AACzC,SAAO;AAAA,IACL;AAAA,IACA;AAAA;AAAA;AAIG,MAAM,4BAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,MACmF;AACnF,QAAM,iBAAiB,SAAS,KAAK;AACrC,QAAM,uBAAuB,eAAe,cAAc,eAAe,SAAS,SAAS;AAE3F,MAAI,WAAW,sBAAsB;AACnC,WAAO;AAAA,MACL,gBAAgB;AAAA,MAChB,eAAe,SAAS;AAAA;AAAA;AAI5B,MAAI,YAAa,WAAW,CAAC,sBAAuB;AAClD,WAAO,0BAA0B;AAAA,MAC/B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAKJ,SAAO;AAAA,IACL,gBAAgB,SAAS,SAAS;AAAA,IAClC,eAAe,SAAS;AAAA;AAAA;AAIrB,MAAM,cAAc,CAAC;AAAA,EAC1B;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EAEA;AAAA,MACkD;AAClD,QAAM,EAAE,IAAI,YAAY;AACxB,QAAM,EAAE,IAAI,YAAY;AACxB,QAAM,WAAW,CAAC,YAAY,CAAC;AAE/B,MAAI,YAAY;AAAS,WAAO;AAEhC,MAAI,YAAY,CAAC,SAAS,SAAS;AACjC,WAAO;AAAA;AAGT,MAAI,qBAAqB;AACvB,QAAI;AAAU,aAAO;AACrB,UAAM,aAAa,qBAAqB,CAAC,aAAa;AACtD,QAAI,SAAS,KAAK,MAAM,cAAc;AAAS,aAAO;AACtD,QAAI,CAAC;AAAY,aAAO;AAAA;AAG1B,SAAO;AAAA;AAGF,MAAM,2BAA2B,CAAC;AAAA,EACvC;AAAA,EAEA;AAAA,MAII;AACJ,QAAM,UAA6B;AAEnC,QAAM,aAAa,MAAM;AAEzB,QAAM,kBAAkB,WAAW,KAAK;AACxC,QAAM,uBAAuB,gBAAgB,cAAc,gBAAgB,SAAS,SAAS;AAE7F,MAAI,sBAAsB;AACxB,YAAQ,gBAAgB,WAAW;AACnC,YAAQ,iBAAiB;AAAA,SACpB;AACL,YAAQ,gBAAgB,mBAAmB,CAAC,aAAa;AACzD,YAAQ,iBAAiB,WAAW,KAAK;AAAA;AAG3C,SAAO;AAAA;",
-  "names": []
-}

package/esm/utils/useDnDHelpers.js

@@ -1,170 +0,0 @@
-import * as React from "react";
-import { useContext, useCallback } from "react";
-import { cloneDeep } from "lodash";
-import TreeViewContext, { defaultRelativeMouseCoord } from "../TreeViewContext";
-import { getNodeById, focusItem } from "./tree-helpers";
-import { inferHoverItemKinshipDrop, inferKeyboardKinshipDrop, isDropValid } from "./dnd-helpers";
-const useDnDHelpers = () => {
-  const ctx = useContext(TreeViewContext);
-  const {
-    props: { data, onOrderChange, restrictDragAndDrop },
-    relativeMouseCord,
-    setRelativeMouseCord,
-    visibleItems,
-    isDragging,
-    setIsDragging,
-    isKeyboardDragging,
-    setIsKeyboardDragging,
-    setDraggedItem,
-    setFocusedItem,
-    triggerTreeRerender,
-    tree,
-    treeRoot,
-    draggedItem
-  } = ctx;
-  const onSortEnd = useCallback(({ oldIndex, newIndex, isKeySorting }) => {
-    const { isBefore, isAfter, item: overItem, isValid } = relativeMouseCord;
-    if (draggedItem && tree && treeRoot && overItem) {
-      let newItems = cloneDeep(data);
-      if (oldIndex === newIndex || !isValid) {
-        setIsDragging(false);
-        setDraggedItem(null);
-        triggerTreeRerender();
-        return;
-      }
-      const movementDirection = newIndex > oldIndex ? "topToBottom" : "bottomToTop";
-      let newNestedIndex;
-      let newParentNode;
-      if (isKeySorting) {
-        const kinship = inferKeyboardKinshipDrop({
-          items: visibleItems,
-          newIndex
-        });
-        newNestedIndex = kinship.newNestedIndex;
-        newParentNode = kinship.newParentNode;
-      } else {
-        const kinship = inferHoverItemKinshipDrop({
-          isBefore,
-          isAfter,
-          overItem,
-          movementDirection,
-          draggedItem
-        });
-        newNestedIndex = kinship.newNestedIndex;
-        newParentNode = kinship.newParentNode;
-      }
-      const newMovedItemNode = tree.parse(draggedItem.node.model);
-      getNodeById(treeRoot, draggedItem.id).drop();
-      if (newParentNode && typeof newNestedIndex === "number") {
-        newParentNode.addChildAtIndex(newMovedItemNode, newNestedIndex);
-        if (newParentNode.isRoot()) {
-          newItems = [...newParentNode.model.children];
-        } else {
-          newItems = [...treeRoot.model.children];
-        }
-      }
-      onOrderChange(newItems, data, draggedItem);
-      setIsDragging(false);
-      setDraggedItem(null);
-      triggerTreeRerender();
-    }
-  }, [
-    data,
-    draggedItem,
-    relativeMouseCord,
-    visibleItems,
-    tree,
-    treeRoot,
-    onOrderChange,
-    triggerTreeRerender,
-    setIsDragging,
-    setDraggedItem
-  ]);
-  const onSortStart = useCallback(() => {
-  }, []);
-  const updateBeforeSortStart = useCallback((beforeStartArgs) => new Promise((resolve) => {
-    const { index, isKeySorting } = beforeStartArgs;
-    const item = visibleItems[index];
-    const { isExpanded } = item.node.model;
-    if (isExpanded) {
-      item.node.model.isExpanded = false;
-      triggerTreeRerender();
-    }
-    setRelativeMouseCord(defaultRelativeMouseCoord);
-    setIsKeyboardDragging(isKeySorting);
-    setIsDragging(true);
-    setDraggedItem(item);
-    focusItem(null);
-    setFocusedItem(null);
-    if (document.activeElement && typeof document.activeElement.blur === "function")
-      document.activeElement.blur();
-    resolve(true);
-  }), [
-    visibleItems,
-    setRelativeMouseCord,
-    setIsKeyboardDragging,
-    setIsDragging,
-    setDraggedItem,
-    setFocusedItem,
-    triggerTreeRerender
-  ]);
-  const onMouseDragOverItem = useCallback(({
-    event,
-    item,
-    itemIndex,
-    setIsDraggingOverThis,
-    openFolderOnHoverTimeout
-  }) => {
-    const { node } = item;
-    const { nodeItemRef } = node.model;
-    if (isDragging && !isKeyboardDragging && draggedItem) {
-      const rect = nodeItemRef?.current?.getBoundingClientRect();
-      if (rect) {
-        const x = event.clientX - rect.left;
-        const y = event.clientY - rect.top;
-        const { height: elementHeight } = rect;
-        const dropBeforeMaxY = elementHeight * 0.25;
-        const dropAfterMinY = elementHeight - elementHeight * 0.25;
-        const isBefore = y < dropBeforeMaxY;
-        const isAfter = y > dropAfterMinY;
-        const isValid = isDropValid({
-          isBefore,
-          isAfter,
-          draggedItem,
-          overItem: item,
-          restrictDragAndDrop
-        });
-        setRelativeMouseCord({
-          isBefore,
-          isAfter,
-          isValid,
-          item,
-          x,
-          y,
-          relativeElementDOMRect: rect,
-          relativeElementIndex: itemIndex
-        });
-        setIsDraggingOverThis(true);
-        if (!openFolderOnHoverTimeout?.current && draggedItem?.id !== item?.id && (item.isGroup || item.children.length > 0) && !restrictDragAndDrop) {
-          openFolderOnHoverTimeout.current = setTimeout(() => {
-            item.node.model.isExpanded = true;
-            openFolderOnHoverTimeout.current = null;
-            triggerTreeRerender();
-          }, 1e3);
-        }
-      }
-    } else {
-      setRelativeMouseCord(defaultRelativeMouseCoord);
-    }
-  }, [isDragging, isKeyboardDragging, draggedItem, restrictDragAndDrop, setRelativeMouseCord, triggerTreeRerender]);
-  return {
-    updateBeforeSortStart,
-    onSortStart,
-    onSortEnd,
-    onMouseDragOverItem
-  };
-};
-export {
-  useDnDHelpers
-};
-//# sourceMappingURL=useDnDHelpers.js.map

package/esm/utils/useDnDHelpers.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/useDnDHelpers.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-depth */\n/* eslint-disable no-lonely-if */\n/* eslint-disable max-lines */\n/* eslint-disable complexity */\n/* eslint-disable max-statements */\nimport React, { useContext, useCallback } from 'react';\nimport { cloneDeep } from 'lodash';\n\nimport TreeViewContext, { defaultRelativeMouseCoord } from '../TreeViewContext';\nimport { getNodeById, focusItem } from './tree-helpers';\nimport { inferHoverItemKinshipDrop, inferKeyboardKinshipDrop, isDropValid } from './dnd-helpers';\nimport type { DSTreeviewT } from '../react-desc-prop-types';\nimport type { DSTreeviewInternalsT } from '../sharedTypes';\n\nexport const useDnDHelpers = () => {\n  const ctx = useContext(TreeViewContext);\n\n  const {\n    props: { data, onOrderChange, restrictDragAndDrop },\n    relativeMouseCord,\n    setRelativeMouseCord,\n    visibleItems,\n    isDragging,\n    setIsDragging,\n    isKeyboardDragging,\n    setIsKeyboardDragging,\n    setDraggedItem,\n    setFocusedItem,\n    triggerTreeRerender,\n    tree,\n    treeRoot,\n    draggedItem,\n  } = ctx;\n\n  const onSortEnd = useCallback(\n    ({ oldIndex, newIndex, isKeySorting }: { oldIndex: number; newIndex: number; isKeySorting: boolean }) => {\n      const { isBefore, isAfter, item: overItem, isValid } = relativeMouseCord;\n      if (draggedItem && tree && treeRoot && overItem) {\n        let newItems = cloneDeep(data);\n        // if dropping in same position do nothing\n        // if the drop is not allowed do nothing\n        if (oldIndex === newIndex || !isValid) {\n          // onOrderChange(newItems, data);\n          setIsDragging(false);\n          setDraggedItem(null);\n          triggerTreeRerender();\n          return;\n        }\n\n        // if we are moving from topToBottom the offset changes\n        const movementDirection = newIndex > oldIndex ? ('topToBottom' as const) : ('bottomToTop' as const);\n\n        let newNestedIndex;\n        let newParentNode;\n        if (isKeySorting) {\n          const kinship = inferKeyboardKinshipDrop({\n            items: visibleItems,\n\n            newIndex,\n          });\n          newNestedIndex = kinship.newNestedIndex;\n          newParentNode = kinship.newParentNode;\n        } else {\n          const kinship = inferHoverItemKinshipDrop({\n            isBefore,\n            isAfter,\n            overItem,\n            movementDirection,\n            draggedItem,\n          });\n          newNestedIndex = kinship.newNestedIndex;\n          newParentNode = kinship.newParentNode;\n        }\n\n        const newMovedItemNode = tree.parse(draggedItem.node.model);\n        getNodeById(treeRoot, draggedItem.id).drop();\n        if (newParentNode && typeof newNestedIndex === 'number') {\n          newParentNode.addChildAtIndex(newMovedItemNode, newNestedIndex);\n\n          if (newParentNode.isRoot()) {\n            newItems = [...newParentNode.model.children];\n          } else {\n            newItems = [...treeRoot.model.children];\n          }\n        }\n\n        onOrderChange(newItems, data, draggedItem);\n        setIsDragging(false);\n        setDraggedItem(null);\n        triggerTreeRerender();\n      }\n    },\n    [\n      data,\n      draggedItem,\n      relativeMouseCord,\n      visibleItems,\n      tree,\n      treeRoot,\n      onOrderChange,\n      triggerTreeRerender,\n      setIsDragging,\n      setDraggedItem,\n    ],\n  );\n\n  const onSortStart = useCallback(\n    () => {},\n    // ({ node, index, collection, isKeySorting }, event) => {\n    // console.log('node :>> ', node);\n    // console.log('isKeySorting :>> ', isKeySorting);\n    // console.log('event :>> ', event);\n    // const item = collection?.[index] || visibleItems[index];\n    // setIsDragging(true);\n    // setDraggedItem(item);\n    // },\n    [],\n  );\n\n  const updateBeforeSortStart = useCallback(\n    (beforeStartArgs: { index: number; isKeySorting: boolean }) =>\n      new Promise((resolve) => {\n        const { index, isKeySorting } = beforeStartArgs;\n\n        const item = visibleItems[index];\n        const { isExpanded } = item.node.model;\n\n        if (isExpanded) {\n          item.node.model.isExpanded = false;\n          triggerTreeRerender();\n        }\n        setRelativeMouseCord(defaultRelativeMouseCoord);\n        setIsKeyboardDragging(isKeySorting);\n        setIsDragging(true);\n        setDraggedItem(item);\n        focusItem(null);\n        setFocusedItem(null);\n        if (document.activeElement && typeof (document.activeElement as HTMLElement).blur === 'function')\n          (document.activeElement as HTMLElement).blur();\n        resolve(true);\n      }),\n    [\n      visibleItems,\n      setRelativeMouseCord,\n      setIsKeyboardDragging,\n      setIsDragging,\n      setDraggedItem,\n      setFocusedItem,\n      triggerTreeRerender,\n    ],\n  );\n\n  // tracks mouse coords relative to an element to check if the drop happens\n  // at the top/center/bottom of an element to choose where to move the element\n  // requested in the specs\n  const onMouseDragOverItem = useCallback(\n    ({\n      event,\n      item,\n      itemIndex,\n      setIsDraggingOverThis,\n      openFolderOnHoverTimeout,\n    }: {\n      event: React.MouseEvent<HTMLLIElement>;\n      item: DSTreeviewT.Item;\n      itemIndex: number;\n      setIsDraggingOverThis: DSTreeviewInternalsT.StateSetter<boolean>;\n      openFolderOnHoverTimeout: React.MutableRefObject<NodeJS.Timeout | null>;\n    }) => {\n      const { node } = item;\n      const { nodeItemRef } = node.model;\n      if (isDragging && !isKeyboardDragging && draggedItem) {\n        const rect = nodeItemRef?.current?.getBoundingClientRect();\n        if (rect) {\n          const x = event.clientX - rect.left; // x position within the element.\n          const y = event.clientY - rect.top; // y position within the element.\n\n          // by spec we need to track where the drop will happens\n          // if drop happens on top 25% drop before\n          // if drop happens on bottom of 25% drop after\n          // if drop happens in the middle 50% either invalid or drop into children\n          const { height: elementHeight } = rect;\n          const dropBeforeMaxY = elementHeight * 0.25;\n          const dropAfterMinY = elementHeight - elementHeight * 0.25;\n          const isBefore = y < dropBeforeMaxY;\n          const isAfter = y > dropAfterMinY;\n          const isValid = isDropValid({\n            isBefore,\n            isAfter,\n            draggedItem,\n            overItem: item,\n            restrictDragAndDrop,\n          });\n          setRelativeMouseCord({\n            isBefore,\n            isAfter,\n            isValid,\n            item,\n            x,\n            y,\n            relativeElementDOMRect: rect,\n            relativeElementIndex: itemIndex,\n          });\n          setIsDraggingOverThis(true);\n\n          if (\n            !openFolderOnHoverTimeout?.current && // only set the interval if it wasn't set already once\n            draggedItem?.id !== item?.id && // don't open ghost element\n            (item.isGroup || item.children.length > 0) && // only open groups\n            !restrictDragAndDrop\n          ) {\n            openFolderOnHoverTimeout.current = setTimeout(() => {\n              item.node.model.isExpanded = true;\n              openFolderOnHoverTimeout.current = null;\n              triggerTreeRerender();\n            }, 1000);\n          }\n        }\n      } else {\n        setRelativeMouseCord(defaultRelativeMouseCoord);\n      }\n    },\n    [isDragging, isKeyboardDragging, draggedItem, restrictDragAndDrop, setRelativeMouseCord, triggerTreeRerender],\n  );\n\n  return {\n    updateBeforeSortStart,\n    onSortStart,\n    onSortEnd,\n    onMouseDragOverItem,\n  };\n};\n"],
-  "mappings": "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",
-  "names": []
-}

package/types/utils/dnd-helpers.d.ts

@@ -1,39 +0,0 @@
-import type { DSTreeviewT } from '../react-desc-prop-types';
-import type { DSTreeviewInternalsT } from '../sharedTypes';
-interface MetaInfoT {
-    isBefore: boolean;
-    isAfter: boolean;
-    draggedItem: DSTreeviewT.Item;
-    overItem: DSTreeviewT.Item;
-}
-interface KinshipT {
-    newParentNode: DSTreeviewT.Item['node'];
-    newNestedIndex: number;
-}
-export declare const keyCodes: {
-    lift: number[];
-    drop: number[];
-    cancel: number[];
-    up: number[];
-    down: number[];
-};
-export declare const sameParentAsHoverItemDrop: ({ isBefore, isAfter, draggedItem, overItem, movementDirection, }: MetaInfoT & {
-    movementDirection: DSTreeviewInternalsT.DnDMovementDirectionT;
-}) => {
-    newNestedIndex: number;
-    newParentNode: import("tree-model/types").Node<DSTreeviewT.Item>;
-};
-export declare const inferHoverItemKinshipDrop: ({ isBefore, isAfter, draggedItem, overItem, movementDirection, }: MetaInfoT & {
-    movementDirection: DSTreeviewInternalsT.DnDMovementDirectionT;
-}) => {
-    newNestedIndex: number;
-    newParentNode: import("tree-model/types").Node<DSTreeviewT.Item>;
-};
-export declare const isDropValid: ({ isBefore, isAfter, draggedItem, overItem, restrictDragAndDrop, }: MetaInfoT & {
-    restrictDragAndDrop: boolean;
-}) => boolean;
-export declare const inferKeyboardKinshipDrop: ({ items, newIndex, }: {
-    items: DSTreeviewT.Item[];
-    newIndex: number;
-}) => Partial<KinshipT>;
-export {};

package/types/utils/useDnDHelpers.d.ts

@@ -1,26 +0,0 @@
-/// <reference types="node" />
-/// <reference types="mocha" />
-/// <reference types="webpack-env" />
-/// <reference types="styled-components" />
-import React from 'react';
-import type { DSTreeviewT } from '../react-desc-prop-types';
-import type { DSTreeviewInternalsT } from '../sharedTypes';
-export declare const useDnDHelpers: () => {
-    updateBeforeSortStart: (beforeStartArgs: {
-        index: number;
-        isKeySorting: boolean;
-    }) => Promise<unknown>;
-    onSortStart: () => void;
-    onSortEnd: ({ oldIndex, newIndex, isKeySorting }: {
-        oldIndex: number;
-        newIndex: number;
-        isKeySorting: boolean;
-    }) => void;
-    onMouseDragOverItem: ({ event, item, itemIndex, setIsDraggingOverThis, openFolderOnHoverTimeout, }: {
-        event: React.MouseEvent<HTMLLIElement>;
-        item: DSTreeviewT.Item;
-        itemIndex: number;
-        setIsDraggingOverThis: DSTreeviewInternalsT.StateSetter<boolean>;
-        openFolderOnHoverTimeout: React.MutableRefObject<NodeJS.Timeout | null>;
-    }) => void;
-};