@marktiderman/genesis-ui 2.5.0 → 2.7.0

package/SKILL.md

@@ -75,6 +75,7 @@ report against Genesis (`packages/ui/EXTENDING.md`), not a reason to fork.
 | Settings list rows                                            | `SettingsRow`, `ToggleRow`                                                         | `/settings-row`, `/toggle-row`                                    |
 | Cmd-K palette                                                 | `CommandPalette`, `useCommandPaletteHotkey`                                        | `/command-palette`                                                |
 | Arrow-key list navigation                                     | `useKeyboardNavigation`                                                            | `/hooks/use-keyboard-navigation`                                  |
+| Reorderable list: drag, keyboard, row-menu moves             | `SortableList`                                                                     | `/sortable-list`                                                  |
 | Persisted page size / density                                 | `useViewSettings`                                                                  | `/hooks/use-view-settings`                                        |
 
 ## Import rule

package/dist/chunk-TXOZMKNW.js

@@ -0,0 +1,320 @@
+"use client";
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from './chunk-QJ6P2DW6.js';
+import { cn } from './chunk-NZ5WBA4R.js';
+import * as React from 'react';
+import { GripVertical, MoreVertical } from 'lucide-react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+
+var DRAG_TYPE = "application/x-genesis-sortable-item";
+var useIsomorphicLayoutEffect = typeof window === "undefined" ? React.useEffect : React.useLayoutEffect;
+function moved(keys, from, to) {
+  const next = keys.slice();
+  const [key] = next.splice(from, 1);
+  next.splice(to, 0, key);
+  return next;
+}
+function SortableList({
+  items,
+  getKey,
+  getItemLabel,
+  renderItem,
+  onReorder,
+  label,
+  disabled,
+  moveMenu = true,
+  className,
+  itemClassName
+}) {
+  const [armed, setArmed] = React.useState(null);
+  const [dragging, setDragging] = React.useState(null);
+  const [dropAt, setDropAt] = React.useState(null);
+  const [grabbed, setGrabbed] = React.useState(null);
+  const [preview, setPreview] = React.useState(null);
+  const [pending, setPending] = React.useState(false);
+  const [announcement, setAnnouncement] = React.useState("");
+  const handles = React.useRef(/* @__PURE__ */ new Map());
+  const refocus = React.useRef(null);
+  const instructionsId = React.useId();
+  const byKey = new Map(items.map((item) => [getKey(item), item]));
+  const itemKeys = items.map(getKey);
+  const keys = preview && preview.length === itemKeys.length && preview.every((k) => byKey.has(k)) ? preview : itemKeys;
+  const total = keys.length;
+  const nameOf = (key) => {
+    const item = byKey.get(key);
+    return item === void 0 ? "Item" : getItemLabel(item);
+  };
+  const announce = (message) => setAnnouncement((previous) => previous === message ? `${message}\xA0` : message);
+  const keepFocus = (key) => {
+    const active = typeof document === "undefined" ? null : document.activeElement;
+    refocus.current = active === handles.current.get(key) || active === document.body || active === null ? key : null;
+  };
+  const keysSignature = keys.join("\0");
+  useIsomorphicLayoutEffect(() => {
+    const key = refocus.current;
+    refocus.current = null;
+    if (!key) return;
+    const handle = handles.current.get(key);
+    const active = document.activeElement;
+    if (handle && (active === document.body || active === null || active === handle)) handle.focus();
+  }, [keysSignature]);
+  React.useEffect(() => {
+    if (disabled && (grabbed || armed || dragging)) {
+      setGrabbed(null);
+      setArmed(null);
+      setDragging(null);
+      setDropAt(null);
+      if (!pending) setPreview(null);
+      return;
+    }
+    if (dragging && !byKey.has(dragging)) {
+      setDragging(null);
+      setDropAt(null);
+      setArmed(null);
+    }
+    if (grabbed && !byKey.has(grabbed.key)) {
+      setGrabbed(null);
+      setPreview(null);
+    }
+  });
+  const commit = (key, from, to, message) => {
+    if (from === to) return;
+    setPending(true);
+    setPreview(moved(itemKeys, from, to));
+    let result;
+    try {
+      result = onReorder(from, to, { key });
+    } catch (error) {
+      result = Promise.reject(error);
+    }
+    Promise.resolve(result).then(
+      () => announce(message),
+      () => announce(`Couldn\u2019t move ${nameOf(key)}.`)
+    ).finally(() => {
+      setPending(false);
+      setPreview(null);
+    });
+  };
+  const move = (key, to) => {
+    if (disabled || pending || grabbed) return;
+    if (!Number.isFinite(to)) return;
+    const from = itemKeys.indexOf(key);
+    const target = Math.max(0, Math.min(total - 1, Math.round(to)));
+    if (from < 0 || target === from) return;
+    keepFocus(key);
+    commit(key, from, target, `${nameOf(key)} moved to position ${target + 1} of ${total}.`);
+  };
+  const pickUp = (key) => {
+    if (disabled || pending) return;
+    const from = itemKeys.indexOf(key);
+    if (from < 0) return;
+    setGrabbed({ key, from });
+    setPreview(itemKeys);
+    announce(
+      `${nameOf(key)} picked up, position ${from + 1} of ${total}. Use the up and down arrow keys to move, Space to drop, Escape to cancel.`
+    );
+  };
+  const drop = (key) => {
+    if (!grabbed) return;
+    const to = keys.indexOf(key);
+    const from = grabbed.from;
+    setGrabbed(null);
+    if (to === from) {
+      setPreview(null);
+      announce(`${nameOf(key)} dropped at position ${to + 1} of ${total}.`);
+      return;
+    }
+    keepFocus(key);
+    commit(key, from, to, `${nameOf(key)} dropped at position ${to + 1} of ${total}.`);
+  };
+  const cancel = (key) => {
+    if (!grabbed) return;
+    const from = grabbed.from;
+    keepFocus(key);
+    setGrabbed(null);
+    setPreview(null);
+    announce(`Move cancelled. ${nameOf(key)} is back at position ${from + 1} of ${total}.`);
+  };
+  const step = (key, to) => {
+    const index = keys.indexOf(key);
+    const target = Math.max(0, Math.min(total - 1, to));
+    if (index < 0 || target === index) return;
+    keepFocus(key);
+    setPreview(moved(keys, index, target));
+    announce(`${nameOf(key)} moved to position ${target + 1} of ${total}.`);
+  };
+  React.useEffect(() => {
+    if (!grabbed) return;
+    const onKey = (event) => {
+      if (event.key !== "Escape") return;
+      event.preventDefault();
+      event.stopPropagation();
+      cancel(grabbed.key);
+    };
+    window.addEventListener("keydown", onKey, true);
+    return () => window.removeEventListener("keydown", onKey, true);
+  });
+  React.useEffect(() => {
+    if (!armed || dragging) return;
+    const disarm = () => setArmed(null);
+    window.addEventListener("pointerup", disarm, { once: true });
+    window.addEventListener("pointercancel", disarm, { once: true });
+    return () => {
+      window.removeEventListener("pointerup", disarm);
+      window.removeEventListener("pointercancel", disarm);
+    };
+  }, [armed, dragging]);
+  const onHandleKeyDown = (event, key) => {
+    if (disabled) return;
+    const isGrabbed = grabbed?.key === key;
+    const index = keys.indexOf(key);
+    const delta = event.key === "ArrowUp" ? -1 : event.key === "ArrowDown" ? 1 : 0;
+    if (isGrabbed) {
+      if (delta) {
+        event.preventDefault();
+        step(key, index + delta);
+      } else if (event.key === "Home" || event.key === "End") {
+        event.preventDefault();
+        step(key, event.key === "Home" ? 0 : total - 1);
+      }
+      return;
+    }
+    if (delta && event.altKey) {
+      event.preventDefault();
+      move(key, index + delta);
+    }
+  };
+  const onHandleClick = (event, key) => {
+    if (disabled || event.detail !== 0) return;
+    if (grabbed?.key === key) drop(key);
+    else if (!grabbed) pickUp(key);
+  };
+  const onDragOver = (event, key) => {
+    if (!dragging) return;
+    event.preventDefault();
+    event.dataTransfer.dropEffect = "move";
+    const rect = event.currentTarget.getBoundingClientRect();
+    const edge = event.clientY < rect.top + rect.height / 2 ? "before" : "after";
+    if (dropAt?.key !== key || dropAt.edge !== edge) setDropAt({ key, edge });
+  };
+  const endDrag = () => {
+    setDragging(null);
+    setDropAt(null);
+    setArmed(null);
+  };
+  const onDrop = (event) => {
+    event.preventDefault();
+    const key = event.dataTransfer.getData(DRAG_TYPE) || dragging;
+    const target = dropAt;
+    endDrag();
+    if (!key || !target || pending || grabbed) return;
+    const from = itemKeys.indexOf(key);
+    const over = itemKeys.indexOf(target.key);
+    if (from < 0 || over < 0) return;
+    let to = target.edge === "before" ? over : over + 1;
+    if (from < to) to -= 1;
+    commit(key, from, to, `${nameOf(key)} dropped at position ${to + 1} of ${total}.`);
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("ul", { "aria-label": label, "aria-busy": pending || void 0, className: cn("flex flex-col gap-1", className), children: keys.map((key, index) => {
+      const item = byKey.get(key);
+      const itemLabel = getItemLabel(item);
+      const isGrabbed = grabbed?.key === key;
+      const isDragging = dragging === key;
+      const handle = disabled ? null : /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          ref: (node) => {
+            if (node) handles.current.set(key, node);
+            else handles.current.delete(key);
+          },
+          "aria-label": `Reorder ${itemLabel}`,
+          "aria-describedby": instructionsId,
+          "data-grabbed": isGrabbed || void 0,
+          className: cn(
+            "inline-flex h-7 w-5 shrink-0 cursor-grab items-center justify-center rounded text-muted-foreground",
+            "hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+            isGrabbed && "bg-accent text-foreground"
+          ),
+          onPointerDown: () => {
+            if (!pending && !grabbed) setArmed(key);
+          },
+          onPointerCancel: () => setArmed(null),
+          onClick: (event) => onHandleClick(event, key),
+          onKeyDown: (event) => onHandleKeyDown(event, key),
+          onBlur: () => {
+            if (isGrabbed && refocus.current !== key) cancel(key);
+          },
+          children: /* @__PURE__ */ jsx(GripVertical, { className: "h-4 w-4", "aria-hidden": true })
+        }
+      );
+      return /* @__PURE__ */ jsxs(
+        "li",
+        {
+          "data-sortable-key": key,
+          draggable: !disabled && armed === key || void 0,
+          className: cn(
+            "relative rounded-md",
+            moveMenu && !disabled && "pr-8",
+            isDragging && "opacity-50",
+            isGrabbed && "ring-2 ring-primary/50",
+            itemClassName
+          ),
+          onDragStart: (event) => {
+            if (disabled || armed !== key) return;
+            event.dataTransfer.setData(DRAG_TYPE, key);
+            event.dataTransfer.effectAllowed = "move";
+            setDragging(key);
+          },
+          onDragEnd: endDrag,
+          onDragOver: (event) => onDragOver(event, key),
+          onDrop,
+          children: [
+            dropAt?.key === key && dragging !== key && /* @__PURE__ */ jsx(
+              "span",
+              {
+                "aria-hidden": true,
+                className: cn(
+                  "pointer-events-none absolute inset-x-0 h-0.5 rounded bg-primary",
+                  dropAt.edge === "before" ? "-top-0.5" : "-bottom-0.5"
+                )
+              }
+            ),
+            renderItem(item, {
+              index,
+              handle,
+              isDragging,
+              isGrabbed,
+              moveUp: () => move(key, index - 1),
+              moveDown: () => move(key, index + 1),
+              moveTo: (to) => move(key, to)
+            }),
+            moveMenu && !disabled && total > 1 && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+              /* @__PURE__ */ jsx(
+                DropdownMenuTrigger,
+                {
+                  "aria-label": `Move ${itemLabel}`,
+                  className: "absolute right-1 top-1 rounded p-1 text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  children: /* @__PURE__ */ jsx(MoreVertical, { className: "h-4 w-4", "aria-hidden": true })
+                }
+              ),
+              /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", children: [
+                /* @__PURE__ */ jsx(DropdownMenuItem, { disabled: index === 0, onSelect: () => move(key, index - 1), children: "Move up" }),
+                /* @__PURE__ */ jsx(DropdownMenuItem, { disabled: index === total - 1, onSelect: () => move(key, index + 1), children: "Move down" }),
+                /* @__PURE__ */ jsx(DropdownMenuItem, { disabled: index === 0, onSelect: () => move(key, 0), children: "Move to top" }),
+                /* @__PURE__ */ jsx(DropdownMenuItem, { disabled: index === total - 1, onSelect: () => move(key, total - 1), children: "Move to bottom" })
+              ] })
+            ] })
+          ]
+        },
+        key
+      );
+    }) }),
+    /* @__PURE__ */ jsx("p", { id: instructionsId, hidden: true, children: "Space or Enter picks the item up. Up and down arrows, Home and End move it. Space or Enter drops it, Escape puts it back. Alt with an arrow moves it one step." }),
+    /* @__PURE__ */ jsx("div", { "aria-live": "polite", "aria-atomic": "true", className: "sr-only", children: announcement })
+  ] });
+}
+
+export { SortableList };
+//# sourceMappingURL=chunk-TXOZMKNW.js.map
+//# sourceMappingURL=chunk-TXOZMKNW.js.map

