@particle-academy/react-fancy 5.12.0 → 5.13.1

package/dist/chunk-YT42J4VQ.js

@@ -0,0 +1,361 @@
+import { cn } from './chunk-DSUHZO6T.js';
+import { createContext, useState, useRef, useCallback, useMemo, useEffect, useContext, Children, isValidElement } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+
+var KanbanContext = createContext(null);
+function useKanban() {
+  const ctx = useContext(KanbanContext);
+  if (!ctx) {
+    throw new Error("Kanban compound components must be used within <Kanban>");
+  }
+  return ctx;
+}
+var KanbanColumnContext = createContext("");
+function useKanbanColumn() {
+  return useContext(KanbanColumnContext);
+}
+var DEFAULT_CARD_CLASSES = "rounded-lg border border-zinc-200 bg-white p-3 shadow-sm transition-shadow hover:shadow-md dark:border-zinc-700 dark:bg-zinc-900";
+function KanbanCard({ children, id, className, unstyled }) {
+  const { setDraggedCard, setDragSource } = useKanban();
+  const columnId = useKanbanColumn();
+  const handleDragStart = useCallback(() => {
+    setDraggedCard(id);
+    setDragSource(columnId);
+  }, [id, columnId, setDraggedCard, setDragSource]);
+  const handleDragEnd = useCallback(() => {
+    setDraggedCard(null);
+    setDragSource(null);
+  }, [setDraggedCard, setDragSource]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-react-fancy-kanban-card": "",
+      draggable: true,
+      onDragStart: handleDragStart,
+      onDragEnd: handleDragEnd,
+      className: cn(
+        // Drag affordance — kept even when unstyled so users still see grab cursors.
+        "cursor-grab active:cursor-grabbing",
+        !unstyled && DEFAULT_CARD_CLASSES,
+        className
+      ),
+      children
+    }
+  );
+}
+KanbanCard.displayName = "KanbanCard";
+var DEFAULT_COLUMN_CLASSES = "min-h-[200px] w-72 rounded-xl bg-zinc-50 p-3 dark:bg-zinc-800/50";
+function countCardChildren(children) {
+  let n = 0;
+  Children.forEach(children, (child) => {
+    if (!isValidElement(child)) return;
+    if (child.type === KanbanCard) {
+      n += 1;
+      return;
+    }
+    const inner = child.props.children;
+    if (inner !== void 0) n += countCardChildren(inner);
+  });
+  return n;
+}
+function findCardIndex(children, cardId) {
+  let idx = -1;
+  let i = 0;
+  function walk(nodes) {
+    Children.forEach(nodes, (child) => {
+      if (idx !== -1) return;
+      if (!isValidElement(child)) return;
+      if (child.type === KanbanCard) {
+        if (child.props.id === cardId) idx = i;
+        i += 1;
+        return;
+      }
+      const inner = child.props.children;
+      if (inner !== void 0) walk(inner);
+    });
+  }
+  walk(children);
+  return idx;
+}
+function KanbanColumn({
+  children,
+  id,
+  title,
+  className,
+  unstyled,
+  wipLimit,
+  hideWhenEmpty
+}) {
+  const { onCardMove, draggedCard, dragSource, registerColumn } = useKanban();
+  const [dragOver, setDragOver] = useState(false);
+  const [dropIndex, setDropIndex] = useState(null);
+  const [dropY, setDropY] = useState(null);
+  const cardsRef = useRef(null);
+  useEffect(() => registerColumn(id), [id, registerColumn]);
+  const updateDrop = useCallback((clientY) => {
+    const container = cardsRef.current;
+    if (!container) {
+      setDropIndex(null);
+      setDropY(null);
+      return;
+    }
+    const all = Array.from(
+      container.querySelectorAll(
+        "[data-react-fancy-kanban-card]"
+      )
+    );
+    const cards = all.filter(
+      (el) => el.closest("[data-react-fancy-kanban-column]") === cardsRef.current?.closest("[data-react-fancy-kanban-column]")
+    );
+    const containerRect = container.getBoundingClientRect();
+    if (cards.length === 0) {
+      setDropIndex(0);
+      setDropY(0);
+      return;
+    }
+    let idx = cards.length;
+    let yRel = 0;
+    for (let i = 0; i < cards.length; i++) {
+      const rect = cards[i].getBoundingClientRect();
+      if (clientY < rect.top + rect.height / 2) {
+        idx = i;
+        yRel = rect.top - containerRect.top;
+        break;
+      }
+    }
+    if (idx === cards.length) {
+      const last = cards[cards.length - 1].getBoundingClientRect();
+      yRel = last.bottom - containerRect.top;
+    }
+    setDropIndex(idx);
+    setDropY(yRel);
+  }, []);
+  const handleDragOver = useCallback(
+    (e) => {
+      if (!draggedCard) return;
+      e.preventDefault();
+      e.stopPropagation();
+      setDragOver(true);
+      updateDrop(e.clientY);
+    },
+    [draggedCard, updateDrop]
+  );
+  const handleDragLeave = useCallback((e) => {
+    if (e.currentTarget.contains(e.relatedTarget)) return;
+    setDragOver(false);
+    setDropIndex(null);
+    setDropY(null);
+  }, []);
+  const handleDrop = useCallback(
+    (e) => {
+      if (!draggedCard) return;
+      e.preventDefault();
+      e.stopPropagation();
+      const target = dropIndex ?? 0;
+      if (dragSource) {
+        let finalIdx = target;
+        if (dragSource === id) {
+          const srcIdx = findCardIndex(children, draggedCard);
+          if (srcIdx !== -1 && target > srcIdx) finalIdx = target - 1;
+          if (srcIdx === finalIdx) {
+            setDragOver(false);
+            setDropIndex(null);
+            setDropY(null);
+            return;
+          }
+        }
+        onCardMove?.(draggedCard, dragSource, id, finalIdx);
+      }
+      setDragOver(false);
+      setDropIndex(null);
+      setDropY(null);
+    },
+    [draggedCard, dragSource, dropIndex, id, onCardMove, children]
+  );
+  const cardCount = countCardChildren(children);
+  if (hideWhenEmpty && cardCount === 0 && !draggedCard) return null;
+  const showIndicator = draggedCard !== null && dropIndex !== null && dropY !== null && dragOver;
+  const overWip = wipLimit !== void 0 && cardCount > wipLimit;
+  return /* @__PURE__ */ jsx(KanbanColumnContext.Provider, { value: id, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-react-fancy-kanban-column": "",
+      "data-column-id": id,
+      role: "group",
+      "aria-label": title,
+      onDrop: handleDrop,
+      onDragOver: handleDragOver,
+      onDragLeave: handleDragLeave,
+      className: cn(
+        "flex flex-col",
+        !unstyled && DEFAULT_COLUMN_CLASSES,
+        dragOver && "ring-2 ring-blue-400 ring-inset",
+        className
+      ),
+      children: [
+        title && /* @__PURE__ */ jsxs("h3", { className: "mb-3 flex items-center gap-2 text-sm font-semibold text-zinc-600 dark:text-zinc-400", children: [
+          /* @__PURE__ */ jsx("span", { className: "flex-1", children: title }),
+          /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: cn(
+                "rounded-full px-1.5 py-0.5 text-[10px] font-semibold",
+                overWip ? "bg-red-100 text-red-700 dark:bg-red-900/40 dark:text-red-300" : "bg-zinc-200 text-zinc-700 dark:bg-zinc-700 dark:text-zinc-300"
+              ),
+              children: [
+                cardCount,
+                wipLimit !== void 0 ? `/${wipLimit}` : ""
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs("div", { ref: cardsRef, className: "relative flex flex-1 flex-col gap-2", children: [
+          children,
+          showIndicator && /* @__PURE__ */ jsx(
+            "div",
+            {
+              "data-react-fancy-kanban-drop-indicator": "",
+              style: { top: dropY },
+              className: "pointer-events-none absolute left-0 right-0 h-0.5 -translate-y-1/2 rounded-full bg-blue-500/80 shadow-[0_0_0_3px_rgba(59,130,246,0.15)]"
+            }
+          )
+        ] })
+      ]
+    }
+  ) });
+}
+KanbanColumn.displayName = "KanbanColumn";
+function KanbanColumnHandle({
+  children,
+  className
+}) {
+  const { setDraggedColumn } = useKanban();
+  const columnId = useKanbanColumn();
+  const handleDragStart = useCallback(
+    (e) => {
+      e.dataTransfer.effectAllowed = "move";
+      e.dataTransfer.setData("text/plain", columnId);
+      e.stopPropagation();
+      setDraggedColumn(columnId);
+    },
+    [columnId, setDraggedColumn]
+  );
+  const handleDragEnd = useCallback(() => {
+    setDraggedColumn(null);
+  }, [setDraggedColumn]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      draggable: true,
+      onDragStart: handleDragStart,
+      onDragEnd: handleDragEnd,
+      "data-react-fancy-kanban-column-handle": "",
+      className: cn(
+        "cursor-grab active:cursor-grabbing select-none",
+        className
+      ),
+      children
+    }
+  );
+}
+KanbanColumnHandle.displayName = "KanbanColumnHandle";
+function KanbanRoot({
+  children,
+  onCardMove,
+  onColumnMove,
+  className
+}) {
+  const [draggedCard, setDraggedCard] = useState(null);
+  const [dragSource, setDragSource] = useState(null);
+  const [draggedColumn, setDraggedColumn] = useState(null);
+  const orderRef = useRef([]);
+  const [columnIds, setColumnIds] = useState([]);
+  const registerColumn = useCallback((id) => {
+    if (!orderRef.current.includes(id)) {
+      orderRef.current = [...orderRef.current, id];
+      setColumnIds(orderRef.current);
+    }
+    return () => {
+      orderRef.current = orderRef.current.filter((x) => x !== id);
+      setColumnIds(orderRef.current);
+    };
+  }, []);
+  const ctx = useMemo(
+    () => ({
+      draggedCard,
+      setDraggedCard,
+      dragSource,
+      setDragSource,
+      draggedColumn,
+      setDraggedColumn,
+      onCardMove,
+      onColumnMove,
+      columnIds,
+      registerColumn
+    }),
+    [
+      draggedCard,
+      dragSource,
+      draggedColumn,
+      onCardMove,
+      onColumnMove,
+      columnIds,
+      registerColumn
+    ]
+  );
+  const containerRef = useRef(null);
+  const handleDragOver = useCallback(
+    (e) => {
+      if (!draggedColumn) return;
+      e.preventDefault();
+    },
+    [draggedColumn]
+  );
+  const handleDrop = useCallback(
+    (e) => {
+      if (!draggedColumn || !containerRef.current) return;
+      e.preventDefault();
+      const cols = containerRef.current.querySelectorAll(
+        "[data-react-fancy-kanban-column]"
+      );
+      const x = e.clientX;
+      let dropIdx = cols.length;
+      for (let i = 0; i < cols.length; i++) {
+        const rect = cols[i].getBoundingClientRect();
+        if (x < rect.left + rect.width / 2) {
+          dropIdx = i;
+          break;
+        }
+      }
+      const sourceIdx = columnIds.indexOf(draggedColumn);
+      const finalIdx = sourceIdx >= 0 && dropIdx > sourceIdx ? dropIdx - 1 : dropIdx;
+      if (finalIdx !== sourceIdx) {
+        onColumnMove?.(draggedColumn, finalIdx);
+      }
+      setDraggedColumn(null);
+    },
+    [draggedColumn, columnIds, onColumnMove]
+  );
+  return /* @__PURE__ */ jsx(KanbanContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: containerRef,
+      "data-react-fancy-kanban": "",
+      onDragOver: handleDragOver,
+      onDrop: handleDrop,
+      role: "application",
+      "aria-roledescription": "kanban board",
+      className: cn("flex gap-4 overflow-x-auto p-4", className),
+      children
+    }
+  ) });
+}
+var Kanban = Object.assign(KanbanRoot, {
+  Column: KanbanColumn,
+  Card: KanbanCard,
+  ColumnHandle: KanbanColumnHandle
+});
+
+export { Kanban, useKanban };
+//# sourceMappingURL=chunk-YT42J4VQ.js.map
+//# sourceMappingURL=chunk-YT42J4VQ.js.map

