@alexgorbatchev/shadcn 0.0.19 → 0.0.21

package/dist/index.js

@@ -10,9 +10,12 @@ import {
   useDensity
 } from "./chunk-e6hk39ev.js";
 import {
-  PortalContext,
   usePortalContainer2
 } from "./chunk-j89xg1ak.js";
+import {
+  usePortalNode,
+  PortalProvider2
+} from "./chunk-aa7m22zj.js";
 import {
   DirectionProvider2,
   useDirection2
@@ -33,7 +36,7 @@ import {
   DropdownMenuRadioItem2,
   DropdownMenuSeparator2,
   DropdownMenuShortcut2
-} from "./chunk-mx21wpq0.js";
+} from "./chunk-d4bm5rzy.js";
 import {
   Popover2,
   PopoverTrigger2,
@@ -41,7 +44,7 @@ import {
   PopoverHeader2,
   PopoverTitle2,
   PopoverDescription2
-} from "./chunk-x7z9jzyf.js";
+} from "./chunk-4djw71cv.js";
 import {
   Skeleton2
 } from "./chunk-d70rcwk7.js";
@@ -77,7 +80,7 @@ import {
   DialogFooter2,
   DialogTitle2,
   DialogDescription2
-} from "./chunk-717ggspf.js";
+} from "./chunk-70vndezn.js";
 import {
   Slider2
 } from "./chunk-644cnngf.js";