package/dist/chunk-TXOZMKNW.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/patterns/sortable-list.tsx"],"names":[],"mappings":"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","file":"chunk-TXOZMKNW.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { GripVertical, MoreVertical } from \"lucide-react\";\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from \"../ui/dropdown-menu\";\nimport { cn } from \"../../utils\";\n\nexport interface SortableListItemContext {\n  /** The item's position as shown, from 0. */\n  index: number;\n  /**\n   * The drag handle: drag it with a pointer, or focus it and press Space or\n   * Enter to pick the item up, the arrow keys to move it and Space or Enter\n   * again to drop it. Render it somewhere in the row.\n   */\n  handle: React.ReactNode;\n  /** True while this item is being dragged with a pointer. */\n  isDragging: boolean;\n  /** True while this item is picked up from the keyboard. */\n  isGrabbed: boolean;\n  /** Move this item without dragging, for a row menu of your own. */\n  moveUp: () => void;\n  moveDown: () => void;\n  moveTo: (index: number) => void;\n}\n\nexport interface SortableListReorder {\n  /** Key of the item that moved. */\n  key: string;\n}\n\nexport interface SortableListProps<T> {\n  items: readonly T[];\n  /** A stable key per item. Required: dragging finds the item again by key. */\n  getKey: (item: T) => string;\n  /** A name for an item, for the handle's label and announcements (\"Week 1\"). */\n  getItemLabel: (item: T) => string;\n  renderItem: (item: T, context: SortableListItemContext) => React.ReactNode;\n  /**\n   * Move the item at `from` to `to` (both from 0, `to` counted after the item\n   * is taken out). Each finished move calls this once: a keyboard pick-up\n   * that wanders and comes back calls nothing.\n   *\n   * The list shows the new order straight away and keeps showing it until the\n   * returned promise settles; by then `items` must be in the new order. A\n   * synchronous handler must update `items` in the same tick. A rejected\n   * promise puts the old order back and announces that the move failed. Other\n   * moves wait until this one settles.\n   */\n  onReorder: (from: number, to: number, move: SortableListReorder) => void | Promise<void>;\n  /** Accessible name of the list (\"Course steps\"). */\n  label: string;\n  /** Turns off dragging and every kind of move. */\n  disabled?: boolean | undefined;\n  /**\n   * A \"Move\" menu on each row (up, down, to top, to bottom), on by default so\n   * touch and screen-reader users always have a way to move an item. Turn it\n   * off only when the row offers `moveUp` / `moveDown` / `moveTo` itself.\n   */\n  moveMenu?: boolean | undefined;\n  className?: string | undefined;\n  itemClassName?: string | undefined;\n}\n\ntype DropAt = { key: string; edge: \"before\" | \"after\" };\n\nconst DRAG_TYPE = \"application/x-genesis-sortable-item\";\n\n// useLayoutEffect warns during server rendering; nothing needs refocusing there.\nconst useIsomorphicLayoutEffect = typeof window === \"undefined\" ? React.useEffect : React.useLayoutEffect;\n\nfunction moved(keys: readonly string[], from: number, to: number) {\n  const next = keys.slice();\n  const [key] = next.splice(from, 1);\n  next.splice(to, 0, key!);\n  return next;\n}\n\n/**\n * A vertical list the user can rearrange: course steps, lesson blocks, form\n * fields.\n *\n * Every way to move an item is equivalent, so dragging is never the only one\n * (the same stance as KanbanBoard's \"Move to…\" menu):\n * - drag the handle with a pointer;\n * - focus the handle, Space or Enter to pick up, ↑/↓ and Home/End to move,\n *   Space or Enter to drop, Escape to put it back (tabbing away also puts it\n *   back); Alt+↑/↓ moves one step without picking up;\n * - the row's \"Move\" menu, or `moveUp` / `moveDown` / `moveTo` from the render\n *   context.\n *\n * Moves are announced in a polite live region once they succeed. Native drag\n * and drop needs no dependency and Radix has none to offer (docs/FRAMEWORK.md\n * rule 3).\n *\n * @stability Beta\n */\nexport function SortableList<T>({\n  items,\n  getKey,\n  getItemLabel,\n  renderItem,\n  onReorder,\n  label,\n  disabled,\n  moveMenu = true,\n  className,\n  itemClassName,\n}: SortableListProps<T>) {\n  const [armed, setArmed] = React.useState<string | null>(null);\n  const [dragging, setDragging] = React.useState<string | null>(null);\n  const [dropAt, setDropAt] = React.useState<DropAt | null>(null);\n  // While a key is grabbed, `preview` is the order on screen; nothing is\n  // written until the drop.\n  const [grabbed, setGrabbed] = React.useState<{ key: string; from: number } | null>(null);\n  // The order to show instead of `items`: during a keyboard pick-up, and from\n  // a committed move until its promise settles.\n  const [preview, setPreview] = React.useState<string[] | null>(null);\n  const [pending, setPending] = React.useState(false);\n  const [announcement, setAnnouncement] = React.useState(\"\");\n  const handles = React.useRef(new Map<string, HTMLButtonElement>());\n  const refocus = React.useRef<string | null>(null);\n  const instructionsId = React.useId();\n\n  const byKey = new Map(items.map((item) => [getKey(item), item] as const));\n  const itemKeys = items.map(getKey);\n  const keys = preview && preview.length === itemKeys.length && preview.every((k) => byKey.has(k)) ? preview : itemKeys;\n  const total = keys.length;\n  const nameOf = (key: string) => {\n    const item = byKey.get(key);\n    return item === undefined ? \"Item\" : getItemLabel(item);\n  };\n\n  // A live region only speaks when its text changes, so the same message\n  // twice in a row is told apart by a trailing no-break space.\n  const announce = (message: string) =>\n    setAnnouncement((previous) => (previous === message ? `${message} ` : message));\n\n  // Only follow the moved item with focus when its handle had focus (or the\n  // DOM move dropped focus to the body); a row menu keeps its own focus.\n  const keepFocus = (key: string) => {\n    const active = typeof document === \"undefined\" ? null : document.activeElement;\n    refocus.current = active === handles.current.get(key) || active === document.body || active === null ? key : null;\n  };\n  const keysSignature = keys.join(\"\\u0000\");\n  useIsomorphicLayoutEffect(() => {\n    const key = refocus.current;\n    refocus.current = null;\n    if (!key) return;\n    const handle = handles.current.get(key);\n    const active = document.activeElement;\n    if (handle && (active === document.body || active === null || active === handle)) handle.focus();\n  }, [keysSignature]);\n\n  // An item that disappears mid-gesture, or the list turning disabled, ends\n  // the gesture.\n  React.useEffect(() => {\n    if (disabled && (grabbed || armed || dragging)) {\n      setGrabbed(null);\n      setArmed(null);\n      setDragging(null);\n      setDropAt(null);\n      if (!pending) setPreview(null);\n      return;\n    }\n    if (dragging && !byKey.has(dragging)) {\n      setDragging(null);\n      setDropAt(null);\n      setArmed(null);\n    }\n    if (grabbed && !byKey.has(grabbed.key)) {\n      setGrabbed(null);\n      setPreview(null);\n    }\n  });\n\n  const commit = (key: string, from: number, to: number, message: string) => {\n    if (from === to) return;\n    setPending(true);\n    setPreview(moved(itemKeys, from, to));\n    // Called synchronously, so a synchronous handler updates `items` in the\n    // same tick as the preview.\n    let result: void | Promise<void>;\n    try {\n      result = onReorder(from, to, { key });\n    } catch (error) {\n      result = Promise.reject(error);\n    }\n    Promise.resolve(result)\n      .then(\n        () => announce(message),\n        () => announce(`Couldn’t move ${nameOf(key)}.`),\n      )\n      .finally(() => {\n        setPending(false);\n        setPreview(null);\n      });\n  };\n\n  const move = (key: string, to: number) => {\n    if (disabled || pending || grabbed) return;\n    if (!Number.isFinite(to)) return;\n    const from = itemKeys.indexOf(key);\n    const target = Math.max(0, Math.min(total - 1, Math.round(to)));\n    if (from < 0 || target === from) return;\n    keepFocus(key);\n    commit(key, from, target, `${nameOf(key)} moved to position ${target + 1} of ${total}.`);\n  };\n\n  const pickUp = (key: string) => {\n    if (disabled || pending) return;\n    const from = itemKeys.indexOf(key);\n    if (from < 0) return;\n    setGrabbed({ key, from });\n    setPreview(itemKeys);\n    announce(\n      `${nameOf(key)} picked up, position ${from + 1} of ${total}. Use the up and down arrow keys to move, Space to drop, Escape to cancel.`,\n    );\n  };\n\n  const drop = (key: string) => {\n    if (!grabbed) return;\n    const to = keys.indexOf(key);\n    const from = grabbed.from;\n    setGrabbed(null);\n    if (to === from) {\n      setPreview(null);\n      announce(`${nameOf(key)} dropped at position ${to + 1} of ${total}.`);\n      return;\n    }\n    keepFocus(key);\n    commit(key, from, to, `${nameOf(key)} dropped at position ${to + 1} of ${total}.`);\n  };\n\n  const cancel = (key: string) => {\n    if (!grabbed) return;\n    const from = grabbed.from;\n    keepFocus(key);\n    setGrabbed(null);\n    setPreview(null);\n    announce(`Move cancelled. ${nameOf(key)} is back at position ${from + 1} of ${total}.`);\n  };\n\n  const step = (key: string, to: number) => {\n    const index = keys.indexOf(key);\n    const target = Math.max(0, Math.min(total - 1, to));\n    if (index < 0 || target === index) return;\n    keepFocus(key);\n    setPreview(moved(keys, index, target));\n    announce(`${nameOf(key)} moved to position ${target + 1} of ${total}.`);\n  };\n\n  // Escape while an item is picked up must not also close a surrounding\n  // Dialog or Sheet, which listen before the handle does.\n  React.useEffect(() => {\n    if (!grabbed) return;\n    const onKey = (event: KeyboardEvent) => {\n      if (event.key !== \"Escape\") return;\n      event.preventDefault();\n      event.stopPropagation();\n      cancel(grabbed.key);\n    };\n    window.addEventListener(\"keydown\", onKey, true);\n    return () => window.removeEventListener(\"keydown\", onKey, true);\n  });\n\n  // A press on the handle arms its row for native dragging; any release or\n  // cancel, wherever it lands, disarms it.\n  React.useEffect(() => {\n    if (!armed || dragging) return;\n    const disarm = () => setArmed(null);\n    window.addEventListener(\"pointerup\", disarm, { once: true });\n    window.addEventListener(\"pointercancel\", disarm, { once: true });\n    return () => {\n      window.removeEventListener(\"pointerup\", disarm);\n      window.removeEventListener(\"pointercancel\", disarm);\n    };\n  }, [armed, dragging]);\n\n  const onHandleKeyDown = (event: React.KeyboardEvent, key: string) => {\n    if (disabled) return;\n    const isGrabbed = grabbed?.key === key;\n    const index = keys.indexOf(key);\n    const delta = event.key === \"ArrowUp\" ? -1 : event.key === \"ArrowDown\" ? 1 : 0;\n    if (isGrabbed) {\n      if (delta) {\n        event.preventDefault();\n        step(key, index + delta);\n      } else if (event.key === \"Home\" || event.key === \"End\") {\n        event.preventDefault();\n        step(key, event.key === \"Home\" ? 0 : total - 1);\n      }\n      return;\n    }\n    if (delta && event.altKey) {\n      event.preventDefault();\n      move(key, index + delta);\n    }\n  };\n\n  // Space and Enter reach the handle as a click with `detail === 0`, as do\n  // screen readers' activations; a pointer click is a press for dragging.\n  const onHandleClick = (event: React.MouseEvent, key: string) => {\n    if (disabled || event.detail !== 0) return;\n    if (grabbed?.key === key) drop(key);\n    else if (!grabbed) pickUp(key);\n  };\n\n  const onDragOver = (event: React.DragEvent<HTMLLIElement>, key: string) => {\n    if (!dragging) return;\n    event.preventDefault();\n    event.dataTransfer.dropEffect = \"move\";\n    const rect = event.currentTarget.getBoundingClientRect();\n    const edge = event.clientY < rect.top + rect.height / 2 ? \"before\" : \"after\";\n    if (dropAt?.key !== key || dropAt.edge !== edge) setDropAt({ key, edge });\n  };\n\n  const endDrag = () => {\n    setDragging(null);\n    setDropAt(null);\n    setArmed(null);\n  };\n\n  const onDrop = (event: React.DragEvent) => {\n    event.preventDefault();\n    const key = event.dataTransfer.getData(DRAG_TYPE) || dragging;\n    const target = dropAt;\n    endDrag();\n    if (!key || !target || pending || grabbed) return;\n    const from = itemKeys.indexOf(key);\n    const over = itemKeys.indexOf(target.key);\n    if (from < 0 || over < 0) return;\n    // `to` counts positions after the dragged item is taken out.\n    let to = target.edge === \"before\" ? over : over + 1;\n    if (from < to) to -= 1;\n    commit(key, from, to, `${nameOf(key)} dropped at position ${to + 1} of ${total}.`);\n  };\n\n  return (\n    <>\n      <ul aria-label={label} aria-busy={pending || undefined} className={cn(\"flex flex-col gap-1\", className)}>\n        {keys.map((key, index) => {\n          const item = byKey.get(key)!;\n          const itemLabel = getItemLabel(item);\n          const isGrabbed = grabbed?.key === key;\n          const isDragging = dragging === key;\n          const handle = disabled ? null : (\n            <button\n              type=\"button\"\n              ref={(node) => {\n                if (node) handles.current.set(key, node);\n                else handles.current.delete(key);\n              }}\n              aria-label={`Reorder ${itemLabel}`}\n              aria-describedby={instructionsId}\n              data-grabbed={isGrabbed || undefined}\n              className={cn(\n                \"inline-flex h-7 w-5 shrink-0 cursor-grab items-center justify-center rounded text-muted-foreground\",\n                \"hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n                isGrabbed && \"bg-accent text-foreground\",\n              )}\n              onPointerDown={() => {\n                if (!pending && !grabbed) setArmed(key);\n              }}\n              onPointerCancel={() => setArmed(null)}\n              onClick={(event) => onHandleClick(event, key)}\n              onKeyDown={(event) => onHandleKeyDown(event, key)}\n              onBlur={() => {\n                // A DOM move during the pick-up blurs the handle for a moment;\n                // that is not the user leaving.\n                if (isGrabbed && refocus.current !== key) cancel(key);\n              }}\n            >\n              <GripVertical className=\"h-4 w-4\" aria-hidden />\n            </button>\n          );\n          return (\n            <li\n              key={key}\n              data-sortable-key={key}\n              draggable={(!disabled && armed === key) || undefined}\n              className={cn(\n                \"relative rounded-md\",\n                moveMenu && !disabled && \"pr-8\",\n                isDragging && \"opacity-50\",\n                isGrabbed && \"ring-2 ring-primary/50\",\n                itemClassName,\n              )}\n              onDragStart={(event) => {\n                if (disabled || armed !== key) return;\n                event.dataTransfer.setData(DRAG_TYPE, key);\n                event.dataTransfer.effectAllowed = \"move\";\n                setDragging(key);\n              }}\n              onDragEnd={endDrag}\n              onDragOver={(event) => onDragOver(event, key)}\n              onDrop={onDrop}\n            >\n              {dropAt?.key === key && dragging !== key && (\n                <span\n                  aria-hidden\n                  className={cn(\n                    \"pointer-events-none absolute inset-x-0 h-0.5 rounded bg-primary\",\n                    dropAt.edge === \"before\" ? \"-top-0.5\" : \"-bottom-0.5\",\n                  )}\n                />\n              )}\n              {renderItem(item, {\n                index,\n                handle,\n                isDragging,\n                isGrabbed,\n                moveUp: () => move(key, index - 1),\n                moveDown: () => move(key, index + 1),\n                moveTo: (to) => move(key, to),\n              })}\n              {moveMenu && !disabled && total > 1 && (\n                <DropdownMenu>\n                  <DropdownMenuTrigger\n                    aria-label={`Move ${itemLabel}`}\n                    className=\"absolute right-1 top-1 rounded p-1 text-muted-foreground hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n                  >\n                    <MoreVertical className=\"h-4 w-4\" aria-hidden />\n                  </DropdownMenuTrigger>\n                  <DropdownMenuContent align=\"end\">\n                    <DropdownMenuItem disabled={index === 0} onSelect={() => move(key, index - 1)}>\n                      Move up\n                    </DropdownMenuItem>\n                    <DropdownMenuItem disabled={index === total - 1} onSelect={() => move(key, index + 1)}>\n                      Move down\n                    </DropdownMenuItem>\n                    <DropdownMenuItem disabled={index === 0} onSelect={() => move(key, 0)}>\n                      Move to top\n                    </DropdownMenuItem>\n                    <DropdownMenuItem disabled={index === total - 1} onSelect={() => move(key, total - 1)}>\n                      Move to bottom\n                    </DropdownMenuItem>\n                  </DropdownMenuContent>\n                </DropdownMenu>\n              )}\n            </li>\n          );\n        })}\n      </ul>\n      <p id={instructionsId} hidden>\n        Space or Enter picks the item up. Up and down arrows, Home and End move it. Space or Enter drops it, Escape puts\n        it back. Alt with an arrow moves it one step.\n      </p>\n      <div aria-live=\"polite\" aria-atomic=\"true\" className=\"sr-only\">\n        {announcement}\n      </div>\n    </>\n  );\n}\n"]}

package/dist/{chunk-DWM7ELFI.js → chunk-ZPPLUGLA.js}

@@ -1,9 +1,9 @@
 "use client";
 import { ViewToggle, ViewSettings } from './chunk-46TZGMFW.js';
-import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from './chunk-QJ6P2DW6.js';
 import { Collapsible, CollapsibleContent } from './chunk-B2GIBUQD.js';
 import { Badge } from './chunk-NPNADZHM.js';
 import { Popover, PopoverTrigger, PopoverContent } from './chunk-22XB3Q6H.js';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from './chunk-QJ6P2DW6.js';
 import { Switch } from './chunk-27ELYTGE.js';
 import { Button } from './chunk-NWSCYLPT.js';
 import { Label } from './chunk-F47U5KNW.js';
@@ -1149,5 +1149,5 @@ function AppShell({
 }
 
 export { AppShell, PageHeader };
-//# sourceMappingURL=chunk-DWM7ELFI.js.map
-//# sourceMappingURL=chunk-DWM7ELFI.js.map
+//# sourceMappingURL=chunk-ZPPLUGLA.js.map
+//# sourceMappingURL=chunk-ZPPLUGLA.js.map