package/dist/chunk-YT42J4VQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Kanban/Kanban.context.ts","../src/components/Kanban/KanbanCard.tsx","../src/components/Kanban/KanbanColumn.tsx","../src/components/Kanban/KanbanColumnHandle.tsx","../src/components/Kanban/Kanban.tsx"],"names":["useCallback","jsx","useState","useRef"],"mappings":"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","file":"chunk-YT42J4VQ.js","sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { KanbanContextValue } from \"./Kanban.types\";\n\nexport const KanbanContext = createContext<KanbanContextValue | null>(null);\n\nexport function useKanban(): KanbanContextValue {\n  const ctx = useContext(KanbanContext);\n  if (!ctx) {\n    throw new Error(\"Kanban compound components must be used within <Kanban>\");\n  }\n  return ctx;\n}\n\nexport const KanbanColumnContext = createContext<string>(\"\");\n\nexport function useKanbanColumn(): string {\n  return useContext(KanbanColumnContext);\n}\n","import { useCallback } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useKanban, useKanbanColumn } from \"./Kanban.context\";\nimport type { KanbanCardProps } from \"./Kanban.types\";\n\nconst DEFAULT_CARD_CLASSES =\n  \"rounded-lg border border-zinc-200 bg-white p-3 shadow-sm transition-shadow hover:shadow-md dark:border-zinc-700 dark:bg-zinc-900\";\n\nexport function KanbanCard({ children, id, className, unstyled }: KanbanCardProps) {\n  const { setDraggedCard, setDragSource } = useKanban();\n  const columnId = useKanbanColumn();\n\n  const handleDragStart = useCallback(() => {\n    setDraggedCard(id);\n    setDragSource(columnId);\n  }, [id, columnId, setDraggedCard, setDragSource]);\n\n  const handleDragEnd = useCallback(() => {\n    setDraggedCard(null);\n    setDragSource(null);\n  }, [setDraggedCard, setDragSource]);\n\n  return (\n    <div\n      data-react-fancy-kanban-card=\"\"\n      draggable\n      onDragStart={handleDragStart}\n      onDragEnd={handleDragEnd}\n      className={cn(\n        // Drag affordance — kept even when unstyled so users still see grab cursors.\n        \"cursor-grab active:cursor-grabbing\",\n        !unstyled && DEFAULT_CARD_CLASSES,\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nKanbanCard.displayName = \"KanbanCard\";\n","import { Children, isValidElement, useCallback, useEffect, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { KanbanCard } from \"./KanbanCard\";\nimport { useKanban, KanbanColumnContext } from \"./Kanban.context\";\nimport type { KanbanColumnProps } from \"./Kanban.types\";\n\nconst DEFAULT_COLUMN_CLASSES =\n  \"min-h-[200px] w-72 rounded-xl bg-zinc-50 p-3 dark:bg-zinc-800/50\";\n\n/**\n * Deep-recurse through the children tree counting Kanban.Card descendants\n * regardless of wrapping (Fragment, ContextMenu, motion.div, custom HOCs,\n * etc.). Used by `hideWhenEmpty` and the WIP-limit count chip.\n */\nfunction countCardChildren(children: React.ReactNode): number {\n  let n = 0;\n  Children.forEach(children, (child) => {\n    if (!isValidElement(child)) return;\n    if (child.type === KanbanCard) {\n      n += 1;\n      return;\n    }\n    const inner = (child.props as { children?: React.ReactNode }).children;\n    if (inner !== undefined) n += countCardChildren(inner);\n  });\n  return n;\n}\n\n/**\n * Find the document-order index of a Kanban.Card with the given id, deep-\n * recursing through wrappers. Used by same-column reorder to compute the\n * post-removal insert position.\n */\nfunction findCardIndex(children: React.ReactNode, cardId: string): number {\n  let idx = -1;\n  let i = 0;\n  function walk(nodes: React.ReactNode): void {\n    Children.forEach(nodes, (child) => {\n      if (idx !== -1) return;\n      if (!isValidElement(child)) return;\n      if (child.type === KanbanCard) {\n        if ((child.props as { id?: string }).id === cardId) idx = i;\n        i += 1;\n        return;\n      }\n      const inner = (child.props as { children?: React.ReactNode }).children;\n      if (inner !== undefined) walk(inner);\n    });\n  }\n  walk(children);\n  return idx;\n}\n\nexport function KanbanColumn({\n  children,\n  id,\n  title,\n  className,\n  unstyled,\n  wipLimit,\n  hideWhenEmpty,\n}: KanbanColumnProps) {\n  const { onCardMove, draggedCard, dragSource, registerColumn } = useKanban();\n  const [dragOver, setDragOver] = useState(false);\n  const [dropIndex, setDropIndex] = useState<number | null>(null);\n  const [dropY, setDropY] = useState<number | null>(null);\n  const cardsRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => registerColumn(id), [id, registerColumn]);\n\n  /**\n   * Compute drop position from mouse Y. Walks the *DOM* (not the React\n   * tree) and queries `[data-react-fancy-kanban-card]` so wrappers\n   * (ContextMenu, custom Card surfaces, motion.div) don't break the\n   * indicator placement.\n   */\n  const updateDrop = useCallback((clientY: number) => {\n    const container = cardsRef.current;\n    if (!container) {\n      setDropIndex(null);\n      setDropY(null);\n      return;\n    }\n\n    // Limit to cards belonging to THIS column — important if a card\n    // happens to nest a sub-board (rare, but cheap to defend).\n    const all = Array.from(\n      container.querySelectorAll<HTMLElement>(\n        \"[data-react-fancy-kanban-card]\",\n      ),\n    );\n    const cards = all.filter(\n      (el) =>\n        el.closest(\"[data-react-fancy-kanban-column]\") ===\n        cardsRef.current?.closest(\"[data-react-fancy-kanban-column]\"),\n    );\n\n    const containerRect = container.getBoundingClientRect();\n\n    if (cards.length === 0) {\n      setDropIndex(0);\n      setDropY(0);\n      return;\n    }\n\n    let idx = cards.length;\n    let yRel = 0;\n    for (let i = 0; i < cards.length; i++) {\n      const rect = cards[i]!.getBoundingClientRect();\n      if (clientY < rect.top + rect.height / 2) {\n        idx = i;\n        yRel = rect.top - containerRect.top;\n        break;\n      }\n    }\n    if (idx === cards.length) {\n      const last = cards[cards.length - 1]!.getBoundingClientRect();\n      yRel = last.bottom - containerRect.top;\n    }\n\n    setDropIndex(idx);\n    setDropY(yRel);\n  }, []);\n\n  const handleDragOver = useCallback(\n    (e: React.DragEvent) => {\n      // Only react to card drags. Column drags are handled by the root.\n      if (!draggedCard) return;\n      e.preventDefault();\n      e.stopPropagation();\n      setDragOver(true);\n      updateDrop(e.clientY);\n    },\n    [draggedCard, updateDrop],\n  );\n\n  const handleDragLeave = useCallback((e: React.DragEvent) => {\n    if (e.currentTarget.contains(e.relatedTarget as Node | null)) return;\n    setDragOver(false);\n    setDropIndex(null);\n    setDropY(null);\n  }, []);\n\n  const handleDrop = useCallback(\n    (e: React.DragEvent) => {\n      if (!draggedCard) return;\n      e.preventDefault();\n      e.stopPropagation();\n      const target = dropIndex ?? 0;\n\n      if (dragSource) {\n        let finalIdx = target;\n        if (dragSource === id) {\n          const srcIdx = findCardIndex(children, draggedCard);\n          if (srcIdx !== -1 && target > srcIdx) finalIdx = target - 1;\n          if (srcIdx === finalIdx) {\n            // No-op\n            setDragOver(false);\n            setDropIndex(null);\n            setDropY(null);\n            return;\n          }\n        }\n        onCardMove?.(draggedCard, dragSource, id, finalIdx);\n      }\n\n      setDragOver(false);\n      setDropIndex(null);\n      setDropY(null);\n    },\n    [draggedCard, dragSource, dropIndex, id, onCardMove, children],\n  );\n\n  const cardCount = countCardChildren(children);\n  if (hideWhenEmpty && cardCount === 0 && !draggedCard) return null;\n\n  const showIndicator =\n    draggedCard !== null &&\n    dropIndex !== null &&\n    dropY !== null &&\n    dragOver;\n\n  const overWip = wipLimit !== undefined && cardCount > wipLimit;\n\n  return (\n    <KanbanColumnContext.Provider value={id}>\n      <div\n        data-react-fancy-kanban-column=\"\"\n        data-column-id={id}\n        role=\"group\"\n        aria-label={title}\n        onDrop={handleDrop}\n        onDragOver={handleDragOver}\n        onDragLeave={handleDragLeave}\n        className={cn(\n          \"flex flex-col\",\n          !unstyled && DEFAULT_COLUMN_CLASSES,\n          dragOver && \"ring-2 ring-blue-400 ring-inset\",\n          className,\n        )}\n      >\n        {title && (\n          <h3 className=\"mb-3 flex items-center gap-2 text-sm font-semibold text-zinc-600 dark:text-zinc-400\">\n            <span className=\"flex-1\">{title}</span>\n            <span\n              className={cn(\n                \"rounded-full px-1.5 py-0.5 text-[10px] font-semibold\",\n                overWip\n                  ? \"bg-red-100 text-red-700 dark:bg-red-900/40 dark:text-red-300\"\n                  : \"bg-zinc-200 text-zinc-700 dark:bg-zinc-700 dark:text-zinc-300\",\n              )}\n            >\n              {cardCount}\n              {wipLimit !== undefined ? `/${wipLimit}` : \"\"}\n            </span>\n          </h3>\n        )}\n\n        {/* Cards container — `relative` so the drop indicator overlay\n            can position itself in the container's coordinate space.\n            Children are rendered untouched so any wrapper hierarchy\n            (ContextMenu, motion.div, etc.) keeps working. */}\n        <div ref={cardsRef} className=\"relative flex flex-1 flex-col gap-2\">\n          {children}\n\n          {showIndicator && (\n            <div\n              data-react-fancy-kanban-drop-indicator=\"\"\n              style={{ top: dropY }}\n              className=\"pointer-events-none absolute left-0 right-0 h-0.5 -translate-y-1/2 rounded-full bg-blue-500/80 shadow-[0_0_0_3px_rgba(59,130,246,0.15)]\"\n            />\n          )}\n        </div>\n      </div>\n    </KanbanColumnContext.Provider>\n  );\n}\n\nKanbanColumn.displayName = \"KanbanColumn\";\n","import { useCallback } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { useKanban, useKanbanColumn } from \"./Kanban.context\";\nimport type { KanbanColumnHandleProps } from \"./Kanban.types\";\n\n/**\n * Drag handle for column reordering.\n *\n * Mount inside a `Kanban.Column` to make that column draggable. The\n * column's parent `Kanban` listens for the drop and surfaces the new\n * position via `onColumnMove`. Without a handle, columns are static.\n *\n * Typically wrapped around the column header so users grab the title\n * to reorder; can also be a small grip icon.\n */\nexport function KanbanColumnHandle({\n  children,\n  className,\n}: KanbanColumnHandleProps) {\n  const { setDraggedColumn } = useKanban();\n  const columnId = useKanbanColumn();\n\n  const handleDragStart = useCallback(\n    (e: React.DragEvent) => {\n      // Set a dataTransfer payload so the browser permits the drag — some\n      // browsers refuse if dataTransfer is empty.\n      e.dataTransfer.effectAllowed = \"move\";\n      e.dataTransfer.setData(\"text/plain\", columnId);\n      e.stopPropagation();\n      setDraggedColumn(columnId);\n    },\n    [columnId, setDraggedColumn],\n  );\n\n  const handleDragEnd = useCallback(() => {\n    setDraggedColumn(null);\n  }, [setDraggedColumn]);\n\n  return (\n    <div\n      draggable\n      onDragStart={handleDragStart}\n      onDragEnd={handleDragEnd}\n      data-react-fancy-kanban-column-handle=\"\"\n      className={cn(\n        \"cursor-grab active:cursor-grabbing select-none\",\n        className,\n      )}\n    >\n      {children}\n    </div>\n  );\n}\n\nKanbanColumnHandle.displayName = \"KanbanColumnHandle\";\n","import { useCallback, useMemo, useRef, useState } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport { KanbanContext } from \"./Kanban.context\";\nimport { KanbanColumn } from \"./KanbanColumn\";\nimport { KanbanCard } from \"./KanbanCard\";\nimport { KanbanColumnHandle } from \"./KanbanColumnHandle\";\nimport type { KanbanProps } from \"./Kanban.types\";\n\n/**\n * Kanban board.\n *\n * Compound:\n *   <Kanban onCardMove={...} onColumnMove={...}>\n *     <Kanban.Column id=\"todo\" wipLimit={4}>\n *       <Kanban.ColumnHandle>...header...</Kanban.ColumnHandle>  // optional\n *       <Kanban.Card id=\"...\">...</Kanban.Card>\n *     </Kanban.Column>\n *   </Kanban>\n *\n * Cards drag between columns AND within a column. Drop position is\n * computed from mouse Y at hover time and surfaced via the `toIndex`\n * argument on `onCardMove`.\n *\n * Columns drag horizontally to reorder when a `<Kanban.ColumnHandle>`\n * is mounted inside them. The root computes the drop index from\n * mouse X and surfaces it via `onColumnMove`.\n */\nfunction KanbanRoot({\n  children,\n  onCardMove,\n  onColumnMove,\n  className,\n}: KanbanProps) {\n  const [draggedCard, setDraggedCard] = useState<string | null>(null);\n  const [dragSource, setDragSource] = useState<string | null>(null);\n  const [draggedColumn, setDraggedColumn] = useState<string | null>(null);\n\n  const orderRef = useRef<string[]>([]);\n  const [columnIds, setColumnIds] = useState<string[]>([]);\n\n  const registerColumn = useCallback((id: string) => {\n    if (!orderRef.current.includes(id)) {\n      orderRef.current = [...orderRef.current, id];\n      setColumnIds(orderRef.current);\n    }\n    return () => {\n      orderRef.current = orderRef.current.filter((x) => x !== id);\n      setColumnIds(orderRef.current);\n    };\n  }, []);\n\n  const ctx = useMemo(\n    () => ({\n      draggedCard,\n      setDraggedCard,\n      dragSource,\n      setDragSource,\n      draggedColumn,\n      setDraggedColumn,\n      onCardMove,\n      onColumnMove,\n      columnIds,\n      registerColumn,\n    }),\n    [\n      draggedCard,\n      dragSource,\n      draggedColumn,\n      onCardMove,\n      onColumnMove,\n      columnIds,\n      registerColumn,\n    ],\n  );\n\n  // ── Column-level drop handling ────────────────────────────────────────\n  // Root listens only when a column is being dragged. Drop index is\n  // computed from mouse X versus each column's horizontal midpoint.\n  const containerRef = useRef<HTMLDivElement>(null);\n\n  const handleDragOver = useCallback(\n    (e: React.DragEvent) => {\n      if (!draggedColumn) return;\n      e.preventDefault();\n    },\n    [draggedColumn],\n  );\n\n  const handleDrop = useCallback(\n    (e: React.DragEvent) => {\n      if (!draggedColumn || !containerRef.current) return;\n      e.preventDefault();\n\n      const cols = containerRef.current.querySelectorAll<HTMLElement>(\n        '[data-react-fancy-kanban-column]',\n      );\n      const x = e.clientX;\n      let dropIdx = cols.length;\n      for (let i = 0; i < cols.length; i++) {\n        const rect = cols[i]!.getBoundingClientRect();\n        if (x < rect.left + rect.width / 2) {\n          dropIdx = i;\n          break;\n        }\n      }\n\n      const sourceIdx = columnIds.indexOf(draggedColumn);\n      // When moving rightward, dropping at index N visually means landing\n      // at N - 1 after the source is removed.\n      const finalIdx =\n        sourceIdx >= 0 && dropIdx > sourceIdx ? dropIdx - 1 : dropIdx;\n\n      if (finalIdx !== sourceIdx) {\n        onColumnMove?.(draggedColumn, finalIdx);\n      }\n      setDraggedColumn(null);\n    },\n    [draggedColumn, columnIds, onColumnMove],\n  );\n\n  return (\n    <KanbanContext.Provider value={ctx}>\n      <div\n        ref={containerRef}\n        data-react-fancy-kanban=\"\"\n        onDragOver={handleDragOver}\n        onDrop={handleDrop}\n        role=\"application\"\n        aria-roledescription=\"kanban board\"\n        className={cn(\"flex gap-4 overflow-x-auto p-4\", className)}\n      >\n        {children}\n      </div>\n    </KanbanContext.Provider>\n  );\n}\n\nexport const Kanban = Object.assign(KanbanRoot, {\n  Column: KanbanColumn,\n  Card: KanbanCard,\n  ColumnHandle: KanbanColumnHandle,\n});\n"]}

