import{jsx as _jsx}from"react/jsx-runtime";import{useSortable}from"@dnd-kit/sortable";import{CSS}from"@dnd-kit/utilities";import{iOS}from"../../utilities.js";import{TreeItem}from"./TreeItem.js";const animateLayoutChanges=({isSorting:t,wasDragging:e})=>!t&&!e;export function SortableTreeItem({id:t,depth:e,...r}){const{attributes:i,isDragging:a,isSorting:s,listeners:o,setDraggableNodeRef:n,setDroppableNodeRef:m,transform:g,transition:l}=useSortable({id:t,animateLayoutChanges:animateLayoutChanges}),d={transform:CSS.Translate.toString(g),transition:l};return _jsx(TreeItem,{id:`nav-${t}`,ref:n,wrapperRef:m,style:d,depth:e,ghost:a,disableSelection:iOS,disableInteraction:s,handleProps:{...i,...o},...r})}