@os-design/drag-sort 1.0.6 → 1.0.9

package/dist/cjs/utils/useDragEffect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useDragEffect.ts"],"names":["HIDDEN_NODE_STYLE","opacity","pointerEvents","createEmptyNode","prev","next","current","useDragEffect","props","draggedNode","cursorPosition","listStoreRef","onDragEnd","targetRef","targetNodeRef","onDragEndRef","initDraggedNodeRect","node","undefined","initDraggedNodeListScrollOffset","list","ref","position","x","y","initWidth","initHeight","targetList","getNodeStyle","moveNode","setTargetNode","nodeIndex","id","index","clearTargetNode","getDraggedNodePos","initX","initY","initScrollLeft","initScrollTop","scrollLeft","scrollTop","getDraggedNodePosRef","draggedNodeSetStyle","removeBlankNode","updateTargetNode","prevTargetNode","startNode","direction","destination","isAnotherList","tail","getTail","axis","horizontal","prevTargetNodeRef","draggedNodePos","isDraggingUp","head","getHead","prevTargetNodeRect","startRectProp","isMoveUp","throttledUpdateTargetNode","window","draggedNodeIndex","targetNode","nodeSetStyle","targetNodeIndex","targetNodeSetStyle","update","nodeProps","setStyle","addListener","removeListener","target","dragged"],"mappings":"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","sourcesContent":["import { Position } from '@os-design/use-drag';\nimport {\n  CSSProperties,\n  RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport useThrottle from '@os-design/use-throttle';\nimport useEvent from '@os-design/use-event';\nimport NodeList, { ExistingNode, Node, NodeProps } from './NodeList';\nimport ListStore from './ListStore';\nimport getElementScroll from './getElementScroll';\nimport useTargetList from './useTargetList';\nimport useInitRect from './useInitRect';\nimport useInitScrollOffset from './useInitScrollOffset';\nimport useGetNodeStyle from './useGetNodeStyle';\nimport useMoveNode from './useMoveNode';\nimport getNodeRect from './getNodeRect';\nimport useBlankNode from './useBlankNode';\n\nexport interface DraggedNode {\n  list: NodeList;\n  node: ExistingNode;\n  position: Position;\n}\n\ninterface TargetNode {\n  list: NodeList;\n  node: ExistingNode;\n}\n\nexport interface ItemLocation {\n  id: string;\n  index: number;\n}\n\nexport type DragEndHandler = (\n  dragged: ItemLocation,\n  target: ItemLocation\n) => void;\n\ninterface UseDragEffectProps {\n  draggedNode: DraggedNode | null;\n  cursorPosition: Position;\n  listStoreRef: RefObject<ListStore>;\n  onDragEnd: DragEndHandler;\n}\n\nconst HIDDEN_NODE_STYLE: CSSProperties = {\n  opacity: 0,\n  pointerEvents: 'none',\n};\n\nconst createEmptyNode = ({\n  prev = null,\n  next = null,\n}: {\n  prev?: Node;\n  next?: Node;\n}): ExistingNode => [prev, next, { current: null }, () => {}, -1];\n\n/* eslint-disable no-constant-condition */\n\nconst useDragEffect = (props: UseDragEffectProps) => {\n  const { draggedNode, cursorPosition, listStoreRef, onDragEnd } = props;\n\n  const targetRef = useRef<ItemLocation | null>(null);\n  const targetNodeRef = useRef<TargetNode | null>(draggedNode);\n\n  useEffect(() => {\n    targetNodeRef.current = draggedNode;\n  }, [draggedNode]);\n\n  const onDragEndRef = useRef(onDragEnd);\n  useEffect(() => {\n    onDragEndRef.current = onDragEnd;\n  }, [onDragEnd]);\n\n  // The initial bounds of the dragged node.\n  // We can't read the bounds of the dragged node on the fly because the node can be unmounted in the virtual list.\n  const initDraggedNodeRect = useInitRect(\n    draggedNode ? draggedNode.node[2] : undefined\n  );\n\n  // The initial scroll position of the list where the dragged node is located.\n  // Used to detect the actual position of the dragged node. The purpose is the same as with initDraggedNodeRect.\n  const initDraggedNodeListScrollOffset = useInitScrollOffset(\n    draggedNode ? draggedNode.list.ref : undefined\n  );\n\n  // The central position of the dragged node\n  const position = useMemo(() => {\n    if (!draggedNode || !initDraggedNodeRect) return null;\n    const { x, y } = cursorPosition;\n    const { initWidth, initHeight } = initDraggedNodeRect;\n    return {\n      x: x - draggedNode.position.x + initWidth / 2,\n      y: y - draggedNode.position.y + initHeight / 2,\n    };\n  }, [cursorPosition, draggedNode, initDraggedNodeRect]);\n\n  // The list in which the cursor is located\n  const targetList = useTargetList(position, listStoreRef);\n\n  // Returns the style for moving the node in the specified direction\n  const getNodeStyle = useGetNodeStyle(initDraggedNodeRect);\n\n  // Moves the node up or down\n  const moveNode = useMoveNode({ position, draggedNode, getNodeStyle });\n\n  const setTargetNode = useCallback((list: NodeList, node: ExistingNode) => {\n    const [, , , , nodeIndex] = node;\n    targetNodeRef.current = { list, node };\n    targetRef.current = { id: list.id, index: nodeIndex };\n  }, []);\n\n  const clearTargetNode = useCallback(() => {\n    targetNodeRef.current = null;\n    targetRef.current = null;\n  }, []);\n\n  // Returns the central position of the dragged node in the list\n  const getDraggedNodePos = useCallback(() => {\n    if (\n      !targetList ||\n      !targetList.ref.current ||\n      !initDraggedNodeRect ||\n      !initDraggedNodeListScrollOffset\n    ) {\n      return null;\n    }\n    const { initX, initY, initWidth, initHeight } = initDraggedNodeRect;\n    const { initScrollLeft, initScrollTop } = initDraggedNodeListScrollOffset;\n    const { scrollLeft, scrollTop } = getElementScroll(targetList.ref.current);\n    return {\n      x: initX + initWidth / 2 + initScrollLeft - scrollLeft,\n      y: initY + initHeight / 2 + initScrollTop - scrollTop,\n    };\n  }, [initDraggedNodeListScrollOffset, initDraggedNodeRect, targetList]);\n\n  const getDraggedNodePosRef = useRef(getDraggedNodePos);\n  useEffect(() => {\n    getDraggedNodePosRef.current = getDraggedNodePos;\n  }, [getDraggedNodePos]);\n\n  // Hide the dragged node\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    const [, , , draggedNodeSetStyle] = draggedNode.node;\n    draggedNodeSetStyle(HIDDEN_NODE_STYLE);\n    return () => draggedNodeSetStyle({});\n  }, [draggedNode]);\n\n  // Append the blank node to the list to increase the height of it.\n  // Used when the dragged node is located inside another list.\n  const removeBlankNode = useBlankNode({\n    draggedNode,\n    targetList,\n    initDraggedNodeRect,\n  });\n\n  const updateTargetNode = useCallback(() => {\n    if (!draggedNode) return;\n    const prevTargetNode = targetNodeRef.current; // The last updated node\n\n    // Dragging outside the origin list\n    if (\n      prevTargetNode &&\n      prevTargetNode.list === draggedNode.list &&\n      targetList !== draggedNode.list\n    ) {\n      moveNode({\n        list: prevTargetNode.list,\n        startNode: prevTargetNode.node,\n        direction: 'down',\n        destination: 'end',\n      });\n      clearTargetNode();\n    }\n\n    // Dragging outside another list\n    if (\n      prevTargetNode &&\n      prevTargetNode.list !== draggedNode.list &&\n      targetList !== prevTargetNode.list\n    ) {\n      moveNode({\n        list: prevTargetNode.list,\n        startNode: prevTargetNode.node,\n        direction: 'down',\n        destination: 'end',\n        isAnotherList: true,\n      });\n      removeBlankNode();\n      clearTargetNode();\n    }\n\n    // Dragging inside the origin list\n    if (!prevTargetNode && targetList === draggedNode.list) {\n      const tail = targetList.getTail();\n      if (!tail) return;\n      const node = moveNode({\n        list: targetList,\n        startNode: tail,\n        direction: 'up',\n        destination: 'cursor',\n      });\n      setTargetNode(targetList, node);\n      return;\n    }\n\n    // Dragging inside another list\n    if (\n      targetList &&\n      targetList !== draggedNode.list &&\n      (!prevTargetNode || prevTargetNode.list !== targetList)\n    ) {\n      const tail = targetList.getTail();\n      if (!tail) return;\n      const node = moveNode({\n        list: targetList,\n        startNode: tail,\n        direction: 'up',\n        destination: 'cursor',\n        isAnotherList: true,\n      });\n      setTargetNode(targetList, node);\n      return;\n    }\n\n    // Dragging in the origin list\n    if (\n      prevTargetNode &&\n      prevTargetNode.list === draggedNode.list &&\n      targetList === draggedNode.list\n    ) {\n      const axis = targetList.horizontal ? 'x' : 'y';\n      const [, , prevTargetNodeRef, ,] = prevTargetNode.node;\n      if (!prevTargetNodeRef.current) {\n        // The target node was unmounted. It happens when the virtual list is used.\n        // If the cursor is above the dragged node, we need to move the nodes down from the tail to the node where\n        // the cursor is located. Otherwise, we need to move the nodes up from the head to the node where the cursor\n        // is located.\n        const draggedNodePos = getDraggedNodePosRef.current();\n        if (!position || !draggedNodePos) return;\n        const isDraggingUp = position[axis] < draggedNodePos[axis];\n        if (isDraggingUp) {\n          const tail = targetList.getTail();\n          if (!tail || !tail[2].current) return;\n          const node = moveNode({\n            list: targetList,\n            startNode: createEmptyNode({ prev: tail }),\n            direction: 'up',\n            destination: 'cursor',\n          });\n          setTargetNode(targetList, node);\n        } else {\n          const head = targetList.getHead();\n          if (!head || !head[2].current) return;\n          const node = moveNode({\n            list: targetList,\n            startNode: createEmptyNode({ next: head }),\n            direction: 'down',\n            destination: 'cursor',\n          });\n          setTargetNode(targetList, node);\n        }\n        return;\n      }\n      const prevTargetNodeRect = getNodeRect(prevTargetNode.node[2]);\n      const startRectProp = targetList.horizontal ? 'left' : 'top';\n      if (!position || !prevTargetNodeRect) return;\n      const isMoveUp = position[axis] < prevTargetNodeRect[startRectProp];\n      const node = isMoveUp\n        ? moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'up',\n            destination: 'cursor',\n          })\n        : moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'down',\n            destination: 'cursor',\n          });\n      setTargetNode(targetList, node);\n      return;\n    }\n\n    // Dragging in another list\n    if (\n      targetList &&\n      targetList !== draggedNode.list &&\n      prevTargetNode &&\n      prevTargetNode.list === targetList\n    ) {\n      const axis = targetList.horizontal ? 'x' : 'y';\n      const prevTargetNodeRect = getNodeRect(prevTargetNode.node[2]);\n      const startRectProp = targetList.horizontal ? 'left' : 'top';\n      if (!position || !prevTargetNodeRect) return;\n      const isMoveUp = position[axis] < prevTargetNodeRect[startRectProp];\n      const node = isMoveUp\n        ? moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'up',\n            destination: 'cursor',\n            isAnotherList: true,\n          })\n        : moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'down',\n            destination: 'cursor',\n            isAnotherList: true,\n          });\n      setTargetNode(targetList, node);\n    }\n  }, [\n    draggedNode,\n    targetList,\n    moveNode,\n    clearTargetNode,\n    removeBlankNode,\n    setTargetNode,\n    position,\n  ]);\n\n  // Update the target node if either the position or the target list has been changed\n  useEffect(() => {\n    updateTargetNode();\n  }, [updateTargetNode]);\n\n  // Update the target node if the target list has been scrolled\n  const [throttledUpdateTargetNode] = useThrottle(updateTargetNode, 100);\n  useEvent(\n    (targetList ? targetList.ref : undefined) as unknown as EventTarget,\n    'scroll',\n    throttledUpdateTargetNode\n  );\n  useEvent(window, 'scroll', throttledUpdateTargetNode);\n\n  // Reset styles of the affected nodes when the dragged node was dropped\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    const [, , , , draggedNodeIndex] = draggedNode.node;\n    return () => {\n      const targetNode = targetNodeRef.current;\n\n      // If the dragged node was outside the origin list, reset the styles for the nodes,\n      // starting at the tail and ending with the dragged node in the origin list.\n      if (!targetNode || targetNode.list !== draggedNode.list) {\n        const tail = draggedNode.list.getTail();\n        if (tail) {\n          let node = tail;\n          while (true) {\n            const [prev, , , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!prev || nodeIndex <= draggedNodeIndex) break;\n            node = prev;\n          }\n        }\n      }\n\n      // If the dragged node was inside another list, reset the styles for the nodes,\n      // starting at the tail and ending with the dragged node in the target list.\n      if (targetNode && targetNode.list !== draggedNode.list) {\n        const tail = targetNode.list.getTail();\n        const [, , , , targetNodeIndex] = targetNode.node;\n        if (tail) {\n          let node = tail;\n          while (true) {\n            const [prev, , , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!prev || nodeIndex <= targetNodeIndex) break;\n            node = prev;\n          }\n        }\n      }\n\n      // If the dragged node was moved inside the origin list, reset the styles for the nodes,\n      // starting with target node and ending with the dragged node.\n      if (targetNode && targetNode.list === draggedNode.list) {\n        const [, , , targetNodeSetStyle, targetNodeIndex] = targetNode.node;\n        if (targetNodeIndex > draggedNodeIndex) {\n          let { node } = targetNode;\n          while (true) {\n            const [prev, , , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!prev || nodeIndex <= draggedNodeIndex) break;\n            node = prev;\n          }\n        } else if (targetNodeIndex < draggedNodeIndex) {\n          let { node } = targetNode;\n          while (true) {\n            const [, next, , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!next || nodeIndex >= draggedNodeIndex) break;\n            node = next;\n          }\n        } else if (targetNodeIndex === draggedNodeIndex) {\n          targetNodeSetStyle({});\n        }\n      }\n    };\n  }, [draggedNode]);\n\n  // Update the position of the newly mounted nodes in the origin list (used in the virtual list)\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    const [, , , , draggedNodeIndex] = draggedNode.node;\n\n    const update = (nodeProps: NodeProps) => {\n      const { setStyle, index } = nodeProps;\n      const targetNode = targetNodeRef.current;\n\n      // Set the hidden style, if the mounted node is the dragged node\n      if (index === draggedNodeIndex) {\n        setStyle(HIDDEN_NODE_STYLE);\n        return;\n      }\n\n      // If the dragged node is inside the origin list\n      if (targetNode && targetNode.list === draggedNode.list) {\n        // Move the mounted node up/down, if it is located between the dragged and target node\n        const [, , , , targetNodeIndex] = targetNode.node;\n        if (index > draggedNodeIndex && index < targetNodeIndex) {\n          setStyle(getNodeStyle('up', targetNode.list.horizontal));\n        } else if (index < draggedNodeIndex && index > targetNodeIndex) {\n          setStyle(getNodeStyle('down', targetNode.list.horizontal));\n        }\n      } else if (index > draggedNodeIndex) {\n        // Otherwise, move the mounted node up, if it is located below the dragged node\n        setStyle(getNodeStyle('up', draggedNode.list.horizontal));\n      }\n    };\n\n    draggedNode.list.addListener(update);\n    return () => draggedNode.list.removeListener(update);\n  }, [draggedNode, getNodeStyle]);\n\n  // Update the position of the newly mounted nodes in the target list (used in the virtual list)\n  useEffect(() => {\n    if (!draggedNode || !targetList || targetList === draggedNode.list) {\n      return () => {};\n    }\n\n    const update = (nodeProps: NodeProps) => {\n      const { setStyle, index } = nodeProps;\n      const targetNode = targetNodeRef.current;\n      if (!targetNode) return;\n      const [, , , , targetNodeIndex] = targetNode.node;\n      if (index >= targetNodeIndex) {\n        // Move the mounted node down, if it is located below the target node or if it is the target node\n        setStyle(getNodeStyle('down', targetList.horizontal));\n      }\n    };\n\n    targetList.addListener(update);\n    return () => targetList.removeListener(update);\n  }, [draggedNode, getNodeStyle, targetList]);\n\n  // Call the onDragEnd callback if the draggedNode was changed to null\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    return () => {\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      const target = targetRef.current;\n      if (!target) return;\n      const [, , , , draggedNodeIndex] = draggedNode.node;\n      const dragged = { id: draggedNode.list.id, index: draggedNodeIndex };\n      if (dragged.id === target.id && dragged.index === target.index) return;\n      onDragEndRef.current(dragged, target);\n    };\n  }, [draggedNode]);\n};\n\nexport default useDragEffect;\n"],"file":"useDragEffect.js"}
+{"version":3,"file":"useDragEffect.js","names":["HIDDEN_NODE_STYLE","opacity","pointerEvents","createEmptyNode","prev","next","current","useDragEffect","props","draggedNode","cursorPosition","listStoreRef","onDragEnd","targetRef","useRef","targetNodeRef","useEffect","onDragEndRef","initDraggedNodeRect","useInitRect","node","undefined","initDraggedNodeListScrollOffset","useInitScrollOffset","list","ref","position","useMemo","x","y","initWidth","initHeight","targetList","useTargetList","getNodeStyle","useGetNodeStyle","moveNode","useMoveNode","setTargetNode","useCallback","nodeIndex","nodeId","listId","id","index","clearTargetNode","getDraggedNodePos","initX","initY","initScrollLeft","initScrollTop","getElementScroll","scrollLeft","scrollTop","getDraggedNodePosRef","draggedNodeSetStyle","removeBlankNode","useBlankNode","updateTargetNode","prevTargetNode","startNode","direction","destination","isAnotherList","tail","getTail","axis","horizontal","prevTargetNodeRef","draggedNodePos","isDraggingUp","head","getHead","prevTargetNodeRect","getNodeRect","startRectProp","isMoveUp","useThrottle","throttledUpdateTargetNode","useEvent","window","draggedNodeIndex","targetNode","nodeSetStyle","targetNodeIndex","targetNodeSetStyle","update","nodeProps","setStyle","addListener","removeListener","target","draggedNodeId","dragged"],"sources":["../../../src/utils/useDragEffect.ts"],"sourcesContent":["import { Position } from '@os-design/use-drag';\nimport {\n  CSSProperties,\n  RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport useThrottle from '@os-design/use-throttle';\nimport useEvent from '@os-design/use-event';\nimport NodeList, { ExistingNode, Node, NodeProps } from './NodeList';\nimport ListStore from './ListStore';\nimport getElementScroll from './getElementScroll';\nimport useTargetList from './useTargetList';\nimport useInitRect from './useInitRect';\nimport useInitScrollOffset from './useInitScrollOffset';\nimport useGetNodeStyle from './useGetNodeStyle';\nimport useMoveNode from './useMoveNode';\nimport getNodeRect from './getNodeRect';\nimport useBlankNode from './useBlankNode';\n\nexport interface DraggedNode {\n  list: NodeList;\n  node: ExistingNode;\n  position: Position;\n}\n\ninterface TargetNode {\n  list: NodeList;\n  node: ExistingNode;\n}\n\nexport interface ItemLocation {\n  listId: string;\n  index: number;\n  id: string;\n}\n\nexport type DragEndHandler = (\n  dragged: ItemLocation,\n  target: ItemLocation\n) => void;\n\ninterface UseDragEffectProps {\n  draggedNode: DraggedNode | null;\n  cursorPosition: Position;\n  listStoreRef: RefObject<ListStore>;\n  onDragEnd: DragEndHandler;\n}\n\nconst HIDDEN_NODE_STYLE: CSSProperties = {\n  opacity: 0,\n  pointerEvents: 'none',\n};\n\nconst createEmptyNode = ({\n  prev = null,\n  next = null,\n}: {\n  prev?: Node;\n  next?: Node;\n}): ExistingNode => [prev, next, { current: null }, () => {}, -1, 'id'];\n\n/* eslint-disable no-constant-condition */\n\nconst useDragEffect = (props: UseDragEffectProps) => {\n  const { draggedNode, cursorPosition, listStoreRef, onDragEnd } = props;\n\n  const targetRef = useRef<ItemLocation | null>(null);\n  const targetNodeRef = useRef<TargetNode | null>(draggedNode);\n\n  useEffect(() => {\n    targetNodeRef.current = draggedNode;\n  }, [draggedNode]);\n\n  const onDragEndRef = useRef(onDragEnd);\n  useEffect(() => {\n    onDragEndRef.current = onDragEnd;\n  }, [onDragEnd]);\n\n  // The initial bounds of the dragged node.\n  // We can't read the bounds of the dragged node on the fly because the node can be unmounted in the virtual list.\n  const initDraggedNodeRect = useInitRect(\n    draggedNode ? draggedNode.node[2] : undefined\n  );\n\n  // The initial scroll position of the list where the dragged node is located.\n  // Used to detect the actual position of the dragged node. The purpose is the same as with initDraggedNodeRect.\n  const initDraggedNodeListScrollOffset = useInitScrollOffset(\n    draggedNode ? draggedNode.list.ref : undefined\n  );\n\n  // The central position of the dragged node\n  const position = useMemo(() => {\n    if (!draggedNode || !initDraggedNodeRect) return null;\n    const { x, y } = cursorPosition;\n    const { initWidth, initHeight } = initDraggedNodeRect;\n    return {\n      x: x - draggedNode.position.x + initWidth / 2,\n      y: y - draggedNode.position.y + initHeight / 2,\n    };\n  }, [cursorPosition, draggedNode, initDraggedNodeRect]);\n\n  // The list in which the cursor is located\n  const targetList = useTargetList(position, listStoreRef);\n\n  // Returns the style for moving the node in the specified direction\n  const getNodeStyle = useGetNodeStyle(initDraggedNodeRect);\n\n  // Moves the node up or down\n  const moveNode = useMoveNode({ position, draggedNode, getNodeStyle });\n\n  const setTargetNode = useCallback((list: NodeList, node: ExistingNode) => {\n    const [, , , , nodeIndex, nodeId] = node;\n    targetNodeRef.current = { list, node };\n    targetRef.current = {\n      listId: list.id,\n      index: nodeIndex,\n      id: nodeId,\n    };\n  }, []);\n\n  const clearTargetNode = useCallback(() => {\n    targetNodeRef.current = null;\n    targetRef.current = null;\n  }, []);\n\n  // Returns the central position of the dragged node in the list\n  const getDraggedNodePos = useCallback(() => {\n    if (\n      !targetList ||\n      !targetList.ref.current ||\n      !initDraggedNodeRect ||\n      !initDraggedNodeListScrollOffset\n    ) {\n      return null;\n    }\n    const { initX, initY, initWidth, initHeight } = initDraggedNodeRect;\n    const { initScrollLeft, initScrollTop } = initDraggedNodeListScrollOffset;\n    const { scrollLeft, scrollTop } = getElementScroll(targetList.ref.current);\n    return {\n      x: initX + initWidth / 2 + initScrollLeft - scrollLeft,\n      y: initY + initHeight / 2 + initScrollTop - scrollTop,\n    };\n  }, [initDraggedNodeListScrollOffset, initDraggedNodeRect, targetList]);\n\n  const getDraggedNodePosRef = useRef(getDraggedNodePos);\n  useEffect(() => {\n    getDraggedNodePosRef.current = getDraggedNodePos;\n  }, [getDraggedNodePos]);\n\n  // Hide the dragged node\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    const [, , , draggedNodeSetStyle] = draggedNode.node;\n    draggedNodeSetStyle(HIDDEN_NODE_STYLE);\n    return () => draggedNodeSetStyle({});\n  }, [draggedNode]);\n\n  // Append the blank node to the list to increase the height of it.\n  // Used when the dragged node is located inside another list.\n  const removeBlankNode = useBlankNode({\n    draggedNode,\n    targetList,\n    initDraggedNodeRect,\n  });\n\n  const updateTargetNode = useCallback(() => {\n    if (!draggedNode) return;\n    const prevTargetNode = targetNodeRef.current; // The last updated node\n\n    // Dragging outside the origin list\n    if (\n      prevTargetNode &&\n      prevTargetNode.list === draggedNode.list &&\n      targetList !== draggedNode.list\n    ) {\n      moveNode({\n        list: prevTargetNode.list,\n        startNode: prevTargetNode.node,\n        direction: 'down',\n        destination: 'end',\n      });\n      clearTargetNode();\n    }\n\n    // Dragging outside another list\n    if (\n      prevTargetNode &&\n      prevTargetNode.list !== draggedNode.list &&\n      targetList !== prevTargetNode.list\n    ) {\n      moveNode({\n        list: prevTargetNode.list,\n        startNode: prevTargetNode.node,\n        direction: 'down',\n        destination: 'end',\n        isAnotherList: true,\n      });\n      removeBlankNode();\n      clearTargetNode();\n    }\n\n    // Dragging inside the origin list\n    if (!prevTargetNode && targetList === draggedNode.list) {\n      const tail = targetList.getTail();\n      if (!tail) return;\n      const node = moveNode({\n        list: targetList,\n        startNode: tail,\n        direction: 'up',\n        destination: 'cursor',\n      });\n      setTargetNode(targetList, node);\n      return;\n    }\n\n    // Dragging inside another list\n    if (\n      targetList &&\n      targetList !== draggedNode.list &&\n      (!prevTargetNode || prevTargetNode.list !== targetList)\n    ) {\n      const tail = targetList.getTail();\n      if (!tail) return;\n      const node = moveNode({\n        list: targetList,\n        startNode: tail,\n        direction: 'up',\n        destination: 'cursor',\n        isAnotherList: true,\n      });\n      setTargetNode(targetList, node);\n      return;\n    }\n\n    // Dragging in the origin list\n    if (\n      prevTargetNode &&\n      prevTargetNode.list === draggedNode.list &&\n      targetList === draggedNode.list\n    ) {\n      const axis = targetList.horizontal ? 'x' : 'y';\n      const [, , prevTargetNodeRef, ,] = prevTargetNode.node;\n      if (!prevTargetNodeRef.current) {\n        // The target node was unmounted. It happens when the virtual list is used.\n        // If the cursor is above the dragged node, we need to move the nodes down from the tail to the node where\n        // the cursor is located. Otherwise, we need to move the nodes up from the head to the node where the cursor\n        // is located.\n        const draggedNodePos = getDraggedNodePosRef.current();\n        if (!position || !draggedNodePos) return;\n        const isDraggingUp = position[axis] < draggedNodePos[axis];\n        if (isDraggingUp) {\n          const tail = targetList.getTail();\n          if (!tail || !tail[2].current) return;\n          const node = moveNode({\n            list: targetList,\n            startNode: createEmptyNode({ prev: tail }),\n            direction: 'up',\n            destination: 'cursor',\n          });\n          setTargetNode(targetList, node);\n        } else {\n          const head = targetList.getHead();\n          if (!head || !head[2].current) return;\n          const node = moveNode({\n            list: targetList,\n            startNode: createEmptyNode({ next: head }),\n            direction: 'down',\n            destination: 'cursor',\n          });\n          setTargetNode(targetList, node);\n        }\n        return;\n      }\n      const prevTargetNodeRect = getNodeRect(prevTargetNode.node[2]);\n      const startRectProp = targetList.horizontal ? 'left' : 'top';\n      if (!position || !prevTargetNodeRect) return;\n      const isMoveUp = position[axis] < prevTargetNodeRect[startRectProp];\n      const node = isMoveUp\n        ? moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'up',\n            destination: 'cursor',\n          })\n        : moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'down',\n            destination: 'cursor',\n          });\n      setTargetNode(targetList, node);\n      return;\n    }\n\n    // Dragging in another list\n    if (\n      targetList &&\n      targetList !== draggedNode.list &&\n      prevTargetNode &&\n      prevTargetNode.list === targetList\n    ) {\n      const axis = targetList.horizontal ? 'x' : 'y';\n      const prevTargetNodeRect = getNodeRect(prevTargetNode.node[2]);\n      const startRectProp = targetList.horizontal ? 'left' : 'top';\n      if (!position || !prevTargetNodeRect) return;\n      const isMoveUp = position[axis] < prevTargetNodeRect[startRectProp];\n      const node = isMoveUp\n        ? moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'up',\n            destination: 'cursor',\n            isAnotherList: true,\n          })\n        : moveNode({\n            list: targetList,\n            startNode: prevTargetNode.node,\n            direction: 'down',\n            destination: 'cursor',\n            isAnotherList: true,\n          });\n      setTargetNode(targetList, node);\n    }\n  }, [\n    draggedNode,\n    targetList,\n    moveNode,\n    clearTargetNode,\n    removeBlankNode,\n    setTargetNode,\n    position,\n  ]);\n\n  // Update the target node if either the position or the target list has been changed\n  useEffect(() => {\n    updateTargetNode();\n  }, [updateTargetNode]);\n\n  // Update the target node if the target list has been scrolled\n  const [throttledUpdateTargetNode] = useThrottle(updateTargetNode, 100);\n  useEvent(\n    (targetList ? targetList.ref : undefined) as unknown as EventTarget,\n    'scroll',\n    throttledUpdateTargetNode\n  );\n  useEvent(window, 'scroll', throttledUpdateTargetNode);\n\n  // Reset styles of the affected nodes when the dragged node was dropped\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    const [, , , , draggedNodeIndex] = draggedNode.node;\n    return () => {\n      const targetNode = targetNodeRef.current;\n\n      // If the dragged node was outside the origin list, reset the styles for the nodes,\n      // starting at the tail and ending with the dragged node in the origin list.\n      if (!targetNode || targetNode.list !== draggedNode.list) {\n        const tail = draggedNode.list.getTail();\n        if (tail) {\n          let node = tail;\n          while (true) {\n            const [prev, , , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!prev || nodeIndex <= draggedNodeIndex) break;\n            node = prev;\n          }\n        }\n      }\n\n      // If the dragged node was inside another list, reset the styles for the nodes,\n      // starting at the tail and ending with the dragged node in the target list.\n      if (targetNode && targetNode.list !== draggedNode.list) {\n        const tail = targetNode.list.getTail();\n        const [, , , , targetNodeIndex] = targetNode.node;\n        if (tail) {\n          let node = tail;\n          while (true) {\n            const [prev, , , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!prev || nodeIndex <= targetNodeIndex) break;\n            node = prev;\n          }\n        }\n      }\n\n      // If the dragged node was moved inside the origin list, reset the styles for the nodes,\n      // starting with target node and ending with the dragged node.\n      if (targetNode && targetNode.list === draggedNode.list) {\n        const [, , , targetNodeSetStyle, targetNodeIndex] = targetNode.node;\n        if (targetNodeIndex > draggedNodeIndex) {\n          let { node } = targetNode;\n          while (true) {\n            const [prev, , , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!prev || nodeIndex <= draggedNodeIndex) break;\n            node = prev;\n          }\n        } else if (targetNodeIndex < draggedNodeIndex) {\n          let { node } = targetNode;\n          while (true) {\n            const [, next, , nodeSetStyle, nodeIndex] = node;\n            nodeSetStyle({});\n            if (!next || nodeIndex >= draggedNodeIndex) break;\n            node = next;\n          }\n        } else if (targetNodeIndex === draggedNodeIndex) {\n          targetNodeSetStyle({});\n        }\n      }\n    };\n  }, [draggedNode]);\n\n  // Update the position of the newly mounted nodes in the origin list (used in the virtual list)\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    const [, , , , draggedNodeIndex] = draggedNode.node;\n\n    const update = (nodeProps: NodeProps) => {\n      const { setStyle, index } = nodeProps;\n      const targetNode = targetNodeRef.current;\n\n      // Set the hidden style, if the mounted node is the dragged node\n      if (index === draggedNodeIndex) {\n        setStyle(HIDDEN_NODE_STYLE);\n        return;\n      }\n\n      // If the dragged node is inside the origin list\n      if (targetNode && targetNode.list === draggedNode.list) {\n        // Move the mounted node up/down, if it is located between the dragged and target node\n        const [, , , , targetNodeIndex] = targetNode.node;\n        if (index > draggedNodeIndex && index < targetNodeIndex) {\n          setStyle(getNodeStyle('up', targetNode.list.horizontal));\n        } else if (index < draggedNodeIndex && index > targetNodeIndex) {\n          setStyle(getNodeStyle('down', targetNode.list.horizontal));\n        }\n      } else if (index > draggedNodeIndex) {\n        // Otherwise, move the mounted node up, if it is located below the dragged node\n        setStyle(getNodeStyle('up', draggedNode.list.horizontal));\n      }\n    };\n\n    draggedNode.list.addListener(update);\n    return () => draggedNode.list.removeListener(update);\n  }, [draggedNode, getNodeStyle]);\n\n  // Update the position of the newly mounted nodes in the target list (used in the virtual list)\n  useEffect(() => {\n    if (!draggedNode || !targetList || targetList === draggedNode.list) {\n      return () => {};\n    }\n\n    const update = (nodeProps: NodeProps) => {\n      const { setStyle, index } = nodeProps;\n      const targetNode = targetNodeRef.current;\n      if (!targetNode) return;\n      const [, , , , targetNodeIndex] = targetNode.node;\n      if (index >= targetNodeIndex) {\n        // Move the mounted node down, if it is located below the target node or if it is the target node\n        setStyle(getNodeStyle('down', targetList.horizontal));\n      }\n    };\n\n    targetList.addListener(update);\n    return () => targetList.removeListener(update);\n  }, [draggedNode, getNodeStyle, targetList]);\n\n  // Call the onDragEnd callback if the draggedNode was changed to null\n  useEffect(() => {\n    if (!draggedNode) return () => {};\n    return () => {\n      // eslint-disable-next-line react-hooks/exhaustive-deps\n      const target = targetRef.current;\n      if (!target) return;\n      const [, , , , draggedNodeIndex, draggedNodeId] = draggedNode.node;\n      const dragged = {\n        listId: draggedNode.list.id,\n        index: draggedNodeIndex,\n        id: draggedNodeId,\n      };\n      if (dragged.id === target.id && dragged.index === target.index) return;\n      onDragEndRef.current(dragged, target);\n    };\n  }, [draggedNode]);\n};\n\nexport default useDragEffect;\n"],"mappings":"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"}

package/dist/cjs/utils/useDroppable.js

@@ -17,7 +17,7 @@ var DroppableContext = /*#__PURE__*/_react["default"].createContext({
   registerNode: function registerNode() {
     return [null, null, {
       current: null
-    }, function () {}, -1];
+    }, function () {}, -1, 'id'];
   },
   deregisterNode: function deregisterNode() {},
   onMouseDown: function onMouseDown() {},

package/dist/cjs/utils/useDroppable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useDroppable.ts"],"names":["DroppableContext","React","createContext","registerNode","current","deregisterNode","onMouseDown","onTouchStart","useDroppable"],"mappings":";;;;;;;;;AAAA;;;;;;AAUO,IAAMA,gBAAgB,gBAAGC,kBAAMC,aAAN,CAA2C;AACzEC,EAAAA,YAAY,EAAE;AAAA,WACZ,CAAC,IAAD,EAAO,IAAP,EAAa;AAAEC,MAAAA,OAAO,EAAE;AAAX,KAAb,EAAgC,YAAM,CAAE,CAAxC,EAA0C,CAAC,CAA3C,CADY;AAAA,GAD2D;AAGzEC,EAAAA,cAAc,EAAE,0BAAM,CAAE,CAHiD;AAIzEC,EAAAA,WAAW,EAAE,uBAAM,CAAE,CAJoD;AAKzEC,EAAAA,YAAY,EAAE,wBAAM,CAAE;AALmD,CAA3C,CAAzB;;;;AAQP,IAAMC,YAAY,GAAG,SAAfA,YAAe;AAAA,SAA6B,uBAAWR,gBAAX,CAA7B;AAAA,CAArB;;eAEeQ,Y","sourcesContent":["import React, { useContext, MouseEvent, TouchEvent } from 'react';\nimport { ExistingNode, NodeProps } from './NodeList';\n\ninterface DroppableContextProps {\n  registerNode: (props: NodeProps) => ExistingNode;\n  deregisterNode: (node: ExistingNode) => void;\n  onMouseDown: (e: MouseEvent, node: ExistingNode) => void;\n  onTouchStart: (e: TouchEvent, node: ExistingNode) => void;\n}\n\nexport const DroppableContext = React.createContext<DroppableContextProps>({\n  registerNode: () =>\n    [null, null, { current: null }, () => {}, -1] as ExistingNode,\n  deregisterNode: () => {},\n  onMouseDown: () => {},\n  onTouchStart: () => {},\n});\n\nconst useDroppable = (): DroppableContextProps => useContext(DroppableContext);\n\nexport default useDroppable;\n"],"file":"useDroppable.js"}
+{"version":3,"file":"useDroppable.js","names":["DroppableContext","React","createContext","registerNode","current","deregisterNode","onMouseDown","onTouchStart","useDroppable","useContext"],"sources":["../../../src/utils/useDroppable.ts"],"sourcesContent":["import React, { useContext, MouseEvent, TouchEvent } from 'react';\nimport { ExistingNode, NodeProps } from './NodeList';\n\ninterface DroppableContextProps {\n  registerNode: (props: NodeProps) => ExistingNode;\n  deregisterNode: (node: ExistingNode) => void;\n  onMouseDown: (e: MouseEvent, node: ExistingNode) => void;\n  onTouchStart: (e: TouchEvent, node: ExistingNode) => void;\n}\n\nexport const DroppableContext = React.createContext<DroppableContextProps>({\n  registerNode: () =>\n    [null, null, { current: null }, () => {}, -1, 'id'] as ExistingNode,\n  deregisterNode: () => {},\n  onMouseDown: () => {},\n  onTouchStart: () => {},\n});\n\nconst useDroppable = (): DroppableContextProps => useContext(DroppableContext);\n\nexport default useDroppable;\n"],"mappings":";;;;;;;;;AAAA;;;;;;AAUO,IAAMA,gBAAgB,gBAAGC,iBAAA,CAAMC,aAAN,CAA2C;EACzEC,YAAY,EAAE;IAAA,OACZ,CAAC,IAAD,EAAO,IAAP,EAAa;MAAEC,OAAO,EAAE;IAAX,CAAb,EAAgC,YAAM,CAAE,CAAxC,EAA0C,CAAC,CAA3C,EAA8C,IAA9C,CADY;EAAA,CAD2D;EAGzEC,cAAc,EAAE,0BAAM,CAAE,CAHiD;EAIzEC,WAAW,EAAE,uBAAM,CAAE,CAJoD;EAKzEC,YAAY,EAAE,wBAAM,CAAE;AALmD,CAA3C,CAAzB;;;;AAQP,IAAMC,YAAY,GAAG,SAAfA,YAAe;EAAA,OAA6B,IAAAC,iBAAA,EAAWT,gBAAX,CAA7B;AAAA,CAArB;;eAEeQ,Y"}

package/dist/cjs/utils/useGeneratedId.js

@@ -7,14 +7,10 @@ exports["default"] = void 0;
 
 var _react = require("react");
 
-var _crypto = _interopRequireDefault(require("crypto"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-var useGeneratedId = function useGeneratedId(size) {
+var useGeneratedId = function useGeneratedId() {
   return (0, _react.useMemo)(function () {
-    return _crypto["default"].randomBytes(size).toString('hex');
-  }, [size]);
+    return Math.random().toString(16).slice(2);
+  }, []);
 };
 
 var _default = useGeneratedId;

package/dist/cjs/utils/useGeneratedId.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useGeneratedId.ts"],"names":["useGeneratedId","size","crypto","randomBytes","toString"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB,CAACC,IAAD;AAAA,SACrB,oBAAQ;AAAA,WAAMC,mBAAOC,WAAP,CAAmBF,IAAnB,EAAyBG,QAAzB,CAAkC,KAAlC,CAAN;AAAA,GAAR,EAAwD,CAACH,IAAD,CAAxD,CADqB;AAAA,CAAvB;;eAGeD,c","sourcesContent":["import { useMemo } from 'react';\nimport crypto from 'crypto';\n\nconst useGeneratedId = (size: number) =>\n  useMemo(() => crypto.randomBytes(size).toString('hex'), [size]);\n\nexport default useGeneratedId;\n"],"file":"useGeneratedId.js"}
+{"version":3,"file":"useGeneratedId.js","names":["useGeneratedId","useMemo","Math","random","toString","slice"],"sources":["../../../src/utils/useGeneratedId.ts"],"sourcesContent":["import { useMemo } from 'react';\n\nconst useGeneratedId = () =>\n  useMemo(() => Math.random().toString(16).slice(2), []);\n\nexport default useGeneratedId;\n"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB;EAAA,OACrB,IAAAC,cAAA,EAAQ;IAAA,OAAMC,IAAI,CAACC,MAAL,GAAcC,QAAd,CAAuB,EAAvB,EAA2BC,KAA3B,CAAiC,CAAjC,CAAN;EAAA,CAAR,EAAmD,EAAnD,CADqB;AAAA,CAAvB;;eAGeL,c"}

package/dist/cjs/utils/useGetNodeStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useGetNodeStyle.ts"],"names":["useGetNodeStyle","size","sizeRef","current","type","horizontal","translateFn","sizeProp","sign","style","transform"],"mappings":";;;;;;;AAAA;;AAYA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,CAACC,IAAD,EAA4C;AAClE,MAAMC,OAAO,GAAG,mBAAOD,IAAP,CAAhB;AAEA,wBAAU,YAAM;AACdC,IAAAA,OAAO,CAACC,OAAR,GAAkBF,IAAlB;AACD,GAFD,EAEG,CAACA,IAAD,CAFH;AAIA,SAAO,wBAA6B,UAACG,IAAD,EAAOC,UAAP,EAAsB;AACxD,QAAID,IAAI,KAAK,MAAT,IAAmB,CAACF,OAAO,CAACC,OAAhC,EAAyC,OAAO,EAAP;AAEzC,QAAMG,WAAW,GAAGD,UAAU,GAAG,YAAH,GAAkB,YAAhD;AACA,QAAME,QAAQ,GAAGF,UAAU,GAAG,WAAH,GAAiB,YAA5C;AACA,QAAMG,IAAI,GAAGJ,IAAI,KAAK,MAAT,GAAkB,CAAlB,GAAsB,CAAC,CAApC;AAEA,QAAMK,KAAoB,GAAG,EAA7B;AACAA,IAAAA,KAAK,CAACC,SAAN,aAAqBJ,WAArB,cAAoCE,IAAI,GAAGN,OAAO,CAACC,OAAR,CAAgBI,QAAhB,CAA3C;AAEA,WAAOE,KAAP;AACD,GAXM,EAWJ,EAXI,CAAP;AAYD,CAnBD;;eAqBeT,e","sourcesContent":["import { CSSProperties, useCallback, useEffect, useRef } from 'react';\n\ninterface InitSize {\n  initWidth: number;\n  initHeight: number;\n}\n\nexport type NodeStyleGetter = (\n  type: 'up' | 'down' | 'init',\n  horizontal: boolean\n) => CSSProperties;\n\nconst useGetNodeStyle = (size: InitSize | null): NodeStyleGetter => {\n  const sizeRef = useRef(size);\n\n  useEffect(() => {\n    sizeRef.current = size;\n  }, [size]);\n\n  return useCallback<NodeStyleGetter>((type, horizontal) => {\n    if (type === 'init' || !sizeRef.current) return {};\n\n    const translateFn = horizontal ? 'translateX' : 'translateY';\n    const sizeProp = horizontal ? 'initWidth' : 'initHeight';\n    const sign = type === 'down' ? 1 : -1;\n\n    const style: CSSProperties = {};\n    style.transform = `${translateFn}(${sign * sizeRef.current[sizeProp]}px)`;\n\n    return style;\n  }, []);\n};\n\nexport default useGetNodeStyle;\n"],"file":"useGetNodeStyle.js"}
+{"version":3,"file":"useGetNodeStyle.js","names":["useGetNodeStyle","size","sizeRef","useRef","useEffect","current","useCallback","type","horizontal","translateFn","sizeProp","sign","style","transform"],"sources":["../../../src/utils/useGetNodeStyle.ts"],"sourcesContent":["import { CSSProperties, useCallback, useEffect, useRef } from 'react';\n\ninterface InitSize {\n  initWidth: number;\n  initHeight: number;\n}\n\nexport type NodeStyleGetter = (\n  type: 'up' | 'down' | 'init',\n  horizontal: boolean\n) => CSSProperties;\n\nconst useGetNodeStyle = (size: InitSize | null): NodeStyleGetter => {\n  const sizeRef = useRef(size);\n\n  useEffect(() => {\n    sizeRef.current = size;\n  }, [size]);\n\n  return useCallback<NodeStyleGetter>((type, horizontal) => {\n    if (type === 'init' || !sizeRef.current) return {};\n\n    const translateFn = horizontal ? 'translateX' : 'translateY';\n    const sizeProp = horizontal ? 'initWidth' : 'initHeight';\n    const sign = type === 'down' ? 1 : -1;\n\n    const style: CSSProperties = {};\n    style.transform = `${translateFn}(${sign * sizeRef.current[sizeProp]}px)`;\n\n    return style;\n  }, []);\n};\n\nexport default useGetNodeStyle;\n"],"mappings":";;;;;;;AAAA;;AAYA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,CAACC,IAAD,EAA4C;EAClE,IAAMC,OAAO,GAAG,IAAAC,aAAA,EAAOF,IAAP,CAAhB;EAEA,IAAAG,gBAAA,EAAU,YAAM;IACdF,OAAO,CAACG,OAAR,GAAkBJ,IAAlB;EACD,CAFD,EAEG,CAACA,IAAD,CAFH;EAIA,OAAO,IAAAK,kBAAA,EAA6B,UAACC,IAAD,EAAOC,UAAP,EAAsB;IACxD,IAAID,IAAI,KAAK,MAAT,IAAmB,CAACL,OAAO,CAACG,OAAhC,EAAyC,OAAO,EAAP;IAEzC,IAAMI,WAAW,GAAGD,UAAU,GAAG,YAAH,GAAkB,YAAhD;IACA,IAAME,QAAQ,GAAGF,UAAU,GAAG,WAAH,GAAiB,YAA5C;IACA,IAAMG,IAAI,GAAGJ,IAAI,KAAK,MAAT,GAAkB,CAAlB,GAAsB,CAAC,CAApC;IAEA,IAAMK,KAAoB,GAAG,EAA7B;IACAA,KAAK,CAACC,SAAN,aAAqBJ,WAArB,cAAoCE,IAAI,GAAGT,OAAO,CAACG,OAAR,CAAgBK,QAAhB,CAA3C;IAEA,OAAOE,KAAP;EACD,CAXM,EAWJ,EAXI,CAAP;AAYD,CAnBD;;eAqBeZ,e"}

package/dist/cjs/utils/useInitRect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useInitRect.ts"],"names":["useInitRect","ref","current","rect","getBoundingClientRect","initX","x","initY","y","initWidth","width","initHeight","height"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,WAAW,GAAG,SAAdA,WAAc,CAACC,GAAD;AAAA,SAClB,oBAAQ,YAAM;AACZ,QAAI,CAACA,GAAD,IAAQ,CAACA,GAAG,CAACC,OAAjB,EAA0B,OAAO,IAAP;AAE1B,QAAMC,IAAI,GAAGF,GAAG,CAACC,OAAJ,CAAYE,qBAAZ,EAAb;AAEA,WAAO;AACLC,MAAAA,KAAK,EAAEF,IAAI,CAACG,CADP;AAELC,MAAAA,KAAK,EAAEJ,IAAI,CAACK,CAFP;AAGLC,MAAAA,SAAS,EAAEN,IAAI,CAACO,KAHX;AAILC,MAAAA,UAAU,EAAER,IAAI,CAACS;AAJZ,KAAP;AAMD,GAXD,EAWG,CAACX,GAAD,CAXH,CADkB;AAAA,CAApB;;eAceD,W","sourcesContent":["import { RefObject, useMemo } from 'react';\n\nconst useInitRect = (ref?: RefObject<HTMLElement>) =>\n  useMemo(() => {\n    if (!ref || !ref.current) return null;\n\n    const rect = ref.current.getBoundingClientRect();\n\n    return {\n      initX: rect.x,\n      initY: rect.y,\n      initWidth: rect.width,\n      initHeight: rect.height,\n    };\n  }, [ref]);\n\nexport default useInitRect;\n"],"file":"useInitRect.js"}
+{"version":3,"file":"useInitRect.js","names":["useInitRect","ref","useMemo","current","rect","getBoundingClientRect","initX","x","initY","y","initWidth","width","initHeight","height"],"sources":["../../../src/utils/useInitRect.ts"],"sourcesContent":["import { RefObject, useMemo } from 'react';\n\nconst useInitRect = (ref?: RefObject<HTMLElement>) =>\n  useMemo(() => {\n    if (!ref || !ref.current) return null;\n\n    const rect = ref.current.getBoundingClientRect();\n\n    return {\n      initX: rect.x,\n      initY: rect.y,\n      initWidth: rect.width,\n      initHeight: rect.height,\n    };\n  }, [ref]);\n\nexport default useInitRect;\n"],"mappings":";;;;;;;AAAA;;AAEA,IAAMA,WAAW,GAAG,SAAdA,WAAc,CAACC,GAAD;EAAA,OAClB,IAAAC,cAAA,EAAQ,YAAM;IACZ,IAAI,CAACD,GAAD,IAAQ,CAACA,GAAG,CAACE,OAAjB,EAA0B,OAAO,IAAP;IAE1B,IAAMC,IAAI,GAAGH,GAAG,CAACE,OAAJ,CAAYE,qBAAZ,EAAb;IAEA,OAAO;MACLC,KAAK,EAAEF,IAAI,CAACG,CADP;MAELC,KAAK,EAAEJ,IAAI,CAACK,CAFP;MAGLC,SAAS,EAAEN,IAAI,CAACO,KAHX;MAILC,UAAU,EAAER,IAAI,CAACS;IAJZ,CAAP;EAMD,CAXD,EAWG,CAACZ,GAAD,CAXH,CADkB;AAAA,CAApB;;eAceD,W"}

package/dist/cjs/utils/useInitScrollOffset.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useInitScrollOffset.ts"],"names":["useInitScrollOffset","ref","current","scrollOffset","initScrollLeft","scrollLeft","initScrollTop","scrollTop"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAACC,GAAD;AAAA,SAC1B,oBAAQ,YAAM;AACZ,QAAI,CAACA,GAAD,IAAQ,CAACA,GAAG,CAACC,OAAjB,EAA0B,OAAO,IAAP;AAE1B,QAAMC,YAAY,GAAG,kCAAiBF,GAAG,CAACC,OAArB,CAArB;AAEA,WAAO;AACLE,MAAAA,cAAc,EAAED,YAAY,CAACE,UADxB;AAELC,MAAAA,aAAa,EAAEH,YAAY,CAACI;AAFvB,KAAP;AAID,GATD,EASG,CAACN,GAAD,CATH,CAD0B;AAAA,CAA5B;;eAYeD,mB","sourcesContent":["import { RefObject, useMemo } from 'react';\nimport getElementScroll from './getElementScroll';\n\nconst useInitScrollOffset = (ref?: RefObject<HTMLElement>) =>\n  useMemo(() => {\n    if (!ref || !ref.current) return null;\n\n    const scrollOffset = getElementScroll(ref.current);\n\n    return {\n      initScrollLeft: scrollOffset.scrollLeft,\n      initScrollTop: scrollOffset.scrollTop,\n    };\n  }, [ref]);\n\nexport default useInitScrollOffset;\n"],"file":"useInitScrollOffset.js"}
+{"version":3,"file":"useInitScrollOffset.js","names":["useInitScrollOffset","ref","useMemo","current","scrollOffset","getElementScroll","initScrollLeft","scrollLeft","initScrollTop","scrollTop"],"sources":["../../../src/utils/useInitScrollOffset.ts"],"sourcesContent":["import { RefObject, useMemo } from 'react';\nimport getElementScroll from './getElementScroll';\n\nconst useInitScrollOffset = (ref?: RefObject<HTMLElement>) =>\n  useMemo(() => {\n    if (!ref || !ref.current) return null;\n\n    const scrollOffset = getElementScroll(ref.current);\n\n    return {\n      initScrollLeft: scrollOffset.scrollLeft,\n      initScrollTop: scrollOffset.scrollTop,\n    };\n  }, [ref]);\n\nexport default useInitScrollOffset;\n"],"mappings":";;;;;;;AAAA;;AACA;;;;AAEA,IAAMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAACC,GAAD;EAAA,OAC1B,IAAAC,cAAA,EAAQ,YAAM;IACZ,IAAI,CAACD,GAAD,IAAQ,CAACA,GAAG,CAACE,OAAjB,EAA0B,OAAO,IAAP;IAE1B,IAAMC,YAAY,GAAG,IAAAC,4BAAA,EAAiBJ,GAAG,CAACE,OAArB,CAArB;IAEA,OAAO;MACLG,cAAc,EAAEF,YAAY,CAACG,UADxB;MAELC,aAAa,EAAEJ,YAAY,CAACK;IAFvB,CAAP;EAID,CATD,EASG,CAACR,GAAD,CATH,CAD0B;AAAA,CAA5B;;eAYeD,mB"}

package/dist/cjs/utils/useMoveNode.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useMoveNode.ts"],"names":["useMoveNode","props","position","draggedNode","getNodeStyle","options","list","startNode","direction","destination","isAnotherList","node","draggedNodeIndex","axis","horizontal","startRectProp","endRectProp","prev","nodeSetStyle","nodeIndex","prevNodeRef","prevNodeSetStyle","prevNodeIndex","prevNodeRect","next","nextNodeRef","nextNodeSetStyle","nextNodeIndex","nextNodeRect"],"mappings":"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","sourcesContent":["import { useCallback } from 'react';\nimport { Position } from '@os-design/use-drag';\nimport NodeList, { ExistingNode } from './NodeList';\nimport getNodeRect from './getNodeRect';\nimport { NodeStyleGetter } from './useGetNodeStyle';\n\ninterface DraggedNode {\n  node: ExistingNode;\n}\n\ninterface UseMoveNodeProps {\n  position: Position | null;\n  draggedNode: DraggedNode | null;\n  getNodeStyle: NodeStyleGetter;\n}\n\ninterface MoveProps {\n  list: NodeList;\n  startNode: ExistingNode;\n  direction: 'up' | 'down';\n  destination: 'cursor' | 'end';\n  isAnotherList?: boolean;\n}\n\n/* eslint-disable no-constant-condition */\n\nconst useMoveNode = (props: UseMoveNodeProps) => {\n  const { position, draggedNode, getNodeStyle } = props;\n\n  return useCallback(\n    (options: MoveProps) => {\n      const {\n        list,\n        startNode,\n        direction,\n        destination,\n        isAnotherList = false,\n      } = options;\n\n      if (!draggedNode || !position) return startNode;\n      const [, , , , draggedNodeIndex] = draggedNode.node;\n      const axis = list.horizontal ? 'x' : 'y';\n      const startRectProp = list.horizontal ? 'left' : 'top';\n      const endRectProp = list.horizontal ? 'right' : 'bottom';\n      let node = startNode;\n\n      if (direction === 'up') {\n        while (true) {\n          const [prev, , , nodeSetStyle, nodeIndex] = node;\n          if (!prev) return node;\n\n          const [, , prevNodeRef, prevNodeSetStyle, prevNodeIndex] = prev;\n\n          if (destination === 'cursor') {\n            const prevNodeRect = getNodeRect(prevNodeRef);\n            if (prevNodeRect && position[axis] > prevNodeRect[endRectProp]) {\n              return node;\n            }\n          }\n\n          if (isAnotherList || prevNodeIndex < draggedNodeIndex) {\n            prevNodeSetStyle(getNodeStyle('down', list.horizontal));\n          } else if (nodeIndex > draggedNodeIndex) {\n            nodeSetStyle(getNodeStyle('init', list.horizontal));\n          }\n\n          node = prev;\n        }\n      } else {\n        while (true) {\n          const [, next, , nodeSetStyle, nodeIndex] = node;\n          if (!next) return node;\n\n          const [, , nextNodeRef, nextNodeSetStyle, nextNodeIndex] = next;\n\n          if (destination === 'cursor') {\n            const nextNodeRect = getNodeRect(nextNodeRef);\n            if (nextNodeRect && position[axis] < nextNodeRect[startRectProp]) {\n              return node;\n            }\n          }\n\n          if (isAnotherList || nodeIndex < draggedNodeIndex) {\n            nodeSetStyle(getNodeStyle('init', list.horizontal));\n          } else if (nextNodeIndex > draggedNodeIndex) {\n            nextNodeSetStyle(getNodeStyle('up', list.horizontal));\n          }\n\n          node = next;\n        }\n      }\n    },\n    [draggedNode, getNodeStyle, position]\n  );\n};\n\nexport default useMoveNode;\n"],"file":"useMoveNode.js"}
+{"version":3,"file":"useMoveNode.js","names":["useMoveNode","props","position","draggedNode","getNodeStyle","useCallback","options","list","startNode","direction","destination","isAnotherList","node","draggedNodeIndex","axis","horizontal","startRectProp","endRectProp","prev","nodeSetStyle","nodeIndex","prevNodeRef","prevNodeSetStyle","prevNodeIndex","prevNodeRect","getNodeRect","next","nextNodeRef","nextNodeSetStyle","nextNodeIndex","nextNodeRect"],"sources":["../../../src/utils/useMoveNode.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport { Position } from '@os-design/use-drag';\nimport NodeList, { ExistingNode } from './NodeList';\nimport getNodeRect from './getNodeRect';\nimport { NodeStyleGetter } from './useGetNodeStyle';\n\ninterface DraggedNode {\n  node: ExistingNode;\n}\n\ninterface UseMoveNodeProps {\n  position: Position | null;\n  draggedNode: DraggedNode | null;\n  getNodeStyle: NodeStyleGetter;\n}\n\ninterface MoveProps {\n  list: NodeList;\n  startNode: ExistingNode;\n  direction: 'up' | 'down';\n  destination: 'cursor' | 'end';\n  isAnotherList?: boolean;\n}\n\n/* eslint-disable no-constant-condition */\n\nconst useMoveNode = (props: UseMoveNodeProps) => {\n  const { position, draggedNode, getNodeStyle } = props;\n\n  return useCallback(\n    (options: MoveProps) => {\n      const {\n        list,\n        startNode,\n        direction,\n        destination,\n        isAnotherList = false,\n      } = options;\n\n      if (!draggedNode || !position) return startNode;\n      const [, , , , draggedNodeIndex] = draggedNode.node;\n      const axis = list.horizontal ? 'x' : 'y';\n      const startRectProp = list.horizontal ? 'left' : 'top';\n      const endRectProp = list.horizontal ? 'right' : 'bottom';\n      let node = startNode;\n\n      if (direction === 'up') {\n        while (true) {\n          const [prev, , , nodeSetStyle, nodeIndex] = node;\n          if (!prev) return node;\n\n          const [, , prevNodeRef, prevNodeSetStyle, prevNodeIndex] = prev;\n\n          if (destination === 'cursor') {\n            const prevNodeRect = getNodeRect(prevNodeRef);\n            if (prevNodeRect && position[axis] > prevNodeRect[endRectProp]) {\n              return node;\n            }\n          }\n\n          if (isAnotherList || prevNodeIndex < draggedNodeIndex) {\n            prevNodeSetStyle(getNodeStyle('down', list.horizontal));\n          } else if (nodeIndex > draggedNodeIndex) {\n            nodeSetStyle(getNodeStyle('init', list.horizontal));\n          }\n\n          node = prev;\n        }\n      } else {\n        while (true) {\n          const [, next, , nodeSetStyle, nodeIndex] = node;\n          if (!next) return node;\n\n          const [, , nextNodeRef, nextNodeSetStyle, nextNodeIndex] = next;\n\n          if (destination === 'cursor') {\n            const nextNodeRect = getNodeRect(nextNodeRef);\n            if (nextNodeRect && position[axis] < nextNodeRect[startRectProp]) {\n              return node;\n            }\n          }\n\n          if (isAnotherList || nodeIndex < draggedNodeIndex) {\n            nodeSetStyle(getNodeStyle('init', list.horizontal));\n          } else if (nextNodeIndex > draggedNodeIndex) {\n            nextNodeSetStyle(getNodeStyle('up', list.horizontal));\n          }\n\n          node = next;\n        }\n      }\n    },\n    [draggedNode, getNodeStyle, position]\n  );\n};\n\nexport default useMoveNode;\n"],"mappings":"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"}

package/dist/cjs/utils/useScrollEventByPoint.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useScrollEventByPoint.ts"],"names":["compare","prevArr","nextArr","remove","add","forEach","item","includes","push","useScrollEventByPoint","point","listener","listenerRef","current","eventListener","e","elementsRef","scrollableElements","x","y","getTarget","document","body","window","index","indexOf","splice","removeEventListener","addEventListener"],"mappings":";;;;;;;AAAA;;AACA;;AAEA,IAAMA,OAAO,GAAG,SAAVA,OAAU,CAAIC,OAAJ,EAAkBC,OAAlB,EAAmC;AACjD,MAAMC,MAAW,GAAG,EAApB;AACA,MAAMC,GAAQ,GAAG,EAAjB;AACAH,EAAAA,OAAO,CAACI,OAAR,CAAgB,UAACC,IAAD,EAAU;AACxB,QAAI,CAACJ,OAAO,CAACK,QAAR,CAAiBD,IAAjB,CAAL,EAA6BH,MAAM,CAACK,IAAP,CAAYF,IAAZ;AAC9B,GAFD;AAGAJ,EAAAA,OAAO,CAACG,OAAR,CAAgB,UAACC,IAAD,EAAU;AACxB,QAAI,CAACL,OAAO,CAACM,QAAR,CAAiBD,IAAjB,CAAL,EAA6BF,GAAG,CAACI,IAAJ,CAASF,IAAT;AAC9B,GAFD;AAGA,SAAO;AAAEH,IAAAA,MAAM,EAANA,MAAF;AAAUC,IAAAA,GAAG,EAAHA;AAAV,GAAP;AACD,CAVD;;AAiBA;AACA;AACA;AACA;AACA,IAAMK,qBAAqB,GAAG,SAAxBA,qBAAwB,CAC5BC,KAD4B,EAE5BC,QAF4B,EAGzB;AACH,MAAMC,WAAW,GAAG,mBAAOD,QAAP,CAApB;AACA,wBAAU,YAAM;AACdC,IAAAA,WAAW,CAACC,OAAZ,GAAsBF,QAAtB;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA,MAAMG,aAAa,GAAG,wBAAY,UAACC,CAAD;AAAA,WAAcH,WAAW,CAACC,OAAZ,CAAoBE,CAApB,CAAd;AAAA,GAAZ,EAAkD,EAAlD,CAAtB;AACA,MAAMC,WAAW,GAAG,mBAAkB,EAAlB,CAApB;AAEA,wBAAU,YAAM;AACd,QAAI,CAACN,KAAL,EAAY;AACZ,QAAMO,kBAAkB,GAAG,0CAAsBP,KAAK,CAACQ,CAA5B,EAA+BR,KAAK,CAACS,CAArC,CAA3B;;AACA,mBAAwBnB,OAAO,CAACgB,WAAW,CAACH,OAAb,EAAsBI,kBAAtB,CAA/B;AAAA,QAAQd,MAAR,YAAQA,MAAR;AAAA,QAAgBC,GAAhB,YAAgBA,GAAhB;;AACA,QAAMgB,SAAS,GAAG,SAAZA,SAAY,CAACd,IAAD;AAAA,aAChBA,IAAI,KAAKe,QAAQ,CAACC,IAAlB,GAAyBC,MAAzB,GAAkCjB,IADlB;AAAA,KAAlB;;AAGAH,IAAAA,MAAM,CAACE,OAAP,CAAe,UAACC,IAAD,EAAU;AACvB,UAAMkB,KAAK,GAAGR,WAAW,CAACH,OAAZ,CAAoBY,OAApB,CAA4BnB,IAA5B,CAAd;AACA,UAAIkB,KAAK,IAAI,CAAb,EAAgBR,WAAW,CAACH,OAAZ,CAAoBa,MAApB,CAA2BF,KAA3B,EAAkC,CAAlC;AAChBJ,MAAAA,SAAS,CAACd,IAAD,CAAT,CAAgBqB,mBAAhB,CAAoC,QAApC,EAA8Cb,aAA9C;AACD,KAJD;AAKAV,IAAAA,GAAG,CAACC,OAAJ,CAAY,UAACC,IAAD,EAAU;AACpBU,MAAAA,WAAW,CAACH,OAAZ,CAAoBL,IAApB,CAAyBF,IAAzB;AACAc,MAAAA,SAAS,CAACd,IAAD,CAAT,CAAgBsB,gBAAhB,CAAiC,QAAjC,EAA2Cd,aAA3C;AACD,KAHD;AAID,GAhBD,EAgBG,CAACA,aAAD,EAAgBJ,KAAhB,CAhBH;AAiBD,CA7BD;;eA+BeD,qB","sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { getScrollableElements } from '@os-design/use-auto-scroll';\n\nconst compare = <T>(prevArr: T[], nextArr: T[]) => {\n  const remove: T[] = [];\n  const add: T[] = [];\n  prevArr.forEach((item) => {\n    if (!nextArr.includes(item)) remove.push(item);\n  });\n  nextArr.forEach((item) => {\n    if (!prevArr.includes(item)) add.push(item);\n  });\n  return { remove, add };\n};\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\n/**\n * Sets the listener that will be called whenever the scroll event occurs\n * in one of the elements located under the specified point.\n */\nconst useScrollEventByPoint = (\n  point: Point | null,\n  listener: (e: Event) => void\n) => {\n  const listenerRef = useRef(listener);\n  useEffect(() => {\n    listenerRef.current = listener;\n  }, [listener]);\n\n  const eventListener = useCallback((e: Event) => listenerRef.current(e), []);\n  const elementsRef = useRef<Element[]>([]);\n\n  useEffect(() => {\n    if (!point) return;\n    const scrollableElements = getScrollableElements(point.x, point.y);\n    const { remove, add } = compare(elementsRef.current, scrollableElements);\n    const getTarget = (item: Element) =>\n      item === document.body ? window : item;\n\n    remove.forEach((item) => {\n      const index = elementsRef.current.indexOf(item);\n      if (index >= 0) elementsRef.current.splice(index, 1);\n      getTarget(item).removeEventListener('scroll', eventListener);\n    });\n    add.forEach((item) => {\n      elementsRef.current.push(item);\n      getTarget(item).addEventListener('scroll', eventListener);\n    });\n  }, [eventListener, point]);\n};\n\nexport default useScrollEventByPoint;\n"],"file":"useScrollEventByPoint.js"}
+{"version":3,"file":"useScrollEventByPoint.js","names":["compare","prevArr","nextArr","remove","add","forEach","item","includes","push","useScrollEventByPoint","point","listener","listenerRef","useRef","useEffect","current","eventListener","useCallback","e","elementsRef","scrollableElements","getScrollableElements","x","y","getTarget","document","body","window","index","indexOf","splice","removeEventListener","addEventListener"],"sources":["../../../src/utils/useScrollEventByPoint.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport { getScrollableElements } from '@os-design/use-auto-scroll';\n\nconst compare = <T>(prevArr: T[], nextArr: T[]) => {\n  const remove: T[] = [];\n  const add: T[] = [];\n  prevArr.forEach((item) => {\n    if (!nextArr.includes(item)) remove.push(item);\n  });\n  nextArr.forEach((item) => {\n    if (!prevArr.includes(item)) add.push(item);\n  });\n  return { remove, add };\n};\n\nexport interface Point {\n  x: number;\n  y: number;\n}\n\n/**\n * Sets the listener that will be called whenever the scroll event occurs\n * in one of the elements located under the specified point.\n */\nconst useScrollEventByPoint = (\n  point: Point | null,\n  listener: (e: Event) => void\n) => {\n  const listenerRef = useRef(listener);\n  useEffect(() => {\n    listenerRef.current = listener;\n  }, [listener]);\n\n  const eventListener = useCallback((e: Event) => listenerRef.current(e), []);\n  const elementsRef = useRef<Element[]>([]);\n\n  useEffect(() => {\n    if (!point) return;\n    const scrollableElements = getScrollableElements(point.x, point.y);\n    const { remove, add } = compare(elementsRef.current, scrollableElements);\n    const getTarget = (item: Element) =>\n      item === document.body ? window : item;\n\n    remove.forEach((item) => {\n      const index = elementsRef.current.indexOf(item);\n      if (index >= 0) elementsRef.current.splice(index, 1);\n      getTarget(item).removeEventListener('scroll', eventListener);\n    });\n    add.forEach((item) => {\n      elementsRef.current.push(item);\n      getTarget(item).addEventListener('scroll', eventListener);\n    });\n  }, [eventListener, point]);\n};\n\nexport default useScrollEventByPoint;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEA,IAAMA,OAAO,GAAG,SAAVA,OAAU,CAAIC,OAAJ,EAAkBC,OAAlB,EAAmC;EACjD,IAAMC,MAAW,GAAG,EAApB;EACA,IAAMC,GAAQ,GAAG,EAAjB;EACAH,OAAO,CAACI,OAAR,CAAgB,UAACC,IAAD,EAAU;IACxB,IAAI,CAACJ,OAAO,CAACK,QAAR,CAAiBD,IAAjB,CAAL,EAA6BH,MAAM,CAACK,IAAP,CAAYF,IAAZ;EAC9B,CAFD;EAGAJ,OAAO,CAACG,OAAR,CAAgB,UAACC,IAAD,EAAU;IACxB,IAAI,CAACL,OAAO,CAACM,QAAR,CAAiBD,IAAjB,CAAL,EAA6BF,GAAG,CAACI,IAAJ,CAASF,IAAT;EAC9B,CAFD;EAGA,OAAO;IAAEH,MAAM,EAANA,MAAF;IAAUC,GAAG,EAAHA;EAAV,CAAP;AACD,CAVD;;AAiBA;AACA;AACA;AACA;AACA,IAAMK,qBAAqB,GAAG,SAAxBA,qBAAwB,CAC5BC,KAD4B,EAE5BC,QAF4B,EAGzB;EACH,IAAMC,WAAW,GAAG,IAAAC,aAAA,EAAOF,QAAP,CAApB;EACA,IAAAG,gBAAA,EAAU,YAAM;IACdF,WAAW,CAACG,OAAZ,GAAsBJ,QAAtB;EACD,CAFD,EAEG,CAACA,QAAD,CAFH;EAIA,IAAMK,aAAa,GAAG,IAAAC,kBAAA,EAAY,UAACC,CAAD;IAAA,OAAcN,WAAW,CAACG,OAAZ,CAAoBG,CAApB,CAAd;EAAA,CAAZ,EAAkD,EAAlD,CAAtB;EACA,IAAMC,WAAW,GAAG,IAAAN,aAAA,EAAkB,EAAlB,CAApB;EAEA,IAAAC,gBAAA,EAAU,YAAM;IACd,IAAI,CAACJ,KAAL,EAAY;IACZ,IAAMU,kBAAkB,GAAG,IAAAC,oCAAA,EAAsBX,KAAK,CAACY,CAA5B,EAA+BZ,KAAK,CAACa,CAArC,CAA3B;;IACA,eAAwBvB,OAAO,CAACmB,WAAW,CAACJ,OAAb,EAAsBK,kBAAtB,CAA/B;IAAA,IAAQjB,MAAR,YAAQA,MAAR;IAAA,IAAgBC,GAAhB,YAAgBA,GAAhB;;IACA,IAAMoB,SAAS,GAAG,SAAZA,SAAY,CAAClB,IAAD;MAAA,OAChBA,IAAI,KAAKmB,QAAQ,CAACC,IAAlB,GAAyBC,MAAzB,GAAkCrB,IADlB;IAAA,CAAlB;;IAGAH,MAAM,CAACE,OAAP,CAAe,UAACC,IAAD,EAAU;MACvB,IAAMsB,KAAK,GAAGT,WAAW,CAACJ,OAAZ,CAAoBc,OAApB,CAA4BvB,IAA5B,CAAd;MACA,IAAIsB,KAAK,IAAI,CAAb,EAAgBT,WAAW,CAACJ,OAAZ,CAAoBe,MAApB,CAA2BF,KAA3B,EAAkC,CAAlC;MAChBJ,SAAS,CAAClB,IAAD,CAAT,CAAgByB,mBAAhB,CAAoC,QAApC,EAA8Cf,aAA9C;IACD,CAJD;IAKAZ,GAAG,CAACC,OAAJ,CAAY,UAACC,IAAD,EAAU;MACpBa,WAAW,CAACJ,OAAZ,CAAoBP,IAApB,CAAyBF,IAAzB;MACAkB,SAAS,CAAClB,IAAD,CAAT,CAAgB0B,gBAAhB,CAAiC,QAAjC,EAA2ChB,aAA3C;IACD,CAHD;EAID,CAhBD,EAgBG,CAACA,aAAD,EAAgBN,KAAhB,CAhBH;AAiBD,CA7BD;;eA+BeD,qB"}

package/dist/cjs/utils/useTargetList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useTargetList.ts"],"names":["useTargetList","position","listStoreRef","number","setNumber","targetList","current","x","y","list","findByPosition","forceUpdate","n","throttledForceUpdate"],"mappings":";;;;;;;AAAA;;AACA;;AAGA;;;;;;;;;;;;;;;;AAEA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CACpBC,QADoB,EAEpBC,YAFoB,EAGjB;AACH,kBAA4B,qBAAS,CAAT,CAA5B;AAAA;AAAA,MAAOC,MAAP;AAAA,MAAeC,SAAf;;AAEA,MAAMC,UAAU,GAAG,oBAAQ,YAAM;AAC/B,QAAI,CAACJ,QAAD,IAAa,CAACC,YAAY,CAACI,OAA/B,EAAwC,OAAO,IAAP;AACxC,QAAQC,CAAR,GAAiBN,QAAjB,CAAQM,CAAR;AAAA,QAAWC,CAAX,GAAiBP,QAAjB,CAAWO,CAAX;AACA,QAAMC,IAAI,GAAGP,YAAY,CAACI,OAAb,CAAqBI,cAArB,CAAoCH,CAApC,EAAuCC,CAAvC,CAAb;AACA,WAAOC,IAAI,IAAI,IAAf;AACD,GALkB,EAKhB,CAACP,YAAD,EAAeD,QAAf,EAAyBE,MAAzB,CALgB,CAAnB,CAHG,CAQmC;;AAEtC,MAAMQ,WAAW,GAAG,wBAAY,YAAM;AACpCP,IAAAA,SAAS,CAAC,UAACQ,CAAD;AAAA,aAAOA,CAAC,GAAG,CAAX;AAAA,KAAD,CAAT;AACD,GAFmB,EAEjB,EAFiB,CAApB,CAVG,CAcH;;AACA,qBAA+B,8BAAYD,WAAZ,EAAyB,GAAzB,CAA/B;AAAA;AAAA,MAAOE,oBAAP;;AACA,yCAAsBZ,QAAtB,EAAgCY,oBAAhC;AAEA,SAAOR,UAAP;AACD,CAtBD;;eAwBeL,a","sourcesContent":["import { RefObject, useCallback, useMemo, useState } from 'react';\nimport useThrottle from '@os-design/use-throttle';\nimport { Position } from '@os-design/use-drag';\nimport ListStore from './ListStore';\nimport useScrollEventByPoint from './useScrollEventByPoint';\n\nconst useTargetList = (\n  position: Position | null,\n  listStoreRef: RefObject<ListStore>\n) => {\n  const [number, setNumber] = useState(0);\n\n  const targetList = useMemo(() => {\n    if (!position || !listStoreRef.current) return null;\n    const { x, y } = position;\n    const list = listStoreRef.current.findByPosition(x, y);\n    return list || null;\n  }, [listStoreRef, position, number]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  const forceUpdate = useCallback(() => {\n    setNumber((n) => n + 1);\n  }, []);\n\n  // Update the target list if one of the elements located under the specified point has been scrolled\n  const [throttledForceUpdate] = useThrottle(forceUpdate, 100);\n  useScrollEventByPoint(position, throttledForceUpdate);\n\n  return targetList;\n};\n\nexport default useTargetList;\n"],"file":"useTargetList.js"}
+{"version":3,"file":"useTargetList.js","names":["useTargetList","position","listStoreRef","useState","number","setNumber","targetList","useMemo","current","x","y","list","findByPosition","forceUpdate","useCallback","n","useThrottle","throttledForceUpdate","useScrollEventByPoint"],"sources":["../../../src/utils/useTargetList.ts"],"sourcesContent":["import { RefObject, useCallback, useMemo, useState } from 'react';\nimport useThrottle from '@os-design/use-throttle';\nimport { Position } from '@os-design/use-drag';\nimport ListStore from './ListStore';\nimport useScrollEventByPoint from './useScrollEventByPoint';\n\nconst useTargetList = (\n  position: Position | null,\n  listStoreRef: RefObject<ListStore>\n) => {\n  const [number, setNumber] = useState(0);\n\n  const targetList = useMemo(() => {\n    if (!position || !listStoreRef.current) return null;\n    const { x, y } = position;\n    const list = listStoreRef.current.findByPosition(x, y);\n    return list || null;\n  }, [listStoreRef, position, number]); // eslint-disable-line react-hooks/exhaustive-deps\n\n  const forceUpdate = useCallback(() => {\n    setNumber((n) => n + 1);\n  }, []);\n\n  // Update the target list if one of the elements located under the specified point has been scrolled\n  const [throttledForceUpdate] = useThrottle(forceUpdate, 100);\n  useScrollEventByPoint(position, throttledForceUpdate);\n\n  return targetList;\n};\n\nexport default useTargetList;\n"],"mappings":";;;;;;;AAAA;;AACA;;AAGA;;;;;;;;;;;;;;;;AAEA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,CACpBC,QADoB,EAEpBC,YAFoB,EAGjB;EACH,gBAA4B,IAAAC,eAAA,EAAS,CAAT,CAA5B;EAAA;EAAA,IAAOC,MAAP;EAAA,IAAeC,SAAf;;EAEA,IAAMC,UAAU,GAAG,IAAAC,cAAA,EAAQ,YAAM;IAC/B,IAAI,CAACN,QAAD,IAAa,CAACC,YAAY,CAACM,OAA/B,EAAwC,OAAO,IAAP;IACxC,IAAQC,CAAR,GAAiBR,QAAjB,CAAQQ,CAAR;IAAA,IAAWC,CAAX,GAAiBT,QAAjB,CAAWS,CAAX;IACA,IAAMC,IAAI,GAAGT,YAAY,CAACM,OAAb,CAAqBI,cAArB,CAAoCH,CAApC,EAAuCC,CAAvC,CAAb;IACA,OAAOC,IAAI,IAAI,IAAf;EACD,CALkB,EAKhB,CAACT,YAAD,EAAeD,QAAf,EAAyBG,MAAzB,CALgB,CAAnB,CAHG,CAQmC;;EAEtC,IAAMS,WAAW,GAAG,IAAAC,kBAAA,EAAY,YAAM;IACpCT,SAAS,CAAC,UAACU,CAAD;MAAA,OAAOA,CAAC,GAAG,CAAX;IAAA,CAAD,CAAT;EACD,CAFmB,EAEjB,EAFiB,CAApB,CAVG,CAcH;;EACA,mBAA+B,IAAAC,wBAAA,EAAYH,WAAZ,EAAyB,GAAzB,CAA/B;EAAA;EAAA,IAAOI,oBAAP;;EACA,IAAAC,iCAAA,EAAsBjB,QAAtB,EAAgCgB,oBAAhC;EAEA,OAAOX,UAAP;AACD,CAtBD;;eAwBeN,a"}

package/dist/cjs/utils/useTransitionStyle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/useTransitionStyle.ts"],"names":["useTransitionStyle","props","className","ms","enabled","style","document","createElement","innerHTML","child","head","appendChild","removeChild"],"mappings":";;;;;;;AAAA;;AAQA;AACA;AACA;AACA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAoC;AAC7D,MAAQC,SAAR,GAAmCD,KAAnC,CAAQC,SAAR;AAAA,MAAmBC,EAAnB,GAAmCF,KAAnC,CAAmBE,EAAnB;AAAA,MAAuBC,OAAvB,GAAmCH,KAAnC,CAAuBG,OAAvB;AAEA,wBAAU,YAAM;AACd,QAAI,CAACA,OAAL,EAAc,OAAO,YAAM,CAAE,CAAf;AACd,QAAMC,KAAK,GAAGC,QAAQ,CAACC,aAAT,CAAuB,OAAvB,CAAd;AACAF,IAAAA,KAAK,CAACG,SAAN,cAAsBN,SAAtB,mCAAwDC,EAAxD;AACA,QAAMM,KAAK,GAAGH,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,KAA1B,CAAd;AACA,WAAO,YAAM;AACXC,MAAAA,QAAQ,CAACI,IAAT,CAAcE,WAAd,CAA0BH,KAA1B;AACD,KAFD;AAGD,GARD,EAQG,CAACP,SAAD,EAAYE,OAAZ,EAAqBD,EAArB,CARH;AASD,CAZD;;eAceH,kB","sourcesContent":["import { useEffect } from 'react';\n\ninterface UseTransitionStyleProps {\n  className: string;\n  ms: number;\n  enabled: boolean;\n}\n\n/**\n * Creates the global style for setting the transition delay.\n */\nconst useTransitionStyle = (props: UseTransitionStyleProps) => {\n  const { className, ms, enabled } = props;\n\n  useEffect(() => {\n    if (!enabled) return () => {};\n    const style = document.createElement('style');\n    style.innerHTML = `.${className}{transition:transform ${ms}ms;}`;\n    const child = document.head.appendChild(style);\n    return () => {\n      document.head.removeChild(child);\n    };\n  }, [className, enabled, ms]);\n};\n\nexport default useTransitionStyle;\n"],"file":"useTransitionStyle.js"}
+{"version":3,"file":"useTransitionStyle.js","names":["useTransitionStyle","props","className","ms","enabled","useEffect","style","document","createElement","innerHTML","child","head","appendChild","removeChild"],"sources":["../../../src/utils/useTransitionStyle.ts"],"sourcesContent":["import { useEffect } from 'react';\n\ninterface UseTransitionStyleProps {\n  className: string;\n  ms: number;\n  enabled: boolean;\n}\n\n/**\n * Creates the global style for setting the transition delay.\n */\nconst useTransitionStyle = (props: UseTransitionStyleProps) => {\n  const { className, ms, enabled } = props;\n\n  useEffect(() => {\n    if (!enabled) return () => {};\n    const style = document.createElement('style');\n    style.innerHTML = `.${className}{transition:transform ${ms}ms;}`;\n    const child = document.head.appendChild(style);\n    return () => {\n      document.head.removeChild(child);\n    };\n  }, [className, enabled, ms]);\n};\n\nexport default useTransitionStyle;\n"],"mappings":";;;;;;;AAAA;;AAQA;AACA;AACA;AACA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB,CAACC,KAAD,EAAoC;EAC7D,IAAQC,SAAR,GAAmCD,KAAnC,CAAQC,SAAR;EAAA,IAAmBC,EAAnB,GAAmCF,KAAnC,CAAmBE,EAAnB;EAAA,IAAuBC,OAAvB,GAAmCH,KAAnC,CAAuBG,OAAvB;EAEA,IAAAC,gBAAA,EAAU,YAAM;IACd,IAAI,CAACD,OAAL,EAAc,OAAO,YAAM,CAAE,CAAf;IACd,IAAME,KAAK,GAAGC,QAAQ,CAACC,aAAT,CAAuB,OAAvB,CAAd;IACAF,KAAK,CAACG,SAAN,cAAsBP,SAAtB,mCAAwDC,EAAxD;IACA,IAAMO,KAAK,GAAGH,QAAQ,CAACI,IAAT,CAAcC,WAAd,CAA0BN,KAA1B,CAAd;IACA,OAAO,YAAM;MACXC,QAAQ,CAACI,IAAT,CAAcE,WAAd,CAA0BH,KAA1B;IACD,CAFD;EAGD,CARD,EAQG,CAACR,SAAD,EAAYE,OAAZ,EAAqBD,EAArB,CARH;AASD,CAZD;;eAceH,kB"}

package/dist/esm/DragAndDrop.js

@@ -28,7 +28,7 @@ const DragAndDrop = ({
   // To determine which list a node should be dropped in, we need to store refs to all the lists.
   const listStoreRef = useRef(new ListStore()); // The class name for a node used to set the transition style
 
-  const generatedId = useGeneratedId(4);
+  const generatedId = useGeneratedId();
   const nodeClassName = useMemo(() => `n${generatedId}`, [generatedId]); // The node that is currently being dragged
 
   const [draggedNode, setDraggedNode] = useState(null);
@@ -129,6 +129,7 @@ const DragAndDrop = ({
     container: draggedNodeContainer
   }, draggedNode.list.renderDraggedNode({
     index: draggedNode.node[4],
+    id: draggedNode.node[5],
     style: {
       position: 'fixed',
       left: cursorPosition.x - draggedNode.position.x,

package/dist/esm/DragAndDrop.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/DragAndDrop.tsx"],"names":["React","useCallback","useMemo","useRef","useState","usePreventDefaultEvent","useMemoObject","useDrag","Portal","useAutoScroll","DragAndDropContext","ListStore","useDragEffect","useGeneratedId","useTransitionStyle","useInitRect","DragAndDrop","draggedNodeContainer","minMouseDistPx","longPressMs","autoScrollDistPercent","autoScrollMaxSpeedPx","transitionDelayMs","onDragEnd","children","listStoreRef","generatedId","nodeClassName","draggedNode","setDraggedNode","startNodeRef","cursorPosition","setCursorPosition","x","y","registerList","list","current","add","deregisterList","id","remove","className","ms","enabled","onDragStart","pos","startPos","startNode","nodeRef","node","rect","getBoundingClientRect","position","onDragMove","dragEndHandler","onMouseDown","onTouchStart","mouseDownHandler","e","touchStartHandler","document","body","distPercent","maxSpeedPx","initRect","undefined","dragAndDropContext","renderDraggedNode","index","style","left","top","width","initWidth","height","initHeight","zIndex"],"mappings":"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","sourcesContent":["import React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport usePreventDefaultEvent from '@os-design/use-prevent-default-event';\nimport useMemoObject from '@os-design/use-memo-object';\nimport useDrag, {\n  Position,\n  OnDragEnd,\n  OnDragMove,\n  OnDragStart,\n} from '@os-design/use-drag';\nimport Portal, { PortalProps } from '@os-design/portal';\nimport useAutoScroll from '@os-design/use-auto-scroll';\nimport { DragAndDropContext } from './utils/useDragAndDrop';\nimport ListStore from './utils/ListStore';\nimport NodeList, { ExistingNode } from './utils/NodeList';\nimport useDragEffect, {\n  DragEndHandler,\n  DraggedNode,\n} from './utils/useDragEffect';\nimport useGeneratedId from './utils/useGeneratedId';\nimport useTransitionStyle from './utils/useTransitionStyle';\nimport useInitRect from './utils/useInitRect';\n\nexport interface DragAndDropProps {\n  /**\n   * The container in which the dragged node will be rendered.\n   * @default document.body\n   */\n  draggedNodeContainer?: PortalProps['container'];\n  /**\n   * The min distance required to start dragging a node (in px).\n   * @default 10\n   */\n  minMouseDistPx?: number;\n  /**\n   * The delay of the long press event required to start dragging a node on the touch device (in ms).\n   * @default 500\n   */\n  longPressMs?: number;\n  /**\n   * The distance to the bound at which the list starts to scroll automatically (in percent).\n   * @default 20\n   */\n  autoScrollDistPercent?: number;\n  /**\n   * The max auto scroll speed (in px).\n   * @default 100\n   */\n  autoScrollMaxSpeedPx?: number;\n  /**\n   * The animation duration (in ms).\n   * @default 250\n   */\n  transitionDelayMs?: number;\n  /**\n   * The callback that is called when the drag is completed.\n   * @default undefined\n   */\n  onDragEnd?: DragEndHandler;\n  /**\n   * The children.\n   * @default undefined\n   */\n  children?: React.ReactNode;\n}\n\ninterface StartNode {\n  list: NodeList;\n  node: ExistingNode;\n}\n\n/**\n * The container containing one or more lists with draggable nodes.\n */\nconst DragAndDrop: React.FC<DragAndDropProps> = ({\n  draggedNodeContainer,\n  minMouseDistPx = 10,\n  longPressMs = 500,\n  autoScrollDistPercent = 20,\n  autoScrollMaxSpeedPx = 100,\n  transitionDelayMs = 250,\n  onDragEnd = () => {},\n  children,\n}) => {\n  // The user can drag a node between the lists (the Droppable components).\n  // To determine which list a node should be dropped in, we need to store refs to all the lists.\n  const listStoreRef = useRef<ListStore>(new ListStore());\n\n  // The class name for a node used to set the transition style\n  const generatedId = useGeneratedId(4);\n  const nodeClassName = useMemo(() => `n${generatedId}`, [generatedId]);\n\n  // The node that is currently being dragged\n  const [draggedNode, setDraggedNode] = useState<DraggedNode | null>(null);\n  const startNodeRef = useRef<StartNode | null>(null);\n  const [cursorPosition, setCursorPosition] = useState<Position>({\n    x: 0,\n    y: 0,\n  });\n\n  // Add a new list to the store\n  const registerList = useCallback((list: NodeList) => {\n    listStoreRef.current.add(list);\n  }, []);\n\n  // Remove the existing list from the store\n  const deregisterList = useCallback((id: string) => {\n    listStoreRef.current.remove(id);\n  }, []);\n\n  // Set the style to delay transitions when the node is dragging\n  useTransitionStyle({\n    className: nodeClassName,\n    ms: transitionDelayMs,\n    enabled: !!draggedNode,\n  });\n\n  const onDragStart = useCallback<OnDragStart>(\n    (pos: Position, startPos: Position) => {\n      const startNode = startNodeRef.current;\n      if (!startNode) return;\n      const [, , nodeRef] = startNode.node;\n      if (!nodeRef.current) return;\n      const rect = nodeRef.current.getBoundingClientRect();\n      setCursorPosition(pos);\n      setDraggedNode({\n        list: startNode.list,\n        node: startNode.node,\n        position: {\n          x: startPos.x - rect.x,\n          y: startPos.y - rect.y,\n        },\n      });\n      startNodeRef.current = null;\n    },\n    []\n  );\n\n  const onDragMove = useCallback<OnDragMove>((pos: Position) => {\n    setCursorPosition(pos);\n  }, []);\n\n  const dragEndHandler = useCallback<OnDragEnd>(() => {\n    setDraggedNode(null);\n  }, []);\n\n  const { onMouseDown, onTouchStart } = useDrag({\n    onDragStart,\n    onDragMove,\n    onDragEnd: dragEndHandler,\n    minMouseDistPx,\n    longPressMs,\n  });\n\n  // Handlers that determine whether a user clicks on the node\n  const mouseDownHandler = useCallback(\n    (e: MouseEvent, list: NodeList, node: ExistingNode) => {\n      startNodeRef.current = { list, node };\n      onMouseDown(e);\n    },\n    [onMouseDown]\n  );\n  const touchStartHandler = useCallback(\n    (e: TouchEvent, list: NodeList, node: ExistingNode) => {\n      startNodeRef.current = { list, node };\n      onTouchStart(e);\n    },\n    [onTouchStart]\n  );\n\n  // Prevent body scrolling when the node is dragging.\n  // It's important to attach the event to the body (not to the document). Otherwise, it won't work in mobile chrome.\n  usePreventDefaultEvent(document.body, 'touchmove', !!draggedNode);\n\n  // Implement the drag animation\n  useDragEffect({\n    draggedNode,\n    cursorPosition,\n    listStoreRef,\n    onDragEnd,\n  });\n\n  // Auto scroll if the cursor position is located near the border\n  useAutoScroll({\n    enabled: !!draggedNode,\n    distPercent: autoScrollDistPercent,\n    maxSpeedPx: autoScrollMaxSpeedPx,\n  });\n\n  const initRect = useInitRect(draggedNode ? draggedNode.node[2] : undefined);\n\n  const dragAndDropContext = useMemoObject({\n    registerList,\n    deregisterList,\n    onMouseDown: mouseDownHandler,\n    onTouchStart: touchStartHandler,\n    nodeClassName,\n  });\n\n  return (\n    <DragAndDropContext.Provider value={dragAndDropContext}>\n      {children}\n\n      {draggedNode && (\n        <Portal container={draggedNodeContainer}>\n          {draggedNode.list.renderDraggedNode({\n            index: draggedNode.node[4],\n            style: {\n              position: 'fixed',\n              left: cursorPosition.x - draggedNode.position.x,\n              top: cursorPosition.y - draggedNode.position.y,\n              width: initRect ? initRect.initWidth : undefined,\n              height: initRect ? initRect.initHeight : undefined,\n              zIndex: 1001,\n            },\n          })}\n        </Portal>\n      )}\n    </DragAndDropContext.Provider>\n  );\n};\n\nexport type { DragEndHandler } from './utils/useDragEffect';\n\nexport default DragAndDrop;\n"],"file":"DragAndDrop.js"}
+{"version":3,"file":"DragAndDrop.js","names":["React","useCallback","useMemo","useRef","useState","usePreventDefaultEvent","useMemoObject","useDrag","Portal","useAutoScroll","DragAndDropContext","ListStore","useDragEffect","useGeneratedId","useTransitionStyle","useInitRect","DragAndDrop","draggedNodeContainer","minMouseDistPx","longPressMs","autoScrollDistPercent","autoScrollMaxSpeedPx","transitionDelayMs","onDragEnd","children","listStoreRef","generatedId","nodeClassName","draggedNode","setDraggedNode","startNodeRef","cursorPosition","setCursorPosition","x","y","registerList","list","current","add","deregisterList","id","remove","className","ms","enabled","onDragStart","pos","startPos","startNode","nodeRef","node","rect","getBoundingClientRect","position","onDragMove","dragEndHandler","onMouseDown","onTouchStart","mouseDownHandler","e","touchStartHandler","document","body","distPercent","maxSpeedPx","initRect","undefined","dragAndDropContext","renderDraggedNode","index","style","left","top","width","initWidth","height","initHeight","zIndex"],"sources":["../../src/DragAndDrop.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport usePreventDefaultEvent from '@os-design/use-prevent-default-event';\nimport useMemoObject from '@os-design/use-memo-object';\nimport useDrag, {\n  Position,\n  OnDragEnd,\n  OnDragMove,\n  OnDragStart,\n} from '@os-design/use-drag';\nimport Portal, { PortalProps } from '@os-design/portal';\nimport useAutoScroll from '@os-design/use-auto-scroll';\nimport { DragAndDropContext } from './utils/useDragAndDrop';\nimport ListStore from './utils/ListStore';\nimport NodeList, { ExistingNode } from './utils/NodeList';\nimport useDragEffect, {\n  DragEndHandler,\n  DraggedNode,\n} from './utils/useDragEffect';\nimport useGeneratedId from './utils/useGeneratedId';\nimport useTransitionStyle from './utils/useTransitionStyle';\nimport useInitRect from './utils/useInitRect';\n\nexport interface DragAndDropProps {\n  /**\n   * The container in which the dragged node will be rendered.\n   * @default document.body\n   */\n  draggedNodeContainer?: PortalProps['container'];\n  /**\n   * The min distance required to start dragging a node (in px).\n   * @default 10\n   */\n  minMouseDistPx?: number;\n  /**\n   * The delay of the long press event required to start dragging a node on the touch device (in ms).\n   * @default 500\n   */\n  longPressMs?: number;\n  /**\n   * The distance to the bound at which the list starts to scroll automatically (in percent).\n   * @default 20\n   */\n  autoScrollDistPercent?: number;\n  /**\n   * The max auto scroll speed (in px).\n   * @default 100\n   */\n  autoScrollMaxSpeedPx?: number;\n  /**\n   * The animation duration (in ms).\n   * @default 250\n   */\n  transitionDelayMs?: number;\n  /**\n   * The callback that is called when the drag is completed.\n   * @default undefined\n   */\n  onDragEnd?: DragEndHandler;\n  /**\n   * The children.\n   * @default undefined\n   */\n  children?: React.ReactNode;\n}\n\ninterface StartNode {\n  list: NodeList;\n  node: ExistingNode;\n}\n\n/**\n * The container containing one or more lists with draggable nodes.\n */\nconst DragAndDrop: React.FC<DragAndDropProps> = ({\n  draggedNodeContainer,\n  minMouseDistPx = 10,\n  longPressMs = 500,\n  autoScrollDistPercent = 20,\n  autoScrollMaxSpeedPx = 100,\n  transitionDelayMs = 250,\n  onDragEnd = () => {},\n  children,\n}) => {\n  // The user can drag a node between the lists (the Droppable components).\n  // To determine which list a node should be dropped in, we need to store refs to all the lists.\n  const listStoreRef = useRef<ListStore>(new ListStore());\n\n  // The class name for a node used to set the transition style\n  const generatedId = useGeneratedId();\n  const nodeClassName = useMemo(() => `n${generatedId}`, [generatedId]);\n\n  // The node that is currently being dragged\n  const [draggedNode, setDraggedNode] = useState<DraggedNode | null>(null);\n  const startNodeRef = useRef<StartNode | null>(null);\n  const [cursorPosition, setCursorPosition] = useState<Position>({\n    x: 0,\n    y: 0,\n  });\n\n  // Add a new list to the store\n  const registerList = useCallback((list: NodeList) => {\n    listStoreRef.current.add(list);\n  }, []);\n\n  // Remove the existing list from the store\n  const deregisterList = useCallback((id: string) => {\n    listStoreRef.current.remove(id);\n  }, []);\n\n  // Set the style to delay transitions when the node is dragging\n  useTransitionStyle({\n    className: nodeClassName,\n    ms: transitionDelayMs,\n    enabled: !!draggedNode,\n  });\n\n  const onDragStart = useCallback<OnDragStart>(\n    (pos: Position, startPos: Position) => {\n      const startNode = startNodeRef.current;\n      if (!startNode) return;\n      const [, , nodeRef] = startNode.node;\n      if (!nodeRef.current) return;\n      const rect = nodeRef.current.getBoundingClientRect();\n      setCursorPosition(pos);\n      setDraggedNode({\n        list: startNode.list,\n        node: startNode.node,\n        position: {\n          x: startPos.x - rect.x,\n          y: startPos.y - rect.y,\n        },\n      });\n      startNodeRef.current = null;\n    },\n    []\n  );\n\n  const onDragMove = useCallback<OnDragMove>((pos: Position) => {\n    setCursorPosition(pos);\n  }, []);\n\n  const dragEndHandler = useCallback<OnDragEnd>(() => {\n    setDraggedNode(null);\n  }, []);\n\n  const { onMouseDown, onTouchStart } = useDrag({\n    onDragStart,\n    onDragMove,\n    onDragEnd: dragEndHandler,\n    minMouseDistPx,\n    longPressMs,\n  });\n\n  // Handlers that determine whether a user clicks on the node\n  const mouseDownHandler = useCallback(\n    (e: MouseEvent, list: NodeList, node: ExistingNode) => {\n      startNodeRef.current = { list, node };\n      onMouseDown(e);\n    },\n    [onMouseDown]\n  );\n  const touchStartHandler = useCallback(\n    (e: TouchEvent, list: NodeList, node: ExistingNode) => {\n      startNodeRef.current = { list, node };\n      onTouchStart(e);\n    },\n    [onTouchStart]\n  );\n\n  // Prevent body scrolling when the node is dragging.\n  // It's important to attach the event to the body (not to the document). Otherwise, it won't work in mobile chrome.\n  usePreventDefaultEvent(document.body, 'touchmove', !!draggedNode);\n\n  // Implement the drag animation\n  useDragEffect({\n    draggedNode,\n    cursorPosition,\n    listStoreRef,\n    onDragEnd,\n  });\n\n  // Auto scroll if the cursor position is located near the border\n  useAutoScroll({\n    enabled: !!draggedNode,\n    distPercent: autoScrollDistPercent,\n    maxSpeedPx: autoScrollMaxSpeedPx,\n  });\n\n  const initRect = useInitRect(draggedNode ? draggedNode.node[2] : undefined);\n\n  const dragAndDropContext = useMemoObject({\n    registerList,\n    deregisterList,\n    onMouseDown: mouseDownHandler,\n    onTouchStart: touchStartHandler,\n    nodeClassName,\n  });\n\n  return (\n    <DragAndDropContext.Provider value={dragAndDropContext}>\n      {children}\n\n      {draggedNode && (\n        <Portal container={draggedNodeContainer}>\n          {draggedNode.list.renderDraggedNode({\n            index: draggedNode.node[4],\n            id: draggedNode.node[5],\n            style: {\n              position: 'fixed',\n              left: cursorPosition.x - draggedNode.position.x,\n              top: cursorPosition.y - draggedNode.position.y,\n              width: initRect ? initRect.initWidth : undefined,\n              height: initRect ? initRect.initHeight : undefined,\n              zIndex: 1001,\n            },\n          })}\n        </Portal>\n      )}\n    </DragAndDropContext.Provider>\n  );\n};\n\nexport type { DragEndHandler } from './utils/useDragEffect';\n\nexport default DragAndDrop;\n"],"mappings":"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"}

package/dist/esm/Draggable.js

@@ -6,6 +6,7 @@ import useAppendClassName from './utils/useAppendClassName';
 
 const Draggable = ({
   index,
+  id,
   children
 }) => {
   // The reference to the list item
@@ -28,14 +29,15 @@ const Draggable = ({
     nodeRef.current = registerNode({
       ref,
       setStyle,
-      index
+      index,
+      id
     });
     return () => {
       if (!nodeRef.current) return;
       deregisterNode(nodeRef.current);
       nodeRef.current = null;
     };
-  }, [deregisterNode, index, registerNode]); // Set the class name for the node to apply the transition style (see the DragAndDrop container)
+  }, [deregisterNode, id, index, registerNode]); // Set the class name for the node to apply the transition style (see the DragAndDrop container)
 
   useAppendClassName(ref, nodeClassName); // Handlers that determine whether a user clicks on the node
 

package/dist/esm/Draggable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Draggable.tsx"],"names":["React","useCallback","useEffect","useRef","useState","useMemoObject","useDroppable","useDragAndDrop","useAppendClassName","Draggable","index","children","ref","nodeRef","style","setStyle","nodeClassName","registerNode","deregisterNode","onMouseDown","onTouchStart","current","mouseDownHandler","e","touchStartHandler","handlers"],"mappings":"AAAA,OAAOA,KAAP,IAGEC,WAHF,EAIEC,SAJF,EAKEC,MALF,EAMEC,QANF,QASO,OATP;AAUA,OAAOC,aAAP,MAA0B,4BAA1B;AAEA,OAAOC,YAAP,MAAyB,sBAAzB;AACA,OAAOC,cAAP,MAA2B,wBAA3B;AACA,OAAOC,kBAAP,MAA+B,4BAA/B;;AAuCA,MAAMC,SAAmC,GAAG,CAAC;AAAEC,EAAAA,KAAF;AAASC,EAAAA;AAAT,CAAD,KAAyB;AACnE;AACA,QAAMC,GAAG,GAAGT,MAAM,CAAwB,IAAxB,CAAlB,CAFmE,CAGnE;;AACA,QAAMU,OAAO,GAAGV,MAAM,CAAO,IAAP,CAAtB,CAJmE,CAKnE;;AACA,QAAM,CAACW,KAAD,EAAQC,QAAR,IAAoBX,QAAQ,CAAgB,EAAhB,CAAlC;AAEA,QAAM;AAAEY,IAAAA;AAAF,MAAoBT,cAAc,EAAxC;AACA,QAAM;AAAEU,IAAAA,YAAF;AAAgBC,IAAAA,cAAhB;AAAgCC,IAAAA,WAAhC;AAA6CC,IAAAA;AAA7C,MACJd,YAAY,EADd,CATmE,CAYnE;;AACAJ,EAAAA,SAAS,CAAC,MAAM;AACdW,IAAAA,OAAO,CAACQ,OAAR,GAAkBJ,YAAY,CAAC;AAAEL,MAAAA,GAAF;AAAOG,MAAAA,QAAP;AAAiBL,MAAAA;AAAjB,KAAD,CAA9B;AACA,WAAO,MAAM;AACX,UAAI,CAACG,OAAO,CAACQ,OAAb,EAAsB;AACtBH,MAAAA,cAAc,CAACL,OAAO,CAACQ,OAAT,CAAd;AACAR,MAAAA,OAAO,CAACQ,OAAR,GAAkB,IAAlB;AACD,KAJD;AAKD,GAPQ,EAON,CAACH,cAAD,EAAiBR,KAAjB,EAAwBO,YAAxB,CAPM,CAAT,CAbmE,CAsBnE;;AACAT,EAAAA,kBAAkB,CAACI,GAAD,EAAMI,aAAN,CAAlB,CAvBmE,CAyBnE;;AACA,QAAMM,gBAAgB,GAAGrB,WAAW,CACjCsB,CAAD,IAAmB;AACjB,QAAI,CAACV,OAAO,CAACQ,OAAb,EAAsB;AACtBF,IAAAA,WAAW,CAACI,CAAD,EAAIV,OAAO,CAACQ,OAAZ,CAAX;AACD,GAJiC,EAKlC,CAACF,WAAD,CALkC,CAApC;AAOA,QAAMK,iBAAiB,GAAGvB,WAAW,CAClCsB,CAAD,IAAmB;AACjB,QAAI,CAACV,OAAO,CAACQ,OAAb,EAAsB;AACtBD,IAAAA,YAAY,CAACG,CAAD,EAAIV,OAAO,CAACQ,OAAZ,CAAZ;AACD,GAJkC,EAKnC,CAACD,YAAD,CALmC,CAArC;AAQA,QAAMK,QAAQ,GAAGpB,aAAa,CAAC;AAC7Bc,IAAAA,WAAW,EAAEG,gBADgB;AAE7BF,IAAAA,YAAY,EAAEI;AAFe,GAAD,CAA9B;AAKA,sBAAO,0CAAGb,QAAQ,CAAC;AAAEC,IAAAA,GAAF;AAAOE,IAAAA,KAAP;AAAcW,IAAAA;AAAd,GAAD,CAAX,CAAP;AACD,CA/CD;;AAiDA,eAAehB,SAAf","sourcesContent":["import React, {\n  CSSProperties,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport useMemoObject from '@os-design/use-memo-object';\nimport { Node } from './utils/NodeList';\nimport useDroppable from './utils/useDroppable';\nimport useDragAndDrop from './utils/useDragAndDrop';\nimport useAppendClassName from './utils/useAppendClassName';\n\nexport interface DraggableHandlers {\n  /**\n   * The handler that should be called when the mouse down event occurs.\n   */\n  onMouseDown: (e: MouseEvent) => void;\n  /**\n   * The handler that should be called when the touch start event occurs.\n   */\n  onTouchStart: (e: TouchEvent) => void;\n}\n\nexport interface DraggableChildrenProps {\n  /**\n   * The reference to the draggable list item.\n   */\n  ref: RefObject<any>; // eslint-disable-line @typescript-eslint/no-explicit-any\n  /**\n   * Additional styles for moving the list item.\n   */\n  style: CSSProperties;\n  /**\n   * The handlers to catch events when the user starts dragging the list item.\n   */\n  handlers: DraggableHandlers;\n}\n\nexport interface DraggableProps {\n  /**\n   * The index of the draggable node.\n   */\n  index: number;\n  /**\n   * The function that renders the draggable node.\n   */\n  children: (props: DraggableChildrenProps) => React.ReactNode;\n}\n\nconst Draggable: React.FC<DraggableProps> = ({ index, children }) => {\n  // The reference to the list item\n  const ref = useRef<HTMLDivElement | null>(null);\n  // The reference to the node containing the refs to the prev and next nodes\n  const nodeRef = useRef<Node>(null);\n  // Additional styles for moving the list item\n  const [style, setStyle] = useState<CSSProperties>({});\n\n  const { nodeClassName } = useDragAndDrop();\n  const { registerNode, deregisterNode, onMouseDown, onTouchStart } =\n    useDroppable();\n\n  // Register the node in the list\n  useEffect(() => {\n    nodeRef.current = registerNode({ ref, setStyle, index });\n    return () => {\n      if (!nodeRef.current) return;\n      deregisterNode(nodeRef.current);\n      nodeRef.current = null;\n    };\n  }, [deregisterNode, index, registerNode]);\n\n  // Set the class name for the node to apply the transition style (see the DragAndDrop container)\n  useAppendClassName(ref, nodeClassName);\n\n  // Handlers that determine whether a user clicks on the node\n  const mouseDownHandler = useCallback(\n    (e: MouseEvent) => {\n      if (!nodeRef.current) return;\n      onMouseDown(e, nodeRef.current);\n    },\n    [onMouseDown]\n  );\n  const touchStartHandler = useCallback(\n    (e: TouchEvent) => {\n      if (!nodeRef.current) return;\n      onTouchStart(e, nodeRef.current);\n    },\n    [onTouchStart]\n  );\n\n  const handlers = useMemoObject({\n    onMouseDown: mouseDownHandler,\n    onTouchStart: touchStartHandler,\n  });\n\n  return <>{children({ ref, style, handlers })}</>;\n};\n\nexport default Draggable;\n"],"file":"Draggable.js"}
+{"version":3,"file":"Draggable.js","names":["React","useCallback","useEffect","useRef","useState","useMemoObject","useDroppable","useDragAndDrop","useAppendClassName","Draggable","index","id","children","ref","nodeRef","style","setStyle","nodeClassName","registerNode","deregisterNode","onMouseDown","onTouchStart","current","mouseDownHandler","e","touchStartHandler","handlers"],"sources":["../../src/Draggable.tsx"],"sourcesContent":["import React, {\n  CSSProperties,\n  RefObject,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport useMemoObject from '@os-design/use-memo-object';\nimport { Node } from './utils/NodeList';\nimport useDroppable from './utils/useDroppable';\nimport useDragAndDrop from './utils/useDragAndDrop';\nimport useAppendClassName from './utils/useAppendClassName';\n\nexport interface DraggableHandlers {\n  /**\n   * The handler that should be called when the mouse down event occurs.\n   */\n  onMouseDown: (e: MouseEvent) => void;\n  /**\n   * The handler that should be called when the touch start event occurs.\n   */\n  onTouchStart: (e: TouchEvent) => void;\n}\n\nexport interface DraggableChildrenProps {\n  /**\n   * The reference to the draggable list item.\n   */\n  ref: RefObject<any>; // eslint-disable-line @typescript-eslint/no-explicit-any\n  /**\n   * Additional styles for moving the list item.\n   */\n  style: CSSProperties;\n  /**\n   * The handlers to catch events when the user starts dragging the list item.\n   */\n  handlers: DraggableHandlers;\n}\n\nexport interface DraggableProps {\n  /**\n   * The index of the draggable node.\n   */\n  index: number;\n  /**\n   * The ID of the draggable node.\n   */\n  id: string;\n  /**\n   * The function that renders the draggable node.\n   */\n  children: (props: DraggableChildrenProps) => React.ReactNode;\n}\n\nconst Draggable: React.FC<DraggableProps> = ({ index, id, children }) => {\n  // The reference to the list item\n  const ref = useRef<HTMLDivElement | null>(null);\n  // The reference to the node containing the refs to the prev and next nodes\n  const nodeRef = useRef<Node>(null);\n  // Additional styles for moving the list item\n  const [style, setStyle] = useState<CSSProperties>({});\n\n  const { nodeClassName } = useDragAndDrop();\n  const { registerNode, deregisterNode, onMouseDown, onTouchStart } =\n    useDroppable();\n\n  // Register the node in the list\n  useEffect(() => {\n    nodeRef.current = registerNode({ ref, setStyle, index, id });\n    return () => {\n      if (!nodeRef.current) return;\n      deregisterNode(nodeRef.current);\n      nodeRef.current = null;\n    };\n  }, [deregisterNode, id, index, registerNode]);\n\n  // Set the class name for the node to apply the transition style (see the DragAndDrop container)\n  useAppendClassName(ref, nodeClassName);\n\n  // Handlers that determine whether a user clicks on the node\n  const mouseDownHandler = useCallback(\n    (e: MouseEvent) => {\n      if (!nodeRef.current) return;\n      onMouseDown(e, nodeRef.current);\n    },\n    [onMouseDown]\n  );\n  const touchStartHandler = useCallback(\n    (e: TouchEvent) => {\n      if (!nodeRef.current) return;\n      onTouchStart(e, nodeRef.current);\n    },\n    [onTouchStart]\n  );\n\n  const handlers = useMemoObject({\n    onMouseDown: mouseDownHandler,\n    onTouchStart: touchStartHandler,\n  });\n\n  return <>{children({ ref, style, handlers })}</>;\n};\n\nexport default Draggable;\n"],"mappings":"AAAA,OAAOA,KAAP,IAGEC,WAHF,EAIEC,SAJF,EAKEC,MALF,EAMEC,QANF,QASO,OATP;AAUA,OAAOC,aAAP,MAA0B,4BAA1B;AAEA,OAAOC,YAAP,MAAyB,sBAAzB;AACA,OAAOC,cAAP,MAA2B,wBAA3B;AACA,OAAOC,kBAAP,MAA+B,4BAA/B;;AA2CA,MAAMC,SAAmC,GAAG,CAAC;EAAEC,KAAF;EAASC,EAAT;EAAaC;AAAb,CAAD,KAA6B;EACvE;EACA,MAAMC,GAAG,GAAGV,MAAM,CAAwB,IAAxB,CAAlB,CAFuE,CAGvE;;EACA,MAAMW,OAAO,GAAGX,MAAM,CAAO,IAAP,CAAtB,CAJuE,CAKvE;;EACA,MAAM,CAACY,KAAD,EAAQC,QAAR,IAAoBZ,QAAQ,CAAgB,EAAhB,CAAlC;EAEA,MAAM;IAAEa;EAAF,IAAoBV,cAAc,EAAxC;EACA,MAAM;IAAEW,YAAF;IAAgBC,cAAhB;IAAgCC,WAAhC;IAA6CC;EAA7C,IACJf,YAAY,EADd,CATuE,CAYvE;;EACAJ,SAAS,CAAC,MAAM;IACdY,OAAO,CAACQ,OAAR,GAAkBJ,YAAY,CAAC;MAAEL,GAAF;MAAOG,QAAP;MAAiBN,KAAjB;MAAwBC;IAAxB,CAAD,CAA9B;IACA,OAAO,MAAM;MACX,IAAI,CAACG,OAAO,CAACQ,OAAb,EAAsB;MACtBH,cAAc,CAACL,OAAO,CAACQ,OAAT,CAAd;MACAR,OAAO,CAACQ,OAAR,GAAkB,IAAlB;IACD,CAJD;EAKD,CAPQ,EAON,CAACH,cAAD,EAAiBR,EAAjB,EAAqBD,KAArB,EAA4BQ,YAA5B,CAPM,CAAT,CAbuE,CAsBvE;;EACAV,kBAAkB,CAACK,GAAD,EAAMI,aAAN,CAAlB,CAvBuE,CAyBvE;;EACA,MAAMM,gBAAgB,GAAGtB,WAAW,CACjCuB,CAAD,IAAmB;IACjB,IAAI,CAACV,OAAO,CAACQ,OAAb,EAAsB;IACtBF,WAAW,CAACI,CAAD,EAAIV,OAAO,CAACQ,OAAZ,CAAX;EACD,CAJiC,EAKlC,CAACF,WAAD,CALkC,CAApC;EAOA,MAAMK,iBAAiB,GAAGxB,WAAW,CAClCuB,CAAD,IAAmB;IACjB,IAAI,CAACV,OAAO,CAACQ,OAAb,EAAsB;IACtBD,YAAY,CAACG,CAAD,EAAIV,OAAO,CAACQ,OAAZ,CAAZ;EACD,CAJkC,EAKnC,CAACD,YAAD,CALmC,CAArC;EAQA,MAAMK,QAAQ,GAAGrB,aAAa,CAAC;IAC7Be,WAAW,EAAEG,gBADgB;IAE7BF,YAAY,EAAEI;EAFe,CAAD,CAA9B;EAKA,oBAAO,0CAAGb,QAAQ,CAAC;IAAEC,GAAF;IAAOE,KAAP;IAAcW;EAAd,CAAD,CAAX,CAAP;AACD,CA/CD;;AAiDA,eAAejB,SAAf"}

package/dist/esm/Droppable.js

@@ -16,7 +16,7 @@ const Droppable = ({
 
   const innerRef = useRef(null); // The unique ID of the list. If no ID was specified, the generated one is used.
 
-  const generatedId = useGeneratedId(10);
+  const generatedId = useGeneratedId();
   const droppableId = useMemo(() => id || generatedId, [generatedId, id]); // The reference to the list of nodes
 
   const listRef = useRef(new NodeList({

package/dist/esm/Droppable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Droppable.tsx"],"names":["React","useCallback","useEffect","useMemo","useRef","useMemoObject","NodeList","useDragAndDrop","DroppableContext","useGeneratedId","Droppable","renderDraggedNode","id","horizontal","children","ref","innerRef","generatedId","droppableId","listRef","current","registerList","deregisterList","onMouseDown","onTouchStart","listId","registerNode","props","add","deregisterNode","node","remove","mouseDownHandler","e","touchStartHandler","droppableContext"],"mappings":"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","sourcesContent":["import React, {\n  RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport useMemoObject from '@os-design/use-memo-object';\nimport NodeList, {\n  ExistingNode,\n  NodeProps,\n  RenderDraggedNode,\n} from './utils/NodeList';\nimport useDragAndDrop from './utils/useDragAndDrop';\nimport { DroppableContext } from './utils/useDroppable';\nimport useGeneratedId from './utils/useGeneratedId';\n\nexport interface DroppableChildrenProps {\n  /**\n   * The reference to the list.\n   * If a virtual list is used, pass it to the outerRef prop.\n   */\n  ref: RefObject<HTMLDivElement>;\n  /**\n   * The reference to the container inside the virtual list.\n   * Pass it to the innerRef prop.\n   */\n  innerRef: RefObject<HTMLDivElement>;\n}\n\nexport interface DroppableProps {\n  /**\n   * The function that renders the dragged node.\n   */\n  renderDraggedNode: RenderDraggedNode;\n  /**\n   * The ID of the list with draggable nodes.\n   * Used to determine in which list the dragged node was dropped.\n   * @default undefined\n   */\n  id?: string;\n  /**\n   * Whether the list is horizontal.\n   * @default false\n   */\n  horizontal?: boolean;\n  /**\n   * The function that renders the list with draggable nodes.\n   */\n  children: (props: DroppableChildrenProps) => React.ReactNode;\n}\n\nconst Droppable: React.FC<DroppableProps> = ({\n  renderDraggedNode,\n  id,\n  horizontal = false,\n  children,\n}) => {\n  // The reference to the list\n  const ref = useRef<HTMLDivElement>(null);\n  // The reference to the container inside the virtual list\n  const innerRef = useRef<HTMLDivElement>(null);\n  // The unique ID of the list. If no ID was specified, the generated one is used.\n  const generatedId = useGeneratedId(10);\n  const droppableId = useMemo(() => id || generatedId, [generatedId, id]);\n  // The reference to the list of nodes\n  const listRef = useRef(\n    new NodeList({\n      id: droppableId,\n      ref,\n      innerRef,\n      horizontal,\n      renderDraggedNode,\n    })\n  );\n\n  // Update the ID of the list if it changes\n  useEffect(() => {\n    listRef.current.id = droppableId;\n  }, [droppableId]);\n\n  // Update the list orientation if it changes.\n  // There is no need to check the order of the nodes in the list because it will be the same.\n  useEffect(() => {\n    listRef.current.horizontal = horizontal;\n  }, [horizontal]);\n\n  // Update the callback that renders the dragged node if it changes\n  useEffect(() => {\n    listRef.current.renderDraggedNode = renderDraggedNode;\n  }, [renderDraggedNode]);\n\n  const { registerList, deregisterList, onMouseDown, onTouchStart } =\n    useDragAndDrop();\n\n  // Register the list in the store\n  useEffect(() => {\n    registerList(listRef.current);\n    const listId = listRef.current.id;\n    return () => deregisterList(listId);\n  }, [deregisterList, registerList]);\n\n  const registerNode = useCallback(\n    (props: NodeProps) => listRef.current.add(props),\n    []\n  );\n  const deregisterNode = useCallback((node: ExistingNode) => {\n    listRef.current.remove(node);\n  }, []);\n\n  // Handlers that determine whether a user clicks on the node\n  const mouseDownHandler = useCallback(\n    (e: MouseEvent, node: ExistingNode) => {\n      onMouseDown(e, listRef.current, node);\n    },\n    [onMouseDown]\n  );\n  const touchStartHandler = useCallback(\n    (e: TouchEvent, node: ExistingNode) => {\n      onTouchStart(e, listRef.current, node);\n    },\n    [onTouchStart]\n  );\n\n  const droppableContext = useMemoObject({\n    registerNode,\n    deregisterNode,\n    onMouseDown: mouseDownHandler,\n    onTouchStart: touchStartHandler,\n  });\n\n  return (\n    <DroppableContext.Provider value={droppableContext}>\n      {(children as Function)({ ref, innerRef })}\n    </DroppableContext.Provider>\n  );\n};\n\nexport default Droppable;\n"],"file":"Droppable.js"}
+{"version":3,"file":"Droppable.js","names":["React","useCallback","useEffect","useMemo","useRef","useMemoObject","NodeList","useDragAndDrop","DroppableContext","useGeneratedId","Droppable","renderDraggedNode","id","horizontal","children","ref","innerRef","generatedId","droppableId","listRef","current","registerList","deregisterList","onMouseDown","onTouchStart","listId","registerNode","props","add","deregisterNode","node","remove","mouseDownHandler","e","touchStartHandler","droppableContext"],"sources":["../../src/Droppable.tsx"],"sourcesContent":["import React, {\n  RefObject,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  MouseEvent,\n  TouchEvent,\n} from 'react';\nimport useMemoObject from '@os-design/use-memo-object';\nimport NodeList, {\n  ExistingNode,\n  NodeProps,\n  RenderDraggedNode,\n} from './utils/NodeList';\nimport useDragAndDrop from './utils/useDragAndDrop';\nimport { DroppableContext } from './utils/useDroppable';\nimport useGeneratedId from './utils/useGeneratedId';\n\nexport interface DroppableChildrenProps {\n  /**\n   * The reference to the list.\n   * If a virtual list is used, pass it to the outerRef prop.\n   */\n  ref: RefObject<HTMLDivElement>;\n  /**\n   * The reference to the container inside the virtual list.\n   * Pass it to the innerRef prop.\n   */\n  innerRef: RefObject<HTMLDivElement>;\n}\n\nexport interface DroppableProps {\n  /**\n   * The function that renders the dragged node.\n   */\n  renderDraggedNode: RenderDraggedNode;\n  /**\n   * The ID of the list with draggable nodes.\n   * Used to determine in which list the dragged node was dropped.\n   * @default undefined\n   */\n  id?: string;\n  /**\n   * Whether the list is horizontal.\n   * @default false\n   */\n  horizontal?: boolean;\n  /**\n   * The function that renders the list with draggable nodes.\n   */\n  children: (props: DroppableChildrenProps) => React.ReactNode;\n}\n\nconst Droppable: React.FC<DroppableProps> = ({\n  renderDraggedNode,\n  id,\n  horizontal = false,\n  children,\n}) => {\n  // The reference to the list\n  const ref = useRef<HTMLDivElement>(null);\n  // The reference to the container inside the virtual list\n  const innerRef = useRef<HTMLDivElement>(null);\n  // The unique ID of the list. If no ID was specified, the generated one is used.\n  const generatedId = useGeneratedId();\n  const droppableId = useMemo(() => id || generatedId, [generatedId, id]);\n  // The reference to the list of nodes\n  const listRef = useRef(\n    new NodeList({\n      id: droppableId,\n      ref,\n      innerRef,\n      horizontal,\n      renderDraggedNode,\n    })\n  );\n\n  // Update the ID of the list if it changes\n  useEffect(() => {\n    listRef.current.id = droppableId;\n  }, [droppableId]);\n\n  // Update the list orientation if it changes.\n  // There is no need to check the order of the nodes in the list because it will be the same.\n  useEffect(() => {\n    listRef.current.horizontal = horizontal;\n  }, [horizontal]);\n\n  // Update the callback that renders the dragged node if it changes\n  useEffect(() => {\n    listRef.current.renderDraggedNode = renderDraggedNode;\n  }, [renderDraggedNode]);\n\n  const { registerList, deregisterList, onMouseDown, onTouchStart } =\n    useDragAndDrop();\n\n  // Register the list in the store\n  useEffect(() => {\n    registerList(listRef.current);\n    const listId = listRef.current.id;\n    return () => deregisterList(listId);\n  }, [deregisterList, registerList]);\n\n  const registerNode = useCallback(\n    (props: NodeProps) => listRef.current.add(props),\n    []\n  );\n  const deregisterNode = useCallback((node: ExistingNode) => {\n    listRef.current.remove(node);\n  }, []);\n\n  // Handlers that determine whether a user clicks on the node\n  const mouseDownHandler = useCallback(\n    (e: MouseEvent, node: ExistingNode) => {\n      onMouseDown(e, listRef.current, node);\n    },\n    [onMouseDown]\n  );\n  const touchStartHandler = useCallback(\n    (e: TouchEvent, node: ExistingNode) => {\n      onTouchStart(e, listRef.current, node);\n    },\n    [onTouchStart]\n  );\n\n  const droppableContext = useMemoObject({\n    registerNode,\n    deregisterNode,\n    onMouseDown: mouseDownHandler,\n    onTouchStart: touchStartHandler,\n  });\n\n  return (\n    <DroppableContext.Provider value={droppableContext}>\n      {(children as Function)({ ref, innerRef })}\n    </DroppableContext.Provider>\n  );\n};\n\nexport default Droppable;\n"],"mappings":"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"}

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"names":["default","DragAndDrop","Droppable","Draggable"],"mappings":"AAAA,SAASA,OAAO,IAAIC,WAApB,QAAuC,eAAvC;AACA,SAASD,OAAO,IAAIE,SAApB,QAAqC,aAArC;AACA,SAASF,OAAO,IAAIG,SAApB,QAAqC,aAArC;AAEA,cAAc,eAAd;AACA,cAAc,aAAd;AACA,cAAc,aAAd","sourcesContent":["export { default as DragAndDrop } from './DragAndDrop';\nexport { default as Droppable } from './Droppable';\nexport { default as Draggable } from './Draggable';\n\nexport * from './DragAndDrop';\nexport * from './Droppable';\nexport * from './Draggable';\n"],"file":"index.js"}
+{"version":3,"file":"index.js","names":["default","DragAndDrop","Droppable","Draggable"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as DragAndDrop } from './DragAndDrop';\nexport { default as Droppable } from './Droppable';\nexport { default as Draggable } from './Draggable';\n\nexport * from './DragAndDrop';\nexport * from './Droppable';\nexport * from './Draggable';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,WAApB,QAAuC,eAAvC;AACA,SAASD,OAAO,IAAIE,SAApB,QAAqC,aAArC;AACA,SAASF,OAAO,IAAIG,SAApB,QAAqC,aAArC;AAEA,cAAc,eAAd;AACA,cAAc,aAAd;AACA,cAAc,aAAd"}

package/dist/esm/utils/ListStore.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/ListStore.ts"],"names":["ListStore","constructor","lists","add","list","push","remove","id","index","findIndex","item","splice","findByPosition","x","y","find","current","ref","rect","getBoundingClientRect","width","height"],"mappings":"AAEA;AACA;AACA;AACA,MAAMA,SAAN,CAAgB;AAGPC,EAAAA,WAAW,GAAG;AAAA,SAFbC,KAEa;AACnB,SAAKA,KAAL,GAAa,EAAb;AACD;AAED;AACF;AACA;;;AACSC,EAAAA,GAAG,CAACC,IAAD,EAAiB;AACzB,SAAKF,KAAL,CAAWG,IAAX,CAAgBD,IAAhB;AACD;AAED;AACF;AACA;;;AACSE,EAAAA,MAAM,CAACC,EAAD,EAAa;AACxB,UAAMC,KAAK,GAAG,KAAKN,KAAL,CAAWO,SAAX,CAAsBC,IAAD,IAAUA,IAAI,CAACH,EAAL,KAAYA,EAA3C,CAAd;AACA,QAAIC,KAAK,KAAK,CAAC,CAAf,EAAkB;AAClB,SAAKN,KAAL,CAAWS,MAAX,CAAkBH,KAAlB,EAAyB,CAAzB;AACD;AAED;AACF;AACA;;;AACSI,EAAAA,cAAc,CAACC,CAAD,EAAYC,CAAZ,EAAuB;AAC1C,WAAO,KAAKZ,KAAL,CAAWa,IAAX,CAAiBX,IAAD,IAAU;AAC/B,YAAM;AAAEY,QAAAA;AAAF,UAAcZ,IAAI,CAACa,GAAzB;AACA,UAAI,CAACD,OAAL,EAAc,OAAO,KAAP;AACd,YAAME,IAAI,GAAGF,OAAO,CAACG,qBAAR,EAAb;AACA,aACEN,CAAC,IAAIK,IAAI,CAACL,CAAV,IACAA,CAAC,IAAIK,IAAI,CAACL,CAAL,GAASK,IAAI,CAACE,KADnB,IAEAN,CAAC,IAAII,IAAI,CAACJ,CAFV,IAGAA,CAAC,IAAII,IAAI,CAACJ,CAAL,GAASI,IAAI,CAACG,MAJrB;AAMD,KAVM,CAAP;AAWD;;AAtCa;;AAyChB,eAAerB,SAAf","sourcesContent":["import NodeList from './NodeList';\n\n/**\n * Stores all the lists where the draggable items is located.\n */\nclass ListStore {\n  private lists: NodeList[];\n\n  public constructor() {\n    this.lists = [];\n  }\n\n  /**\n   * Adds a new list to the store.\n   */\n  public add(list: NodeList) {\n    this.lists.push(list);\n  }\n\n  /**\n   * Removes the list from the store.\n   */\n  public remove(id: string) {\n    const index = this.lists.findIndex((item) => item.id === id);\n    if (index === -1) return;\n    this.lists.splice(index, 1);\n  }\n\n  /**\n   * Returns the list in which the position is located.\n   */\n  public findByPosition(x: number, y: number) {\n    return this.lists.find((list) => {\n      const { current } = list.ref;\n      if (!current) return false;\n      const rect = current.getBoundingClientRect();\n      return (\n        x >= rect.x &&\n        x <= rect.x + rect.width &&\n        y >= rect.y &&\n        y <= rect.y + rect.height\n      );\n    });\n  }\n}\n\nexport default ListStore;\n"],"file":"ListStore.js"}
+{"version":3,"file":"ListStore.js","names":["ListStore","constructor","lists","add","list","push","remove","id","index","findIndex","item","splice","findByPosition","x","y","find","current","ref","rect","getBoundingClientRect","width","height"],"sources":["../../../src/utils/ListStore.ts"],"sourcesContent":["import NodeList from './NodeList';\n\n/**\n * Stores all the lists where the draggable items is located.\n */\nclass ListStore {\n  private lists: NodeList[];\n\n  public constructor() {\n    this.lists = [];\n  }\n\n  /**\n   * Adds a new list to the store.\n   */\n  public add(list: NodeList) {\n    this.lists.push(list);\n  }\n\n  /**\n   * Removes the list from the store.\n   */\n  public remove(id: string) {\n    const index = this.lists.findIndex((item) => item.id === id);\n    if (index === -1) return;\n    this.lists.splice(index, 1);\n  }\n\n  /**\n   * Returns the list in which the position is located.\n   */\n  public findByPosition(x: number, y: number) {\n    return this.lists.find((list) => {\n      const { current } = list.ref;\n      if (!current) return false;\n      const rect = current.getBoundingClientRect();\n      return (\n        x >= rect.x &&\n        x <= rect.x + rect.width &&\n        y >= rect.y &&\n        y <= rect.y + rect.height\n      );\n    });\n  }\n}\n\nexport default ListStore;\n"],"mappings":"AAEA;AACA;AACA;AACA,MAAMA,SAAN,CAAgB;EAGPC,WAAW,GAAG;IAAA,KAFbC,KAEa;IACnB,KAAKA,KAAL,GAAa,EAAb;EACD;EAED;AACF;AACA;;;EACSC,GAAG,CAACC,IAAD,EAAiB;IACzB,KAAKF,KAAL,CAAWG,IAAX,CAAgBD,IAAhB;EACD;EAED;AACF;AACA;;;EACSE,MAAM,CAACC,EAAD,EAAa;IACxB,MAAMC,KAAK,GAAG,KAAKN,KAAL,CAAWO,SAAX,CAAsBC,IAAD,IAAUA,IAAI,CAACH,EAAL,KAAYA,EAA3C,CAAd;IACA,IAAIC,KAAK,KAAK,CAAC,CAAf,EAAkB;IAClB,KAAKN,KAAL,CAAWS,MAAX,CAAkBH,KAAlB,EAAyB,CAAzB;EACD;EAED;AACF;AACA;;;EACSI,cAAc,CAACC,CAAD,EAAYC,CAAZ,EAAuB;IAC1C,OAAO,KAAKZ,KAAL,CAAWa,IAAX,CAAiBX,IAAD,IAAU;MAC/B,MAAM;QAAEY;MAAF,IAAcZ,IAAI,CAACa,GAAzB;MACA,IAAI,CAACD,OAAL,EAAc,OAAO,KAAP;MACd,MAAME,IAAI,GAAGF,OAAO,CAACG,qBAAR,EAAb;MACA,OACEN,CAAC,IAAIK,IAAI,CAACL,CAAV,IACAA,CAAC,IAAIK,IAAI,CAACL,CAAL,GAASK,IAAI,CAACE,KADnB,IAEAN,CAAC,IAAII,IAAI,CAACJ,CAFV,IAGAA,CAAC,IAAII,IAAI,CAACJ,CAAL,GAASI,IAAI,CAACG,MAJrB;IAMD,CAVM,CAAP;EAWD;;AAtCa;;AAyChB,eAAerB,SAAf"}

package/dist/esm/utils/NodeList.js

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any,no-param-reassign,prefer-destructuring,no-constant-condition */
-// [prev, next, ref, setStyle, index]
+// [prev, next, ref, setStyle, index, id]
 
 /**
  * Stores all the draggable items in the list.
@@ -71,7 +71,7 @@ class NodeList {
 
 
   addToTheBeginning(props) {
-    this.head = [null, this.head, props.ref, props.setStyle, props.index];
+    this.head = [null, this.head, props.ref, props.setStyle, props.index, props.id];
     const [, next] = this.head;
     if (next) next[0] = this.head; // Set the prev cursor of the next element
 
@@ -85,7 +85,7 @@ class NodeList {
 
 
   addToTheEnd(props) {
-    this.tail = [this.tail, null, props.ref, props.setStyle, props.index];
+    this.tail = [this.tail, null, props.ref, props.setStyle, props.index, props.id];
     const [prev] = this.tail;
     if (prev) prev[1] = this.tail; // Set the next cursor of the prev element
 
@@ -99,7 +99,7 @@ class NodeList {
 
 
   static addAfter(node, props) {
-    node[1] = [node, node[1], props.ref, props.setStyle, props.index];
+    node[1] = [node, node[1], props.ref, props.setStyle, props.index, props.id];
     if (node[1][1]) node[1][1][0] = node[1];
     return node[1];
   }