package/dist/chunk-YT6N44Z3.js

@@ -0,0 +1,99 @@
+import { cn } from './chunk-DSUHZO6T.js';
+import { ChevronLeft, ChevronRight } from 'lucide-react';
+import { useMemo } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function range(start, end) {
+  return Array.from({ length: end - start + 1 }, (_, i) => start + i);
+}
+function getPages(page, totalPages, siblings) {
+  const totalSlots = siblings * 2 + 5;
+  if (totalPages <= totalSlots) return range(1, totalPages);
+  const leftSibling = Math.max(page - siblings, 1);
+  const rightSibling = Math.min(page + siblings, totalPages);
+  const showLeftEllipsis = leftSibling > 2;
+  const showRightEllipsis = rightSibling < totalPages - 1;
+  if (!showLeftEllipsis && showRightEllipsis) {
+    const leftRange = range(1, 3 + siblings * 2);
+    return [...leftRange, "ellipsis", totalPages];
+  }
+  if (showLeftEllipsis && !showRightEllipsis) {
+    const rightRange = range(totalPages - (2 + siblings * 2), totalPages);
+    return [1, "ellipsis", ...rightRange];
+  }
+  return [
+    1,
+    "ellipsis",
+    ...range(leftSibling, rightSibling),
+    "ellipsis",
+    totalPages
+  ];
+}
+function Pagination({
+  page,
+  onPageChange,
+  totalPages,
+  siblingCount = 1,
+  className
+}) {
+  const pages = useMemo(
+    () => getPages(page, totalPages, siblingCount),
+    [page, totalPages, siblingCount]
+  );
+  if (totalPages <= 1) return null;
+  const btnBase = "inline-flex h-9 min-w-9 items-center justify-center rounded-lg border text-sm transition-colors";
+  const btnDefault = "border-zinc-200 bg-white hover:bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-900 dark:hover:bg-zinc-800";
+  const btnActive = "border-zinc-900 bg-zinc-900 text-white dark:border-white dark:bg-white dark:text-zinc-900";
+  const btnDisabled = "cursor-not-allowed opacity-50";
+  return /* @__PURE__ */ jsxs("nav", { "aria-label": "Pagination", "data-react-fancy-pagination": "", className: cn("flex items-center gap-1", className), children: [
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        disabled: page <= 1,
+        onClick: () => onPageChange(page - 1),
+        className: cn(btnBase, btnDefault, page <= 1 && btnDisabled, "px-2"),
+        "aria-label": "Previous page",
+        children: /* @__PURE__ */ jsx(ChevronLeft, { size: 16 })
+      }
+    ),
+    pages.map(
+      (p, i) => p === "ellipsis" ? /* @__PURE__ */ jsx("span", { className: "px-1 text-zinc-400", children: "..." }, `e-${i}`) : /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          onClick: () => onPageChange(p),
+          "aria-current": p === page ? "page" : void 0,
+          className: cn(
+            btnBase,
+            p === page ? btnActive : btnDefault,
+            "px-2"
+          ),
+          children: p
+        },
+        p
+      )
+    ),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        disabled: page >= totalPages,
+        onClick: () => onPageChange(page + 1),
+        className: cn(
+          btnBase,
+          btnDefault,
+          page >= totalPages && btnDisabled,
+          "px-2"
+        ),
+        "aria-label": "Next page",
+        children: /* @__PURE__ */ jsx(ChevronRight, { size: 16 })
+      }
+    )
+  ] });
+}
+Pagination.displayName = "Pagination";
+
+export { Pagination };
+//# sourceMappingURL=chunk-YT6N44Z3.js.map
+//# sourceMappingURL=chunk-YT6N44Z3.js.map