@@ -92,7 +95,7 @@ import {
   Tooltip2,
   TooltipTrigger2,
   TooltipContent2
-} from "./chunk-czg9p52v.js";
+} from "./chunk-mz3e810d.js";
 import {
   RadioGroup2,
   RadioGroupItem2
@@ -105,7 +108,7 @@ import {
   CardAction2,
   CardContent2,
   CardFooter2
-} from "./chunk-v4yqjvzd.js";
+} from "./chunk-bygq5yqf.js";
 import {
   InputGroup2,
   InputGroupAddon2,
@@ -114,6 +117,21 @@ import {
   InputGroupInput2,
   InputGroupTextarea2
 } from "./chunk-1jeg5z55.js";
+import {
+  Tabs2,
+  tabsListVariants2,
+  TabsList2,
+  TabsTrigger2,
+  TabsContent2,
+  DragDropPreview2,
+  DragDropProvider2,
+  useDragDrop2,
+  useDragSource2,
+  DragSource2,
+  useDropTarget2,
+  DropTarget2,
+  Kanban2
+} from "./chunk-kbg2e95b.js";
 import {
   badgeVariants2,
   Badge2
@@ -179,6 +197,11 @@ import {
   TableCell2,
   TableCaption2
 } from "./chunk-0y0kqaqj.js";
+import {
+  NativeSelect2,
+  NativeSelectOption2,
+  NativeSelectOptGroup2
+} from "./chunk-r9qrb6b6.js";
 import {
   Kbd2,
   KbdGroup2
@@ -187,7 +210,7 @@ import {
   HoverCard2,
   HoverCardTrigger2,
   HoverCardContent2
-} from "./chunk-m54kq3he.js";
+} from "./chunk-hh43wg05.js";
 import {
   Sheet2,
   SheetTrigger2,
@@ -221,7 +244,15 @@ import {
   SidebarMenuSub2,
   SidebarMenuSubItem2,
   SidebarMenuSubButton2
-} from "./chunk-45kmek5e.js";
+} from "./chunk-dq7kr5y0.js";
+import {
+  Toolbar2,
+  ToolbarButton2,
+  ToolbarLink2,
+  ToolbarInput2,
+  ToolbarGroup2,
+  ToolbarSeparator2
+} from "./chunk-21wbz345.js";
 // src/components/ButtonLink.tsx
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
@@ -406,22 +437,27 @@ function ComboboxContent({
   const resolvedDensity = useDensity(density);
   const direction = useDirection();
   const container = usePortalContainer2();
+  const portal = usePortalNode();
   return /* @__PURE__ */ jsx3(ComboboxPrimitive.Portal, {
     container,
-    children: /* @__PURE__ */ jsx3(ComboboxPrimitive.Positioner, {
-      side,
-      sideOffset,
-      align,
-      alignOffset,
-      anchor,
-      className: "isolate ",
-      children: /* @__PURE__ */ jsx3(ComboboxPrimitive.Popup, {
-        dir: direction,
-        "data-density": resolvedDensity,
-        "data-slot": "combobox-content",
-        "data-chips": !!anchor,
-        className: (state) => cn2("group/combobox-content relative max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[chips=true]:min-w-(--anchor-width) *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-control *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
-        ...props
+    ref: portal.ref,
+    children: /* @__PURE__ */ jsx3(PortalProvider2, {
+      container: portal.node,
+      children: /* @__PURE__ */ jsx3(ComboboxPrimitive.Positioner, {
+        side,
+        sideOffset,
+        align,
+        alignOffset,
+        anchor,
+        className: "isolate ",
+        children: /* @__PURE__ */ jsx3(ComboboxPrimitive.Popup, {
+          dir: direction,
+          "data-density": resolvedDensity,
+          "data-slot": "combobox-content",
+          "data-chips": !!anchor,
+          className: (state) => cn2("group/combobox-content relative max-h-(--available-height) w-(--anchor-width) max-w-(--available-width) min-w-[calc(var(--anchor-width)+--spacing(7))] origin-(--transform-origin) overflow-hidden rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[chips=true]:min-w-(--anchor-width) *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-control *:data-[slot=input-group]:border-input/30 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:shadow-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
+          ...props
+        })
       })
     })
   });
@@ -498,7 +534,14 @@ function ComboboxChips({ density, className, ...props }) {
     ...props
   });
 }
-function ComboboxChip({ density, className, children, showRemove = true, ...props }) {
+function ComboboxChip({
+  density,
+  className,
+  children,
+  showRemove = true,
+  removeLabel = "Remove item",
+  ...props
+}) {
   return /* @__PURE__ */ jsxs2(ComboboxPrimitive.Chip, {
     "data-density": density,
     "data-slot": "combobox-chip",
@@ -513,7 +556,7 @@ function ComboboxChip({ density, className, children, showRemove = true, ...prop
         }),
         className: "size-tag -ms-1 opacity-50 hover:opacity-100",
         "data-slot": "combobox-chip-remove",
-        "aria-label": "Remove item",
+        "aria-label": removeLabel,
         children: /* @__PURE__ */ jsx3(XIcon, {
           className: "pointer-events-none"
         })
@@ -529,334 +572,54 @@ function ComboboxChipsInput({ density, className, ...props }) {
     ...props
   });
 }
-// src/components/Tabs.tsx
-import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
-import { cva } from "class-variance-authority";
-import { jsx as jsx4 } from "react/jsx-runtime";
-function Tabs({ density, className, orientation = "horizontal", ...props }) {
-  return /* @__PURE__ */ jsx4(TabsPrimitive.Root, {
-    "data-density": density,
-    "data-slot": "tabs",
-    orientation,
-    className: (state) => cn2("group/tabs flex gap-2 data-[orientation=horizontal]:flex-col", typeof className === "function" ? className(state) : className),
-    ...props
-  });
-}
-var tabsListVariants = cva("group/tabs-list inline-flex w-fit items-center justify-center rounded-sm p-px text-muted-foreground group-data-[orientation=horizontal]/tabs:h-control group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none", {
-  variants: {
-    variant: {
-      default: "bg-muted",
-      line: "gap-1 bg-transparent"
-    }
-  },
-  defaultVariants: {
-    variant: "default"
-  }
-});
-function TabsList({ density, className, variant = "default", ...props }) {
-  return /* @__PURE__ */ jsx4(TabsPrimitive.List, {
-    "data-density": density,
-    "data-slot": "tabs-list",
-    "data-variant": variant,
-    className: (state) => cn2(tabsListVariants({ variant }), typeof className === "function" ? className(state) : className),
-    ...props
-  });
-}
-function TabsTrigger({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx4(TabsPrimitive.Tab, {
-    "data-density": density,
-    "data-slot": "tabs-trigger",
-    className: (state) => cn2("relative inline-flex h-full flex-1 items-center justify-center gap-control-gap rounded-md border border-transparent px-1.5 py-0.5 text-sm font-medium whitespace-nowrap text-foreground/60 transition-colors group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pe-1 has-data-[icon=inline-start]:ps-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 group-data-[variant=default]/tabs-list:data-active:shadow-sm group-data-[variant=line]/tabs-list:data-active:shadow-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent", "data-active:bg-background data-active:text-foreground", "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-end-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100", typeof className === "function" ? className(state) : className),
-    ...props
-  });
-}
-function TabsContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx4(TabsPrimitive.Panel, {
-    "data-density": density,
-    "data-slot": "tabs-content",
-    className: (state) => cn2("flex-1 text-sm outline-none", typeof className === "function" ? className(state) : className),
-    ...props
-  });
-}
-// src/components/DragDropProvider.tsx
-import { useCallback, useEffect, useRef, useState } from "react";
-import { flushSync } from "react-dom";
-
-// src/drag-drop/DragDropContext.ts
-import { createContext } from "react";
-var DragDropContext = createContext(null);
-
-// src/components/DragDropPreview.tsx
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-function DragDropPreview({ labels, maxItems = 5 }) {
-  const limit = Math.max(1, Math.floor(maxItems));
-  return /* @__PURE__ */ jsxs3("div", {
-    "data-slot": "drag-drop-preview",
-    className: "flex w-max max-w-64 flex-col items-start gap-1",
-    children: [
-      labels.slice(0, limit).map((label, index) => /* @__PURE__ */ jsx5(Badge2, {
-        variant: "secondary",
-        density: "compact",
-        children: /* @__PURE__ */ jsx5("span", {
-          className: "max-w-60 truncate",
-          children: label
-        })
-      }, `${index}:${label}`)),
-      labels.length > limit && /* @__PURE__ */ jsxs3(Badge2, {
-        variant: "secondary",
-        density: "compact",
-        children: [
-          "+",
-          labels.length - limit,
-          " more…"
-        ]
-      })
-    ]
-  });
-}
-
-// src/components/DragDropProvider.tsx
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
-function DragDropProvider({ children, maxPreviewItems = 5 }) {
-  const [active, setActive] = useState(null);
-  const [over, setOver] = useState(null);
-  const preview = useRef(null);
-  const end = useCallback(() => {
-    setActive(null);
-    setOver(null);
-  }, []);
-  useEffect(() => {
-    window.addEventListener("dragend", end);
-    window.addEventListener("drop", end);
-    return () => {
-      window.removeEventListener("dragend", end);
-      window.removeEventListener("drop", end);
-    };
-  }, [end]);
-  const start = (event, item, effect) => {
-    event.dataTransfer.effectAllowed = effect;
-    event.dataTransfer.setData(item.type, JSON.stringify(item.data) ?? "null");
-    event.dataTransfer.setData("text/plain", item.labels.join(`
-`));
-    flushSync(() => {
-      setActive(item);
-      setOver(null);
-    });
-    if (preview.current)
-      event.dataTransfer.setDragImage(preview.current, 12, 12);
-  };
-  const enter = (next) => setOver((current) => current?.id === next.id && current.type === next.type && current.isAlt === next.isAlt && current.effect === next.effect ? current : next);
-  const leave = (id) => setOver((current) => current?.id === id ? null : current);
-  return /* @__PURE__ */ jsxs4(DragDropContext, {
-    value: { active, over, start, end, enter, leave },
-    children: [
-      children,
-      /* @__PURE__ */ jsx6("div", {
-        ref: preview,
-        "aria-hidden": "true",
-        className: "pointer-events-none fixed -left-[10000px] top-0 w-max",
-        children: /* @__PURE__ */ jsx6(DragDropPreview, {
-          labels: active?.labels ?? [],
-          maxItems: maxPreviewItems
-        })
-      }),
-      /* @__PURE__ */ jsx6("span", {
-        role: "status",
-        "aria-label": "Drag status",
-        className: "sr-only",
-        children: active && `${active.labels.length} ${active.labels.length === 1 ? "item" : "items"} being dragged`
-      })
-    ]
-  });
-}
-// src/components/DragSource.tsx
-import { useRender as useRender2 } from "@base-ui/react/use-render";
-import { mergeProps as mergeProps2 } from "@base-ui/react/merge-props";
-
-// src/hooks/useDragSource.ts
-import { useId } from "react";
-
-// src/hooks/useDragDrop.ts
-import { useContext } from "react";
-function useDragDrop() {
-  const context = useContext(DragDropContext);
-  if (!context)
-    throw new Error("Drag and drop requires DragDropProvider.");
-  return context;
-}
-
-// src/hooks/useDragSource.ts
-function useDragSource({
-  type,
-  data,
-  labels,
-  effectAllowed = "copyMove",
-  disabled = false
-}) {
-  const { active, start, end } = useDragDrop();
-  const sourceId = useId();
-  return {
-    isDragging: active?.sourceId === sourceId,
-    props: {
-      draggable: !disabled,
-      onDragStart: (event) => {
-        if (event.defaultPrevented)
-          return;
-        event.stopPropagation();
-        if (disabled || labels.length === 0) {
-          event.preventDefault();
-          return;
-        }
-        start(event, { sourceId, type, data, labels }, effectAllowed);
-      },
-      onDragEnd: end
-    }
-  };
-}
-
-// src/components/DragSource.tsx
-function DragSource({
-  type,
-  data,
-  labels,
-  effectAllowed,
-  disabled,
-  render,
-  ...props
-}) {
-  const source = useDragSource({ type, data, labels, effectAllowed, disabled });
-  return useRender2({
-    defaultTagName: "div",
-    render,
-    props: mergeProps2(props, source.props),
-    state: { slot: "drag-source", dragging: source.isDragging }
-  });
-}
-// src/components/DropTarget.tsx
-import { useRender as useRender3 } from "@base-ui/react/use-render";
-import { mergeProps as mergeProps3 } from "@base-ui/react/merge-props";
-
-// src/hooks/useDropTarget.ts
-import { useId as useId2, useState as useState2 } from "react";
-function useDropTarget({ accept, canDrop, getDropEffect, onDrop }) {
-  const { active, over, enter, leave, end } = useDragDrop();
-  const id = useId2();
-  const [feedback, setFeedback] = useState2(null);
-  return {
-    feedback,
-    type: over?.id === id ? over.type : null,
-    isOver: over?.id === id,
-    isAlt: over?.id === id && over.isAlt,
-    effect: over?.id === id ? over.effect : "none",
-    props: {
-      onDragOver: (event) => {
-        const type = accept.find((type) => event.dataTransfer.types.includes(type));
-        if (!type)
-          return;
-        event.stopPropagation();
-        const item = active?.type === type ? active : null;
-        const effect = item && canDrop && !canDrop(item) ? "none" : getDropEffect?.(item, event) ?? "move";
-        event.dataTransfer.dropEffect = effect;
-        if (effect === "none") {
-          leave(id);
-          return;
-        }
-        event.preventDefault();
-        setFeedback((current) => current?.type === type && current.isAlt === event.altKey && current.effect === effect ? current : { type, isAlt: event.altKey, effect });
-        enter({ id, type, isAlt: event.altKey, effect });
-      },
-      onDragLeave: (event) => {
-        if (!(event.relatedTarget instanceof Node) || !event.currentTarget.contains(event.relatedTarget))
-          leave(id);
-      },
-      onDrop: (event) => {
-        const type = accept.find((type) => event.dataTransfer.types.includes(type));
-        if (!type)
-          return;
-        event.stopPropagation();
-        event.preventDefault();
-        const raw = event.dataTransfer.getData(type);
-        let data;
-        try {
-          data = JSON.parse(raw);
-        } catch {
-          data = raw;
-        }
-        const item = { type, data, labels: active?.labels ?? [] };
-        leave(id);
-        end();
-        if (!canDrop || canDrop(item))
-          onDrop(item, event);
-      }
-    }
-  };
-}
-
-// src/components/DropTarget.tsx
-function DropTarget({
-  accept,
-  canDrop,
-  getDropEffect,
-  onDrop,
-  render,
-  ...props
-}) {
-  const target = useDropTarget({ accept, canDrop, getDropEffect, onDrop });
-  return useRender3({
-    defaultTagName: "div",
-    render,
-    props: mergeProps3(props, target.props),
-    state: { slot: "drop-target", over: target.isOver, effect: target.effect }
-  });
-}
 // src/components/EmptyState.tsx
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function EmptyState({ title, description, children }) {
-  return /* @__PURE__ */ jsxs5(Empty2, {
+  return /* @__PURE__ */ jsxs3(Empty2, {
     children: [
-      /* @__PURE__ */ jsxs5(EmptyHeader2, {
+      /* @__PURE__ */ jsxs3(EmptyHeader2, {
         children: [
-          /* @__PURE__ */ jsx7(EmptyTitle2, {
+          /* @__PURE__ */ jsx4(EmptyTitle2, {
             children: title
           }),
-          /* @__PURE__ */ jsx7(EmptyDescription2, {
+          /* @__PURE__ */ jsx4(EmptyDescription2, {
             children: description
           })
         ]
       }),
-      children && /* @__PURE__ */ jsx7(EmptyContent2, {
+      children && /* @__PURE__ */ jsx4(EmptyContent2, {
         children
       })
     ]
   });
 }
 // src/components/PageMessage.tsx
-import { useId as useId3 } from "react";
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
+import { useId } from "react";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 function PageMessage({ title, description, children }) {
-  const titleId = useId3();
-  const descriptionId = useId3();
-  return /* @__PURE__ */ jsx8("main", {
+  const titleId = useId();
+  const descriptionId = useId();
+  return /* @__PURE__ */ jsx5("main", {
     "aria-labelledby": titleId,
     "aria-describedby": description == null ? undefined : descriptionId,
     className: "grid min-h-dvh w-full place-items-center bg-background text-foreground",
-    children: /* @__PURE__ */ jsxs6(Empty2, {
+    children: /* @__PURE__ */ jsxs4(Empty2, {
       children: [
-        /* @__PURE__ */ jsxs6(EmptyHeader2, {
+        /* @__PURE__ */ jsxs4(EmptyHeader2, {
           children: [
-            /* @__PURE__ */ jsx8(EmptyTitle2, {
-              children: /* @__PURE__ */ jsx8("h1", {
+            /* @__PURE__ */ jsx5(EmptyTitle2, {
+              children: /* @__PURE__ */ jsx5("h1", {
                 id: titleId,
                 children: title
               })
             }),
-            description != null && /* @__PURE__ */ jsx8(EmptyDescription2, {
+            description != null && /* @__PURE__ */ jsx5(EmptyDescription2, {
               id: descriptionId,
               children: description
             })
           ]
         }),
-        children != null && /* @__PURE__ */ jsx8(EmptyContent2, {
+        children != null && /* @__PURE__ */ jsx5(EmptyContent2, {
           children
         })
       ]
@@ -864,9 +627,9 @@ function PageMessage({ title, description, children }) {
   });
 }
 // src/components/JsonViewer.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx6 } from "react/jsx-runtime";
 function JsonViewer({ value, label = "JSON", rows = 12 }) {
-  return /* @__PURE__ */ jsx9(Textarea2, {
+  return /* @__PURE__ */ jsx6(Textarea2, {
     readOnly: true,
     rows,
     "aria-label": label,
@@ -876,31 +639,37 @@ function JsonViewer({ value, label = "JSON", rows = 12 }) {
 // src/components/AlertDialog.tsx
 import { AlertDialog as AlertDialogPrimitive } from "@base-ui/react/alert-dialog";
 import { useDirection as useDirection3 } from "@base-ui/react/direction-provider";
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 "use client";
 function AlertDialog({ ...props }) {
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Root, {
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Root, {
     "data-slot": "alert-dialog",
     ...props
   });
 }
 function AlertDialogTrigger({ ...props }) {
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Trigger, {
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Trigger, {
     "data-slot": "alert-dialog-trigger",
     ...props
   });
 }
-function AlertDialogPortal({ container, ...props }) {
+function AlertDialogPortal({ container, ref, children, ...props }) {
   const resolvedContainer = usePortalContainer2(container);
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Portal, {
+  const portal = usePortalNode(ref);
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Portal, {
     "data-slot": "alert-dialog-portal",
     container: resolvedContainer,
-    ...props
+    ref: portal.ref,
+    ...props,
+    children: /* @__PURE__ */ jsx7(PortalProvider2, {
+      container: portal.node,
+      children
+    })
   });
 }
 function AlertDialogOverlay({ density, className, ...props }) {
   const resolvedDensity = useDensity(density);
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Backdrop, {
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Backdrop, {
     "data-density": resolvedDensity,
     "data-slot": "alert-dialog-overlay",
     className: (state) => cn2("fixed inset-0 isolate bg-backdrop duration-120 data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
@@ -910,13 +679,14 @@ function AlertDialogOverlay({ density, className, ...props }) {
 function AlertDialogContent({ density, className, size = "default", ...props }) {
   const resolvedDensity = useDensity(density);
   const direction = useDirection3();
-  return /* @__PURE__ */ jsxs7(AlertDialogPortal, {
+  return /* @__PURE__ */ jsxs5(AlertDialogPortal, {
     children: [
-      /* @__PURE__ */ jsx10(AlertDialogOverlay, {}),
-      /* @__PURE__ */ jsx10(AlertDialogPrimitive.Popup, {
+      /* @__PURE__ */ jsx7(AlertDialogOverlay, {}),
+      /* @__PURE__ */ jsx7(AlertDialogPrimitive.Popup, {
         dir: direction,
         "data-density": resolvedDensity,
         "data-slot": "alert-dialog-content",
+        "data-scroll": "none",
         "data-size": size,
         className: (state) => cn2("group/alert-dialog-content fixed top-1/2 left-1/2 grid w-full -translate-x-1/2 -translate-y-1/2 gap-panel rounded-md bg-popover p-panel text-popover-foreground border border-frame-edge shadow-frame duration-120 outline-none data-[size=default]:max-w-xs data-[size=sm]:max-w-xs data-[size=default]:sm:max-w-sm data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:data-open:animate-none motion-reduce:data-closed:animate-none", typeof className === "function" ? className(state) : className),
         ...props
@@ -925,7 +695,7 @@ function AlertDialogContent({ density, className, size = "default", ...props })
   });
 }
 function AlertDialogHeader({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx10("div", {
+  return /* @__PURE__ */ jsx7("div", {
     "data-density": density,
     "data-slot": "alert-dialog-header",
     className: cn2("grid grid-rows-[auto_1fr] place-items-center gap-control-gap text-center has-data-[slot=alert-dialog-media]:grid-rows-[auto_auto_1fr] has-data-[slot=alert-dialog-media]:gap-x-4 sm:group-data-[size=default]/alert-dialog-content:place-items-start sm:group-data-[size=default]/alert-dialog-content:text-start sm:group-data-[size=default]/alert-dialog-content:has-data-[slot=alert-dialog-media]:grid-rows-[auto_1fr]", className),
@@ -933,7 +703,7 @@ function AlertDialogHeader({ density, className, ...props }) {
   });
 }
 function AlertDialogFooter({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx10("div", {
+  return /* @__PURE__ */ jsx7("div", {
     "data-density": density,
     "data-slot": "alert-dialog-footer",
     className: cn2("-mx-panel -mb-panel flex flex-col-reverse gap-2 rounded-b-md border-t bg-muted/50 p-panel group-data-[size=sm]/alert-dialog-content:grid group-data-[size=sm]/alert-dialog-content:grid-cols-2 sm:flex-row sm:justify-end", className),
@@ -941,7 +711,7 @@ function AlertDialogFooter({ density, className, ...props }) {
   });
 }
 function AlertDialogMedia({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx10("div", {
+  return /* @__PURE__ */ jsx7("div", {
     "data-density": density,
     "data-slot": "alert-dialog-media",
     className: cn2("mb-2 inline-flex size-10 items-center justify-center rounded-md bg-muted sm:group-data-[size=default]/alert-dialog-content:row-span-2 *:[svg:not([class*='size-'])]:size-control-xs", className),
@@ -949,7 +719,7 @@ function AlertDialogMedia({ density, className, ...props }) {
   });
 }
 function AlertDialogTitle({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Title, {
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Title, {
     "data-density": density,
     "data-slot": "alert-dialog-title",
     className: (state) => cn2("text-base font-medium sm:group-data-[size=default]/alert-dialog-content:group-has-data-[slot=alert-dialog-media]/alert-dialog-content:col-start-2", typeof className === "function" ? className(state) : className),
@@ -957,7 +727,7 @@ function AlertDialogTitle({ density, className, ...props }) {
   });
 }
 function AlertDialogDescription({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Description, {
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Description, {
     "data-density": density,
     "data-slot": "alert-dialog-description",
     className: (state) => cn2("text-sm text-balance text-muted-foreground md:text-pretty *:[a]:underline *:[a]:underline-offset-3 *:[a]:hover:text-foreground", typeof className === "function" ? className(state) : className),
@@ -965,7 +735,7 @@ function AlertDialogDescription({ density, className, ...props }) {
   });
 }
 function AlertDialogAction({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx10(Button2, {
+  return /* @__PURE__ */ jsx7(Button2, {
     "data-density": density,
     "data-slot": "alert-dialog-action",
     className,
@@ -979,11 +749,11 @@ function AlertDialogCancel({
   size = "default",
   ...props
 }) {
-  return /* @__PURE__ */ jsx10(AlertDialogPrimitive.Close, {
+  return /* @__PURE__ */ jsx7(AlertDialogPrimitive.Close, {
     "data-density": density,
     "data-slot": "alert-dialog-cancel",
     className,
-    render: /* @__PURE__ */ jsx10(Button2, {
+    render: /* @__PURE__ */ jsx7(Button2, {
       variant,
       size
     }),
@@ -994,11 +764,11 @@ function AlertDialogCancel({
 import { Select as SelectPrimitive } from "@base-ui/react/select";
 import { useDirection as useDirection4 } from "@base-ui/react/direction-provider";
 import { ChevronDownIcon as ChevronDownIcon3, CheckIcon as CheckIcon2, ChevronUpIcon as ChevronUpIcon2 } from "lucide-react";
-import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
 "use client";
 var Select = SelectPrimitive.Root;
 function SelectGroup({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx11(SelectPrimitive.Group, {
+  return /* @__PURE__ */ jsx8(SelectPrimitive.Group, {
     "data-density": density,
     "data-slot": "select-group",
     className: (state) => cn2("scroll-my-1 p-1", typeof className === "function" ? className(state) : className),
@@ -1006,7 +776,7 @@ function SelectGroup({ density, className, ...props }) {
   });
 }
 function SelectValue({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx11(SelectPrimitive.Value, {
+  return /* @__PURE__ */ jsx8(SelectPrimitive.Value, {
     "data-density": density,
     "data-slot": "select-value",
     className: (state) => cn2("flex flex-1 text-start", typeof className === "function" ? className(state) : className),
@@ -1014,7 +784,7 @@ function SelectValue({ density, className, ...props }) {
   });
 }
 function SelectTrigger({ density, className, size = "default", children, ...props }) {
-  return /* @__PURE__ */ jsxs8(SelectPrimitive.Trigger, {
+  return /* @__PURE__ */ jsxs6(SelectPrimitive.Trigger, {
     "data-density": density,
     "data-slot": "select-trigger",
     "data-size": size,
@@ -1022,8 +792,8 @@ function SelectTrigger({ density, className, size = "default", children, ...prop
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx11(SelectPrimitive.Icon, {
-        render: /* @__PURE__ */ jsx11(ChevronDownIcon3, {
+      /* @__PURE__ */ jsx8(SelectPrimitive.Icon, {
+        render: /* @__PURE__ */ jsx8(ChevronDownIcon3, {
           className: "pointer-events-none size-4 text-muted-foreground"
         })
       })
@@ -1044,35 +814,40 @@ function SelectContent({
   const resolvedDensity = useDensity(density);
   const direction = useDirection4();
   const container = usePortalContainer2();
-  return /* @__PURE__ */ jsx11(SelectPrimitive.Portal, {
+  const portal = usePortalNode();
+  return /* @__PURE__ */ jsx8(SelectPrimitive.Portal, {
     container,
-    children: /* @__PURE__ */ jsx11(SelectPrimitive.Positioner, {
-      side,
-      sideOffset,
-      align,
-      alignOffset,
-      alignItemWithTrigger,
-      className: "isolate ",
-      children: /* @__PURE__ */ jsxs8(SelectPrimitive.Popup, {
-        dir: direction,
-        "data-density": resolvedDensity,
-        "data-slot": "select-content",
-        "data-align-trigger": alignItemWithTrigger,
-        className: (state) => cn2("relative isolate max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[align-trigger=true]:animate-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:animate-none", typeof className === "function" ? className(state) : className),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsx11(SelectScrollUpButton, {}),
-          /* @__PURE__ */ jsx11(SelectPrimitive.List, {
-            children
-          }),
-          /* @__PURE__ */ jsx11(SelectScrollDownButton, {})
-        ]
+    ref: portal.ref,
+    children: /* @__PURE__ */ jsx8(PortalProvider2, {
+      container: portal.node,
+      children: /* @__PURE__ */ jsx8(SelectPrimitive.Positioner, {
+        side,
+        sideOffset,
+        align,
+        alignOffset,
+        alignItemWithTrigger,
+        className: "isolate ",
+        children: /* @__PURE__ */ jsxs6(SelectPrimitive.Popup, {
+          dir: direction,
+          "data-density": resolvedDensity,
+          "data-slot": "select-content",
+          "data-align-trigger": alignItemWithTrigger,
+          className: (state) => cn2("relative isolate max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[align-trigger=true]:animate-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:animate-none", typeof className === "function" ? className(state) : className),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx8(SelectScrollUpButton, {}),
+            /* @__PURE__ */ jsx8(SelectPrimitive.List, {
+              children
+            }),
+            /* @__PURE__ */ jsx8(SelectScrollDownButton, {})
+          ]
+        })
       })
     })
   });
 }
 function SelectLabel({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx11(SelectPrimitive.GroupLabel, {
+  return /* @__PURE__ */ jsx8(SelectPrimitive.GroupLabel, {
     "data-density": density,
     "data-slot": "select-label",
     className: (state) => cn2("px-1.5 py-1 text-xs text-muted-foreground", typeof className === "function" ? className(state) : className),
@@ -1080,21 +855,21 @@ function SelectLabel({ density, className, ...props }) {
   });
 }
 function SelectItem({ density, className, children, ...props }) {
-  return /* @__PURE__ */ jsxs8(SelectPrimitive.Item, {
+  return /* @__PURE__ */ jsxs6(SelectPrimitive.Item, {
     "data-density": density,
     "data-slot": "select-item",
     className: (state) => cn2("relative flex w-full cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx11(SelectPrimitive.ItemText, {
+      /* @__PURE__ */ jsx8(SelectPrimitive.ItemText, {
         className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
         children
       }),
-      /* @__PURE__ */ jsx11(SelectPrimitive.ItemIndicator, {
-        render: /* @__PURE__ */ jsx11("span", {
+      /* @__PURE__ */ jsx8(SelectPrimitive.ItemIndicator, {
+        render: /* @__PURE__ */ jsx8("span", {
           className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center"
         }),
-        children: /* @__PURE__ */ jsx11(CheckIcon2, {
+        children: /* @__PURE__ */ jsx8(CheckIcon2, {
           className: "pointer-events-none"
         })
       })
@@ -1102,7 +877,7 @@ function SelectItem({ density, className, children, ...props }) {
   });
 }
 function SelectSeparator({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx11(SelectPrimitive.Separator, {
+  return /* @__PURE__ */ jsx8(SelectPrimitive.Separator, {
     "data-density": density,
     "data-slot": "select-separator",
     className: (state) => cn2("pointer-events-none -mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
@@ -1110,40 +885,40 @@ function SelectSeparator({ density, className, ...props }) {
   });
 }
 function SelectScrollUpButton({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx11(SelectPrimitive.ScrollUpArrow, {
+  return /* @__PURE__ */ jsx8(SelectPrimitive.ScrollUpArrow, {
     "data-density": density,
     "data-slot": "select-scroll-up-button",
     className: (state) => cn2("top-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
     ...props,
-    children: /* @__PURE__ */ jsx11(ChevronUpIcon2, {})
+    children: /* @__PURE__ */ jsx8(ChevronUpIcon2, {})
   });
 }
 function SelectScrollDownButton({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx11(SelectPrimitive.ScrollDownArrow, {
+  return /* @__PURE__ */ jsx8(SelectPrimitive.ScrollDownArrow, {
     "data-density": density,
     "data-slot": "select-scroll-down-button",
     className: (state) => cn2("bottom-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
     ...props,
-    children: /* @__PURE__ */ jsx11(ChevronDownIcon3, {})
+    children: /* @__PURE__ */ jsx8(ChevronDownIcon3, {})
   });
 }
 // src/components/DensityProvider.tsx
-import { mergeProps as mergeProps4 } from "@base-ui/react/merge-props";
-import { useRender as useRender4 } from "@base-ui/react/use-render";
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { mergeProps as mergeProps2 } from "@base-ui/react/merge-props";
+import { useRender as useRender2 } from "@base-ui/react/use-render";
+import { jsx as jsx9 } from "react/jsx-runtime";
 function DensityProvider({
   density = "comfortable",
   className,
   render,
   ...props
 }) {
-  const element = useRender4({
+  const element = useRender2({
     defaultTagName: "div",
-    props: mergeProps4({ className: cn2("font-sans text-base leading-(--ag-leading)", className) }, props),
+    props: mergeProps2({ className: cn2("font-sans text-base leading-(--ag-leading)", className) }, props),
     render,
     state: { slot: "density-provider", density }
   });
-  return /* @__PURE__ */ jsx12(DensityContext.Provider, {
+  return /* @__PURE__ */ jsx9(DensityContext.Provider, {
     value: density,
     children: element
   });
@@ -1151,7 +926,137 @@ function DensityProvider({
 // src/components/ThemeProvider.tsx
 import { useMemo } from "react";
 import { useIsomorphicLayoutEffect, useTernaryDarkMode } from "usehooks-ts";
-import { jsx as jsx13 } from "react/jsx-runtime";
+
+// src/components/ScrollGuard.tsx
+import { useEffect } from "react";
+
+// src/utils/observeScrollGuards.ts
+function throwViolation(error) {
+  throw error;
+}
+function getViolation(element, view) {
+  if (!element.getClientRects().length)
+    return;
+  const style = view.getComputedStyle(element);
+  if (style.visibility !== "visible")
+    return;
+  const axes = [];
+  if (["auto", "scroll"].includes(style.overflowX) && element.scrollWidth > element.clientWidth) {
+    axes.push(`horizontal: ${element.scrollWidth}px > ${element.clientWidth}px`);
+  }
+  if (["auto", "scroll"].includes(style.overflowY) && element.scrollHeight > element.clientHeight) {
+    axes.push(`vertical: ${element.scrollHeight}px > ${element.clientHeight}px`);
+  }
+  if (!axes.length)
+    return;
+  const slot = element.getAttribute("data-slot");
+  const identity = element.id ? ` id="${element.id}"` : slot ? ` data-slot="${slot}"` : "";
+  return `<${element.localName}${identity}> (${axes.join(", ")})`;
+}
+function observeScrollGuards(ownerDocument, reportViolation = throwViolation) {
+  const view = ownerDocument.defaultView;
+  if (!view)
+    return () => {};
+  let frame;
+  let needsRefresh = true;
+  let guarded = [];
+  const observed = new Set;
+  const reported = new WeakSet;
+  const schedule = () => {
+    frame ??= view.requestAnimationFrame(check);
+  };
+  const resizeObserver = new view.ResizeObserver(schedule);
+  const refresh = () => {
+    guarded = [...ownerDocument.querySelectorAll('[data-scroll="none"]')];
+    const targets = new Set(guarded.flatMap((element) => [element, ...element.querySelectorAll("*")]));
+    for (const element of observed) {
+      if (!targets.has(element)) {
+        resizeObserver.unobserve(element);
+        observed.delete(element);
+      }
+    }
+    for (const element of targets) {
+      if (!observed.has(element)) {
+        resizeObserver.observe(element);
+        observed.add(element);
+      }
+    }
+    needsRefresh = false;
+  };
+  const check = () => {
+    frame = undefined;
+    if (needsRefresh)
+      refresh();
+    const violations = [];
+    for (const element of guarded) {
+      const violation = getViolation(element, view);
+      if (!violation) {
+        reported.delete(element);
+      } else if (!reported.has(element)) {
+        reported.add(element);
+        violations.push(violation);
+      }
+    }
+    if (violations.length) {
+      reportViolation(new Error(`[shadcn] Scrolling is forbidden by data-scroll="none": ${violations.join("; ")}. ` + "Move scrolling content into a nested ScrollArea or another explicit scroll viewport."));
+    }
+  };
+  const mutations = new view.MutationObserver((records) => {
+    needsRefresh ||= records.some((record) => record.type === "childList" || record.attributeName === "data-scroll");
+    schedule();
+  });
+  mutations.observe(ownerDocument.documentElement, {
+    subtree: true,
+    childList: true,
+    characterData: true,
+    attributes: true
+  });
+  view.addEventListener("resize", schedule);
+  ownerDocument.addEventListener("load", schedule, true);
+  ownerDocument.addEventListener("transitionend", schedule, true);
+  ownerDocument.addEventListener("animationend", schedule, true);
+  ownerDocument.fonts.addEventListener("loadingdone", schedule);
+  schedule();
+  return () => {
+    mutations.disconnect();
+    resizeObserver.disconnect();
+    if (frame !== undefined)
+      view.cancelAnimationFrame(frame);
+    view.removeEventListener("resize", schedule);
+    ownerDocument.removeEventListener("load", schedule, true);
+    ownerDocument.removeEventListener("transitionend", schedule, true);
+    ownerDocument.removeEventListener("animationend", schedule, true);
+    ownerDocument.fonts.removeEventListener("loadingdone", schedule);
+  };
+}
+
+// src/components/ScrollGuard.tsx
+"use client";
+var registrations = new WeakMap;
+function ScrollGuard({ ownerDocument }) {
+  useEffect(() => {
+    if (process.env.NODE_ENV === "production")
+      return;
+    const target = ownerDocument ?? document;
+    let registration = registrations.get(target);
+    if (!registration) {
+      registration = { users: 0, disconnect: observeScrollGuards(target) };
+      registrations.set(target, registration);
+    }
+    registration.users++;
+    return () => {
+      registration.users--;
+      if (!registration.users) {
+        registration.disconnect();
+        registrations.delete(target);
+      }
+    };
+  }, [ownerDocument]);
+  return null;
+}
+
+// src/components/ThemeProvider.tsx
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 function StoredThemeProvider({
   children,
   defaultTheme = "system",
@@ -1162,7 +1067,7 @@ function StoredThemeProvider({
     defaultValue: defaultTheme,
     localStorageKey: storageKey
   });
-  return /* @__PURE__ */ jsx13(ThemePalette, {
+  return /* @__PURE__ */ jsx10(ThemePalette, {
     theme: forcedTheme ?? ternaryDarkMode,
     resolvedTheme: forcedTheme ?? (isDarkMode ? "dark" : "light"),
     setTheme: setTernaryDarkMode,
@@ -1180,9 +1085,12 @@ function ThemePalette({
     document.documentElement.style.colorScheme = resolvedTheme;
   }, [resolvedTheme]);
   const value = useMemo(() => ({ theme, resolvedTheme, setTheme }), [theme, resolvedTheme, setTheme]);
-  return /* @__PURE__ */ jsx13(ThemeContext.Provider, {
+  return /* @__PURE__ */ jsxs7(ThemeContext.Provider, {
     value,
-    children
+    children: [
+      /* @__PURE__ */ jsx10(ScrollGuard, {}),
+      children
+    ]
   });
 }
 function ControlledThemeProvider({
@@ -1193,7 +1101,7 @@ function ControlledThemeProvider({
   const isDark = useMediaQuery("(prefers-color-scheme: dark)");
   const { theme, setTheme } = controlledTheme;
   const resolvedTheme = forcedTheme ?? (theme === "system" ? isDark ? "dark" : "light" : theme);
-  return /* @__PURE__ */ jsx13(ThemePalette, {
+  return /* @__PURE__ */ jsx10(ThemePalette, {
     theme: forcedTheme ?? theme,
     resolvedTheme,
     setTheme,
@@ -1202,23 +1110,23 @@ function ControlledThemeProvider({
 }
 function ThemeProvider(props) {
   if (props.controlledTheme)
-    return /* @__PURE__ */ jsx13(ControlledThemeProvider, {
+    return /* @__PURE__ */ jsx10(ControlledThemeProvider, {
       ...props,
       controlledTheme: props.controlledTheme
     });
-  return /* @__PURE__ */ jsx13(StoredThemeProvider, {
+  return /* @__PURE__ */ jsx10(StoredThemeProvider, {
     ...props
   });
 }
 // src/hooks/useComboboxAnchor.ts
-import { useRef as useRef2 } from "react";
+import { useRef } from "react";
 function useComboboxAnchor() {
-  return useRef2(null);
+  return useRef(null);
 }
 // src/components/AspectRatio.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx11 } from "react/jsx-runtime";
 function AspectRatio({ ratio, className, style, ...props }) {
-  return /* @__PURE__ */ jsx14("div", {
+  return /* @__PURE__ */ jsx11("div", {
     "data-slot": "aspect-ratio",
     className: cn2("relative", className),
     style: { aspectRatio: ratio, ...style },
@@ -1227,11 +1135,11 @@ function AspectRatio({ ratio, className, style, ...props }) {
 }
 // src/components/Breadcrumb.tsx
 import { ChevronRightIcon, MoreHorizontalIcon } from "lucide-react";
-import { mergeProps as mergeProps5 } from "@base-ui/react/merge-props";
-import { useRender as useRender5 } from "@base-ui/react/use-render";
-import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
+import { mergeProps as mergeProps3 } from "@base-ui/react/merge-props";
+import { useRender as useRender3 } from "@base-ui/react/use-render";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 function Breadcrumb({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx15("nav", {
+  return /* @__PURE__ */ jsx12("nav", {
     "aria-label": "breadcrumb",
     "data-density": density,
     "data-slot": "breadcrumb",
@@ -1240,7 +1148,7 @@ function Breadcrumb({ density, className, ...props }) {
   });
 }
 function BreadcrumbList({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx15("ol", {
+  return /* @__PURE__ */ jsx12("ol", {
     "data-density": density,
     "data-slot": "breadcrumb-list",
     className: cn2("flex flex-wrap items-center gap-control-gap text-sm wrap-break-word text-muted-foreground", className),
@@ -1248,7 +1156,7 @@ function BreadcrumbList({ density, className, ...props }) {
   });
 }
 function BreadcrumbItem({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx15("li", {
+  return /* @__PURE__ */ jsx12("li", {
     "data-density": density,
     "data-slot": "breadcrumb-item",
     className: cn2("inline-flex items-center gap-1", className),
@@ -1256,9 +1164,9 @@ function BreadcrumbItem({ density, className, ...props }) {
   });
 }
 function BreadcrumbLink({ density, className, render, ...props }) {
-  return useRender5({
+  return useRender3({
     defaultTagName: "a",
-    props: mergeProps5({
+    props: mergeProps3({
       className: cn2("transition-colors hover:text-foreground", className)
     }, props),
     render,
@@ -1269,7 +1177,7 @@ function BreadcrumbLink({ density, className, render, ...props }) {
   });
 }
 function BreadcrumbPage({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx15("span", {
+  return /* @__PURE__ */ jsx12("span", {
     "data-density": density,
     "data-slot": "breadcrumb-page",
     role: "link",
@@ -1280,20 +1188,20 @@ function BreadcrumbPage({ density, className, ...props }) {
   });
 }
 function BreadcrumbSeparator({ density, children, className, ...props }) {
-  return /* @__PURE__ */ jsx15("li", {
+  return /* @__PURE__ */ jsx12("li", {
     "data-density": density,
     "data-slot": "breadcrumb-separator",
     role: "presentation",
     "aria-hidden": "true",
     className: cn2("[&>svg]:size-3.5", className),
     ...props,
-    children: children ?? /* @__PURE__ */ jsx15(ChevronRightIcon, {
+    children: children ?? /* @__PURE__ */ jsx12(ChevronRightIcon, {
       className: "rtl:rotate-180"
     })
   });
 }
 function BreadcrumbEllipsis({ density, className, ...props }) {
-  return /* @__PURE__ */ jsxs9("span", {
+  return /* @__PURE__ */ jsxs8("span", {
     "data-density": density,
     "data-slot": "breadcrumb-ellipsis",
     role: "presentation",
@@ -1301,8 +1209,8 @@ function BreadcrumbEllipsis({ density, className, ...props }) {
     className: cn2("flex size-5 items-center justify-center [&>svg]:size-4", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx15(MoreHorizontalIcon, {}),
-      /* @__PURE__ */ jsx15("span", {
+      /* @__PURE__ */ jsx12(MoreHorizontalIcon, {}),
+      /* @__PURE__ */ jsx12("span", {
         className: "sr-only",
         children: "More"
       })
@@ -1310,11 +1218,11 @@ function BreadcrumbEllipsis({ density, className, ...props }) {
   });
 }
 // src/components/ButtonGroup.tsx
-import { mergeProps as mergeProps6 } from "@base-ui/react/merge-props";
-import { useRender as useRender6 } from "@base-ui/react/use-render";
-import { cva as cva2 } from "class-variance-authority";
-import { jsx as jsx16 } from "react/jsx-runtime";
-var buttonGroupVariants = cva2("flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10 has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-e-sm [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
+import { mergeProps as mergeProps4 } from "@base-ui/react/merge-props";
+import { useRender as useRender4 } from "@base-ui/react/use-render";
+import { cva } from "class-variance-authority";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var buttonGroupVariants = cva("flex w-fit items-stretch *:focus-visible:relative *:focus-visible:z-10 has-[>[data-slot=button-group]]:gap-2 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-e-sm [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1", {
   variants: {
     orientation: {
       horizontal: "*:data-slot:rounded-e-none [&>[data-slot]:not(:has(~[data-slot]))]:rounded-e-sm! [&>[data-slot]~[data-slot]]:rounded-s-none [&>[data-slot]~[data-slot]]:border-s-0",
@@ -1326,7 +1234,7 @@ var buttonGroupVariants = cva2("flex w-fit items-stretch *:focus-visible:relativ
   }
 });
 function ButtonGroup({ density, className, orientation, ...props }) {
-  return /* @__PURE__ */ jsx16("div", {
+  return /* @__PURE__ */ jsx13("div", {
     role: "group",
     "data-density": density,
     "data-slot": "button-group",
@@ -1336,9 +1244,9 @@ function ButtonGroup({ density, className, orientation, ...props }) {
   });
 }
 function ButtonGroupText({ density, className, render, ...props }) {
-  return useRender6({
+  return useRender4({
     defaultTagName: "div",
-    props: mergeProps6({
+    props: mergeProps4({
       className: cn2("flex items-center gap-2 rounded-sm border bg-muted px-control-x text-sm font-medium [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4", className)
     }, props),
     render,
@@ -1354,7 +1262,7 @@ function ButtonGroupSeparator({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ jsx16(Separator2, {
+  return /* @__PURE__ */ jsx13(Separator2, {
     "data-density": density,
     "data-slot": "button-group-separator",
     orientation,
@@ -1362,61 +1270,13 @@ function ButtonGroupSeparator({
     ...props
   });
 }
-// src/components/NativeSelect.tsx
-import { ChevronDownIcon as ChevronDownIcon4 } from "lucide-react";
-import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
-function NativeSelect({
-  density,
-  className,
-  dir,
-  size = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs10("div", {
-    dir,
-    className: cn2("group/native-select relative w-fit has-[select:disabled]:opacity-50", className),
-    "data-density": density,
-    "data-slot": "native-select-wrapper",
-    "data-size": size,
-    children: [
-      /* @__PURE__ */ jsx17("select", {
-        dir,
-        "data-slot": "native-select",
-        "data-size": size,
-        className: "h-control w-full min-w-0 appearance-none rounded-sm border border-input bg-secondary py-1 pe-8 ps-2.5 text-sm transition-colors outline-none select-none selection:bg-primary selection:text-primary-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-not-allowed aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive data-[size=sm]:h-control-sm data-[size=sm]:rounded-sm data-[size=sm]:py-0.5",
-        ...props
-      }),
-      /* @__PURE__ */ jsx17(ChevronDownIcon4, {
-        className: "pointer-events-none absolute top-1/2 end-2.5 size-4 -translate-y-1/2 text-muted-foreground select-none",
-        "aria-hidden": "true",
-        "data-slot": "native-select-icon"
-      })
-    ]
-  });
-}
-function NativeSelectOption({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx17("option", {
-    "data-density": density,
-    "data-slot": "native-select-option",
-    className: cn2("bg-[Canvas] text-[CanvasText]", className),
-    ...props
-  });
-}
-function NativeSelectOptGroup({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx17("optgroup", {
-    "data-density": density,
-    "data-slot": "native-select-optgroup",
-    className: cn2("bg-[Canvas] text-[CanvasText]", className),
-    ...props
-  });
-}
 // src/components/Item.tsx
-import { mergeProps as mergeProps7 } from "@base-ui/react/merge-props";
-import { useRender as useRender7 } from "@base-ui/react/use-render";
-import { cva as cva3 } from "class-variance-authority";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { mergeProps as mergeProps5 } from "@base-ui/react/merge-props";
+import { useRender as useRender5 } from "@base-ui/react/use-render";
+import { cva as cva2 } from "class-variance-authority";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function ItemGroup({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     role: "list",
     "data-density": density,
     "data-slot": "item-group",
@@ -1425,7 +1285,7 @@ function ItemGroup({ density, className, ...props }) {
   });
 }
 function ItemSeparator({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18(Separator2, {
+  return /* @__PURE__ */ jsx14(Separator2, {
     "data-density": density,
     "data-slot": "item-separator",
     orientation: "horizontal",
@@ -1433,7 +1293,7 @@ function ItemSeparator({ density, className, ...props }) {
     ...props
   });
 }
-var itemVariants = cva3("group/item flex w-full flex-wrap items-center rounded-sm border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring [a]:transition-colors [a]:hover:bg-muted", {
+var itemVariants = cva2("group/item flex w-full flex-wrap items-center rounded-sm border text-sm transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring [a]:transition-colors [a]:hover:bg-muted", {
   variants: {
     variant: {
       default: "border-transparent",
@@ -1459,9 +1319,9 @@ function Item({
   render,
   ...props
 }) {
-  return useRender7({
+  return useRender5({
     defaultTagName: "div",
-    props: mergeProps7({
+    props: mergeProps5({
       className: cn2(itemVariants({ variant, size, className }))
     }, props),
     render,
@@ -1473,7 +1333,7 @@ function Item({
     }
   });
 }
-var itemMediaVariants = cva3("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
+var itemMediaVariants = cva2("flex shrink-0 items-center justify-center gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start [&_svg]:pointer-events-none", {
   variants: {
     variant: {
       default: "bg-transparent",
@@ -1486,7 +1346,7 @@ var itemMediaVariants = cva3("flex shrink-0 items-center justify-center gap-2 gr
   }
 });
 function ItemMedia({ density, className, variant = "default", ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     "data-density": density,
     "data-slot": "item-media",
     "data-variant": variant,
@@ -1495,7 +1355,7 @@ function ItemMedia({ density, className, variant = "default", ...props }) {
   });
 }
 function ItemContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     "data-density": density,
     "data-slot": "item-content",
     className: cn2("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className),
@@ -1503,7 +1363,7 @@ function ItemContent({ density, className, ...props }) {
   });
 }
 function ItemTitle({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     "data-density": density,
     "data-slot": "item-title",
     className: cn2("line-clamp-1 flex w-fit items-center gap-2 text-sm leading-snug font-medium underline-offset-4", className),
@@ -1511,7 +1371,7 @@ function ItemTitle({ density, className, ...props }) {
   });
 }
 function ItemDescription({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("p", {
+  return /* @__PURE__ */ jsx14("p", {
     "data-density": density,
     "data-slot": "item-description",
     className: cn2("line-clamp-2 text-start text-sm leading-normal font-normal text-muted-foreground group-data-[size=xs]/item:text-xs [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary", className),
@@ -1519,7 +1379,7 @@ function ItemDescription({ density, className, ...props }) {
   });
 }
 function ItemActions({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     "data-density": density,
     "data-slot": "item-actions",
     className: cn2("flex items-center gap-2", className),
@@ -1527,7 +1387,7 @@ function ItemActions({ density, className, ...props }) {
   });
 }
 function ItemHeader({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     "data-density": density,
     "data-slot": "item-header",
     className: cn2("flex basis-full items-center justify-between gap-2", className),
@@ -1535,7 +1395,7 @@ function ItemHeader({ density, className, ...props }) {
   });
 }
 function ItemFooter({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx18("div", {
+  return /* @__PURE__ */ jsx14("div", {
     "data-density": density,
     "data-slot": "item-footer",
     className: cn2("flex basis-full items-center justify-between gap-2", className),
@@ -1544,9 +1404,9 @@ function ItemFooter({ density, className, ...props }) {
 }
 // src/components/Pagination.tsx
 import { ChevronLeftIcon, ChevronRightIcon as ChevronRightIcon2, MoreHorizontalIcon as MoreHorizontalIcon2 } from "lucide-react";
-import { jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
 function Pagination({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx19("nav", {
+  return /* @__PURE__ */ jsx15("nav", {
     role: "navigation",
     "aria-label": "pagination",
     "data-density": density,
@@ -1556,7 +1416,7 @@ function Pagination({ density, className, ...props }) {
   });
 }
 function PaginationContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx19("ul", {
+  return /* @__PURE__ */ jsx15("ul", {
     "data-density": density,
     "data-slot": "pagination-content",
     className: cn2("flex items-center gap-0.5", className),
@@ -1564,7 +1424,7 @@ function PaginationContent({ density, className, ...props }) {
   });
 }
 function PaginationItem({ ...props }) {
-  return /* @__PURE__ */ jsx19("li", {
+  return /* @__PURE__ */ jsx15("li", {
     "data-slot": "pagination-item",
     ...props
   });
@@ -1576,7 +1436,7 @@ function PaginationLink({
   size = "icon",
   ...props
 }) {
-  return /* @__PURE__ */ jsx19("a", {
+  return /* @__PURE__ */ jsx15("a", {
     "data-density": density,
     className: cn2(buttonVariants2({ variant: isActive ? "outline" : "ghost", size }), className),
     "aria-current": isActive ? "page" : undefined,
@@ -1591,18 +1451,18 @@ function PaginationPrevious({
   text = "Previous",
   ...props
 }) {
-  return /* @__PURE__ */ jsxs11(PaginationLink, {
+  return /* @__PURE__ */ jsxs9(PaginationLink, {
     density,
     "aria-label": "Go to previous page",
     size: "default",
     className: cn2("ps-1.5!", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx19(ChevronLeftIcon, {
+      /* @__PURE__ */ jsx15(ChevronLeftIcon, {
         "data-icon": "inline-start",
         className: "rtl:rotate-180"
       }),
-      /* @__PURE__ */ jsx19("span", {
+      /* @__PURE__ */ jsx15("span", {
         className: "hidden sm:block",
         children: text
       })
@@ -1610,18 +1470,18 @@ function PaginationPrevious({
   });
 }
 function PaginationNext({ density, className, text = "Next", ...props }) {
-  return /* @__PURE__ */ jsxs11(PaginationLink, {
+  return /* @__PURE__ */ jsxs9(PaginationLink, {
     density,
     "aria-label": "Go to next page",
     size: "default",
     className: cn2("pe-1.5!", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx19("span", {
+      /* @__PURE__ */ jsx15("span", {
         className: "hidden sm:block",
         children: text
       }),
-      /* @__PURE__ */ jsx19(ChevronRightIcon2, {
+      /* @__PURE__ */ jsx15(ChevronRightIcon2, {
         "data-icon": "inline-end",
         className: "rtl:rotate-180"
       })
@@ -1629,15 +1489,15 @@ function PaginationNext({ density, className, text = "Next", ...props }) {
   });
 }
 function PaginationEllipsis({ density, className, ...props }) {
-  return /* @__PURE__ */ jsxs11("span", {
+  return /* @__PURE__ */ jsxs9("span", {
     "aria-hidden": true,
     "data-density": density,
     "data-slot": "pagination-ellipsis",
     className: cn2("flex size-control items-center justify-center [&_svg:not([class*='size-'])]:size-4", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx19(MoreHorizontalIcon2, {}),
-      /* @__PURE__ */ jsx19("span", {
+      /* @__PURE__ */ jsx15(MoreHorizontalIcon2, {}),
+      /* @__PURE__ */ jsx15("span", {
         className: "sr-only",
         children: "More pages"
       })
@@ -1646,39 +1506,39 @@ function PaginationEllipsis({ density, className, ...props }) {
 }
 // src/components/ScrollArea.tsx
 import { ScrollArea as ScrollAreaPrimitive } from "@base-ui/react/scroll-area";
-import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
 function ScrollArea({
   density,
   className,
   children,
-  scrollbars = /* @__PURE__ */ jsx20(ScrollBar, {}),
+  scrollbars = /* @__PURE__ */ jsx16(ScrollBar, {}),
   ...props
 }) {
-  return /* @__PURE__ */ jsxs12(ScrollAreaPrimitive.Root, {
+  return /* @__PURE__ */ jsxs10(ScrollAreaPrimitive.Root, {
     "data-density": density,
     "data-slot": "scroll-area",
-    className: (state) => cn2("relative", typeof className === "function" ? className(state) : className),
+    className: (state) => cn2("relative flex min-h-0 flex-col", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx20(ScrollAreaPrimitive.Viewport, {
+      /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Viewport, {
         "data-slot": "scroll-area-viewport",
-        className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1",
+        className: "size-full min-h-0 flex-1 rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1",
         children
       }),
       scrollbars,
-      /* @__PURE__ */ jsx20(ScrollAreaPrimitive.Corner, {})
+      /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Corner, {})
     ]
   });
 }
 function ScrollBar({ density, className, orientation = "vertical", ...props }) {
-  return /* @__PURE__ */ jsx20(ScrollAreaPrimitive.Scrollbar, {
+  return /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Scrollbar, {
     "data-density": density,
     "data-slot": "scroll-area-scrollbar",
     "data-orientation": orientation,
     orientation,
     className: (state) => cn2("flex touch-none p-px transition-colors select-none data-[orientation=horizontal]:h-2.5 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent data-[orientation=vertical]:w-2.5 data-[orientation=vertical]:border-s data-[orientation=vertical]:border-s-transparent", typeof className === "function" ? className(state) : className),
     ...props,
-    children: /* @__PURE__ */ jsx20(ScrollAreaPrimitive.Thumb, {
+    children: /* @__PURE__ */ jsx16(ScrollAreaPrimitive.Thumb, {
       "data-slot": "scroll-area-thumb",
       className: "relative flex-1 rounded-full bg-border"
     })
@@ -1688,13 +1548,13 @@ function ScrollBar({ density, className, orientation = "vertical", ...props }) {
 import { useMemo as useMemo2 } from "react";
 
 // src/drawer/DrawerContext.ts
-import { createContext as createContext2 } from "react";
-var DrawerContext = createContext2(null);
+import { createContext } from "react";
+var DrawerContext = createContext(null);
 
 // src/hooks/useDrawer.ts
-import { useContext as useContext2 } from "react";
+import { useContext } from "react";
 function useDrawer() {
-  const context = useContext2(DrawerContext);
+  const context = useContext(DrawerContext);
   if (!context) {
     throw new Error("useDrawer must be used within a Drawer.");
   }
@@ -1703,7 +1563,7 @@ function useDrawer() {
 
 // src/components/Drawer.tsx
 import { Drawer as DrawerPrimitive } from "@base-ui/react/drawer";
-import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
 function Drawer({
   modal = true,
   showSwipeHandle = false,
@@ -1713,9 +1573,9 @@ function Drawer({
 }) {
   const hasSnapPoints = snapPoints != null && snapPoints.length > 0;
   const contextValue = useMemo2(() => ({ hasSnapPoints, modal, showSwipeHandle, swipeDirection }), [hasSnapPoints, modal, showSwipeHandle, swipeDirection]);
-  return /* @__PURE__ */ jsx21(DrawerContext.Provider, {
+  return /* @__PURE__ */ jsx17(DrawerContext.Provider, {
     value: contextValue,
-    children: /* @__PURE__ */ jsx21(DrawerPrimitive.Root, {
+    children: /* @__PURE__ */ jsx17(DrawerPrimitive.Root, {
       "data-slot": "drawer",
       modal,
       snapPoints,
@@ -1725,28 +1585,34 @@ function Drawer({
   });
 }
 function DrawerTrigger({ ...props }) {
-  return /* @__PURE__ */ jsx21(DrawerPrimitive.Trigger, {
+  return /* @__PURE__ */ jsx17(DrawerPrimitive.Trigger, {
     "data-slot": "drawer-trigger",
     ...props
   });
 }
-function DrawerPortal({ container, ...props }) {
+function DrawerPortal({ container, ref, children, ...props }) {
   const resolvedContainer = usePortalContainer2(container);
-  return /* @__PURE__ */ jsx21(DrawerPrimitive.Portal, {
+  const portal = usePortalNode(ref);
+  return /* @__PURE__ */ jsx17(DrawerPrimitive.Portal, {
     "data-slot": "drawer-portal",
     container: resolvedContainer,
-    ...props
+    ref: portal.ref,
+    ...props,
+    children: /* @__PURE__ */ jsx17(PortalProvider2, {
+      container: portal.node,
+      children
+    })
   });
 }
 function DrawerClose({ ...props }) {
-  return /* @__PURE__ */ jsx21(DrawerPrimitive.Close, {
+  return /* @__PURE__ */ jsx17(DrawerPrimitive.Close, {
     "data-slot": "drawer-close",
     ...props
   });
 }
 function DrawerOverlay({ density, className, ...props }) {
   const resolvedDensity = useDensity(density);
-  return /* @__PURE__ */ jsx21(DrawerPrimitive.Backdrop, {
+  return /* @__PURE__ */ jsx17(DrawerPrimitive.Backdrop, {
     "data-density": resolvedDensity,
     "data-slot": "drawer-overlay",
     className: (state) => cn2("fixed inset-0  min-h-dvh bg-backdrop opacity-[max(var(--drawer-overlay-min-opacity,0),calc(1-var(--drawer-swipe-progress)))] transition-opacity duration-450 ease-[cubic-bezier(0.32,0.72,0,1)] select-none data-ending-style:pointer-events-none data-ending-style:opacity-0 data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-snap-points:[--drawer-overlay-min-opacity:0.5] data-starting-style:opacity-0 data-swiping:duration-0  supports-[-webkit-touch-callout:none]:absolute", typeof className === "function" ? className(state) : className),
@@ -1754,7 +1620,7 @@ function DrawerOverlay({ density, className, ...props }) {
   });
 }
 function DrawerSwipeHandle({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx21("div", {
+  return /* @__PURE__ */ jsx17("div", {
     "data-density": density,
     "data-slot": "drawer-swipe-handle",
     "aria-hidden": "true",
@@ -1767,28 +1633,30 @@ function DrawerContent({ density, className, children, ...props }) {
   const direction = useDirection2();
   const { hasSnapPoints, modal, showSwipeHandle, swipeDirection } = useDrawer();
   const swipeAxis = swipeDirection === "down" || swipeDirection === "up" ? "y" : "x";
-  return /* @__PURE__ */ jsxs13(DrawerPortal, {
+  return /* @__PURE__ */ jsxs11(DrawerPortal, {
     "data-slot": "drawer-portal",
     children: [
-      modal === true && /* @__PURE__ */ jsx21(DrawerOverlay, {
+      modal === true && /* @__PURE__ */ jsx17(DrawerOverlay, {
         "data-snap-points": hasSnapPoints ? "" : undefined
       }),
-      /* @__PURE__ */ jsx21(DrawerPrimitive.Viewport, {
+      /* @__PURE__ */ jsx17(DrawerPrimitive.Viewport, {
         dir: direction,
         "data-slot": "drawer-viewport",
         "data-modal": modal,
         className: "pointer-events-none fixed inset-0  select-none data-[modal=true]:pointer-events-auto",
-        children: /* @__PURE__ */ jsxs13(DrawerPrimitive.Popup, {
+        children: /* @__PURE__ */ jsxs11(DrawerPrimitive.Popup, {
           "data-density": resolvedDensity,
           "data-slot": "drawer-popup",
+          "data-scroll": "none",
           "data-swipe-axis": swipeAxis,
           "data-snap-points": hasSnapPoints ? "" : undefined,
           className: (state) => cn2("group/drawer-popup pointer-events-auto fixed  m-(--drawer-inset,0px) flex h-(--drawer-content-height) max-h-(--drawer-content-max-height,none) min-h-0 w-(--drawer-content-width,auto) transform-[translate3d(var(--translate-x,0px),var(--translate-y,0px),0)] flex-col border border-frame-edge shadow-frame bg-popover text-sm text-popover-foreground transition-[transform,height,opacity,filter] duration-450 ease-[cubic-bezier(0.22,1,0.36,1)] will-change-transform outline-none select-none [interpolate-size:allow-keywords] data-[swipe-direction=down]:rounded-t-md data-[swipe-direction=down]:border-t data-[swipe-direction=left]:rounded-r-md data-[swipe-direction=left]:border-r data-[swipe-direction=right]:rounded-l-md data-[swipe-direction=right]:border-l data-[swipe-direction=up]:rounded-b-md data-[swipe-direction=up]:border-b", "data-nested-drawer-open:overflow-hidden data-nested-drawer-open:brightness-95", "after:pointer-events-none after:absolute after:bg-(--drawer-bleed-background,var(--color-popover)) data-[swipe-axis=x]:after:inset-y-0 data-[swipe-axis=x]:after:w-(--bleed) data-[swipe-axis=y]:after:inset-x-0 data-[swipe-axis=y]:after:h-(--bleed) data-[swipe-direction=down]:after:top-full data-[swipe-direction=left]:after:right-full data-[swipe-direction=right]:after:left-full data-[swipe-direction=up]:after:bottom-full", "[--drawer-content-height:var(--drawer-height,auto)] data-[swipe-axis=x]:[--drawer-content-width:75%] data-[swipe-axis=y]:[--drawer-content-max-height:calc(100dvh-6rem)] data-[swipe-axis=y]:data-snap-points:[--drawer-content-height:100dvh] data-[swipe-axis=x]:sm:[--drawer-content-width:24rem]", "[--bleed:3rem] [--peek:1rem] [--stack-height:var(--drawer-frontmost-height,var(--drawer-height,0px))] [--stack-peek-offset:max(0px,calc((var(--nested-drawers)-var(--stack-progress))*var(--peek)))] [--stack-progress:clamp(0,var(--drawer-swipe-progress),1)] [--stack-shrink:0]", "data-ending-style:transform-(--closed-transform) data-ending-style:opacity-[0.9999] data-ending-style:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-nested-drawer-swiping:duration-0 data-ending-style:data-nested-drawer-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)] data-starting-style:transform-(--closed-transform) data-swiping:duration-0 data-ending-style:data-swiping:duration-[calc(var(--drawer-swipe-strength)*400ms)]", "data-[swipe-axis=y]:inset-x-0 data-[swipe-axis=y]:data-nested-drawer-open:h-(--stack-height)", "data-[swipe-axis=x]:inset-y-0 data-[swipe-axis=x]:flex-row", "data-[swipe-direction=down]:bottom-0 data-[swipe-direction=down]:origin-bottom data-[swipe-direction=down]:[--closed-transform:translate3d(0,calc(100%+var(--drawer-inset,0px)+2px),0)] data-[swipe-direction=down]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)-var(--stack-peek-offset)-(var(--stack-shrink)*var(--stack-height)))]", "data-[swipe-direction=up]:top-0 data-[swipe-direction=up]:origin-top data-[swipe-direction=up]:[--closed-transform:translate3d(0,calc(-100%-var(--drawer-inset,0px)-2px),0)] data-[swipe-direction=up]:[--translate-y:calc(var(--drawer-snap-point-offset,0px)+var(--drawer-swipe-movement-y)+var(--stack-peek-offset)+(var(--stack-shrink)*var(--stack-height)))]", "data-[swipe-direction=left]:left-0 data-[swipe-direction=left]:origin-left data-[swipe-direction=left]:[--closed-transform:translate3d(calc(-100%-var(--drawer-inset,0px)-2px),0,0)] data-[swipe-direction=left]:[--translate-x:calc(var(--drawer-swipe-movement-x)+var(--stack-peek-offset)+(var(--stack-shrink)*100%))]", "data-[swipe-direction=right]:right-0 data-[swipe-direction=right]:origin-right data-[swipe-direction=right]:[--closed-transform:translate3d(calc(100%+var(--drawer-inset,0px)+2px),0,0)] data-[swipe-direction=right]:[--translate-x:calc(var(--drawer-swipe-movement-x)-var(--stack-peek-offset)-(var(--stack-shrink)*100%))]", typeof className === "function" ? className(state) : className),
           ...props,
           children: [
-            showSwipeHandle && /* @__PURE__ */ jsx21(DrawerSwipeHandle, {}),
-            /* @__PURE__ */ jsx21(DrawerPrimitive.Content, {
+            showSwipeHandle && /* @__PURE__ */ jsx17(DrawerSwipeHandle, {}),
+            /* @__PURE__ */ jsx17(DrawerPrimitive.Content, {
               "data-slot": "drawer-content",
+              "data-scroll": "none",
               className: "flex min-h-0 flex-1 flex-col overflow-hidden overscroll-contain rounded-[inherit] transition-opacity duration-300 ease-out select-text group-data-nested-drawer-open/drawer-popup:opacity-0 group-data-nested-drawer-swiping/drawer-popup:opacity-100 group-data-swiping/drawer-popup:select-none",
               children
             })
@@ -1799,7 +1667,7 @@ function DrawerContent({ density, className, children, ...props }) {
   });
 }
 function DrawerHeader({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx21("div", {
+  return /* @__PURE__ */ jsx17("div", {
     "data-density": density,
     "data-slot": "drawer-header",
     className: cn2("flex shrink-0 flex-col gap-0.5 p-panel pb-0 group-data-[swipe-axis=y]/drawer-popup:text-center md:gap-0.5 md:text-start md:group-data-[swipe-axis=y]/drawer-popup:text-start", className),
@@ -1807,7 +1675,7 @@ function DrawerHeader({ density, className, ...props }) {
   });
 }
 function DrawerFooter({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx21("div", {
+  return /* @__PURE__ */ jsx17("div", {
     "data-density": density,
     "data-slot": "drawer-footer",
     className: cn2("mt-auto flex shrink-0 flex-col gap-2 p-panel pt-0", className),
@@ -1815,7 +1683,7 @@ function DrawerFooter({ density, className, ...props }) {
   });
 }
 function DrawerTitle({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx21(DrawerPrimitive.Title, {
+  return /* @__PURE__ */ jsx17(DrawerPrimitive.Title, {
     "data-density": density,
     "data-slot": "drawer-title",
     className: (state) => cn2(" text-base font-medium text-foreground", typeof className === "function" ? className(state) : className),
@@ -1823,7 +1691,7 @@ function DrawerTitle({ density, className, ...props }) {
   });
 }
 function DrawerDescription({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx21(DrawerPrimitive.Description, {
+  return /* @__PURE__ */ jsx17(DrawerPrimitive.Description, {
     "data-density": density,
     "data-slot": "drawer-description",
     className: (state) => cn2("text-sm text-balance text-muted-foreground", typeof className === "function" ? className(state) : className),
@@ -1834,23 +1702,29 @@ function DrawerDescription({ density, className, ...props }) {
 import { ChevronRightIcon as ChevronRightIcon3, CheckIcon as CheckIcon3 } from "lucide-react";
 import { useDirection as useDirection5 } from "@base-ui/react/direction-provider";
 import { ContextMenu as ContextMenuPrimitive } from "@base-ui/react/context-menu";
-import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
 function ContextMenu({ ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.Root, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Root, {
     "data-slot": "context-menu",
     ...props
   });
 }
-function ContextMenuPortal({ container, ...props }) {
+function ContextMenuPortal({ container, ref, children, ...props }) {
   const resolvedContainer = usePortalContainer2(container);
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.Portal, {
+  const portal = usePortalNode(ref);
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Portal, {
     "data-slot": "context-menu-portal",
     container: resolvedContainer,
-    ...props
+    ref: portal.ref,
+    ...props,
+    children: /* @__PURE__ */ jsx18(PortalProvider2, {
+      container: portal.node,
+      children
+    })
   });
 }
 function ContextMenuTrigger({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.Trigger, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Trigger, {
     "data-density": density,
     "data-slot": "context-menu-trigger",
     className: (state) => cn2("select-none", typeof className === "function" ? className(state) : className),
@@ -1868,15 +1742,15 @@ function ContextMenuContent({
 }) {
   const resolvedDensity = useDensity(density);
   const direction = useDirection5();
-  return /* @__PURE__ */ jsx22(ContextMenuPortal, {
-    children: /* @__PURE__ */ jsx22(ContextMenuPrimitive.Positioner, {
+  return /* @__PURE__ */ jsx18(ContextMenuPortal, {
+    children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.Positioner, {
       dir: direction,
       className: "isolate  outline-none",
       align,
       alignOffset,
       side,
       sideOffset,
-      children: /* @__PURE__ */ jsx22(ContextMenuPrimitive.Popup, {
+      children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.Popup, {
         dir: direction,
         "data-density": resolvedDensity,
         "data-slot": "context-menu-content",
@@ -1887,13 +1761,13 @@ function ContextMenuContent({
   });
 }
 function ContextMenuGroup({ ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.Group, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Group, {
     "data-slot": "context-menu-group",
     ...props
   });
 }
 function ContextMenuLabel({ density, className, inset, ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.GroupLabel, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.GroupLabel, {
     "data-density": density,
     "data-slot": "context-menu-label",
     "data-inset": inset,
@@ -1902,7 +1776,7 @@ function ContextMenuLabel({ density, className, inset, ...props }) {
   });
 }
 function ContextMenuItem({ density, className, inset, variant = "default", ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.Item, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Item, {
     "data-density": density,
     "data-slot": "context-menu-item",
     "data-inset": inset,
@@ -1912,13 +1786,13 @@ function ContextMenuItem({ density, className, inset, variant = "default", ...pr
   });
 }
 function ContextMenuSub({ ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.SubmenuRoot, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.SubmenuRoot, {
     "data-slot": "context-menu-sub",
     ...props
   });
 }
 function ContextMenuSubTrigger({ density, className, inset, children, ...props }) {
-  return /* @__PURE__ */ jsxs14(ContextMenuPrimitive.SubmenuTrigger, {
+  return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.SubmenuTrigger, {
     "data-density": density,
     "data-slot": "context-menu-sub-trigger",
     "data-inset": inset,
@@ -1926,14 +1800,14 @@ function ContextMenuSubTrigger({ density, className, inset, children, ...props }
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx22(ChevronRightIcon3, {
+      /* @__PURE__ */ jsx18(ChevronRightIcon3, {
         className: "rtl:rotate-180 ms-auto"
       })
     ]
   });
 }
 function ContextMenuSubContent({ ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuContent, {
+  return /* @__PURE__ */ jsx18(ContextMenuContent, {
     "data-slot": "context-menu-sub-content",
     className: "  shadow-frame border border-frame-edge",
     side: "inline-end",
@@ -1948,7 +1822,7 @@ function ContextMenuCheckboxItem({
   inset,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs14(ContextMenuPrimitive.CheckboxItem, {
+  return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.CheckboxItem, {
     "data-density": density,
     "data-slot": "context-menu-checkbox-item",
     "data-inset": inset,
@@ -1956,10 +1830,10 @@ function ContextMenuCheckboxItem({
     checked,
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", {
+      /* @__PURE__ */ jsx18("span", {
         className: "pointer-events-none absolute end-2",
-        children: /* @__PURE__ */ jsx22(ContextMenuPrimitive.CheckboxItemIndicator, {
-          children: /* @__PURE__ */ jsx22(CheckIcon3, {})
+        children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.CheckboxItemIndicator, {
+          children: /* @__PURE__ */ jsx18(CheckIcon3, {})
         })
       }),
       children
@@ -1967,23 +1841,23 @@ function ContextMenuCheckboxItem({
   });
 }
 function ContextMenuRadioGroup({ ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.RadioGroup, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.RadioGroup, {
     "data-slot": "context-menu-radio-group",
     ...props
   });
 }
 function ContextMenuRadioItem({ density, className, children, inset, ...props }) {
-  return /* @__PURE__ */ jsxs14(ContextMenuPrimitive.RadioItem, {
+  return /* @__PURE__ */ jsxs12(ContextMenuPrimitive.RadioItem, {
     "data-density": density,
     "data-slot": "context-menu-radio-item",
     "data-inset": inset,
     className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", {
+      /* @__PURE__ */ jsx18("span", {
         className: "pointer-events-none absolute end-2",
-        children: /* @__PURE__ */ jsx22(ContextMenuPrimitive.RadioItemIndicator, {
-          children: /* @__PURE__ */ jsx22(CheckIcon3, {})
+        children: /* @__PURE__ */ jsx18(ContextMenuPrimitive.RadioItemIndicator, {
+          children: /* @__PURE__ */ jsx18(CheckIcon3, {})
         })
       }),
       children
@@ -1991,7 +1865,7 @@ function ContextMenuRadioItem({ density, className, children, inset, ...props })
   });
 }
 function ContextMenuSeparator({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx22(ContextMenuPrimitive.Separator, {
+  return /* @__PURE__ */ jsx18(ContextMenuPrimitive.Separator, {
     "data-density": density,
     "data-slot": "context-menu-separator",
     className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
@@ -1999,7 +1873,7 @@ function ContextMenuSeparator({ density, className, ...props }) {
   });
 }
 function ContextMenuShortcut({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx22("span", {
+  return /* @__PURE__ */ jsx18("span", {
     "data-density": density,
     "data-slot": "context-menu-shortcut",
     className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/context-menu-item:text-accent-foreground", className),
@@ -2010,9 +1884,9 @@ function ContextMenuShortcut({ density, className, ...props }) {
 import { CheckIcon as CheckIcon4 } from "lucide-react";
 import { Menu as MenuPrimitive } from "@base-ui/react/menu";
 import { Menubar as MenubarPrimitive } from "@base-ui/react/menubar";
-import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
 function Menubar({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx23(MenubarPrimitive, {
+  return /* @__PURE__ */ jsx19(MenubarPrimitive, {
     "data-density": density,
     "data-slot": "menubar",
     className: (state) => cn2("flex h-control items-center gap-0.5 rounded-sm border p-px", typeof className === "function" ? className(state) : className),
@@ -2020,25 +1894,25 @@ function Menubar({ density, className, ...props }) {
   });
 }
 function MenubarMenu({ ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenu2, {
+  return /* @__PURE__ */ jsx19(DropdownMenu2, {
     "data-slot": "menubar-menu",
     ...props
   });
 }
 function MenubarGroup({ ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuGroup2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuGroup2, {
     "data-slot": "menubar-group",
     ...props
   });
 }
 function MenubarPortal({ ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuPortal2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuPortal2, {
     "data-slot": "menubar-portal",
     ...props
   });
 }
 function MenubarTrigger({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuTrigger2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuTrigger2, {
     "data-density": density,
     "data-slot": "menubar-trigger",
     className: (state) => cn2("flex h-full items-center rounded-sm px-control-x text-sm leading-none font-medium outline-hidden select-none hover:bg-muted aria-expanded:bg-muted", typeof className === "function" ? className(state) : className),
@@ -2053,7 +1927,7 @@ function MenubarContent({
   sideOffset = 8,
   ...props
 }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuContent2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuContent2, {
     density,
     "data-slot": "menubar-content",
     align,
@@ -2064,7 +1938,7 @@ function MenubarContent({
   });
 }
 function MenubarItem({ density, className, inset, variant = "default", ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuItem2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuItem2, {
     density,
     "data-slot": "menubar-item",
     inset,
@@ -2081,7 +1955,7 @@ function MenubarCheckboxItem({
   inset,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs15(MenuPrimitive.CheckboxItem, {
+  return /* @__PURE__ */ jsxs13(MenuPrimitive.CheckboxItem, {
     "data-density": density,
     "data-slot": "menubar-checkbox-item",
     "data-inset": inset,
@@ -2089,10 +1963,10 @@ function MenubarCheckboxItem({
     checked,
     ...props,
     children: [
-      /* @__PURE__ */ jsx23("span", {
+      /* @__PURE__ */ jsx19("span", {
         className: "pointer-events-none absolute start-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
-        children: /* @__PURE__ */ jsx23(MenuPrimitive.CheckboxItemIndicator, {
-          children: /* @__PURE__ */ jsx23(CheckIcon4, {})
+        children: /* @__PURE__ */ jsx19(MenuPrimitive.CheckboxItemIndicator, {
+          children: /* @__PURE__ */ jsx19(CheckIcon4, {})
         })
       }),
       children
@@ -2100,23 +1974,23 @@ function MenubarCheckboxItem({
   });
 }
 function MenubarRadioGroup({ ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuRadioGroup2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuRadioGroup2, {
     "data-slot": "menubar-radio-group",
     ...props
   });
 }
 function MenubarRadioItem({ density, className, children, inset, ...props }) {
-  return /* @__PURE__ */ jsxs15(MenuPrimitive.RadioItem, {
+  return /* @__PURE__ */ jsxs13(MenuPrimitive.RadioItem, {
     "data-density": density,
     "data-slot": "menubar-radio-item",
     "data-inset": inset,
     className: (state) => cn2("relative flex cursor-default items-center gap-control-gap rounded-md py-1 pe-1.5 ps-7 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:ps-7 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx23("span", {
+      /* @__PURE__ */ jsx19("span", {
         className: "pointer-events-none absolute start-1.5 flex size-4 items-center justify-center [&_svg:not([class*='size-'])]:size-4",
-        children: /* @__PURE__ */ jsx23(MenuPrimitive.RadioItemIndicator, {
-          children: /* @__PURE__ */ jsx23(CheckIcon4, {})
+        children: /* @__PURE__ */ jsx19(MenuPrimitive.RadioItemIndicator, {
+          children: /* @__PURE__ */ jsx19(CheckIcon4, {})
         })
       }),
       children
@@ -2124,7 +1998,7 @@ function MenubarRadioItem({ density, className, children, inset, ...props }) {
   });
 }
 function MenubarLabel({ density, className, inset, ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuLabel2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuLabel2, {
     density,
     "data-slot": "menubar-label",
     inset,
@@ -2133,7 +2007,7 @@ function MenubarLabel({ density, className, inset, ...props }) {
   });
 }
 function MenubarSeparator({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuSeparator2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuSeparator2, {
     density,
     "data-slot": "menubar-separator",
     className: (state) => cn2("-mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
@@ -2141,7 +2015,7 @@ function MenubarSeparator({ density, className, ...props }) {
   });
 }
 function MenubarShortcut({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuShortcut2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuShortcut2, {
     "data-density": density,
     "data-slot": "menubar-shortcut",
     className: cn2("ms-auto text-xs tracking-widest text-muted-foreground group-focus/menubar-item:text-accent-foreground", className),
@@ -2149,13 +2023,13 @@ function MenubarShortcut({ density, className, ...props }) {
   });
 }
 function MenubarSub({ ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuSub2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuSub2, {
     "data-slot": "menubar-sub",
     ...props
   });
 }
 function MenubarSubTrigger({ density, className, inset, ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuSubTrigger2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuSubTrigger2, {
     density,
     "data-slot": "menubar-sub-trigger",
     inset,
@@ -2164,7 +2038,7 @@ function MenubarSubTrigger({ density, className, inset, ...props }) {
   });
 }
 function MenubarSubContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx23(DropdownMenuSubContent2, {
+  return /* @__PURE__ */ jsx19(DropdownMenuSubContent2, {
     density,
     "data-slot": "menubar-sub-content",
     className: (state) => cn2("  min-w-32 rounded-sm bg-popover p-1 text-popover-foreground shadow-frame border border-frame-edge border border-frame-edge shadow-frame duration-100     data-open:animate-in data-open:fade-in-0  data-closed:animate-out data-closed:fade-out-0 ", typeof className === "function" ? className(state) : className),
@@ -2172,10 +2046,10 @@ function MenubarSubContent({ density, className, ...props }) {
   });
 }
 // src/components/NavigationMenu.tsx
-import { ChevronDownIcon as ChevronDownIcon5 } from "lucide-react";
+import { ChevronDownIcon as ChevronDownIcon4 } from "lucide-react";
 import { NavigationMenu as NavigationMenuPrimitive } from "@base-ui/react/navigation-menu";
-import { cva as cva4 } from "class-variance-authority";
-import { jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
+import { cva as cva3 } from "class-variance-authority";
+import { jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
 function NavigationMenu({
   density,
   align = "start",
@@ -2184,14 +2058,14 @@ function NavigationMenu({
   ...props
 }) {
   const resolvedDensity = useDensity(density);
-  return /* @__PURE__ */ jsxs16(NavigationMenuPrimitive.Root, {
+  return /* @__PURE__ */ jsxs14(NavigationMenuPrimitive.Root, {
     "data-density": resolvedDensity,
     "data-slot": "navigation-menu",
     className: (state) => cn2("group/navigation-menu relative flex max-w-max flex-1 items-center justify-center", typeof className === "function" ? className(state) : className),
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx24(NavigationMenuPositioner, {
+      /* @__PURE__ */ jsx20(NavigationMenuPositioner, {
         density: resolvedDensity,
         align
       })
@@ -2199,7 +2073,7 @@ function NavigationMenu({
   });
 }
 function NavigationMenuList({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx24(NavigationMenuPrimitive.List, {
+  return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.List, {
     "data-density": density,
     "data-slot": "navigation-menu-list",
     className: (state) => cn2("group flex flex-1 list-none items-center justify-center gap-0", typeof className === "function" ? className(state) : className),
@@ -2207,16 +2081,16 @@ function NavigationMenuList({ density, className, ...props }) {
   });
 }
 function NavigationMenuItem({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Item, {
+  return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Item, {
     "data-density": density,
     "data-slot": "navigation-menu-item",
     className: (state) => cn2("relative", typeof className === "function" ? className(state) : className),
     ...props
   });
 }
-var navigationMenuTriggerStyle = cva4("group/navigation-menu-trigger inline-flex h-control-lg w-max items-center justify-center rounded-sm px-control-x py-1.5 text-sm font-medium transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted");
+var navigationMenuTriggerStyle = cva3("group/navigation-menu-trigger inline-flex h-control-lg w-max items-center justify-center rounded-sm px-control-x py-1.5 text-sm font-medium transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted");
 function NavigationMenuTrigger({ density, className, children, ...props }) {
-  return /* @__PURE__ */ jsxs16(NavigationMenuPrimitive.Trigger, {
+  return /* @__PURE__ */ jsxs14(NavigationMenuPrimitive.Trigger, {
     "data-density": density,
     "data-slot": "navigation-menu-trigger",
     className: (state) => cn2(navigationMenuTriggerStyle(), "group", typeof className === "function" ? className(state) : className),
@@ -2224,12 +2098,12 @@ function NavigationMenuTrigger({ density, className, children, ...props }) {
     children: [
       children,
       " ",
-      /* @__PURE__ */ jsx24(NavigationMenuIndicator, {})
+      /* @__PURE__ */ jsx20(NavigationMenuIndicator, {})
     ]
   });
 }
 function NavigationMenuContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Content, {
+  return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Content, {
     "data-density": density,
     "data-slot": "navigation-menu-content",
     className: (state) => cn2("data-ending-style:data-activation-direction=left:translate-x-[50%] data-ending-style:data-activation-direction=right:translate-x-[-50%] data-starting-style:data-activation-direction=left:translate-x-[-50%] data-starting-style:data-activation-direction=right:translate-x-[50%] h-full w-auto p-1 transition-[opacity,transform,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)]        data-ending-style:opacity-0 data-starting-style:opacity-0                ", typeof className === "function" ? className(state) : className),
@@ -2248,29 +2122,34 @@ function NavigationMenuPositioner({
   const resolvedDensity = useDensity(density);
   const direction = useDirection2();
   const container = usePortalContainer2();
-  return /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Portal, {
+  const portal = usePortalNode();
+  return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Portal, {
     container,
-    children: /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Positioner, {
-      dir: direction,
-      side,
-      sideOffset,
-      align,
-      alignOffset,
-      className: (state) => cn2("isolate  h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0", typeof className === "function" ? className(state) : className),
-      ...props,
-      children: /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Popup, {
-        "data-density": resolvedDensity,
-        "data-slot": "navigation-menu-popup",
-        className: "data-[ending-style]:easing-[ease] xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin) rounded-sm bg-popover text-popover-foreground border border-frame-edge shadow-frame transition-[opacity,transform,width,height,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] outline-none  data-ending-style:opacity-0 data-ending-style:duration-150  data-starting-style:opacity-0",
-        children: /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Viewport, {
-          className: "relative size-full overflow-hidden"
+    ref: portal.ref,
+    children: /* @__PURE__ */ jsx20(PortalProvider2, {
+      container: portal.node,
+      children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Positioner, {
+        dir: direction,
+        side,
+        sideOffset,
+        align,
+        alignOffset,
+        className: (state) => cn2("isolate  h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0", typeof className === "function" ? className(state) : className),
+        ...props,
+        children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Popup, {
+          "data-density": resolvedDensity,
+          "data-slot": "navigation-menu-popup",
+          className: "data-[ending-style]:easing-[ease] xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin) rounded-sm bg-popover text-popover-foreground border border-frame-edge shadow-frame transition-[opacity,transform,width,height,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] outline-none  data-ending-style:opacity-0 data-ending-style:duration-150  data-starting-style:opacity-0",
+          children: /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Viewport, {
+            className: "relative size-full overflow-hidden"
+          })
         })
       })
     })
   });
 }
 function NavigationMenuLink({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Link, {
+  return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Link, {
     "data-density": density,
     "data-slot": "navigation-menu-link",
     className: (state) => cn2("flex items-center gap-2 rounded-sm p-2 text-sm transition-colors outline-none hover:bg-muted focus:bg-muted focus-visible:ring-1 focus-visible:ring-ring focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
@@ -2283,35 +2162,41 @@ function NavigationMenuIndicator({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx24(NavigationMenuPrimitive.Icon, {
+  return /* @__PURE__ */ jsx20(NavigationMenuPrimitive.Icon, {
     "data-density": density,
     "data-slot": "navigation-menu-indicator",
     className: (state) => cn2("ms-1 inline-flex size-3 shrink-0 items-center justify-center transition-transform duration-120 data-popup-open:rotate-180 [&_svg]:size-full", typeof className === "function" ? className(state) : className),
     ...props,
-    children: children ?? /* @__PURE__ */ jsx24(ChevronDownIcon5, {})
+    children: children ?? /* @__PURE__ */ jsx20(ChevronDownIcon4, {})
   });
 }
 // src/components/Toast.tsx
 import { Toast as ToastPrimitive } from "@base-ui/react/toast";
 import { CircleCheckIcon, InfoIcon, TriangleAlertIcon, OctagonXIcon, LoaderCircleIcon, XIcon as XIcon2 } from "lucide-react";
-import { jsx as jsx25, jsxs as jsxs17, Fragment } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs15, Fragment } from "react/jsx-runtime";
 function ToastProvider(props) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Provider, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Provider, {
     ...props
   });
 }
-function ToastPortal({ container, ...props }) {
+function ToastPortal({ container, ref, children, ...props }) {
   const resolvedContainer = usePortalContainer2(container);
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Portal, {
+  const portal = usePortalNode(ref);
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Portal, {
     "data-slot": "toast-portal",
     container: resolvedContainer,
-    ...props
+    ref: portal.ref,
+    ...props,
+    children: /* @__PURE__ */ jsx21(PortalProvider2, {
+      container: portal.node,
+      children
+    })
   });
 }
 function ToastViewport({ density, dir, className, ...props }) {
   const resolvedDensity = useDensity(density);
   const inheritedDirection = useDirection2();
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Viewport, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Viewport, {
     dir: dir ?? inheritedDirection,
     "data-density": resolvedDensity,
     "data-slot": "toast-viewport",
@@ -2320,7 +2205,7 @@ function ToastViewport({ density, dir, className, ...props }) {
   });
 }
 function Toast({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Root, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Root, {
     "data-density": density,
     "data-slot": "toast",
     className: (state) => cn2("group/toast pointer-events-auto absolute right-0 bottom-0 w-full rounded-md border border-frame-edge bg-popover text-popover-foreground shadow-frame outline-none select-none focus-visible:ring-1 focus-visible:ring-ring [--offset-y:calc(var(--toast-offset-y)*-1-var(--toast-index)*var(--spacing-panel))] [transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)+var(--toast-swipe-movement-y)))] transition-[transform,opacity] duration-120 ease-out data-limited:opacity-0 data-starting-style:opacity-0 data-ending-style:opacity-0 motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
@@ -2328,21 +2213,21 @@ function Toast({ density, className, ...props }) {
   });
 }
 function ToastContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Content, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Content, {
     "data-slot": "toast-content",
     className: (state) => cn2("flex items-center gap-control-gap p-panel", typeof className === "function" ? className(state) : className),
     ...props
   });
 }
 function ToastTitle({ className, ...props }) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Title, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Title, {
     "data-slot": "toast-title",
     className: (state) => cn2("text-sm font-medium", typeof className === "function" ? className(state) : className),
     ...props
   });
 }
 function ToastDescription({ className, ...props }) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Description, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Description, {
     "data-slot": "toast-description",
     className: (state) => cn2("text-sm text-muted-foreground", typeof className === "function" ? className(state) : className),
     ...props
@@ -2350,13 +2235,13 @@ function ToastDescription({ className, ...props }) {
 }
 function ToastAction({
   className,
-  render = /* @__PURE__ */ jsx25(Button2, {
+  render = /* @__PURE__ */ jsx21(Button2, {
     variant: "outline",
     size: "sm"
   }),
   ...props
 }) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Action, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Action, {
     "data-slot": "toast-action",
     render,
     className: (state) => cn2("shrink-0", typeof className === "function" ? className(state) : className),
@@ -2366,19 +2251,19 @@ function ToastAction({
 function ToastClose({
   className,
   children,
-  render = /* @__PURE__ */ jsx25(Button2, {
+  render = /* @__PURE__ */ jsx21(Button2, {
     variant: "ghost",
     size: "icon-sm"
   }),
   ...props
 }) {
-  return /* @__PURE__ */ jsx25(ToastPrimitive.Close, {
+  return /* @__PURE__ */ jsx21(ToastPrimitive.Close, {
     "data-slot": "toast-close",
     "aria-label": "Close toast",
     render,
     className: (state) => cn2("relative shrink-0 text-muted-foreground hover:text-foreground", typeof className === "function" ? className(state) : className),
     ...props,
-    children: children ?? /* @__PURE__ */ jsx25(XIcon2, {
+    children: children ?? /* @__PURE__ */ jsx21(XIcon2, {
       "aria-hidden": "true"
     })
   });
@@ -2386,24 +2271,24 @@ function ToastClose({
 function ToastIcon({ type }) {
   switch (type) {
     case "success":
-      return /* @__PURE__ */ jsx25(CircleCheckIcon, {
+      return /* @__PURE__ */ jsx21(CircleCheckIcon, {
         "aria-hidden": "true"
       });
     case "info":
-      return /* @__PURE__ */ jsx25(InfoIcon, {
+      return /* @__PURE__ */ jsx21(InfoIcon, {
         "aria-hidden": "true"
       });
     case "warning":
-      return /* @__PURE__ */ jsx25(TriangleAlertIcon, {
+      return /* @__PURE__ */ jsx21(TriangleAlertIcon, {
         "aria-hidden": "true"
       });
     case "error":
-      return /* @__PURE__ */ jsx25(OctagonXIcon, {
+      return /* @__PURE__ */ jsx21(OctagonXIcon, {
         "aria-hidden": "true",
         className: "text-destructive"
       });
     case "loading":
-      return /* @__PURE__ */ jsx25(LoaderCircleIcon, {
+      return /* @__PURE__ */ jsx21(LoaderCircleIcon, {
         "aria-hidden": "true",
         className: "animate-spin motion-reduce:animate-none"
       });
@@ -2413,41 +2298,41 @@ function ToastIcon({ type }) {
 }
 function ToastList() {
   const { toasts } = ToastPrimitive.useToastManager();
-  return /* @__PURE__ */ jsx25(Fragment, {
-    children: toasts.map((toastItem) => /* @__PURE__ */ jsx25(Toast, {
+  return /* @__PURE__ */ jsx21(Fragment, {
+    children: toasts.map((toastItem) => /* @__PURE__ */ jsx21(Toast, {
       toast: toastItem,
-      children: /* @__PURE__ */ jsxs17(ToastContent, {
+      children: /* @__PURE__ */ jsxs15(ToastContent, {
         children: [
-          /* @__PURE__ */ jsx25("span", {
+          /* @__PURE__ */ jsx21("span", {
             "data-slot": "toast-icon",
             className: "shrink-0 empty:hidden [&_svg]:size-4",
-            children: /* @__PURE__ */ jsx25(ToastIcon, {
+            children: /* @__PURE__ */ jsx21(ToastIcon, {
               type: toastItem.type
             })
           }),
-          /* @__PURE__ */ jsxs17("div", {
+          /* @__PURE__ */ jsxs15("div", {
             className: "flex min-w-0 flex-1 flex-col gap-1",
             children: [
-              /* @__PURE__ */ jsx25(ToastTitle, {}),
-              /* @__PURE__ */ jsx25(ToastDescription, {})
+              /* @__PURE__ */ jsx21(ToastTitle, {}),
+              /* @__PURE__ */ jsx21(ToastDescription, {})
             ]
           }),
-          /* @__PURE__ */ jsx25(ToastAction, {}),
-          /* @__PURE__ */ jsx25(ToastClose, {})
+          /* @__PURE__ */ jsx21(ToastAction, {}),
+          /* @__PURE__ */ jsx21(ToastClose, {})
         ]
       })
     }, toastItem.id))
   });
 }
 function ToastToaster({ children, density, ...props }) {
-  return /* @__PURE__ */ jsxs17(ToastProvider, {
+  return /* @__PURE__ */ jsxs15(ToastProvider, {
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx25(ToastPortal, {
-        children: /* @__PURE__ */ jsx25(ToastViewport, {
+      /* @__PURE__ */ jsx21(ToastPortal, {
+        children: /* @__PURE__ */ jsx21(ToastViewport, {
           density,
-          children: /* @__PURE__ */ jsx25(ToastList, {})
+          children: /* @__PURE__ */ jsx21(ToastList, {})
         })
       })
     ]
@@ -2460,11 +2345,11 @@ function useToastManager() {
   return Toast2.useToastManager();
 }
 // src/components/Marker.tsx
-import { mergeProps as mergeProps8 } from "@base-ui/react/merge-props";
-import { useRender as useRender8 } from "@base-ui/react/use-render";
-import { cva as cva5 } from "class-variance-authority";
-import { jsx as jsx26 } from "react/jsx-runtime";
-var markerVariants = cva5("group/marker relative flex min-h-4 w-full items-center gap-control-gap text-start text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground [&:is(a,button)]:outline-none [&:is(a,button)]:focus-visible:outline-1 [&:is(a,button)]:focus-visible:outline-ring", {
+import { mergeProps as mergeProps6 } from "@base-ui/react/merge-props";
+import { useRender as useRender6 } from "@base-ui/react/use-render";
+import { cva as cva4 } from "class-variance-authority";
+import { jsx as jsx22 } from "react/jsx-runtime";
+var markerVariants = cva4("group/marker relative flex min-h-4 w-full items-center gap-control-gap text-start text-sm text-muted-foreground [&_svg:not([class*='size-'])]:size-4 [a]:underline [a]:underline-offset-3 [a]:hover:text-foreground [&:is(a,button)]:outline-none [&:is(a,button)]:focus-visible:outline-1 [&:is(a,button)]:focus-visible:outline-ring", {
   variants: {
     variant: {
       default: "",
@@ -2474,15 +2359,15 @@ var markerVariants = cva5("group/marker relative flex min-h-4 w-full items-cente
   }
 });
 function Marker({ density, className, variant = "default", render, ...props }) {
-  return useRender8({
+  return useRender6({
     defaultTagName: "div",
-    props: mergeProps8({ className: cn2(markerVariants({ variant, className })) }, props),
+    props: mergeProps6({ className: cn2(markerVariants({ variant, className })) }, props),
     render,
     state: { slot: "marker", variant, density }
   });
 }
 function MarkerIcon({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx26("span", {
+  return /* @__PURE__ */ jsx22("span", {
     "data-density": density,
     "data-slot": "marker-icon",
     "aria-hidden": "true",
@@ -2491,7 +2376,7 @@ function MarkerIcon({ density, className, ...props }) {
   });
 }
 function MarkerContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx26("span", {
+  return /* @__PURE__ */ jsx22("span", {
     "data-density": density,
     "data-slot": "marker-content",
     className: cn2("min-w-0 wrap-break-word group-data-[variant=separator]/marker:text-center [&>a]:underline [&>a]:underline-offset-3 [&>a:hover]:text-foreground", className),
@@ -2499,19 +2384,19 @@ function MarkerContent({ density, className, ...props }) {
   });
 }
 // src/components/Bubble.tsx
-import { mergeProps as mergeProps9 } from "@base-ui/react/merge-props";
-import { useRender as useRender9 } from "@base-ui/react/use-render";
-import { cva as cva6 } from "class-variance-authority";
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { mergeProps as mergeProps7 } from "@base-ui/react/merge-props";
+import { useRender as useRender7 } from "@base-ui/react/use-render";
+import { cva as cva5 } from "class-variance-authority";
+import { jsx as jsx23 } from "react/jsx-runtime";
 function BubbleGroup({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx27("div", {
+  return /* @__PURE__ */ jsx23("div", {
     "data-density": density,
     "data-slot": "bubble-group",
     className: cn2("flex min-w-0 flex-col gap-control-gap", className),
     ...props
   });
 }
-var bubbleVariants = cva6("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
+var bubbleVariants = cva5("group/bubble relative flex w-fit max-w-[80%] min-w-0 flex-col gap-1 group-data-[align=end]/message:self-end data-[align=end]:self-end data-[variant=ghost]:max-w-full", {
   variants: {
     variant: {
       default: "*:data-[slot=bubble-content]:bg-primary *:data-[slot=bubble-content]:text-primary-foreground [&>[data-slot=bubble-content]:is(button,a):hover]:bg-primary/80",
@@ -2526,7 +2411,7 @@ var bubbleVariants = cva6("group/bubble relative flex w-fit max-w-[80%] min-w-0
   defaultVariants: { variant: "default" }
 });
 function Bubble({ density, variant = "default", align = "start", className, ...props }) {
-  return /* @__PURE__ */ jsx27("div", {
+  return /* @__PURE__ */ jsx23("div", {
     "data-density": density,
     "data-slot": "bubble",
     "data-variant": variant,
@@ -2536,16 +2421,16 @@ function Bubble({ density, variant = "default", align = "start", className, ...p
   });
 }
 function BubbleContent({ density, className, render, ...props }) {
-  return useRender9({
+  return useRender7({
     defaultTagName: "div",
-    props: mergeProps9({
+    props: mergeProps7({
       className: cn2("w-fit max-w-full min-w-0 overflow-hidden rounded-sm border border-transparent px-control-x py-control-gap text-sm leading-relaxed wrap-break-word group-data-[align=end]/bubble:self-end [&:is(button)]:text-start [&:is(button,a)]:transition-colors motion-reduce:transition-none [&:is(button,a)]:outline-none [&:is(button,a)]:focus-visible:border-ring [&:is(button,a)]:focus-visible:ring-1 [&:is(button,a)]:focus-visible:ring-ring", className)
     }, props),
     render,
     state: { slot: "bubble-content", density }
   });
 }
-var bubbleReactionsVariants = cva6("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-sm border border-border bg-muted px-1.5 py-0.5 text-sm ring-2 ring-card has-[button]:p-0", {
+var bubbleReactionsVariants = cva5("absolute z-10 flex w-fit shrink-0 items-center justify-center gap-1 rounded-sm border border-border bg-muted px-1.5 py-0.5 text-sm ring-2 ring-card has-[button]:p-0", {
   variants: {
     side: { top: "top-0 -translate-y-3/4", bottom: "bottom-0 translate-y-3/4" },
     align: { start: "start-3", end: "end-3" }
@@ -2559,7 +2444,7 @@ function BubbleReactions({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx27("div", {
+  return /* @__PURE__ */ jsx23("div", {
     "data-density": density,
     "data-slot": "bubble-reactions",
     "data-align": align,
@@ -2569,17 +2454,17 @@ function BubbleReactions({
   });
 }
 // src/components/Message.tsx
-import { useContext as useContext3, useLayoutEffect, useMemo as useMemo3, useRef as useRef3, useState as useState3 } from "react";
-import { useRender as useRender10 } from "@base-ui/react/use-render";
+import { useContext as useContext2, useLayoutEffect, useMemo as useMemo3, useRef as useRef2, useState } from "react";
+import { useRender as useRender8 } from "@base-ui/react/use-render";
 
 // src/message/MessageContext.ts
-import { createContext as createContext3 } from "react";
-var MessageContext = createContext3(null);
+import { createContext as createContext2 } from "react";
+var MessageContext = createContext2(null);
 
 // src/components/Message.tsx
-import { jsx as jsx28 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 function MessageGroup({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx28("div", {
+  return /* @__PURE__ */ jsx24("div", {
     "data-density": density,
     "data-slot": "message-group",
     className: cn2("flex min-w-0 flex-col gap-control-gap", className),
@@ -2587,12 +2472,12 @@ function MessageGroup({ density, className, ...props }) {
   });
 }
 function Message({ density, className, align = "start", style, ...props }) {
-  const [footerOffset, setFooterOffset] = useState3(0);
+  const [footerOffset, setFooterOffset] = useState(0);
   const context = useMemo3(() => ({ setFooterOffset }), []);
   const messageStyle = { ...style, "--message-footer-offset": `${footerOffset}px` };
-  return /* @__PURE__ */ jsx28(MessageContext.Provider, {
+  return /* @__PURE__ */ jsx24(MessageContext.Provider, {
     value: context,
-    children: /* @__PURE__ */ jsx28("div", {
+    children: /* @__PURE__ */ jsx24("div", {
       "data-density": density,
       "data-slot": "message",
       "data-align": align,
@@ -2603,7 +2488,7 @@ function Message({ density, className, align = "start", style, ...props }) {
   });
 }
 function MessageAvatar({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx28("div", {
+  return /* @__PURE__ */ jsx24("div", {
     "data-density": density,
     "data-slot": "message-avatar",
     className: cn2("flex w-fit min-w-8 shrink-0 items-center justify-center self-end overflow-hidden rounded-full bg-muted group-has-data-[slot=message-footer]/message:-translate-y-(--message-footer-offset)", className),
@@ -2611,7 +2496,7 @@ function MessageAvatar({ density, className, ...props }) {
   });
 }
 function MessageContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx28("div", {
+  return /* @__PURE__ */ jsx24("div", {
     "data-density": density,
     "data-slot": "message-content",
     className: cn2("flex w-full min-w-0 flex-col gap-control-gap wrap-break-word group-data-[align=end]/message:[&>[data-slot]:not([data-slot=message-header])]:self-end", className),
@@ -2619,7 +2504,7 @@ function MessageContent({ density, className, ...props }) {
   });
 }
 function MessageHeader({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx28("div", {
+  return /* @__PURE__ */ jsx24("div", {
     "data-density": density,
     "data-slot": "message-header",
     className: cn2("flex max-w-full min-w-0 items-center px-control-x text-xs font-medium text-muted-foreground group-has-data-[variant=ghost]/message:px-0", className),
@@ -2627,8 +2512,8 @@ function MessageHeader({ density, className, ...props }) {
   });
 }
 function MessageFooter({ density, className, ...props }) {
-  const context = useContext3(MessageContext);
-  const footerRef = useRef3(null);
+  const context = useContext2(MessageContext);
+  const footerRef = useRef2(null);
   useLayoutEffect(() => {
     const footer = footerRef.current;
     const content = footer?.parentElement;
@@ -2647,7 +2532,7 @@ function MessageFooter({ density, className, ...props }) {
       context.setFooterOffset(0);
     };
   }, [context]);
-  return useRender10({
+  return useRender8({
     defaultTagName: "div",
     ref: footerRef,
     state: { slot: "message-footer", density },
@@ -2658,11 +2543,11 @@ function MessageFooter({ density, className, ...props }) {
   });
 }
 // src/components/Attachment.tsx
-import { mergeProps as mergeProps10 } from "@base-ui/react/merge-props";
-import { useRender as useRender11 } from "@base-ui/react/use-render";
-import { cva as cva7 } from "class-variance-authority";
-import { jsx as jsx29 } from "react/jsx-runtime";
-var attachmentVariants = cva7("group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-md border bg-card text-card-foreground transition-colors motion-reduce:transition-none focus-within:ring-1 focus-within:ring-ring has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive data-[state=idle]:border-dashed", {
+import { mergeProps as mergeProps8 } from "@base-ui/react/merge-props";
+import { useRender as useRender9 } from "@base-ui/react/use-render";
+import { cva as cva6 } from "class-variance-authority";
+import { jsx as jsx25 } from "react/jsx-runtime";
+var attachmentVariants = cva6("group/attachment relative flex w-fit max-w-full min-w-0 shrink-0 flex-wrap rounded-md border bg-card text-card-foreground transition-colors motion-reduce:transition-none focus-within:ring-1 focus-within:ring-ring has-[>a,>button]:hover:bg-muted/50 data-[state=error]:border-destructive data-[state=idle]:border-dashed", {
   variants: {
     size: {
       default: "gap-control-gap text-sm has-data-[slot=attachment-content]:px-control-x has-data-[slot=attachment-content]:py-control-gap has-data-[slot=attachment-media]:p-control-gap",
@@ -2683,7 +2568,7 @@ function Attachment({
   orientation = "horizontal",
   ...props
 }) {
-  return /* @__PURE__ */ jsx29("div", {
+  return /* @__PURE__ */ jsx25("div", {
     "data-slot": "attachment",
     "data-density": density,
     "data-state": state,
@@ -2693,7 +2578,7 @@ function Attachment({
     ...props
   });
 }
-var attachmentMediaVariants = cva7("relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-sm bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[orientation=horizontal]/attachment:group-data-[size=sm]/attachment:w-8 group-data-[orientation=horizontal]/attachment:group-data-[size=xs]/attachment:w-7 group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5", {
+var attachmentMediaVariants = cva6("relative flex aspect-square w-10 shrink-0 items-center justify-center overflow-hidden rounded-sm bg-muted text-foreground group-data-[orientation=vertical]/attachment:w-full group-data-[orientation=horizontal]/attachment:group-data-[size=sm]/attachment:w-8 group-data-[orientation=horizontal]/attachment:group-data-[size=xs]/attachment:w-7 group-data-[state=error]/attachment:bg-destructive/10 group-data-[state=error]/attachment:text-destructive group-data-[orientation=vertical]/attachment:*:data-[slot=spinner]:size-6! [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 group-data-[orientation=vertical]/attachment:[&_svg:not([class*='size-'])]:size-6 group-data-[size=xs]/attachment:[&_svg:not([class*='size-'])]:size-3.5", {
   variants: {
     variant: {
       icon: "",
@@ -2703,7 +2588,7 @@ var attachmentMediaVariants = cva7("relative flex aspect-square w-10 shrink-0 it
   defaultVariants: { variant: "icon" }
 });
 function AttachmentMedia({ density, className, variant = "icon", ...props }) {
-  return /* @__PURE__ */ jsx29("div", {
+  return /* @__PURE__ */ jsx25("div", {
     "data-slot": "attachment-media",
     "data-density": density,
     "data-variant": variant,
@@ -2712,7 +2597,7 @@ function AttachmentMedia({ density, className, variant = "icon", ...props }) {
   });
 }
 function AttachmentContent({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx29("div", {
+  return /* @__PURE__ */ jsx25("div", {
     "data-slot": "attachment-content",
     "data-density": density,
     className: cn2("max-w-full min-w-0 flex-1 leading-tight group-data-[orientation=vertical]/attachment:px-1", className),
@@ -2720,7 +2605,7 @@ function AttachmentContent({ density, className, ...props }) {
   });
 }
 function AttachmentTitle({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx29("span", {
+  return /* @__PURE__ */ jsx25("span", {
     "data-slot": "attachment-title",
     "data-density": density,
     className: cn2("block max-w-full min-w-0 truncate font-medium group-data-[state=processing]/attachment:shimmer group-data-[state=uploading]/attachment:shimmer", className),
@@ -2728,7 +2613,7 @@ function AttachmentTitle({ density, className, ...props }) {
   });
 }
 function AttachmentDescription({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx29("span", {
+  return /* @__PURE__ */ jsx25("span", {
     "data-slot": "attachment-description",
     "data-density": density,
     className: cn2("mt-0.5 block max-w-full min-w-0 truncate text-xs text-muted-foreground group-data-[state=error]/attachment:text-destructive", className),
@@ -2736,7 +2621,7 @@ function AttachmentDescription({ density, className, ...props }) {
   });
 }
 function AttachmentActions({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx29("div", {
+  return /* @__PURE__ */ jsx25("div", {
     "data-slot": "attachment-actions",
     "data-density": density,
     className: cn2("relative z-20 flex shrink-0 items-center group-data-[orientation=vertical]/attachment:absolute group-data-[orientation=vertical]/attachment:top-3 group-data-[orientation=vertical]/attachment:end-3 group-data-[orientation=vertical]/attachment:gap-1", className),
@@ -2749,7 +2634,7 @@ function AttachmentAction({
   size = "icon-xs",
   ...props
 }) {
-  return /* @__PURE__ */ jsx29(Button2, {
+  return /* @__PURE__ */ jsx25(Button2, {
     "data-slot": "attachment-action",
     variant,
     size,
@@ -2758,15 +2643,15 @@ function AttachmentAction({
   });
 }
 function AttachmentTrigger({ density, className, render, type, ...props }) {
-  return useRender11({
+  return useRender9({
     defaultTagName: "button",
-    props: mergeProps10({ type: render ? type : type ?? "button", className: cn2("absolute inset-0 z-10 outline-none", className) }, props),
+    props: mergeProps8({ type: render ? type : type ?? "button", className: cn2("absolute inset-0 z-10 outline-none", className) }, props),
     render,
     state: { slot: "attachment-trigger", density }
   });
 }
 function AttachmentGroup({ density, className, ...props }) {
-  return /* @__PURE__ */ jsx29("div", {
+  return /* @__PURE__ */ jsx25("div", {
     "data-slot": "attachment-group",
     "data-density": density,
     className: cn2("flex min-w-0 scroll-fade-x snap-x snap-mandatory scroll-px-1 no-scrollbar gap-3 overflow-x-auto overscroll-x-contain py-1 *:data-[slot=attachment]:flex-none *:data-[slot=attachment]:snap-start", className),
@@ -2774,8 +2659,8 @@ function AttachmentGroup({ density, className, ...props }) {
   });
 }
 // src/components/InlineEdit.tsx
-import { useEffect as useEffect2, useRef as useRef4, useState as useState4 } from "react";
-import { jsx as jsx30, jsxs as jsxs18 } from "react/jsx-runtime";
+import { useEffect as useEffect2, useRef as useRef3, useState as useState2 } from "react";
+import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
 function InlineEdit({
   label,
   value,
@@ -2786,10 +2671,10 @@ function InlineEdit({
   onCommit,
   onCancel
 }) {
-  const input = useRef4(null);
-  const isFinished = useRef4(false);
-  const [isSaving, setSaving] = useState4(false);
-  const [error, setError] = useState4("");
+  const input = useRef3(null);
+  const isFinished = useRef3(false);
+  const [isSaving, setSaving] = useState2(false);
+  const [error, setError] = useState2("");
   useEffect2(() => {
     input.current?.focus();
     if (shouldSelectOnMount)
@@ -2810,14 +2695,14 @@ function InlineEdit({
       setSaving(false);
     }
   };
-  return /* @__PURE__ */ jsxs18("form", {
+  return /* @__PURE__ */ jsxs16("form", {
     className: "flex min-w-0 flex-col gap-1",
     onSubmit: (event) => {
       event.preventDefault();
       save();
     },
     children: [
-      /* @__PURE__ */ jsx30(Input2, {
+      /* @__PURE__ */ jsx26(Input2, {
         ref: input,
         density,
         "aria-label": label,
@@ -2838,7 +2723,7 @@ function InlineEdit({
           }
         }
       }),
-      error && /* @__PURE__ */ jsx30("p", {
+      error && /* @__PURE__ */ jsx26("p", {
         role: "alert",
         className: "text-xs text-destructive",
         children: error
@@ -2850,28 +2735,28 @@ function InlineEdit({
 import { Radio } from "@base-ui/react/radio";
 import { RadioGroup } from "@base-ui/react/radio-group";
 import { StarIcon, CircleOffIcon } from "lucide-react";
-import { jsx as jsx31 } from "react/jsx-runtime";
+import { jsx as jsx27 } from "react/jsx-runtime";
 function StarRating({ label, value, disabled, density, onValueChange }) {
-  return /* @__PURE__ */ jsx31(RadioGroup, {
+  return /* @__PURE__ */ jsx27(RadioGroup, {
     "aria-label": label,
     value,
     disabled,
     "data-density": density,
     className: "inline-flex w-fit shrink-0 items-center gap-0.5",
     onValueChange,
-    children: [1, 2, 3, 4, 5, 0].map((star) => /* @__PURE__ */ jsx31(Radio.Root, {
+    children: [1, 2, 3, 4, 5, 0].map((star) => /* @__PURE__ */ jsx27(Radio.Root, {
       value: star,
       nativeButton: true,
-      render: /* @__PURE__ */ jsx31("button", {
+      render: /* @__PURE__ */ jsx27("button", {
         type: "button"
       }),
       "aria-label": star === 0 ? "Unrated" : `${star} ${star === 1 ? "star" : "stars"}`,
       title: star === 0 ? "Clear rating" : `${star} stars`,
       className: "inline-flex size-5 shrink-0 items-center justify-center rounded-sm text-muted-foreground outline-none hover:text-primary focus-visible:ring-1 focus-visible:ring-ring data-disabled:cursor-not-allowed data-disabled:opacity-50",
-      children: star === 0 ? /* @__PURE__ */ jsx31(CircleOffIcon, {
+      children: star === 0 ? /* @__PURE__ */ jsx27(CircleOffIcon, {
         "aria-hidden": "true",
         className: "size-3"
-      }) : /* @__PURE__ */ jsx31(StarIcon, {
+      }) : /* @__PURE__ */ jsx27(StarIcon, {
         "aria-hidden": "true",
         className: star <= value ? "size-3.5 fill-primary text-primary" : "size-3.5"
       })
@@ -2879,8 +2764,8 @@ function StarRating({ label, value, disabled, density, onValueChange }) {
   });
 }
 // src/components/ConfirmationDialog.tsx
-import { useState as useState5 } from "react";
-import { jsx as jsx32, jsxs as jsxs19 } from "react/jsx-runtime";
+import { useState as useState3 } from "react";
+import { jsx as jsx28, jsxs as jsxs17 } from "react/jsx-runtime";
 function ConfirmationDialog({
   open,
   title,
@@ -2889,9 +2774,9 @@ function ConfirmationDialog({
   onOpenChange,
   onConfirm
 }) {
-  const [isPending, setPending] = useState5(false);
-  const [error, setError] = useState5("");
-  return /* @__PURE__ */ jsx32(AlertDialog, {
+  const [isPending, setPending] = useState3(false);
+  const [error, setError] = useState3("");
+  return /* @__PURE__ */ jsx28(AlertDialog, {
     open,
     onOpenChange: (next) => {
       if (!isPending) {
@@ -2899,31 +2784,31 @@ function ConfirmationDialog({
         onOpenChange(next);
       }
     },
-    children: /* @__PURE__ */ jsxs19(AlertDialogContent, {
+    children: /* @__PURE__ */ jsxs17(AlertDialogContent, {
       children: [
-        /* @__PURE__ */ jsxs19(AlertDialogHeader, {
+        /* @__PURE__ */ jsxs17(AlertDialogHeader, {
           children: [
-            /* @__PURE__ */ jsx32(AlertDialogTitle, {
+            /* @__PURE__ */ jsx28(AlertDialogTitle, {
               children: title
             }),
-            /* @__PURE__ */ jsx32(AlertDialogDescription, {
+            /* @__PURE__ */ jsx28(AlertDialogDescription, {
               children: description
             })
           ]
         }),
-        error && /* @__PURE__ */ jsx32(Alert2, {
+        error && /* @__PURE__ */ jsx28(Alert2, {
           variant: "destructive",
-          children: /* @__PURE__ */ jsx32(AlertDescription2, {
+          children: /* @__PURE__ */ jsx28(AlertDescription2, {
             children: error
           })
         }),
-        /* @__PURE__ */ jsxs19(AlertDialogFooter, {
+        /* @__PURE__ */ jsxs17(AlertDialogFooter, {
           children: [
-            /* @__PURE__ */ jsx32(AlertDialogCancel, {
+            /* @__PURE__ */ jsx28(AlertDialogCancel, {
               disabled: isPending,
               children: "Cancel"
             }),
-            /* @__PURE__ */ jsx32(Button2, {
+            /* @__PURE__ */ jsx28(Button2, {
               variant: "destructive",
               disabled: isPending,
               onClick: async () => {
@@ -2947,13 +2832,13 @@ function ConfirmationDialog({
   });
 }
 // src/components/ImagePicker.tsx
-import { useRef as useRef5 } from "react";
+import { useRef as useRef4 } from "react";
 import { ImageIcon, UploadIcon } from "lucide-react";
 
 // src/hooks/useObjectURL.ts
-import { useEffect as useEffect3, useState as useState6 } from "react";
+import { useEffect as useEffect3, useState as useState4 } from "react";
 function useObjectURL(file) {
-  const [url, setURL] = useState6();
+  const [url, setURL] = useState4();
   useEffect3(() => {
     if (!file) {
       setURL(undefined);
@@ -2967,32 +2852,32 @@ function useObjectURL(file) {
 }
 
 // src/components/ImagePicker.tsx
-import { jsx as jsx33, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
 function ImagePicker({ src, file, label, disabled, onFileChange, onClear }) {
-  const input = useRef5(null);
+  const input = useRef4(null);
   const preview = useObjectURL(file);
   const image = file === null ? undefined : preview ?? src;
-  return /* @__PURE__ */ jsxs20("figure", {
+  return /* @__PURE__ */ jsxs18("figure", {
     className: "flex min-w-0 flex-col items-center gap-3",
     "aria-label": label,
     children: [
-      /* @__PURE__ */ jsxs20(Avatar2, {
+      /* @__PURE__ */ jsxs18(Avatar2, {
         size: "preview",
         shape: "square",
         children: [
-          /* @__PURE__ */ jsx33(AvatarImage2, {
+          /* @__PURE__ */ jsx29(AvatarImage2, {
             src: image,
             alt: label
           }),
-          /* @__PURE__ */ jsx33(AvatarFallback2, {
-            children: /* @__PURE__ */ jsx33(ImageIcon, {
+          /* @__PURE__ */ jsx29(AvatarFallback2, {
+            children: /* @__PURE__ */ jsx29(ImageIcon, {
               className: "size-12",
               "aria-hidden": "true"
             })
           })
         ]
       }),
-      /* @__PURE__ */ jsx33("input", {
+      /* @__PURE__ */ jsx29("input", {
         ref: input,
         hidden: true,
         type: "file",
@@ -3006,22 +2891,22 @@ function ImagePicker({ src, file, label, disabled, onFileChange, onClear }) {
           event.currentTarget.value = "";
         }
       }),
-      /* @__PURE__ */ jsxs20("div", {
+      /* @__PURE__ */ jsxs18("div", {
         className: "flex flex-wrap justify-center gap-2",
         children: [
-          /* @__PURE__ */ jsxs20(Button2, {
+          /* @__PURE__ */ jsxs18(Button2, {
             type: "button",
             variant: "outline",
             disabled,
             onClick: () => input.current?.click(),
             children: [
-              /* @__PURE__ */ jsx33(UploadIcon, {
+              /* @__PURE__ */ jsx29(UploadIcon, {
                 "data-icon": "inline-start"
               }),
               "Upload image"
             ]
           }),
-          /* @__PURE__ */ jsx33(Button2, {
+          /* @__PURE__ */ jsx29(Button2, {
             type: "button",
             variant: "outline",
             disabled: disabled || !image,
@@ -3033,19 +2918,972 @@ function ImagePicker({ src, file, label, disabled, onFileChange, onClear }) {
     ]
   });
 }
-// src/components/PortalProvider.tsx
-import { jsx as jsx34 } from "react/jsx-runtime";
-function PortalProvider({ container, children }) {
-  return /* @__PURE__ */ jsx34(PortalContext.Provider, {
-    value: container,
+// src/components/NumberField.tsx
+import { NumberField as NumberFieldPrimitive } from "@base-ui/react/number-field";
+import { MinusIcon, PlusIcon, MoveHorizontalIcon } from "lucide-react";
+import { jsx as jsx30 } from "react/jsx-runtime";
+function NumberField({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Root, {
+    "data-density": density,
+    "data-slot": "number-field",
+    className: (state) => cn2("flex min-w-0 flex-col gap-field-gap", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function NumberFieldGroup({
+  density,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Group, {
+    "data-density": density,
+    "data-slot": "number-field-group",
+    className: (state) => cn2("flex h-control min-w-0 items-stretch rounded-sm border border-input bg-secondary text-foreground transition-colors focus-within:border-ring focus-within:ring-1 focus-within:ring-ring data-disabled:opacity-50 motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function NumberFieldInput({
+  density,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Input, {
+    "data-density": density,
+    "data-slot": "number-field-input",
+    className: (state) => cn2("min-w-0 flex-1 bg-transparent px-control-x text-center text-sm tabular-nums outline-none disabled:cursor-not-allowed", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function NumberFieldDecrement({
+  density,
+  className,
+  children = /* @__PURE__ */ jsx30(MinusIcon, {}),
+  ...props
+}) {
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Decrement, {
+    "data-density": density,
+    "data-slot": "number-field-decrement",
+    className: (state) => cn2("flex w-control shrink-0 items-center justify-center rounded-s-sm outline-none hover:bg-muted focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-3.5", typeof className === "function" ? className(state) : className),
+    ...props,
+    children
+  });
+}
+function NumberFieldIncrement({
+  density,
+  className,
+  children = /* @__PURE__ */ jsx30(PlusIcon, {}),
+  ...props
+}) {
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.Increment, {
+    "data-density": density,
+    "data-slot": "number-field-increment",
+    className: (state) => cn2("flex w-control shrink-0 items-center justify-center rounded-e-sm outline-none hover:bg-muted focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-3.5", typeof className === "function" ? className(state) : className),
+    ...props,
+    children
+  });
+}
+function NumberFieldScrubArea({
+  density,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.ScrubArea, {
+    "data-density": density,
+    "data-slot": "number-field-scrub-area",
+    className: (state) => cn2("flex w-fit cursor-ew-resize items-center gap-control-gap text-sm font-medium", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function NumberFieldScrubAreaCursor({
+  density,
+  className,
+  children = /* @__PURE__ */ jsx30(MoveHorizontalIcon, {}),
+  ...props
+}) {
+  const resolvedDensity = useDensity(density);
+  return /* @__PURE__ */ jsx30(NumberFieldPrimitive.ScrubAreaCursor, {
+    "data-density": resolvedDensity,
+    "data-slot": "number-field-scrub-area-cursor",
+    className: (state) => cn2("z-50 font-sans text-sm text-foreground [&_svg]:size-5", typeof className === "function" ? className(state) : className),
+    ...props,
     children
   });
 }
+// src/components/Meter.tsx
+import { Meter as MeterPrimitive } from "@base-ui/react/meter";
+import { jsx as jsx31 } from "react/jsx-runtime";
+function Meter({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx31(MeterPrimitive.Root, {
+    "data-density": density,
+    "data-slot": "meter",
+    className: (state) => cn2("flex min-w-0 flex-wrap items-center gap-field-gap", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function MeterLabel({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx31(MeterPrimitive.Label, {
+    "data-density": density,
+    "data-slot": "meter-label",
+    className: (state) => cn2("text-sm font-medium", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function MeterValue({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx31(MeterPrimitive.Value, {
+    "data-density": density,
+    "data-slot": "meter-value",
+    className: (state) => cn2("ms-auto text-sm text-muted-foreground tabular-nums", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function MeterTrack({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx31(MeterPrimitive.Track, {
+    "data-density": density,
+    "data-slot": "meter-track",
+    className: (state) => cn2("h-1 w-full overflow-hidden rounded-sm bg-muted", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function MeterIndicator({
+  density,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx31(MeterPrimitive.Indicator, {
+    "data-density": density,
+    "data-slot": "meter-indicator",
+    className: (state) => cn2("h-full bg-primary transition-[width] motion-reduce:transition-none", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+// src/components/Stepper.tsx
+import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
+import { CheckIcon as CheckIcon5 } from "lucide-react";
+import { jsx as jsx32 } from "react/jsx-runtime";
+function Stepper({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx32(TabsPrimitive.Root, {
+    "data-density": density,
+    "data-slot": "stepper",
+    className: (state) => cn2("group/stepper flex min-w-0 flex-col gap-panel data-[orientation=vertical]:flex-row", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function StepperList({
+  density,
+  className,
+  activateOnFocus = false,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx32(TabsPrimitive.List, {
+    "data-density": density,
+    "data-slot": "stepper-list",
+    activateOnFocus,
+    className: (state) => cn2("flex min-w-0 gap-panel group-data-[orientation=vertical]/stepper:flex-col", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function StepperTrigger({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx32(TabsPrimitive.Tab, {
+    "data-density": density,
+    "data-slot": "stepper-trigger",
+    className: (state) => cn2("group/step flex min-h-control items-center gap-control-gap rounded-sm text-sm text-muted-foreground outline-none focus-visible:ring-1 focus-visible:ring-ring data-active:text-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:opacity-50", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function StepperIndicator({ completed = false, children, className, ...props }) {
+  return /* @__PURE__ */ jsx32("span", {
+    "aria-hidden": "true",
+    "data-slot": "stepper-indicator",
+    "data-completed": completed || undefined,
+    className: cn2("flex size-control shrink-0 items-center justify-center rounded-sm border border-input bg-secondary text-sm tabular-nums group-data-active/step:border-primary group-data-active/step:bg-primary group-data-active/step:text-primary-foreground data-completed:border-primary data-completed:text-primary [&_svg]:size-3.5", className),
+    ...props,
+    children: completed ? /* @__PURE__ */ jsx32(CheckIcon5, {}) : children
+  });
+}
+function StepperContent({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx32(TabsPrimitive.Panel, {
+    "data-density": density,
+    "data-slot": "stepper-content",
+    className: (state) => cn2("min-w-0 flex-1 outline-none focus-visible:ring-1 focus-visible:ring-ring", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+// src/components/AppShell.tsx
+import { jsx as jsx33, jsxs as jsxs19 } from "react/jsx-runtime";
+function AppShell({
+  navigation,
+  brand,
+  children,
+  header,
+  sidebarFooter,
+  footer,
+  height = "100dvh",
+  defaultSidebarOpen = true,
+  label = "Application",
+  density
+}) {
+  return /* @__PURE__ */ jsxs19(SidebarProvider2, {
+    density,
+    defaultOpen: defaultSidebarOpen,
+    className: "relative min-h-0",
+    style: { height },
+    "data-scroll": "none",
+    children: [
+      /* @__PURE__ */ jsxs19(Sidebar2, {
+        collapsible: "icon",
+        position: "container",
+        children: [
+          /* @__PURE__ */ jsx33(SidebarHeader2, {
+            children: brand
+          }),
+          /* @__PURE__ */ jsx33(SidebarContent2, {
+            children: /* @__PURE__ */ jsx33("nav", {
+              "aria-label": "Primary navigation",
+              children: /* @__PURE__ */ jsx33(SidebarGroup2, {
+                children: /* @__PURE__ */ jsx33(SidebarMenu2, {
+                  children: navigation.map((item) => /* @__PURE__ */ jsx33(SidebarMenuItem2, {
+                    children: /* @__PURE__ */ jsxs19(SidebarMenuButton2, {
+                      render: /* @__PURE__ */ jsx33("a", {
+                        href: item.href,
+                        "aria-current": item.active ? "page" : undefined
+                      }),
+                      isActive: item.active,
+                      tooltip: item.label,
+                      children: [
+                        item.icon,
+                        /* @__PURE__ */ jsx33("span", {
+                          children: item.label
+                        })
+                      ]
+                    })
+                  }, item.id))
+                })
+              })
+            })
+          }),
+          sidebarFooter && /* @__PURE__ */ jsx33(SidebarFooter2, {
+            children: sidebarFooter
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs19(SidebarInset2, {
+        "aria-label": label,
+        className: "min-h-0 min-w-0",
+        "data-scroll": "none",
+        children: [
+          /* @__PURE__ */ jsxs19("header", {
+            "data-scroll": "none",
+            className: "flex shrink-0 items-center gap-control-gap border-b border-border p-panel",
+            children: [
+              /* @__PURE__ */ jsx33(SidebarTrigger2, {}),
+              /* @__PURE__ */ jsx33(Separator2, {
+                orientation: "vertical",
+                className: "h-control"
+              }),
+              header
+            ]
+          }),
+          /* @__PURE__ */ jsx33(ScrollArea, {
+            className: "min-h-0 flex-1",
+            children: /* @__PURE__ */ jsx33("div", {
+              className: "flex min-w-0 flex-col gap-panel p-panel",
+              children
+            })
+          }),
+          footer && /* @__PURE__ */ jsx33("footer", {
+            className: "shrink-0 border-t border-border p-panel",
+            "data-scroll": "none",
+            children: footer
+          })
+        ]
+      })
+    ]
+  });
+}
+// src/components/PageHeader.tsx
+import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
+function PageHeader({ title, description, breadcrumbs, actions, density }) {
+  return /* @__PURE__ */ jsxs20("header", {
+    "data-density": density,
+    "data-slot": "page-header",
+    "data-scroll": "none",
+    className: "flex min-w-0 flex-col gap-field-gap",
+    children: [
+      breadcrumbs,
+      /* @__PURE__ */ jsxs20("div", {
+        className: "flex min-w-0 flex-wrap items-start justify-between gap-panel",
+        children: [
+          /* @__PURE__ */ jsxs20("div", {
+            className: "min-w-0",
+            children: [
+              /* @__PURE__ */ jsx34("h1", {
+                className: "text-xl font-semibold text-foreground",
+                children: title
+              }),
+              description && /* @__PURE__ */ jsx34("div", {
+                className: "mt-1 text-sm text-muted-foreground",
+                children: description
+              })
+            ]
+          }),
+          actions && /* @__PURE__ */ jsx34("div", {
+            className: "flex shrink-0 flex-wrap items-center gap-control-gap",
+            children: actions
+          })
+        ]
+      })
+    ]
+  });
+}
+// src/components/WorkspaceSwitcher.tsx
+import { jsx as jsx35, jsxs as jsxs21 } from "react/jsx-runtime";
+function WorkspaceSwitcher({
+  workspaces,
+  value,
+  defaultValue,
+  onValueChange,
+  disabled,
+  label = "Workspace",
+  density
+}) {
+  return /* @__PURE__ */ jsxs21(Select, {
+    items: workspaces,
+    value,
+    defaultValue: defaultValue ?? workspaces[0]?.value,
+    onValueChange: (next) => {
+      if (next !== null)
+        onValueChange?.(next);
+    },
+    disabled,
+    children: [
+      /* @__PURE__ */ jsx35(SelectTrigger, {
+        "aria-label": label,
+        density,
+        children: /* @__PURE__ */ jsx35(SelectValue, {})
+      }),
+      /* @__PURE__ */ jsx35(SelectContent, {
+        density,
+        children: /* @__PURE__ */ jsx35(SelectGroup, {
+          children: workspaces.map((workspace) => /* @__PURE__ */ jsx35(SelectItem, {
+            value: workspace.value,
+            children: workspace.label
+          }, workspace.value))
+        })
+      })
+    ]
+  });
+}
+// src/components/AccountMenu.tsx
+import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
+function AccountMenu({ name, email, image, onAction, density }) {
+  return /* @__PURE__ */ jsxs22(DropdownMenu2, {
+    children: [
+      /* @__PURE__ */ jsxs22(DropdownMenuTrigger2, {
+        render: /* @__PURE__ */ jsx36(Button2, {
+          variant: "ghost",
+          density
+        }),
+        "aria-label": `Account menu for ${name}`,
+        children: [
+          /* @__PURE__ */ jsxs22(Avatar2, {
+            className: "size-control",
+            children: [
+              /* @__PURE__ */ jsx36(AvatarImage2, {
+                src: image,
+                alt: ""
+              }),
+              /* @__PURE__ */ jsx36(AvatarFallback2, {
+                children: name.slice(0, 2).toUpperCase()
+              })
+            ]
+          }),
+          /* @__PURE__ */ jsx36("span", {
+            children: name
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx36(DropdownMenuContent2, {
+        density,
+        align: "end",
+        children: /* @__PURE__ */ jsxs22(DropdownMenuGroup2, {
+          children: [
+            /* @__PURE__ */ jsx36(DropdownMenuLabel2, {
+              children: email ?? name
+            }),
+            /* @__PURE__ */ jsx36(DropdownMenuItem2, {
+              onClick: () => onAction("profile"),
+              children: "Profile"
+            }),
+            /* @__PURE__ */ jsx36(DropdownMenuItem2, {
+              onClick: () => onAction("settings"),
+              children: "Settings"
+            }),
+            /* @__PURE__ */ jsx36(DropdownMenuSeparator2, {}),
+            /* @__PURE__ */ jsx36(DropdownMenuItem2, {
+              onClick: () => onAction("sign-out"),
+              children: "Sign out"
+            })
+          ]
+        })
+      })
+    ]
+  });
+}
+// src/components/StatCard.tsx
+import { jsx as jsx37, jsxs as jsxs23 } from "react/jsx-runtime";
+function StatCard({
+  label,
+  value,
+  change,
+  changeIntent = "neutral",
+  description,
+  children,
+  loading = false,
+  density
+}) {
+  return /* @__PURE__ */ jsxs23(Card2, {
+    density,
+    "aria-label": label,
+    "aria-busy": loading,
+    children: [
+      /* @__PURE__ */ jsxs23(CardHeader2, {
+        children: [
+          /* @__PURE__ */ jsx37(CardTitle2, {
+            children: label
+          }),
+          description && /* @__PURE__ */ jsx37(CardDescription2, {
+            children: description
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx37(CardContent2, {
+        children: /* @__PURE__ */ jsxs23("div", {
+          className: "flex flex-wrap items-center justify-between gap-control-gap",
+          children: [
+            loading ? /* @__PURE__ */ jsx37(Skeleton2, {
+              className: "h-8 w-24",
+              "aria-label": `Loading ${label}`
+            }) : /* @__PURE__ */ jsx37("div", {
+              className: "text-2xl font-semibold tabular-nums",
+              children: value
+            }),
+            change && /* @__PURE__ */ jsx37(Badge2, {
+              variant: changeIntent === "positive" ? "success" : changeIntent === "negative" ? "destructive" : "secondary",
+              children: change
+            })
+          ]
+        })
+      }),
+      children && /* @__PURE__ */ jsx37(CardFooter2, {
+        children
+      })
+    ]
+  });
+}
+// src/components/AuthForm.tsx
+import { useId as useId2, useState as useState5 } from "react";
+import { jsx as jsx38, jsxs as jsxs24 } from "react/jsx-runtime";
+function AuthForm({
+  mode = "sign-in",
+  onSubmit,
+  footer,
+  alternativeActions,
+  disabled = false,
+  density
+}) {
+  const id = useId2();
+  const [pending, setPending] = useState5(false);
+  const [error, setError] = useState5("");
+  const title = mode === "sign-up" ? "Create an account" : mode === "reset-password" ? "Reset your password" : "Sign in";
+  async function submit(event) {
+    event.preventDefault();
+    const data = new FormData(event.currentTarget);
+    setError("");
+    setPending(true);
+    try {
+      await onSubmit({
+        email: String(data.get("email") ?? ""),
+        password: String(data.get("password") ?? ""),
+        name: String(data.get("name") ?? "")
+      });
+    } catch (error) {
+      setError(error instanceof Error ? error.message : "Unable to submit. Please try again.");
+    } finally {
+      setPending(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs24(Card2, {
+    density,
+    children: [
+      /* @__PURE__ */ jsxs24(CardHeader2, {
+        children: [
+          /* @__PURE__ */ jsx38(CardTitle2, {
+            children: title
+          }),
+          /* @__PURE__ */ jsx38(CardDescription2, {
+            children: mode === "reset-password" ? "Enter your email to request a password reset." : "Enter your details to continue."
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx38(CardContent2, {
+        children: /* @__PURE__ */ jsx38("form", {
+          onSubmit: submit,
+          "aria-label": title,
+          "aria-busy": pending,
+          children: /* @__PURE__ */ jsxs24(FieldGroup2, {
+            children: [
+              mode === "sign-up" && /* @__PURE__ */ jsxs24(Field2, {
+                children: [
+                  /* @__PURE__ */ jsx38(FieldLabel2, {
+                    htmlFor: id + "-name",
+                    children: "Name"
+                  }),
+                  /* @__PURE__ */ jsx38(Input2, {
+                    id: id + "-name",
+                    name: "name",
+                    autoComplete: "name",
+                    required: true,
+                    disabled: disabled || pending
+                  })
+                ]
+              }),
+              /* @__PURE__ */ jsxs24(Field2, {
+                children: [
+                  /* @__PURE__ */ jsx38(FieldLabel2, {
+                    htmlFor: id + "-email",
+                    children: "Email"
+                  }),
+                  /* @__PURE__ */ jsx38(Input2, {
+                    id: id + "-email",
+                    name: "email",
+                    type: "email",
+                    autoComplete: "email",
+                    required: true,
+                    disabled: disabled || pending
+                  })
+                ]
+              }),
+              mode !== "reset-password" && /* @__PURE__ */ jsxs24(Field2, {
+                children: [
+                  /* @__PURE__ */ jsx38(FieldLabel2, {
+                    htmlFor: id + "-password",
+                    children: "Password"
+                  }),
+                  /* @__PURE__ */ jsx38(Input2, {
+                    id: id + "-password",
+                    name: "password",
+                    type: "password",
+                    autoComplete: mode === "sign-up" ? "new-password" : "current-password",
+                    minLength: mode === "sign-up" ? 8 : undefined,
+                    required: true,
+                    disabled: disabled || pending
+                  }),
+                  mode === "sign-up" && /* @__PURE__ */ jsx38(FieldDescription2, {
+                    children: "Use at least eight characters."
+                  })
+                ]
+              }),
+              error && /* @__PURE__ */ jsxs24(Alert2, {
+                variant: "destructive",
+                children: [
+                  /* @__PURE__ */ jsx38(AlertTitle2, {
+                    children: "Request failed"
+                  }),
+                  /* @__PURE__ */ jsx38(AlertDescription2, {
+                    children: error
+                  })
+                ]
+              }),
+              /* @__PURE__ */ jsxs24(Button2, {
+                type: "submit",
+                disabled: disabled || pending,
+                children: [
+                  pending && /* @__PURE__ */ jsx38(Spinner2, {
+                    "data-icon": "inline-start"
+                  }),
+                  mode === "reset-password" ? "Send reset link" : title
+                ]
+              }),
+              alternativeActions
+            ]
+          })
+        })
+      }),
+      footer && /* @__PURE__ */ jsx38(CardFooter2, {
+        children: footer
+      })
+    ]
+  });
+}
+// src/components/SettingsSection.tsx
+import { jsx as jsx39, jsxs as jsxs25 } from "react/jsx-runtime";
+function SettingsSection({
+  title,
+  description,
+  children,
+  onSubmit,
+  saveLabel = "Save changes",
+  pending = false,
+  disabled = false,
+  footer,
+  destructive = false,
+  density
+}) {
+  return /* @__PURE__ */ jsx39("form", {
+    "aria-label": title,
+    onSubmit,
+    "aria-busy": pending,
+    children: /* @__PURE__ */ jsxs25(Card2, {
+      density,
+      children: [
+        /* @__PURE__ */ jsxs25(CardHeader2, {
+          children: [
+            /* @__PURE__ */ jsx39(CardTitle2, {
+              children: title
+            }),
+            description && /* @__PURE__ */ jsx39(CardDescription2, {
+              children: description
+            })
+          ]
+        }),
+        /* @__PURE__ */ jsx39(CardContent2, {
+          children: /* @__PURE__ */ jsxs25("fieldset", {
+            disabled: disabled || pending,
+            className: "min-w-0 border-0 p-0",
+            children: [
+              /* @__PURE__ */ jsx39("legend", {
+                className: "sr-only",
+                children: title
+              }),
+              /* @__PURE__ */ jsx39(FieldGroup2, {
+                children
+              })
+            ]
+          })
+        }),
+        /* @__PURE__ */ jsxs25(CardFooter2, {
+          className: "flex flex-wrap items-center justify-between gap-control-gap",
+          children: [
+            footer,
+            /* @__PURE__ */ jsxs25(Button2, {
+              type: "submit",
+              variant: destructive ? "destructive" : "default",
+              disabled: disabled || pending,
+              children: [
+                pending && /* @__PURE__ */ jsx39(Spinner2, {
+                  "data-icon": "inline-start"
+                }),
+                saveLabel
+              ]
+            })
+          ]
+        })
+      ]
+    })
+  });
+}
+// src/components/TagInput.tsx
+import { jsx as jsx40, jsxs as jsxs26 } from "react/jsx-runtime";
+function TagInput({
+  label,
+  options,
+  value,
+  defaultValue,
+  onValueChange,
+  disabled,
+  name,
+  placeholder = "Add tags",
+  density
+}) {
+  const anchor = useComboboxAnchor();
+  return /* @__PURE__ */ jsxs26(Combobox, {
+    items: options,
+    multiple: true,
+    value,
+    defaultValue,
+    onValueChange,
+    disabled,
+    name,
+    children: [
+      /* @__PURE__ */ jsxs26(ComboboxChips, {
+        ref: anchor,
+        density,
+        children: [
+          /* @__PURE__ */ jsx40(ComboboxValue, {
+            children: (values) => values.map((item) => /* @__PURE__ */ jsx40(ComboboxChip, {
+              removeLabel: `Remove ${item}`,
+              children: item
+            }, item))
+          }),
+          /* @__PURE__ */ jsx40(ComboboxChipsInput, {
+            "aria-label": label,
+            placeholder
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs26(ComboboxContent, {
+        anchor,
+        density,
+        children: [
+          /* @__PURE__ */ jsx40(ComboboxEmpty, {
+            children: "No matching tags."
+          }),
+          /* @__PURE__ */ jsx40(ComboboxList, {
+            children: /* @__PURE__ */ jsx40(ComboboxGroup, {
+              children: /* @__PURE__ */ jsx40(ComboboxCollection, {
+                children: (item) => /* @__PURE__ */ jsx40(ComboboxItem, {
+                  value: item,
+                  children: item
+                }, item)
+              })
+            })
+          })
+        ]
+      })
+    ]
+  });
+}
+// src/components/FilterBar.tsx
+import { jsx as jsx41, jsxs as jsxs27 } from "react/jsx-runtime";
+function FilterBar({
+  label,
+  search,
+  onSearchChange,
+  filters,
+  value,
+  onValueChange,
+  disabled,
+  density
+}) {
+  return /* @__PURE__ */ jsxs27("fieldset", {
+    "aria-label": label,
+    disabled,
+    "data-density": density,
+    className: "flex min-w-0 flex-wrap items-center gap-2",
+    children: [
+      /* @__PURE__ */ jsx41(Input2, {
+        "aria-label": `Search ${label}`,
+        type: "search",
+        value: search,
+        onChange: (event) => onSearchChange(event.target.value),
+        className: "min-w-40 flex-1"
+      }),
+      filters.map((filter) => /* @__PURE__ */ jsxs27(NativeSelect2, {
+        "aria-label": filter.label,
+        value: value[filter.id] ?? "",
+        onChange: (event) => onValueChange({ ...value, [filter.id]: event.target.value }),
+        children: [
+          /* @__PURE__ */ jsxs27(NativeSelectOption2, {
+            value: "",
+            children: [
+              "All ",
+              filter.label.toLowerCase()
+            ]
+          }),
+          filter.options.map((option) => /* @__PURE__ */ jsx41(NativeSelectOption2, {
+            value: option.value,
+            children: option.label
+          }, option.value))
+        ]
+      }, filter.id)),
+      /* @__PURE__ */ jsx41(Button2, {
+        type: "button",
+        variant: "ghost",
+        disabled: !search && !Object.values(value).some(Boolean),
+        onClick: () => {
+          onSearchChange("");
+          onValueChange({});
+        },
+        children: "Clear filters"
+      })
+    ]
+  });
+}
+// src/components/BarList.tsx
+import { jsx as jsx42, jsxs as jsxs28 } from "react/jsx-runtime";
+function BarList({
+  label,
+  items,
+  onItemSelect,
+  valueFormatter = (value) => value.toLocaleString(),
+  density
+}) {
+  const max = Math.max(1, ...items.map((item) => item.value));
+  return /* @__PURE__ */ jsxs28("section", {
+    "aria-label": label,
+    "data-density": density,
+    children: [
+      /* @__PURE__ */ jsx42("ul", {
+        className: "grid gap-3",
+        children: items.map((item) => /* @__PURE__ */ jsx42("li", {
+          children: /* @__PURE__ */ jsxs28(Meter, {
+            min: 0,
+            max,
+            value: item.value,
+            "aria-label": item.label,
+            format: { maximumFractionDigits: 2 },
+            children: [
+              /* @__PURE__ */ jsxs28("div", {
+                className: "mb-1 flex items-center justify-between gap-3 text-sm",
+                children: [
+                  /* @__PURE__ */ jsx42(MeterLabel, {
+                    children: onItemSelect ? /* @__PURE__ */ jsx42(Button2, {
+                      type: "button",
+                      variant: "link",
+                      className: "h-auto p-0",
+                      onClick: () => onItemSelect(item),
+                      children: item.label
+                    }) : item.label
+                  }),
+                  /* @__PURE__ */ jsx42(MeterValue, {
+                    children: () => valueFormatter(item.value)
+                  })
+                ]
+              }),
+              /* @__PURE__ */ jsx42(MeterTrack, {
+                children: /* @__PURE__ */ jsx42(MeterIndicator, {})
+              })
+            ]
+          })
+        }, item.id))
+      }),
+      !items.length && /* @__PURE__ */ jsx42("p", {
+        role: "status",
+        className: "text-sm text-muted-foreground",
+        children: "No data available."
+      })
+    ]
+  });
+}
+// src/components/StatusTracker.tsx
+import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
+var statusClasses = { success: "bg-success", warning: "bg-warning", error: "bg-destructive", unknown: "bg-muted" };
+function StatusTracker({ label, items, onItemSelect, density }) {
+  return /* @__PURE__ */ jsx43(TooltipProvider2, {
+    children: /* @__PURE__ */ jsx43("div", {
+      role: "group",
+      "aria-label": label,
+      "data-density": density,
+      className: "flex min-w-0 gap-1",
+      children: items.map((item) => /* @__PURE__ */ jsxs29(Tooltip2, {
+        children: [
+          /* @__PURE__ */ jsx43(TooltipTrigger2, {
+            "aria-label": `${item.label}: ${item.status}`,
+            onClick: () => onItemSelect?.(item),
+            className: cn2("h-8 min-w-2 flex-1 rounded-sm outline-none focus-visible:ring-2 focus-visible:ring-ring", statusClasses[item.status])
+          }),
+          /* @__PURE__ */ jsxs29(TooltipContent2, {
+            children: [
+              item.label,
+              ": ",
+              item.description ?? item.status
+            ]
+          })
+        ]
+      }, item.id))
+    })
+  });
+}
+// src/components/DashboardLayout.tsx
+import { jsx as jsx44, jsxs as jsxs30 } from "react/jsx-runtime";
+function DashboardLayout({
+  title,
+  description,
+  actions,
+  filters,
+  stats,
+  children,
+  footer,
+  density
+}) {
+  return /* @__PURE__ */ jsxs30("div", {
+    "data-density": density,
+    "data-scroll": "none",
+    className: "grid min-w-0 gap-6",
+    children: [
+      /* @__PURE__ */ jsx44(PageHeader, {
+        title,
+        description,
+        actions
+      }),
+      filters,
+      stats.length > 0 && /* @__PURE__ */ jsx44("div", {
+        className: "grid gap-4 sm:grid-cols-2 xl:grid-cols-4",
+        children: stats.map(({ id, ...stat }) => /* @__PURE__ */ jsx44(StatCard, {
+          ...stat
+        }, id))
+      }),
+      /* @__PURE__ */ jsx44("div", {
+        className: "grid min-w-0 gap-4",
+        children
+      }),
+      footer
+    ]
+  });
+}
+// src/components/BillingUsage.tsx
+import { jsx as jsx45, jsxs as jsxs31 } from "react/jsx-runtime";
+function BillingUsage({ plan, price, period, metrics, onManage, pending, density }) {
+  return /* @__PURE__ */ jsxs31(Card2, {
+    density,
+    "aria-label": "Billing and usage",
+    children: [
+      /* @__PURE__ */ jsxs31(CardHeader2, {
+        children: [
+          /* @__PURE__ */ jsx45(CardTitle2, {
+            children: plan
+          }),
+          /* @__PURE__ */ jsxs31(CardDescription2, {
+            children: [
+              price,
+              " · ",
+              period
+            ]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx45(CardContent2, {
+        className: "grid gap-4",
+        children: metrics.map((metric) => /* @__PURE__ */ jsxs31(Meter, {
+          value: metric.used,
+          max: metric.limit,
+          "aria-label": metric.label,
+          children: [
+            /* @__PURE__ */ jsxs31("div", {
+              className: "mb-2 flex items-center justify-between gap-3 text-sm",
+              children: [
+                /* @__PURE__ */ jsx45(MeterLabel, {
+                  children: metric.label
+                }),
+                /* @__PURE__ */ jsx45(MeterValue, {
+                  children: () => `${metric.used.toLocaleString()} / ${metric.limit.toLocaleString()}${metric.unit ? ` ${metric.unit}` : ""}`
+                })
+              ]
+            }),
+            /* @__PURE__ */ jsx45(MeterTrack, {
+              children: /* @__PURE__ */ jsx45(MeterIndicator, {})
+            })
+          ]
+        }, metric.id))
+      }),
+      /* @__PURE__ */ jsx45(CardFooter2, {
+        children: /* @__PURE__ */ jsx45(Button2, {
+          type: "button",
+          variant: "outline",
+          onClick: onManage,
+          disabled: pending,
+          children: "Manage billing"
+        })
+      })
+    ]
+  });
+}
 export {
   Accordion,
   AccordionContent,
   AccordionItem,
   AccordionTrigger,
+  AccountMenu,
   Alert2 as Alert,
   AlertAction2 as AlertAction,
   AlertDescription2 as AlertDescription,
@@ -3062,6 +3900,7 @@ export {
   AlertDialogTitle,
   AlertDialogTrigger,
   AlertTitle2 as AlertTitle,
+  AppShell,
   AspectRatio,
   Attachment,
   AttachmentAction,
@@ -3072,6 +3911,7 @@ export {
   AttachmentMedia,
   AttachmentTitle,
   AttachmentTrigger,
+  AuthForm,
   Avatar2 as Avatar,
   AvatarBadge2 as AvatarBadge,
   AvatarFallback2 as AvatarFallback,
@@ -3079,6 +3919,8 @@ export {
   AvatarGroupCount2 as AvatarGroupCount,
   AvatarImage2 as AvatarImage,
   Badge2 as Badge,
+  BarList,
+  BillingUsage,
   Breadcrumb,
   BreadcrumbEllipsis,
   BreadcrumbItem,
@@ -3137,6 +3979,7 @@ export {
   ContextMenuSubContent,
   ContextMenuSubTrigger,
   ContextMenuTrigger,
+  DashboardLayout,
   DensityProvider,
   Dialog2 as Dialog,
   DialogClose2 as DialogClose,
@@ -3149,9 +3992,9 @@ export {
   DialogTitle2 as DialogTitle,
   DialogTrigger2 as DialogTrigger,
   DirectionProvider2 as DirectionProvider,
-  DragDropPreview,
-  DragDropProvider,
-  DragSource,
+  DragDropPreview2 as DragDropPreview,
+  DragDropProvider2 as DragDropProvider,
+  DragSource2 as DragSource,
   Drawer,
   DrawerClose,
   DrawerContent,
@@ -3163,7 +4006,7 @@ export {
   DrawerSwipeHandle,
   DrawerTitle,
   DrawerTrigger,
-  DropTarget,
+  DropTarget2 as DropTarget,
   DropdownMenu2 as DropdownMenu,
   DropdownMenuCheckboxItem2 as DropdownMenuCheckboxItem,
   DropdownMenuContent2 as DropdownMenuContent,
@@ -3196,6 +4039,7 @@ export {
   FieldSeparator2 as FieldSeparator,
   FieldSet2 as FieldSet,
   FieldTitle2 as FieldTitle,
+  FilterBar,
   HoverCard2 as HoverCard,
   HoverCardContent2 as HoverCardContent,
   HoverCardTrigger2 as HoverCardTrigger,
@@ -3219,6 +4063,7 @@ export {
   ItemSeparator,
   ItemTitle,
   JsonViewer,
+  Kanban2 as Kanban,
   Kbd2 as Kbd,
   KbdGroup2 as KbdGroup,
   Label2 as Label,
@@ -3247,9 +4092,14 @@ export {
   MessageFooter,
   MessageGroup,
   MessageHeader,
-  NativeSelect,
-  NativeSelectOptGroup,
-  NativeSelectOption,
+  Meter,
+  MeterIndicator,
+  MeterLabel,
+  MeterTrack,
+  MeterValue,
+  NativeSelect2 as NativeSelect,
+  NativeSelectOptGroup2 as NativeSelectOptGroup,
+  NativeSelectOption2 as NativeSelectOption,
   NavigationMenu,
   NavigationMenuContent,
   NavigationMenuIndicator,
@@ -3258,6 +4108,14 @@ export {
   NavigationMenuList,
   NavigationMenuPositioner,
   NavigationMenuTrigger,
+  NumberField,
+  NumberFieldDecrement,
+  NumberFieldGroup,
+  NumberFieldIncrement,
+  NumberFieldInput,
+  NumberFieldScrubArea,
+  NumberFieldScrubAreaCursor,
+  PageHeader,
   PageMessage,
   Pagination,
   PaginationContent,
@@ -3272,7 +4130,7 @@ export {
   PopoverHeader2 as PopoverHeader,
   PopoverTitle2 as PopoverTitle,
   PopoverTrigger2 as PopoverTrigger,
-  PortalProvider,
+  PortalProvider2 as PortalProvider,
   Progress2 as Progress,
   ProgressIndicator2 as ProgressIndicator,
   ProgressLabel2 as ProgressLabel,
@@ -3282,6 +4140,7 @@ export {
   RadioGroupItem2 as RadioGroupItem,
   ScrollArea,
   ScrollBar,
+  ScrollGuard,
   Select,
   SelectContent,
   SelectGroup,
@@ -3293,6 +4152,7 @@ export {
   SelectTrigger,
   SelectValue,
   Separator2 as Separator,
+  SettingsSection,
   Sheet2 as Sheet,
   SheetClose2 as SheetClose,
   SheetContent2 as SheetContent,
@@ -3328,6 +4188,13 @@ export {
   Slider2 as Slider,
   Spinner2 as Spinner,
   StarRating,
+  StatCard,
+  StatusTracker,
+  Stepper,
+  StepperContent,
+  StepperIndicator,
+  StepperList,
+  StepperTrigger,
   Switch2 as Switch,
   Table2 as Table,
   TableBody2 as TableBody,
@@ -3337,10 +4204,11 @@ export {
   TableHead2 as TableHead,
   TableHeader2 as TableHeader,
   TableRow2 as TableRow,
-  Tabs,
-  TabsContent,
-  TabsList,
-  TabsTrigger,
+  Tabs2 as Tabs,
+  TabsContent2 as TabsContent,
+  TabsList2 as TabsList,
+  TabsTrigger2 as TabsTrigger,
+  TagInput,
   Textarea2 as Textarea,
   ThemeProvider,
   Toast,
@@ -3356,10 +4224,17 @@ export {
   Toggle2 as Toggle,
   ToggleGroup2 as ToggleGroup,
   ToggleGroupItem2 as ToggleGroupItem,
+  Toolbar2 as Toolbar,
+  ToolbarButton2 as ToolbarButton,
+  ToolbarGroup2 as ToolbarGroup,
+  ToolbarInput2 as ToolbarInput,
+  ToolbarLink2 as ToolbarLink,
+  ToolbarSeparator2 as ToolbarSeparator,
   Tooltip2 as Tooltip,
   TooltipContent2 as TooltipContent,
   TooltipProvider2 as TooltipProvider,
   TooltipTrigger2 as TooltipTrigger,
+  WorkspaceSwitcher,
   badgeVariants2 as badgeVariants,
   buttonGroupVariants,
   buttonVariants2 as buttonVariants,
@@ -3367,13 +4242,13 @@ export {
   createToastManager,
   markerVariants,
   navigationMenuTriggerStyle,
-  tabsListVariants,
+  tabsListVariants2 as tabsListVariants,
   toggleVariants2 as toggleVariants,
   useComboboxAnchor,
   useDirection2 as useDirection,
-  useDragDrop,
-  useDragSource,
-  useDropTarget,
+  useDragDrop2 as useDragDrop,
+  useDragSource2 as useDragSource,
+  useDropTarget2 as useDropTarget,
   usePortalContainer2 as usePortalContainer,
   useSidebar2 as useSidebar,
   useTheme2 as useTheme,