{"version":3,"file":"SortableList.mjs","names":["Flexbox"],"sources":["../../src/SortableList/SortableList.tsx"],"sourcesContent":["'use client';\n\nimport {\n  type Active,\n  DndContext,\n  KeyboardSensor,\n  PointerSensor,\n  useSensor,\n  useSensors,\n} from '@dnd-kit/core';\nimport { restrictToVerticalAxis, restrictToWindowEdges } from '@dnd-kit/modifiers';\nimport {\n  arrayMove,\n  SortableContext,\n  sortableKeyboardCoordinates,\n  verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { Fragment, memo, type ReactNode, useMemo, useState } from 'react';\n\nimport { Flexbox } from '@/Flex';\n\nimport DragHandle from './components/DragHandle';\nimport SortableItem from './components/SortableItem';\nimport SortableOverlay from './components/SortableOverlay';\nimport { styles } from './style';\nimport { type SortableListItem, type SortableListProps } from './type';\n\nconst SortableListParent = memo<SortableListProps>(\n  ({ ref, items, onChange, renderItem, gap = 8, ...rest }) => {\n    const [active, setActive] = useState<Active | null>(null);\n    const activeItem = useMemo(() => items.find((item) => item.id === active?.id), [active, items]);\n    const sensors = useSensors(\n      useSensor(PointerSensor),\n      useSensor(KeyboardSensor, {\n        coordinateGetter: sortableKeyboardCoordinates,\n      }),\n    );\n\n    return (\n      <DndContext\n        modifiers={[restrictToVerticalAxis, restrictToWindowEdges]}\n        sensors={sensors}\n        onDragCancel={() => {\n          setActive(null);\n        }}\n        onDragEnd={({ active, over }) => {\n          if (over && active.id !== over?.id) {\n            const activeIndex = items.findIndex(({ id }) => id === active.id);\n            const overIndex = items.findIndex(({ id }) => id === over.id);\n\n            onChange(arrayMove(items, activeIndex, overIndex));\n          }\n          setActive(null);\n        }}\n        onDragStart={({ active }) => {\n          setActive(active);\n        }}\n      >\n        <SortableContext items={items} strategy={verticalListSortingStrategy}>\n          <Flexbox as={'ul'} className={styles.container} gap={gap} ref={ref} {...rest}>\n            {items.map((item) => (\n              <Fragment key={item.id}>{renderItem(item)}</Fragment>\n            ))}\n          </Flexbox>\n        </SortableContext>\n        <SortableOverlay>{activeItem ? renderItem(activeItem) : null}</SortableOverlay>\n      </DndContext>\n    );\n  },\n);\n\nSortableListParent.displayName = 'SortableList';\n\nexport interface ISortableList {\n  <T extends SortableListItem = SortableListItem>(props: SortableListProps<T>): ReactNode;\n  DragHandle: typeof DragHandle;\n  Item: typeof SortableItem;\n}\n\nconst SortableList = SortableListParent as unknown as ISortableList;\n\nSortableList.Item = SortableItem;\nSortableList.DragHandle = DragHandle;\n\nexport default SortableList;\n"],"mappings":";;;;;;;;;;;;AA2BA,MAAM,qBAAqB,MACxB,EAAE,KAAK,OAAO,UAAU,YAAY,MAAM,GAAG,GAAG,WAAW;CAC1D,MAAM,CAAC,QAAQ,aAAa,SAAwB,KAAK;CACzD,MAAM,aAAa,cAAc,MAAM,MAAM,SAAS,KAAK,OAAO,QAAQ,GAAG,EAAE,CAAC,QAAQ,MAAM,CAAC;CAC/F,MAAM,UAAU,WACd,UAAU,cAAc,EACxB,UAAU,gBAAgB,EACxB,kBAAkB,6BACnB,CAAC,CACH;AAED,QACE,qBAAC,YAAD;EACE,WAAW,CAAC,wBAAwB,sBAAsB;EACjD;EACT,oBAAoB;AAClB,aAAU,KAAK;;EAEjB,YAAY,EAAE,QAAQ,WAAW;AAC/B,OAAI,QAAQ,OAAO,OAAO,MAAM,GAI9B,UAAS,UAAU,OAHC,MAAM,WAAW,EAAE,SAAS,OAAO,OAAO,GAAG,EAC/C,MAAM,WAAW,EAAE,SAAS,OAAO,KAAK,GAAG,CAEZ,CAAC;AAEpD,aAAU,KAAK;;EAEjB,cAAc,EAAE,aAAa;AAC3B,aAAU,OAAO;;YAhBrB,CAmBE,oBAAC,iBAAD;GAAwB;GAAO,UAAU;aACvC,oBAACA,mBAAD;IAAS,IAAI;IAAM,WAAW,OAAO;IAAgB;IAAU;IAAK,GAAI;cACrE,MAAM,KAAK,SACV,oBAAC,UAAD,EAAA,UAAyB,WAAW,KAAK,EAAY,EAAtC,KAAK,GAAiC,CACrD;IACM,CAAA;GACM,CAAA,EAClB,oBAAC,iBAAD,EAAA,UAAkB,aAAa,WAAW,WAAW,GAAG,MAAuB,CAAA,CACpE;;EAGlB;AAED,mBAAmB,cAAc;AAQjC,MAAM,eAAe;AAErB,aAAa,OAAO;AACpB,aAAa,aAAa"}