package/dist/chunk-YT6N44Z3.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";;;;;AAKA,SAAS,KAAA,CAAM,OAAe,GAAA,EAAuB;AACnD,EAAA,OAAO,KAAA,CAAM,IAAA,CAAK,EAAE,MAAA,EAAQ,GAAA,GAAM,KAAA,GAAQ,CAAA,EAAE,EAAG,CAAC,CAAA,EAAG,CAAA,KAAM,KAAA,GAAQ,CAAC,CAAA;AACpE;AAEA,SAAS,QAAA,CACP,IAAA,EACA,UAAA,EACA,QAAA,EACyB;AACzB,EAAA,MAAM,UAAA,GAAa,WAAW,CAAA,GAAI,CAAA;AAClC,EAAA,IAAI,UAAA,IAAc,UAAA,EAAY,OAAO,KAAA,CAAM,GAAG,UAAU,CAAA;AAExD,EAAA,MAAM,WAAA,GAAc,IAAA,CAAK,GAAA,CAAI,IAAA,GAAO,UAAU,CAAC,CAAA;AAC/C,EAAA,MAAM,YAAA,GAAe,IAAA,CAAK,GAAA,CAAI,IAAA,GAAO,UAAU,UAAU,CAAA;AAEzD,EAAA,MAAM,mBAAmB,WAAA,GAAc,CAAA;AACvC,EAAA,MAAM,iBAAA,GAAoB,eAAe,UAAA,GAAa,CAAA;AAEtD,EAAA,IAAI,CAAC,oBAAoB,iBAAA,EAAmB;AAC1C,IAAA,MAAM,SAAA,GAAY,KAAA,CAAM,CAAA,EAAG,CAAA,GAAI,WAAW,CAAC,CAAA;AAC3C,IAAA,OAAO,CAAC,GAAG,SAAA,EAAW,UAAA,EAAY,UAAU,CAAA;AAAA,EAC9C;AAEA,EAAA,IAAI,gBAAA,IAAoB,CAAC,iBAAA,EAAmB;AAC1C,IAAA,MAAM,aAAa,KAAA,CAAM,UAAA,IAAc,CAAA,GAAI,QAAA,GAAW,IAAI,UAAU,CAAA;AACpE,IAAA,OAAO,CAAC,CAAA,EAAG,UAAA,EAAY,GAAG,UAAU,CAAA;AAAA,EACtC;AAEA,EAAA,OAAO;AAAA,IACL,CAAA;AAAA,IACA,UAAA;AAAA,IACA,GAAG,KAAA,CAAM,WAAA,EAAa,YAAY,CAAA;AAAA,IAClC,UAAA;AAAA,IACA;AAAA,GACF;AACF;AAEO,SAAS,UAAA,CAAW;AAAA,EACzB,IAAA;AAAA,EACA,YAAA;AAAA,EACA,UAAA;AAAA,EACA,YAAA,GAAe,CAAA;AAAA,EACf;AACF,CAAA,EAAoB;AAClB,EAAA,MAAM,KAAA,GAAQ,OAAA;AAAA,IACZ,MAAM,QAAA,CAAS,IAAA,EAAM,UAAA,EAAY,YAAY,CAAA;AAAA,IAC7C,CAAC,IAAA,EAAM,UAAA,EAAY,YAAY;AAAA,GACjC;AAEA,EAAA,IAAI,UAAA,IAAc,GAAG,OAAO,IAAA;AAE5B,EAAA,MAAM,OAAA,GACJ,iGAAA;AACF,EAAA,MAAM,UAAA,GACJ,wGAAA;AACF,EAAA,MAAM,SAAA,GACJ,2FAAA;AACF,EAAA,MAAM,WAAA,GAAc,+BAAA;AAEpB,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAW,YAAA,EAAa,6BAAA,EAA4B,IAAG,SAAA,EAAW,EAAA,CAAG,yBAAA,EAA2B,SAAS,CAAA,EAC5G,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,UAAU,IAAA,IAAQ,CAAA;AAAA,QAClB,OAAA,EAAS,MAAM,YAAA,CAAa,IAAA,GAAO,CAAC,CAAA;AAAA,QACpC,WAAW,EAAA,CAAG,OAAA,EAAS,YAAY,IAAA,IAAQ,CAAA,IAAK,aAAa,MAAM,CAAA;AAAA,QACnE,YAAA,EAAW,eAAA;AAAA,QAEX,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAY,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA,KACzB;AAAA,IAEC,KAAA,CAAM,GAAA;AAAA,MAAI,CAAC,CAAA,EAAG,CAAA,KACb,CAAA,KAAM,UAAA,mBACJ,GAAA,CAAC,MAAA,EAAA,EAAoB,SAAA,EAAU,oBAAA,EAAqB,QAAA,EAAA,KAAA,EAAA,EAAzC,CAAA,EAAA,EAAK,CAAC,EAEjB,CAAA,mBAEA,GAAA;AAAA,QAAC,QAAA;AAAA,QAAA;AAAA,UAEC,IAAA,EAAK,QAAA;AAAA,UACL,OAAA,EAAS,MAAM,YAAA,CAAa,CAAC,CAAA;AAAA,UAC7B,cAAA,EAAc,CAAA,KAAM,IAAA,GAAO,MAAA,GAAS,MAAA;AAAA,UACpC,SAAA,EAAW,EAAA;AAAA,YACT,OAAA;AAAA,YACA,CAAA,KAAM,OAAO,SAAA,GAAY,UAAA;AAAA,YACzB;AAAA,WACF;AAAA,UAEC,QAAA,EAAA;AAAA,SAAA;AAAA,QAVI;AAAA;AAWP,KAEJ;AAAA,oBAEA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,QAAA;AAAA,QACL,UAAU,IAAA,IAAQ,UAAA;AAAA,QAClB,OAAA,EAAS,MAAM,YAAA,CAAa,IAAA,GAAO,CAAC,CAAA;AAAA,QACpC,SAAA,EAAW,EAAA;AAAA,UACT,OAAA;AAAA,UACA,UAAA;AAAA,UACA,QAAQ,UAAA,IAAc,WAAA;AAAA,UACtB;AAAA,SACF;AAAA,QACA,YAAA,EAAW,WAAA;AAAA,QAEX,QAAA,kBAAA,GAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA;AAC1B,GAAA,EACF,CAAA;AAEJ;AAEA,UAAA,CAAW,WAAA,GAAc,YAAA","file":"chunk-YT6N44Z3.js","sourcesContent":["import { ChevronLeft, ChevronRight } from \"lucide-react\";\nimport { useMemo } from \"react\";\nimport { cn } from \"../../utils/cn\";\nimport type { PaginationProps } from \"./Pagination.types\";\n\nfunction range(start: number, end: number): number[] {\n  return Array.from({ length: end - start + 1 }, (_, i) => start + i);\n}\n\nfunction getPages(\n  page: number,\n  totalPages: number,\n  siblings: number,\n): (number | \"ellipsis\")[] {\n  const totalSlots = siblings * 2 + 5; // siblings + boundaries + ellipses + current\n  if (totalPages <= totalSlots) return range(1, totalPages);\n\n  const leftSibling = Math.max(page - siblings, 1);\n  const rightSibling = Math.min(page + siblings, totalPages);\n\n  const showLeftEllipsis = leftSibling > 2;\n  const showRightEllipsis = rightSibling < totalPages - 1;\n\n  if (!showLeftEllipsis && showRightEllipsis) {\n    const leftRange = range(1, 3 + siblings * 2);\n    return [...leftRange, \"ellipsis\", totalPages];\n  }\n\n  if (showLeftEllipsis && !showRightEllipsis) {\n    const rightRange = range(totalPages - (2 + siblings * 2), totalPages);\n    return [1, \"ellipsis\", ...rightRange];\n  }\n\n  return [\n    1,\n    \"ellipsis\",\n    ...range(leftSibling, rightSibling),\n    \"ellipsis\",\n    totalPages,\n  ];\n}\n\nexport function Pagination({\n  page,\n  onPageChange,\n  totalPages,\n  siblingCount = 1,\n  className,\n}: PaginationProps) {\n  const pages = useMemo(\n    () => getPages(page, totalPages, siblingCount),\n    [page, totalPages, siblingCount],\n  );\n\n  if (totalPages <= 1) return null;\n\n  const btnBase =\n    \"inline-flex h-9 min-w-9 items-center justify-center rounded-lg border text-sm transition-colors\";\n  const btnDefault =\n    \"border-zinc-200 bg-white hover:bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-900 dark:hover:bg-zinc-800\";\n  const btnActive =\n    \"border-zinc-900 bg-zinc-900 text-white dark:border-white dark:bg-white dark:text-zinc-900\";\n  const btnDisabled = \"cursor-not-allowed opacity-50\";\n\n  return (\n    <nav aria-label=\"Pagination\" data-react-fancy-pagination=\"\" className={cn(\"flex items-center gap-1\", className)}>\n      <button\n        type=\"button\"\n        disabled={page <= 1}\n        onClick={() => onPageChange(page - 1)}\n        className={cn(btnBase, btnDefault, page <= 1 && btnDisabled, \"px-2\")}\n        aria-label=\"Previous page\"\n      >\n        <ChevronLeft size={16} />\n      </button>\n\n      {pages.map((p, i) =>\n        p === \"ellipsis\" ? (\n          <span key={`e-${i}`} className=\"px-1 text-zinc-400\">\n            ...\n          </span>\n        ) : (\n          <button\n            key={p}\n            type=\"button\"\n            onClick={() => onPageChange(p)}\n            aria-current={p === page ? \"page\" : undefined}\n            className={cn(\n              btnBase,\n              p === page ? btnActive : btnDefault,\n              \"px-2\",\n            )}\n          >\n            {p}\n          </button>\n        ),\n      )}\n\n      <button\n        type=\"button\"\n        disabled={page >= totalPages}\n        onClick={() => onPageChange(page + 1)}\n        className={cn(\n          btnBase,\n          btnDefault,\n          page >= totalPages && btnDisabled,\n          \"px-2\",\n        )}\n        aria-label=\"Next page\"\n      >\n        <ChevronRight size={16} />\n      </button>\n    </nav>\n  );\n}\n\nPagination.displayName = \"Pagination\";\n"]}