@gryt/ui 0.2.0 → 0.4.0

package/dist/index.js

@@ -1,25 +1,46 @@
-import { jsx as a, jsxs as g } from "react/jsx-runtime";
-import { Tooltip as h } from "@base-ui/react/tooltip";
-import { Button as M } from "@base-ui/react/button";
-import { forwardRef as c, useRef as V, useCallback as E, useLayoutEffect as W } from "react";
-import { clsx as X } from "clsx";
-import { twMerge as q } from "tailwind-merge";
-import { Field as S } from "@base-ui/react/field";
-import { PaperPlaneTilt as J, X as K, Check as F, CaretUpDown as Q, CircleNotch as Y, CaretDown as Z } from "@phosphor-icons/react";
-import { Avatar as $ } from "@base-ui/react/avatar";
-import { Checkbox as z } from "@base-ui/react/checkbox";
-import { Radio as j } from "@base-ui/react/radio";
-import { RadioGroup as _ } from "@base-ui/react/radio-group";
-import { Switch as A } from "@base-ui/react/switch";
-import { Slider as k } from "@base-ui/react/slider";
-import { Select as b } from "@base-ui/react/select";
-import { Separator as tt } from "@base-ui/react/separator";
-import { Progress as C } from "@base-ui/react/progress";
-import { Dialog as l } from "@base-ui/react/dialog";
-import { Menu as x } from "@base-ui/react/menu";
-import { Tabs as P } from "@base-ui/react/tabs";
-import { Accordion as N } from "@base-ui/react/accordion";
-const L = {
+import { jsx as o, jsxs as d } from "react/jsx-runtime";
+import { Tooltip as R } from "@base-ui/react/tooltip";
+import { Button as at } from "@base-ui/react/button";
+import { forwardRef as s, useRef as yt, useCallback as Q, useLayoutEffect as mt, useSyncExternalStore as pt, useContext as W, createContext as bt } from "react";
+import { clsx as ft } from "clsx";
+import { twMerge as xt } from "tailwind-merge";
+import { Field as E } from "@base-ui/react/field";
+import { PaperPlaneTilt as ht, X as nt, Check as st, CaretUpDown as wt, CircleNotch as vt, CaretDown as Nt, Minus as Pt, Plus as kt } from "@phosphor-icons/react";
+import { Avatar as X } from "@base-ui/react/avatar";
+import { Checkbox as Z } from "@base-ui/react/checkbox";
+import { Radio as q } from "@base-ui/react/radio";
+import { RadioGroup as Tt } from "@base-ui/react/radio-group";
+import { Switch as tt } from "@base-ui/react/switch";
+import { Slider as B } from "@base-ui/react/slider";
+import { Select as f } from "@base-ui/react/select";
+import { Separator as $t } from "@base-ui/react/separator";
+import { Progress as Y } from "@base-ui/react/progress";
+import { Dialog as k } from "@base-ui/react/dialog";
+import { Drawer as h } from "@base-ui/react/drawer";
+import { Menu as I } from "@base-ui/react/menu";
+import { Tabs as V } from "@base-ui/react/tabs";
+import { Accordion as F } from "@base-ui/react/accordion";
+import { ContextMenu as P } from "@base-ui/react/context-menu";
+import { Popover as w } from "@base-ui/react/popover";
+import { Toast as v } from "@base-ui/react/toast";
+import { ScrollArea as L } from "@base-ui/react/scroll-area";
+import { Toggle as Ct } from "@base-ui/react/toggle";
+import { ToggleGroup as St } from "@base-ui/react/toggle-group";
+import { Meter as z } from "@base-ui/react/meter";
+import { AlertDialog as T } from "@base-ui/react/alert-dialog";
+import { Autocomplete as u } from "@base-ui/react/autocomplete";
+import { Combobox as g } from "@base-ui/react/combobox";
+import { CheckboxGroup as Rt } from "@base-ui/react/checkbox-group";
+import { Collapsible as _ } from "@base-ui/react/collapsible";
+import { Form as It } from "@base-ui/react/form";
+import { Fieldset as it } from "@base-ui/react/fieldset";
+import { Menubar as At } from "@base-ui/react/menubar";
+import { NavigationMenu as x } from "@base-ui/react/navigation-menu";
+import { NumberField as S } from "@base-ui/react/number-field";
+import { OTPField as et } from "@base-ui/react/otp-field";
+import { PreviewCard as D } from "@base-ui/react/preview-card";
+import { Toolbar as M } from "@base-ui/react/toolbar";
+const rt = {
   color: {
     bg: "#111318",
     surface: "#1a1d24",
@@ -48,8 +69,8 @@ const L = {
     full: 999
   }
 };
-function et(n = {}) {
-  const t = { ...L.color, ...n.color }, e = { ...L.radius, ...n.radius };
+function Dt(a = {}) {
+  const t = { ...rt.color, ...a.color }, e = { ...rt.radius, ...a.radius };
   return {
     "--gryt-bg": t.bg,
     "--gryt-surface": t.surface,
@@ -97,47 +118,47 @@ function et(n = {}) {
     "--gryt-radius-full": `${e.full}px`
   };
 }
-function rt(n) {
-  return Object.keys(n).some((t) => t.startsWith("--"));
+function Mt(a) {
+  return Object.keys(a).some((t) => t.startsWith("--"));
 }
-function se({
-  children: n,
+function eo({
+  children: a,
   className: t,
   theme: e,
   tooltipDelay: r = 400
 }) {
-  const s = e && rt(e) ? e : et(e ?? {});
-  return /* @__PURE__ */ a("div", { className: t, style: s, children: /* @__PURE__ */ a(h.Provider, { delay: r, children: n }) });
+  const i = e && Mt(e) ? e : Dt(e ?? {});
+  return /* @__PURE__ */ o("div", { className: t, style: i, children: /* @__PURE__ */ o(R.Provider, { delay: r, children: a }) });
 }
-function o(...n) {
-  return q(X(n));
+function n(...a) {
+  return xt(ft(a));
 }
-const at = {
+const Lt = {
   primary: "bg-gryt-accent text-gryt-on-accent hover:not-data-disabled:bg-gryt-accent-light",
   secondary: "bg-gryt-secondary text-gryt-on-secondary hover:not-data-disabled:bg-gryt-secondary-light",
   neutral: "bg-gryt-surface-raised text-gryt-text hover:not-data-disabled:bg-gryt-surface-hover",
   danger: "bg-gryt-danger text-gryt-on-danger hover:not-data-disabled:bg-gryt-danger-light",
   ghost: "bg-transparent text-gryt-muted hover:not-data-disabled:bg-white/8 hover:not-data-disabled:text-gryt-text"
-}, nt = {
+}, jt = {
   xsmall: "min-h-8 px-3 text-xs",
   small: "min-h-9 px-4 text-sm",
   medium: "min-h-10 px-5 text-sm",
   large: "min-h-12 px-6 text-base"
-}, ot = c(
+}, Gt = s(
   function({
     children: t,
     className: e,
     endIcon: r,
-    size: s = "medium",
-    startIcon: i,
-    tone: d = "primary",
-    ...y
-  }, u) {
-    return /* @__PURE__ */ g(
-      M,
+    size: i = "medium",
+    startIcon: c,
+    tone: l = "primary",
+    ...p
+  }, m) {
+    return /* @__PURE__ */ d(
+      at,
       {
-        ref: u,
-        className: o(
+        ref: m,
+        className: n(
           "gryt-button",
           "inline-flex items-center justify-center gap-2 border-0 shadow-none",
           "rounded-(--gryt-radius-full) font-semibold whitespace-nowrap select-none",
@@ -152,72 +173,72 @@ const at = {
           "motion-safe:active:not-data-disabled:scale-[0.96]",
           "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gryt-accent-light",
           "data-disabled:cursor-not-allowed data-disabled:opacity-50",
-          nt[s],
-          at[d],
+          jt[i],
+          Lt[l],
           e
         ),
-        ...y,
+        ...p,
         children: [
-          i,
+          c,
           t,
           r
         ]
       }
     );
   }
-), f = "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gryt-accent-light", H = "rounded-(--gryt-radius-xl) border border-gryt-border bg-gryt-surface text-gryt-text", I = [
+), y = "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gryt-accent-light", $ = "rounded-(--gryt-radius-xl) border border-gryt-border bg-gryt-surface text-gryt-text", C = [
   // scale and translate are named explicitly because Tailwind v4 sets them as
   // standalone CSS properties rather than folding them into `transform`, so
   // transitioning `transform` would leave the popup snapping into place.
   "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none",
   "data-starting-style:scale-[0.98] data-starting-style:opacity-0",
   "data-ending-style:scale-[0.98] data-ending-style:opacity-0"
-].join(" "), T = "data-disabled:cursor-not-allowed data-disabled:opacity-50", st = {
+].join(" "), j = "data-disabled:cursor-not-allowed data-disabled:opacity-50", Bt = {
   primary: "data-checked:bg-gryt-accent data-checked:text-gryt-on-accent",
   secondary: "data-checked:bg-gryt-secondary data-checked:text-gryt-on-secondary",
   neutral: "data-checked:bg-gryt-surface-hover data-checked:text-gryt-text",
   danger: "data-checked:bg-gryt-danger data-checked:text-gryt-on-danger",
   success: "data-checked:bg-gryt-success data-checked:text-gryt-on-accent",
   warning: "data-checked:bg-gryt-warning data-checked:text-gryt-on-accent"
-}, G = {
+}, ct = {
   primary: "bg-gryt-accent",
   secondary: "bg-gryt-secondary",
   neutral: "bg-gryt-surface-hover",
   danger: "bg-gryt-danger",
   success: "bg-gryt-success",
   warning: "bg-gryt-warning"
-}, ct = {
+}, zt = {
   primary: "data-checked:border-gryt-accent",
   secondary: "data-checked:border-gryt-secondary",
   neutral: "data-checked:border-gryt-muted",
   danger: "data-checked:border-gryt-danger",
   success: "data-checked:border-gryt-success",
   warning: "data-checked:border-gryt-warning"
-}, it = {
+}, Ft = {
   primary: "data-checked:bg-gryt-accent",
   secondary: "data-checked:bg-gryt-secondary",
   neutral: "data-checked:bg-gryt-surface-hover",
   danger: "data-checked:bg-gryt-danger",
   success: "data-checked:bg-gryt-success",
   warning: "data-checked:bg-gryt-warning"
-}, dt = {
+}, Vt = {
   primary: "text-gryt-accent hover:not-data-disabled:bg-gryt-accent/10",
   secondary: "text-gryt-secondary hover:not-data-disabled:bg-gryt-secondary/10",
   neutral: "text-gryt-muted hover:not-data-disabled:bg-white/8 hover:not-data-disabled:text-gryt-text",
   danger: "text-gryt-danger hover:not-data-disabled:bg-gryt-danger/10",
   ghost: "text-gryt-muted hover:not-data-disabled:bg-white/8 hover:not-data-disabled:text-gryt-text"
-}, lt = {
+}, Et = {
   xsmall: "h-8 w-8",
   small: "h-9 w-9",
   medium: "h-10 w-10",
   large: "h-12 w-12"
-}, ce = c(
-  function({ className: t, size: e = "medium", tone: r = "neutral", ...s }, i) {
-    return /* @__PURE__ */ a(
-      M,
+}, ro = s(
+  function({ className: t, size: e = "medium", tone: r = "neutral", ...i }, c) {
+    return /* @__PURE__ */ o(
+      at,
       {
-        ref: i,
-        className: o(
+        ref: c,
+        className: n(
           "gryt-icon-button",
           "inline-flex shrink-0 items-center justify-center border-0 bg-transparent p-0",
           "rounded-(--gryt-radius-full) select-none",
@@ -225,23 +246,23 @@ const at = {
           "transition-[scale,background-color,color] duration-(--gryt-dur-spring) ease-spring",
           "motion-safe:hover:not-data-disabled:scale-[1.06]",
           "motion-safe:active:not-data-disabled:scale-[0.94]",
-          f,
-          T,
-          lt[e],
-          dt[r],
+          y,
+          j,
+          Et[e],
+          Vt[r],
           t
         ),
-        ...s
+        ...i
       }
     );
   }
-), ie = c(
-  function({ className: t, elevated: e = !1, ...r }, s) {
-    return /* @__PURE__ */ a(
+), oo = s(
+  function({ className: t, elevated: e = !1, ...r }, i) {
+    return /* @__PURE__ */ o(
       "div",
       {
-        ref: s,
-        className: o(
+        ref: i,
+        className: n(
           "gryt-surface rounded-(--gryt-radius-lg) border border-gryt-border p-4 text-gryt-text",
           e ? "bg-gryt-surface-raised" : "bg-gryt-surface",
           t
@@ -250,276 +271,276 @@ const at = {
       }
     );
   }
-), de = c(
-  function({ children: t, className: e, from: r = "assistant", ...s }, i) {
-    return /* @__PURE__ */ a(
+), ao = s(
+  function({ children: t, className: e, from: r = "assistant", ...i }, c) {
+    return /* @__PURE__ */ o(
       "div",
       {
-        ref: i,
-        className: o(
+        ref: c,
+        className: n(
           "gryt-message-bubble",
           r === "user" && "ml-auto bg-gryt-accent text-gryt-on-accent",
           r === "assistant" && "mr-auto border border-gryt-border bg-gryt-surface text-gryt-text",
           r === "system" && "mx-auto border border-dashed border-gryt-border bg-transparent text-gryt-muted",
           e
         ),
-        ...s,
+        ...i,
         children: t
       }
     );
   }
-), gt = {
+), Ht = {
   small: "min-h-9 px-3 py-1.5 text-sm",
   medium: "min-h-11 px-4 py-2.5 text-sm"
-}, le = c(
+}, no = s(
   function({
     className: t,
     error: e = !1,
     fieldClassName: r,
-    helperText: s,
-    label: i,
-    minRows: d = 3,
-    multiline: y = !1,
-    size: u = "medium",
-    ...p
-  }, w) {
-    const v = /* @__PURE__ */ a(
-      S.Control,
+    helperText: i,
+    label: c,
+    minRows: l = 3,
+    multiline: p = !1,
+    size: m = "medium",
+    ...N
+  }, A) {
+    const G = /* @__PURE__ */ o(
+      E.Control,
       {
-        ref: w,
-        render: y ? /* @__PURE__ */ a("textarea", { rows: d }) : void 0,
-        className: o(
+        ref: A,
+        render: p ? /* @__PURE__ */ o("textarea", { rows: l }) : void 0,
+        className: n(
           "gryt-text-field-control w-full rounded-(--gryt-radius-xl) border bg-gryt-surface-raised",
           "text-gryt-text outline-none placeholder:text-gryt-muted",
           "transition-colors duration-150",
           "hover:border-gryt-accent-light focus:border-gryt-accent",
           "disabled:cursor-not-allowed disabled:opacity-60",
-          y && "resize-y leading-6",
+          p && "resize-y leading-6",
           e ? "border-gryt-danger" : "border-gryt-border",
-          gt[u],
+          Ht[m],
           t
         ),
-        ...p
+        ...N
       }
     );
-    return /* @__PURE__ */ g(
-      S.Root,
+    return /* @__PURE__ */ d(
+      E.Root,
       {
-        className: o(
+        className: n(
           "gryt-text-field flex w-full flex-col gap-1.5",
           r
         ),
         children: [
-          i ? /* @__PURE__ */ a(S.Label, { className: "text-xs font-medium text-gryt-muted", children: i }) : null,
-          v,
-          s ? /* @__PURE__ */ a(
-            S.Description,
+          c ? /* @__PURE__ */ o(E.Label, { className: "text-xs font-medium text-gryt-muted", children: c }) : null,
+          G,
+          i ? /* @__PURE__ */ o(
+            E.Description,
             {
-              className: o(
+              className: n(
                 "text-xs",
                 e ? "text-gryt-danger" : "text-gryt-muted"
               ),
-              children: s
+              children: i
             }
           ) : null
         ]
       }
     );
   }
-), ge = c(
+), so = s(
   function({
     className: t,
     disabled: e = !1,
     maxRows: r = 8,
-    minRows: s = 1,
-    onSubmit: i,
-    placeholder: d = "Message Gryt",
-    submitLabel: y = "Send",
-    ...u
-  }, p) {
-    const w = V(null), v = E(() => {
-      const m = w.current;
-      if (!m)
+    minRows: i = 1,
+    onSubmit: c,
+    placeholder: l = "Message Gryt",
+    submitLabel: p = "Send",
+    ...m
+  }, N) {
+    const A = yt(null), G = Q(() => {
+      const b = A.current;
+      if (!b)
         return;
-      const R = window.getComputedStyle(m), D = parseFloat(R.lineHeight) || 24, B = parseFloat(R.paddingTop) + parseFloat(R.paddingBottom);
-      m.style.height = "auto", m.style.height = `${Math.min(
-        Math.max(m.scrollHeight, D * s + B),
-        D * r + B
+      const O = window.getComputedStyle(b), J = parseFloat(O.lineHeight) || 24, K = parseFloat(O.paddingTop) + parseFloat(O.paddingBottom);
+      b.style.height = "auto", b.style.height = `${Math.min(
+        Math.max(b.scrollHeight, J * i + K),
+        J * r + K
       )}px`;
-    }, [r, s]);
-    W(v, [v, u.value]);
-    function U(m) {
-      if (!i) {
-        m.preventDefault();
+    }, [r, i]);
+    mt(G, [G, m.value]);
+    function ut(b) {
+      if (!c) {
+        b.preventDefault();
         return;
       }
-      i(m);
+      c(b);
     }
-    return /* @__PURE__ */ g("form", { className: o("gryt-composer", t), onSubmit: U, children: [
-      /* @__PURE__ */ a(
+    return /* @__PURE__ */ d("form", { className: n("gryt-composer", t), onSubmit: ut, children: [
+      /* @__PURE__ */ o(
         "textarea",
         {
-          ref: (m) => {
-            w.current = m, typeof p == "function" ? p(m) : p && (p.current = m);
+          ref: (b) => {
+            A.current = b, typeof N == "function" ? N(b) : N && (N.current = b);
           },
-          rows: s,
+          rows: i,
           disabled: e,
-          placeholder: d,
-          onInput: v,
+          placeholder: l,
+          onInput: G,
           className: "gryt-composer-textarea disabled:cursor-not-allowed disabled:opacity-60",
-          ...u
+          ...m
         }
       ),
-      /* @__PURE__ */ a(
-        ot,
+      /* @__PURE__ */ o(
+        Gt,
         {
           type: "submit",
           disabled: e,
           size: "small",
-          endIcon: /* @__PURE__ */ a(J, { size: 14, weight: "fill" }),
-          children: y
+          endIcon: /* @__PURE__ */ o(ht, { size: 14, weight: "fill" }),
+          children: p
         }
       )
     ] });
   }
-), ut = {
+), Ot = {
   small: "h-8 w-8 text-xs",
   medium: "h-10 w-10 text-sm",
   large: "h-12 w-12 text-base"
-}, yt = c(function({ alt: t, children: e, className: r, fallback: s, size: i = "medium", src: d, ...y }, u) {
-  return /* @__PURE__ */ g(
-    $.Root,
+}, Xt = s(function({ alt: t, children: e, className: r, fallback: i, size: c = "medium", src: l, ...p }, m) {
+  return /* @__PURE__ */ d(
+    X.Root,
     {
-      ref: u,
-      className: o(
+      ref: m,
+      className: n(
         "gryt-avatar inline-flex shrink-0 items-center justify-center overflow-hidden align-middle select-none",
         "rounded-(--gryt-radius-full) bg-gryt-surface-raised font-medium text-gryt-text ring-1 ring-gryt-border",
-        ut[i],
+        Ot[c],
         r
       ),
-      ...y,
+      ...p,
       children: [
-        d ? /* @__PURE__ */ a(
-          $.Image,
+        l ? /* @__PURE__ */ o(
+          X.Image,
           {
-            src: d,
+            src: l,
             alt: t,
             className: "h-full w-full object-cover"
           }
         ) : null,
-        /* @__PURE__ */ a($.Fallback, { className: "flex h-full w-full items-center justify-center", children: s ?? e })
+        /* @__PURE__ */ o(X.Fallback, { className: "flex h-full w-full items-center justify-center", children: i ?? e })
       ]
     }
   );
-}), ue = c(function({ active: t = !1, avatar: e, className: r, subtitle: s, title: i, ...d }, y) {
-  return /* @__PURE__ */ g(
+}), io = s(function({ active: t = !1, avatar: e, className: r, subtitle: i, title: c, ...l }, p) {
+  return /* @__PURE__ */ d(
     "button",
     {
-      ref: y,
+      ref: p,
       type: "button",
-      className: o(
+      className: n(
         "gryt-conversation-item",
         t ? "bg-gryt-accent text-gryt-on-accent" : "text-gryt-text hover:bg-white/5",
         r
       ),
-      ...d,
+      ...l,
       children: [
-        e ?? /* @__PURE__ */ a(
-          yt,
+        e ?? /* @__PURE__ */ o(
+          Xt,
           {
             size: "small",
-            className: o(
+            className: n(
               t ? "bg-gryt-on-accent text-gryt-accent ring-transparent" : "bg-gryt-surface-raised text-gryt-text"
             ),
-            children: i.slice(0, 1).toUpperCase()
+            children: c.slice(0, 1).toUpperCase()
           }
         ),
-        /* @__PURE__ */ g("span", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ a("span", { className: "block truncate text-sm font-semibold", children: i }),
-          s ? /* @__PURE__ */ a(
+        /* @__PURE__ */ d("span", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ o("span", { className: "block truncate text-sm font-semibold", children: c }),
+          i ? /* @__PURE__ */ o(
             "span",
             {
-              className: o(
+              className: n(
                 "block truncate text-xs",
                 t ? "text-gryt-on-accent/70" : "text-gryt-muted"
               ),
-              children: s
+              children: i
             }
           ) : null
         ] })
       ]
     }
   );
-}), ye = c(function({ badgeContent: t, children: e, className: r, max: s = 99, showZero: i = !1, ...d }, y) {
-  const u = typeof t == "number" ? t : null, p = u !== null && u === 0 && !i, w = u !== null && u > s ? `${s}+` : t;
-  return /* @__PURE__ */ g(
+}), co = s(function({ badgeContent: t, children: e, className: r, max: i = 99, showZero: c = !1, ...l }, p) {
+  const m = typeof t == "number" ? t : null, N = m !== null && m === 0 && !c, A = m !== null && m > i ? `${i}+` : t;
+  return /* @__PURE__ */ d(
     "span",
     {
-      ref: y,
-      className: o("gryt-badge relative inline-flex", r),
-      ...d,
+      ref: p,
+      className: n("gryt-badge relative inline-flex", r),
+      ...l,
       children: [
         e,
-        t !== void 0 && !p ? /* @__PURE__ */ a(
+        t !== void 0 && !N ? /* @__PURE__ */ o(
           "span",
           {
-            className: o(
+            className: n(
               "gryt-badge-dot absolute -top-1 -right-1 z-10 inline-flex items-center justify-center",
               "min-w-5 rounded-(--gryt-radius-full) px-1.5 py-0.5",
               "bg-gryt-accent text-[0.65rem] leading-none font-semibold text-gryt-on-accent",
               "ring-2 ring-gryt-bg"
             ),
-            children: w
+            children: A
           }
         ) : null
       ]
     }
   );
-}), mt = {
+}), Yt = {
   neutral: "border-gryt-border bg-gryt-surface-raised text-gryt-text",
   primary: "border-gryt-accent/40 bg-gryt-accent/12 text-gryt-accent",
   secondary: "border-gryt-secondary/40 bg-gryt-secondary/12 text-gryt-secondary",
   success: "border-gryt-success/40 bg-gryt-success/12 text-gryt-success",
   warning: "border-gryt-warning/40 bg-gryt-warning/12 text-gryt-warning",
   danger: "border-gryt-danger/40 bg-gryt-danger/12 text-gryt-danger"
-}, me = c(function({ children: t, className: e, icon: r, label: s, onDelete: i, tone: d = "neutral", ...y }, u) {
-  return /* @__PURE__ */ g(
+}, lo = s(function({ children: t, className: e, icon: r, label: i, onDelete: c, tone: l = "neutral", ...p }, m) {
+  return /* @__PURE__ */ d(
     "span",
     {
-      ref: u,
-      className: o(
+      ref: m,
+      className: n(
         "gryt-chip inline-flex items-center gap-1.5 rounded-(--gryt-radius-full) border px-3 py-1 text-xs font-medium",
-        mt[d],
+        Yt[l],
         e
       ),
-      ...y,
+      ...p,
       children: [
         r,
-        s ?? t,
-        i ? /* @__PURE__ */ a(
+        i ?? t,
+        c ? /* @__PURE__ */ o(
           "button",
           {
             type: "button",
             "aria-label": "Remove",
-            onClick: i,
-            className: o(
+            onClick: c,
+            className: n(
               "-mr-1 inline-flex h-4 w-4 items-center justify-center rounded-(--gryt-radius-full)",
               "opacity-70 transition-opacity hover:opacity-100",
-              f
+              y
             ),
-            children: /* @__PURE__ */ a(K, { size: 10, weight: "bold", "aria-hidden": "true" })
+            children: /* @__PURE__ */ o(nt, { size: 10, weight: "bold", "aria-hidden": "true" })
           }
         ) : null
       ]
     }
   );
-}), be = c(
-  function({ className: t, tone: e = "primary", ...r }, s) {
-    return /* @__PURE__ */ a(
-      z.Root,
+}), go = s(
+  function({ className: t, tone: e = "primary", ...r }, i) {
+    return /* @__PURE__ */ o(
+      Z.Root,
       {
-        ref: s,
-        className: o(
+        ref: i,
+        className: n(
           "gryt-checkbox flex h-5 w-5 shrink-0 items-center justify-center",
           "rounded-(--gryt-radius-sm) border border-gryt-border bg-gryt-surface-raised",
           "transition-[scale,background-color,border-color] duration-(--gryt-dur-spring) ease-spring",
@@ -529,18 +550,18 @@ const at = {
           "hover:not-data-disabled:border-gryt-accent-light",
           "motion-safe:hover:not-data-disabled:scale-[1.08]",
           "motion-safe:active:not-data-disabled:scale-[0.92]",
-          f,
-          T,
+          y,
+          j,
           // Unchecked stays a neutral outline; the tone only paints once checked.
-          st[e],
+          Bt[e],
           t
         ),
         ...r,
-        children: /* @__PURE__ */ a(
-          z.Indicator,
+        children: /* @__PURE__ */ o(
+          Z.Indicator,
           {
             keepMounted: !0,
-            className: o(
+            className: n(
               "flex origin-center",
               "transition-[scale,opacity] duration-(--gryt-dur-spring) ease-spring",
               // Scaling from 0 rather than from something near 1 is deliberate.
@@ -550,65 +571,65 @@ const at = {
               "data-unchecked:scale-0 data-unchecked:opacity-0",
               "motion-reduce:transition-none"
             ),
-            children: /* @__PURE__ */ a(F, { size: 12, weight: "bold" })
+            children: /* @__PURE__ */ o(st, { size: 12, weight: "bold" })
           }
         )
       }
     );
   }
-), fe = c(function({ className: t, tone: e = "primary", ...r }, s) {
-  return /* @__PURE__ */ a(
-    j.Root,
+), uo = s(function({ className: t, tone: e = "primary", ...r }, i) {
+  return /* @__PURE__ */ o(
+    q.Root,
     {
-      ref: s,
-      className: o(
+      ref: i,
+      className: n(
         "gryt-radio flex h-5 w-5 shrink-0 items-center justify-center",
         "rounded-(--gryt-radius-full) border border-gryt-border bg-gryt-surface-raised",
         "transition-[scale,background-color,border-color] duration-(--gryt-dur-spring) ease-spring",
         "hover:not-data-disabled:border-gryt-accent-light",
         "motion-safe:hover:not-data-disabled:scale-[1.08]",
         "motion-safe:active:not-data-disabled:scale-[0.92]",
-        f,
-        T,
+        y,
+        j,
         // Border takes the tone when selected; the dot inside carries the fill.
-        ct[e],
+        zt[e],
         t
       ),
       ...r,
-      children: /* @__PURE__ */ a(
-        j.Indicator,
+      children: /* @__PURE__ */ o(
+        q.Indicator,
         {
           keepMounted: !0,
-          className: o(
+          className: n(
             "h-2.5 w-2.5 origin-center rounded-(--gryt-radius-full)",
             "transition-[scale,opacity] duration-(--gryt-dur-spring) ease-spring",
             // From 0, for the same reason as the Checkbox tick — see the note there.
             "data-unchecked:scale-0 data-unchecked:opacity-0",
             "motion-reduce:transition-none",
-            G[e]
+            ct[e]
           )
         }
       )
     }
   );
-}), pe = c(
+}), yo = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      _,
+    return /* @__PURE__ */ o(
+      Tt,
       {
         ref: r,
-        className: o("gryt-radio-group flex flex-col gap-2", t),
+        className: n("gryt-radio-group flex flex-col gap-2", t),
         ...e
       }
     );
   }
-), he = c(
-  function({ className: t, tone: e = "primary", ...r }, s) {
-    return /* @__PURE__ */ a(
-      A.Root,
+), mo = s(
+  function({ className: t, tone: e = "primary", ...r }, i) {
+    return /* @__PURE__ */ o(
+      tt.Root,
       {
-        ref: s,
-        className: o(
+        ref: i,
+        className: n(
           "gryt-switch relative inline-flex h-6 w-10 shrink-0 items-center",
           "rounded-(--gryt-radius-full) border border-gryt-border bg-gryt-surface-raised p-0.5",
           "transition-[scale,background-color,border-color] duration-(--gryt-dur-spring) ease-spring",
@@ -616,16 +637,16 @@ const at = {
           "hover:not-data-disabled:border-gryt-accent-light",
           "motion-safe:hover:not-data-disabled:scale-[1.05]",
           "motion-safe:active:not-data-disabled:scale-[0.95]",
-          f,
-          T,
-          it[e],
+          y,
+          j,
+          Ft[e],
           t
         ),
         ...r,
-        children: /* @__PURE__ */ a(
-          A.Thumb,
+        children: /* @__PURE__ */ o(
+          tt.Thumb,
           {
-            className: o(
+            className: n(
               "h-4.5 w-4.5 rounded-(--gryt-radius-full) bg-gryt-text",
               "transition-transform duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none",
               "data-checked:translate-x-4 data-checked:bg-gryt-bg"
@@ -636,36 +657,36 @@ const at = {
     );
   }
 );
-function xe({
-  className: n,
+function po({
+  className: a,
   tone: t = "primary",
   "aria-label": e,
   ...r
 }) {
-  return /* @__PURE__ */ a(
-    k.Root,
+  return /* @__PURE__ */ o(
+    B.Root,
     {
-      className: o("gryt-slider w-full", n),
+      className: n("gryt-slider w-full", a),
       ...r,
-      children: /* @__PURE__ */ a(k.Control, { className: "flex w-full touch-none items-center py-2 select-none", children: /* @__PURE__ */ g(k.Track, { className: "h-1.5 w-full rounded-(--gryt-radius-full) bg-gryt-surface-raised select-none", children: [
-        /* @__PURE__ */ a(
-          k.Indicator,
+      children: /* @__PURE__ */ o(B.Control, { className: "flex w-full touch-none items-center py-2 select-none", children: /* @__PURE__ */ d(B.Track, { className: "h-1.5 w-full rounded-(--gryt-radius-full) bg-gryt-surface-raised select-none", children: [
+        /* @__PURE__ */ o(
+          B.Indicator,
           {
-            className: o(
+            className: n(
               "h-full rounded-(--gryt-radius-full) select-none",
-              G[t]
+              ct[t]
             )
           }
         ),
-        /* @__PURE__ */ a(
-          k.Thumb,
+        /* @__PURE__ */ o(
+          B.Thumb,
           {
             "aria-label": e,
-            className: o(
+            className: n(
               "h-4 w-4 rounded-(--gryt-radius-full) bg-gryt-text select-none",
               "transition-transform duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none",
               "motion-safe:hover:scale-[1.12] motion-safe:active:scale-[0.94]",
-              f
+              y
             )
           }
         )
@@ -673,97 +694,97 @@ function xe({
     }
   );
 }
-const bt = {
+const Ut = {
   small: "min-h-9 px-3 text-sm",
   medium: "min-h-11 px-4 text-sm"
 };
-function we({
-  className: n,
+function bo({
+  className: a,
   label: t,
   options: e = [],
   placeholder: r = "Select",
-  size: s = "medium",
-  ...i
+  size: i = "medium",
+  ...c
 }) {
-  return /* @__PURE__ */ g(b.Root, { items: e, ...i, children: [
-    /* @__PURE__ */ g("div", { className: o("gryt-select flex w-full flex-col gap-1.5", n), children: [
-      t ? /* @__PURE__ */ a(b.Label, { className: "text-xs font-medium text-gryt-muted", children: t }) : null,
-      /* @__PURE__ */ g(
-        b.Trigger,
+  return /* @__PURE__ */ d(f.Root, { items: e, ...c, children: [
+    /* @__PURE__ */ d("div", { className: n("gryt-select flex w-full flex-col gap-1.5", a), children: [
+      t ? /* @__PURE__ */ o(f.Label, { className: "text-xs font-medium text-gryt-muted", children: t }) : null,
+      /* @__PURE__ */ d(
+        f.Trigger,
         {
-          className: o(
+          className: n(
             "flex w-full items-center justify-between gap-2",
             "rounded-(--gryt-radius-xl) border border-gryt-border bg-gryt-surface-raised",
             "text-gryt-text select-none",
             "transition-colors duration-150 hover:border-gryt-accent-light",
             "data-disabled:cursor-not-allowed data-disabled:opacity-60",
-            f,
-            bt[s]
+            y,
+            Ut[i]
           ),
           children: [
-            /* @__PURE__ */ a(b.Value, { placeholder: r }),
-            /* @__PURE__ */ a(b.Icon, { className: "shrink-0 text-gryt-muted", children: /* @__PURE__ */ a(Q, { size: 16 }) })
+            /* @__PURE__ */ o(f.Value, { placeholder: r }),
+            /* @__PURE__ */ o(f.Icon, { className: "shrink-0 text-gryt-muted", children: /* @__PURE__ */ o(wt, { size: 16 }) })
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ a(b.Portal, { children: /* @__PURE__ */ a(b.Positioner, { sideOffset: 6, className: "outline-none", children: /* @__PURE__ */ a(
-      b.Popup,
+    /* @__PURE__ */ o(f.Portal, { children: /* @__PURE__ */ o(f.Positioner, { sideOffset: 6, className: "outline-none", children: /* @__PURE__ */ o(
+      f.Popup,
       {
-        className: o("min-w-(--anchor-width) p-1", H, I),
-        children: /* @__PURE__ */ a(b.List, { children: e.map((d) => /* @__PURE__ */ g(
-          b.Item,
+        className: n("min-w-(--anchor-width) p-1", $, C),
+        children: /* @__PURE__ */ o(f.List, { children: e.map((l) => /* @__PURE__ */ d(
+          f.Item,
           {
-            value: d.value,
-            disabled: d.disabled,
-            className: o(
+            value: l.value,
+            disabled: l.disabled,
+            className: n(
               "flex cursor-default items-center justify-between gap-2",
               "rounded-(--gryt-radius-md) px-3 py-2 text-sm text-gryt-text",
               "outline-none select-none data-highlighted:bg-gryt-surface-raised",
               "data-disabled:cursor-not-allowed data-disabled:opacity-50"
             ),
             children: [
-              /* @__PURE__ */ a(b.ItemText, { children: d.label }),
-              /* @__PURE__ */ a(b.ItemIndicator, { className: "text-gryt-accent", children: /* @__PURE__ */ a(F, { size: 14, weight: "bold" }) })
+              /* @__PURE__ */ o(f.ItemText, { children: l.label }),
+              /* @__PURE__ */ o(f.ItemIndicator, { className: "text-gryt-accent", children: /* @__PURE__ */ o(st, { size: 14, weight: "bold" }) })
             ]
           },
-          String(d.value)
+          String(l.value)
         )) })
       }
     ) }) })
   ] });
 }
-function ve({
-  children: n,
+function fo({
+  children: a,
   className: t,
   side: e = "top",
   sideOffset: r = 8,
-  title: s
+  title: i
 }) {
-  return /* @__PURE__ */ g(h.Root, { children: [
-    /* @__PURE__ */ a(h.Trigger, { render: n }),
-    /* @__PURE__ */ a(h.Portal, { children: /* @__PURE__ */ a(h.Positioner, { side: e, sideOffset: r, children: /* @__PURE__ */ a(
-      h.Popup,
+  return /* @__PURE__ */ d(R.Root, { children: [
+    /* @__PURE__ */ o(R.Trigger, { render: a }),
+    /* @__PURE__ */ o(R.Portal, { children: /* @__PURE__ */ o(R.Positioner, { side: e, sideOffset: r, children: /* @__PURE__ */ o(
+      R.Popup,
       {
-        className: o(
+        className: n(
           "gryt-tooltip rounded-(--gryt-radius-md) border border-gryt-border bg-gryt-surface-raised",
           "px-2.5 py-1.5 text-xs text-gryt-text",
-          I,
+          C,
           t
         ),
-        children: s
+        children: i
       }
     ) }) })
   ] });
 }
-const ke = h.Provider, Ne = c(
-  function({ className: t, orientation: e = "horizontal", ...r }, s) {
-    return /* @__PURE__ */ a(
-      tt,
+const xo = R.Provider, ho = s(
+  function({ className: t, orientation: e = "horizontal", ...r }, i) {
+    return /* @__PURE__ */ o(
+      $t,
       {
-        ref: s,
+        ref: i,
         orientation: e,
-        className: o(
+        className: n(
           "gryt-divider bg-gryt-border",
           e === "vertical" ? "h-full w-px" : "h-px w-full",
           t
@@ -772,12 +793,12 @@ const ke = h.Provider, Ne = c(
       }
     );
   }
-), Pe = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
+), wo = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
     "div",
     {
       ref: r,
-      className: o(
+      className: n(
         "gryt-card rounded-(--gryt-radius-xl) border border-gryt-border bg-gryt-surface text-gryt-text",
         t
       ),
@@ -785,149 +806,149 @@ const ke = h.Provider, Ne = c(
     }
   );
 });
-function Se({
-  children: n,
+function vo({
+  children: a,
   className: t,
   subheader: e,
   title: r,
-  ...s
+  ...i
 }) {
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ d(
     "div",
     {
-      className: o("gryt-card-header flex flex-col gap-1 p-4", t),
-      ...s,
+      className: n("gryt-card-header flex flex-col gap-1 p-4", t),
+      ...i,
       children: [
-        r ? /* @__PURE__ */ a("span", { className: "text-base font-semibold text-gryt-text", children: r }) : null,
-        e ? /* @__PURE__ */ a("span", { className: "text-sm text-gryt-muted", children: e }) : null,
-        n
+        r ? /* @__PURE__ */ o("span", { className: "text-base font-semibold text-gryt-text", children: r }) : null,
+        e ? /* @__PURE__ */ o("span", { className: "text-sm text-gryt-muted", children: e }) : null,
+        a
       ]
     }
   );
 }
-function Te({
-  className: n,
+function No({
+  className: a,
   ...t
 }) {
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: o(
+      className: n(
         "gryt-card-content px-4 pb-4 text-sm text-gryt-muted",
-        n
+        a
       ),
       ...t
     }
   );
 }
-function Re({
-  className: n,
+function Po({
+  className: a,
   ...t
 }) {
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(
     "div",
     {
-      className: o(
+      className: n(
         "gryt-card-actions flex items-center gap-2 px-4 pb-4",
-        n
+        a
       ),
       ...t
     }
   );
 }
-const ft = {
+const Qt = {
   info: "border-gryt-secondary/40 bg-gryt-secondary/10 text-gryt-secondary",
   success: "border-gryt-success/40 bg-gryt-success/10 text-gryt-success",
   warning: "border-gryt-warning/40 bg-gryt-warning/10 text-gryt-warning",
   error: "border-gryt-danger/40 bg-gryt-danger/10 text-gryt-danger"
-}, $e = c(function({ className: t, severity: e = "info", ...r }, s) {
-  return /* @__PURE__ */ a(
+}, ko = s(function({ className: t, severity: e = "info", ...r }, i) {
+  return /* @__PURE__ */ o(
     "div",
     {
-      ref: s,
+      ref: i,
       role: "alert",
-      className: o(
+      className: n(
         "gryt-alert rounded-(--gryt-radius-lg) border px-4 py-3 text-sm",
-        ft[e],
+        Qt[e],
         t
       ),
       ...r
     }
   );
 });
-function Ce({ className: n, value: t = null, ...e }) {
-  return /* @__PURE__ */ a(
-    C.Root,
+function To({ className: a, value: t = null, ...e }) {
+  return /* @__PURE__ */ o(
+    Y.Root,
     {
       value: t,
-      className: o("gryt-progress w-full", n),
+      className: n("gryt-progress w-full", a),
       ...e,
-      children: /* @__PURE__ */ a(C.Track, { className: "h-1.5 w-full overflow-hidden rounded-(--gryt-radius-full) bg-gryt-surface-raised", children: /* @__PURE__ */ a(C.Indicator, { className: "h-full rounded-(--gryt-radius-full) bg-gryt-accent transition-[width] duration-(--gryt-dur-spring-soft) ease-spring motion-reduce:transition-none" }) })
+      children: /* @__PURE__ */ o(Y.Track, { className: "h-1.5 w-full overflow-hidden rounded-(--gryt-radius-full) bg-gryt-surface-raised", children: /* @__PURE__ */ o(Y.Indicator, { className: "h-full rounded-(--gryt-radius-full) bg-gryt-accent transition-[width] duration-(--gryt-dur-spring-soft) ease-spring motion-reduce:transition-none" }) })
     }
   );
 }
-function Ie({
-  className: n,
+function $o({
+  className: a,
   size: t = 24,
   "aria-label": e = "Loading"
 }) {
-  return /* @__PURE__ */ a(
-    Y,
+  return /* @__PURE__ */ o(
+    vt,
     {
       role: "status",
       "aria-label": e,
       size: t,
       weight: "bold",
-      className: o(
+      className: n(
         "gryt-spinner text-gryt-accent motion-safe:animate-spin",
-        n
+        a
       )
     }
   );
 }
-const pt = {
+const Wt = {
   text: "h-4 rounded-(--gryt-radius-sm)",
   rounded: "rounded-(--gryt-radius-lg)",
   circular: "rounded-(--gryt-radius-full)",
   rectangular: "rounded-none"
 };
-function De({
-  className: n,
+function Co({
+  className: a,
   height: t,
   style: e,
   variant: r = "text",
-  width: s,
-  ...i
+  width: i,
+  ...c
 }) {
-  const d = {
-    width: s,
+  const l = {
+    width: i,
     height: t,
     ...e
   };
-  return /* @__PURE__ */ a(
+  return /* @__PURE__ */ o(
     "div",
     {
       "aria-hidden": "true",
-      className: o(
+      className: n(
         "gryt-skeleton bg-gryt-surface-raised motion-safe:animate-pulse",
-        pt[r],
-        n
+        Wt[r],
+        a
       ),
-      style: d,
-      ...i
+      style: l,
+      ...c
     }
   );
 }
-const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none", ht = c(
+const lt = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none", _t = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      l.Backdrop,
+    return /* @__PURE__ */ o(
+      k.Backdrop,
       {
         ref: r,
-        className: o(
+        className: n(
           "gryt-dialog-backdrop fixed inset-0 min-h-dvh bg-black/60",
           "backdrop-blur-(--gryt-backdrop-blur)",
-          O,
+          lt,
           "data-starting-style:opacity-0 data-ending-style:opacity-0",
           t
         ),
@@ -935,17 +956,17 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     );
   }
-), xt = c(
+), Jt = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      l.Popup,
+    return /* @__PURE__ */ o(
+      k.Popup,
       {
         ref: r,
-        className: o(
+        className: n(
           "gryt-dialog fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2",
           "flex w-96 max-w-[calc(100vw-3rem)] flex-col gap-4",
           "rounded-(--gryt-radius-lg) border border-gryt-border bg-gryt-surface p-5 text-gryt-text",
-          O,
+          lt,
           "data-starting-style:scale-[0.98] data-starting-style:opacity-0",
           "data-ending-style:scale-[0.98] data-ending-style:opacity-0",
           t
@@ -954,13 +975,13 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     );
   }
-), wt = c(
+), Kt = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      l.Title,
+    return /* @__PURE__ */ o(
+      k.Title,
       {
         ref: r,
-        className: o(
+        className: n(
           "gryt-dialog-title text-base font-semibold text-gryt-text",
           t
         ),
@@ -968,13 +989,13 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     );
   }
-), vt = c(
+), Zt = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      l.Description,
+    return /* @__PURE__ */ o(
+      k.Description,
       {
         ref: r,
-        className: o(
+        className: n(
           "gryt-dialog-description text-sm text-gryt-muted",
           t
         ),
@@ -982,13 +1003,13 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     );
   }
-), kt = c(
+), qt = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
+    return /* @__PURE__ */ o(
       "div",
       {
         ref: r,
-        className: o(
+        className: n(
           "gryt-dialog-footer flex justify-end gap-3",
           t
         ),
@@ -996,91 +1017,202 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     );
   }
-), Be = {
-  Root: l.Root,
-  Trigger: l.Trigger,
-  Portal: l.Portal,
-  Close: l.Close,
-  Backdrop: ht,
-  Popup: xt,
-  Title: wt,
-  Description: vt,
-  Footer: kt
-}, Nt = {
-  left: "inset-y-0 -left-(--gryt-drawer-bleed) h-full w-[calc(20rem+var(--gryt-drawer-bleed))] max-w-[calc(85vw+var(--gryt-drawer-bleed))] border-r py-5 pr-5 pl-[calc(1.25rem+var(--gryt-drawer-bleed))] data-starting-style:-translate-x-full data-ending-style:-translate-x-full",
-  right: "inset-y-0 -right-(--gryt-drawer-bleed) h-full w-[calc(20rem+var(--gryt-drawer-bleed))] max-w-[calc(85vw+var(--gryt-drawer-bleed))] border-l py-5 pl-5 pr-[calc(1.25rem+var(--gryt-drawer-bleed))] data-starting-style:translate-x-full data-ending-style:translate-x-full",
-  top: "inset-x-0 -top-(--gryt-drawer-bleed) h-auto max-h-[calc(85vh+var(--gryt-drawer-bleed))] w-full border-b px-5 pb-5 pt-[calc(1.25rem+var(--gryt-drawer-bleed))] data-starting-style:-translate-y-full data-ending-style:-translate-y-full",
-  bottom: "inset-x-0 -bottom-(--gryt-drawer-bleed) h-auto max-h-[calc(85vh+var(--gryt-drawer-bleed))] w-full border-t px-5 pt-5 pb-[calc(1.25rem+var(--gryt-drawer-bleed))] data-starting-style:translate-y-full data-ending-style:translate-y-full"
-}, Pt = c(function({ className: t, side: e = "right", ...r }, s) {
-  return /* @__PURE__ */ a(
-    l.Popup,
+), So = {
+  Root: k.Root,
+  Trigger: k.Trigger,
+  Portal: k.Portal,
+  Close: k.Close,
+  Backdrop: _t,
+  Popup: Jt,
+  Title: Kt,
+  Description: Zt,
+  Footer: qt
+}, te = () => () => {
+};
+function ee(a) {
+  const t = Q(
+    (r) => {
+      if (typeof window > "u" || !window.matchMedia) return te();
+      const i = window.matchMedia(a);
+      return i.addEventListener("change", r), () => i.removeEventListener("change", r);
+    },
+    [a]
+  ), e = Q(() => typeof window > "u" || !window.matchMedia ? !1 : window.matchMedia(a).matches, [a]);
+  return pt(t, e, () => !1);
+}
+const re = {
+  left: "left",
+  right: "right",
+  top: "up",
+  bottom: "down"
+}, H = bt("right"), oe = {
+  left: "items-stretch justify-start",
+  right: "items-stretch justify-end",
+  top: "items-start justify-center",
+  bottom: "items-end justify-center"
+}, ae = {
+  left: "rounded-r-(--gryt-radius-xl)",
+  right: "rounded-l-(--gryt-radius-xl)",
+  top: "rounded-b-(--gryt-radius-xl)",
+  bottom: "rounded-t-(--gryt-radius-xl)"
+}, ne = {
+  left: [
+    "h-full w-[calc(20rem+var(--gryt-drawer-bleed))] max-w-[calc(85vw+var(--gryt-drawer-bleed))]",
+    "-ml-(--gryt-drawer-bleed) border-r py-5 pr-5 pl-[calc(1.25rem+var(--gryt-drawer-bleed))]",
+    "[transform:translateX(var(--drawer-swipe-movement-x))]",
+    "data-starting-style:[transform:translateX(calc(-100%+var(--gryt-drawer-bleed)))]",
+    "data-ending-style:[transform:translateX(calc(-100%+var(--gryt-drawer-bleed)))]"
+  ].join(" "),
+  right: [
+    "h-full w-[calc(20rem+var(--gryt-drawer-bleed))] max-w-[calc(85vw+var(--gryt-drawer-bleed))]",
+    "-mr-(--gryt-drawer-bleed) border-l py-5 pl-5 pr-[calc(1.25rem+var(--gryt-drawer-bleed))]",
+    "[transform:translateX(var(--drawer-swipe-movement-x))]",
+    "data-starting-style:[transform:translateX(calc(100%-var(--gryt-drawer-bleed)))]",
+    "data-ending-style:[transform:translateX(calc(100%-var(--gryt-drawer-bleed)))]"
+  ].join(" "),
+  top: [
+    "w-full max-h-[calc(85vh+var(--gryt-drawer-bleed))]",
+    "-mt-(--gryt-drawer-bleed) border-b px-5 pb-5 pt-[calc(1.25rem+var(--gryt-drawer-bleed))]",
+    "[transform:translateY(var(--drawer-swipe-movement-y))]",
+    "data-starting-style:[transform:translateY(calc(-100%+var(--gryt-drawer-bleed)))]",
+    "data-ending-style:[transform:translateY(calc(-100%+var(--gryt-drawer-bleed)))]"
+  ].join(" "),
+  bottom: [
+    "w-full max-h-[calc(85vh+var(--gryt-drawer-bleed))]",
+    "-mb-(--gryt-drawer-bleed) border-t px-5 pt-5 pb-[calc(1.25rem+var(--gryt-drawer-bleed))]",
+    "[transform:translateY(var(--drawer-swipe-movement-y))]",
+    "data-starting-style:[transform:translateY(calc(100%-var(--gryt-drawer-bleed)))]",
+    "data-ending-style:[transform:translateY(calc(100%-var(--gryt-drawer-bleed)))]"
+  ].join(" ")
+};
+function se({
+  side: a = "right",
+  sheetOnMobile: t = !0,
+  children: e,
+  ...r
+}) {
+  const i = ee("(max-width: 767px)"), c = t && i ? "bottom" : a;
+  return /* @__PURE__ */ o(H.Provider, { value: c, children: /* @__PURE__ */ o(h.Root, { swipeDirection: re[c], ...r, children: e }) });
+}
+const ie = s(
+  function({ className: t, ...e }, r) {
+    const i = W(H);
+    return /* @__PURE__ */ o(
+      h.Viewport,
+      {
+        ref: r,
+        className: n(
+          // z-50 matters: the popup is no longer positioned itself, so the
+          // viewport is what has to sit above the page. Without it a sticky
+          // site header renders over the panel.
+          "gryt-drawer-viewport fixed inset-0 z-50 flex",
+          oe[i],
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), ce = s(function({ className: t, ...e }, r) {
+  const i = W(H);
+  return /* @__PURE__ */ o(
+    h.Popup,
     {
-      ref: s,
-      className: o(
-        "gryt-drawer fixed z-50 flex flex-col gap-4 border-gryt-border bg-gryt-surface text-gryt-text",
-        "transition-transform duration-(--gryt-dur-spring-soft) ease-spring motion-reduce:transition-none",
-        Nt[e],
+      ref: r,
+      className: n(
+        "gryt-drawer flex flex-col gap-4 border-gryt-border bg-gryt-surface text-gryt-text",
+        "overflow-y-auto overscroll-contain outline-none",
+        "transition-transform duration-(--gryt-dur-spring-soft) ease-spring",
+        // While the finger is down the panel must track it exactly. Any
+        // duration here turns a drag into a drag plus lag.
+        "data-swiping:duration-0 data-swiping:select-none",
+        "motion-reduce:transition-none",
+        ne[i],
+        ae[i],
         t
       ),
-      ...r
+      ...e
     }
   );
-}), St = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    l.Backdrop,
+}), le = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    h.Backdrop,
     {
       ref: r,
-      className: o(
-        "gryt-drawer-backdrop fixed inset-0 min-h-dvh bg-black/60",
+      className: n(
+        "gryt-drawer-backdrop fixed inset-0 z-50 min-h-dvh bg-black/60",
         "backdrop-blur-(--gryt-backdrop-blur)",
-        "transition-opacity duration-(--gryt-dur-spring-soft) ease-spring motion-reduce:transition-none",
+        // Lightens as the panel is dragged away, so letting go halfway does not
+        // leave a full-strength scrim over a half-gone sheet.
+        "[opacity:calc(1-var(--drawer-swipe-progress,0))]",
+        "transition-opacity duration-(--gryt-dur-spring-soft) ease-spring",
+        "data-swiping:duration-0",
         "data-starting-style:opacity-0 data-ending-style:opacity-0",
+        "motion-reduce:transition-none",
         t
       ),
       ...e
     }
   );
-}), ze = {
-  Root: l.Root,
-  Trigger: l.Trigger,
-  Portal: l.Portal,
-  Close: l.Close,
-  Title: l.Title,
-  Description: l.Description,
-  Backdrop: St,
-  Popup: Pt
-}, Tt = c(
-  function({ className: t, sideOffset: e = 8, ...r }, s) {
-    return /* @__PURE__ */ a(
-      x.Positioner,
+});
+function de({ className: a }) {
+  const t = W(H);
+  return t !== "bottom" && t !== "top" ? null : /* @__PURE__ */ o(
+    "div",
+    {
+      "aria-hidden": !0,
+      className: n(
+        "gryt-drawer-grabber mx-auto h-1.5 w-10 shrink-0 rounded-(--gryt-radius-full) bg-gryt-border",
+        t === "top" && "order-last",
+        a
+      )
+    }
+  );
+}
+const Ro = {
+  Root: se,
+  Trigger: h.Trigger,
+  Portal: h.Portal,
+  Backdrop: le,
+  Viewport: ie,
+  Popup: ce,
+  Content: h.Content,
+  Grabber: de,
+  Close: h.Close,
+  Title: h.Title,
+  Description: h.Description
+}, ge = s(
+  function({ className: t, sideOffset: e = 8, ...r }, i) {
+    return /* @__PURE__ */ o(
+      I.Positioner,
       {
-        ref: s,
+        ref: i,
         sideOffset: e,
-        className: o("gryt-menu-positioner outline-none", t),
+        className: n("gryt-menu-positioner outline-none", t),
         ...r
       }
     );
   }
-), Rt = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    x.Popup,
+), ue = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    I.Popup,
     {
       ref: r,
-      className: o(
+      className: n(
         "gryt-menu min-w-44 p-1 outline-none",
-        H,
-        I,
+        $,
+        C,
         t
       ),
       ...e
     }
   );
-}), $t = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    x.Item,
+}), ye = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    I.Item,
     {
       ref: r,
-      className: o(
+      className: n(
         "gryt-menu-item flex cursor-default items-center gap-2 rounded-(--gryt-radius-md)",
         "px-3 py-2 text-sm text-gryt-text outline-none select-none",
         // Base UI drives keyboard and pointer highlight through the same
@@ -1092,50 +1224,50 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       ...e
     }
   );
-}), Ct = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    x.Separator,
+}), me = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    I.Separator,
     {
       ref: r,
-      className: o("gryt-menu-separator my-1 h-px bg-gryt-border", t),
+      className: n("gryt-menu-separator my-1 h-px bg-gryt-border", t),
       ...e
     }
   );
-}), je = {
-  Root: x.Root,
-  Trigger: x.Trigger,
-  Portal: x.Portal,
-  Positioner: Tt,
-  Popup: Rt,
-  Item: $t,
-  Separator: Ct
-}, It = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    P.Root,
+}), U = {
+  Root: I.Root,
+  Trigger: I.Trigger,
+  Portal: I.Portal,
+  Positioner: ge,
+  Popup: ue,
+  Item: ye,
+  Separator: me
+}, pe = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    V.Root,
     {
       ref: r,
-      className: o("gryt-tabs", t),
+      className: n("gryt-tabs", t),
       ...e
     }
   );
-}), Dt = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    P.List,
+}), be = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    V.List,
     {
       ref: r,
-      className: o(
+      className: n(
         "gryt-tabs-list relative inline-flex items-center gap-1 rounded-(--gryt-radius-full) bg-gryt-surface-raised p-1",
         t
       ),
       ...e
     }
   );
-}), Bt = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    P.Tab,
+}), fe = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    V.Tab,
     {
       ref: r,
-      className: o(
+      className: n(
         "gryt-tab inline-flex min-h-8 items-center justify-center whitespace-nowrap",
         "rounded-(--gryt-radius-full) border-0 bg-transparent px-4 py-1.5",
         "text-sm font-medium text-gryt-muted select-none",
@@ -1144,20 +1276,20 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
         // The fill moved to Indicator so it can travel between tabs; the tab
         // itself only changes its text colour.
         "data-active:text-gryt-on-accent",
-        f,
+        y,
         t
       ),
       ...e
     }
   );
-}), zt = c(
+}), xe = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      P.Indicator,
+    return /* @__PURE__ */ o(
+      V.Indicator,
       {
         ref: r,
         renderBeforeHydration: !0,
-        className: o(
+        className: n(
           "gryt-tabs-indicator absolute top-1 left-0 z-0 h-[calc(100%-0.5rem)]",
           "w-(--active-tab-width) translate-x-(--active-tab-left)",
           "rounded-(--gryt-radius-full) bg-gryt-accent",
@@ -1169,57 +1301,57 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     );
   }
-), jt = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    P.Panel,
+), he = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    V.Panel,
     {
       ref: r,
-      className: o("gryt-tabs-panel pt-3 text-sm text-gryt-text", t),
+      className: n("gryt-tabs-panel pt-3 text-sm text-gryt-text", t),
       ...e
     }
   );
-}), Ae = Object.assign(It, { List: Dt, Tab: Bt, Panel: jt, Indicator: zt }), At = c(function({ className: t, ...e }, r) {
-  return /* @__PURE__ */ a(
-    N.Root,
+}), Io = Object.assign(pe, { List: be, Tab: fe, Panel: he, Indicator: xe }), we = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    F.Root,
     {
       ref: r,
-      className: o(
+      className: n(
         "gryt-accordion flex w-full flex-col gap-2 rounded-(--gryt-radius-xl) border border-gryt-border bg-gryt-surface p-2",
         t
       ),
       ...e
     }
   );
-}), Lt = c(
+}), ve = s(
   function({ className: t, ...e }, r) {
-    return /* @__PURE__ */ a(
-      N.Item,
+    return /* @__PURE__ */ o(
+      F.Item,
       {
         ref: r,
-        className: o("gryt-accordion-item", t),
+        className: n("gryt-accordion-item", t),
         ...e
       }
     );
   }
-), Mt = c(
-  function({ children: t, className: e, expandIcon: r, ...s }, i) {
-    return /* @__PURE__ */ a(N.Header, { className: "gryt-accordion-header m-0", children: /* @__PURE__ */ g(
-      N.Trigger,
+), Ne = s(
+  function({ children: t, className: e, expandIcon: r, ...i }, c) {
+    return /* @__PURE__ */ o(F.Header, { className: "gryt-accordion-header m-0", children: /* @__PURE__ */ d(
+      F.Trigger,
       {
-        ref: i,
-        className: o(
+        ref: c,
+        className: n(
           "gryt-accordion-trigger flex w-full items-center justify-between gap-3",
           "rounded-(--gryt-radius-lg) border-0 bg-transparent px-3 py-2.5",
           "text-left text-sm font-medium text-gryt-text select-none",
           "transition-colors duration-150 hover:bg-gryt-surface-raised",
-          f,
+          y,
           e
         ),
-        ...s,
+        ...i,
         children: [
           t,
-          r === void 0 ? /* @__PURE__ */ a(
-            Z,
+          r === void 0 ? /* @__PURE__ */ o(
+            Nt,
             {
               size: 16,
               className: "shrink-0 transition-transform duration-(--gryt-dur-spring) ease-spring data-panel-open:rotate-180 motion-reduce:transition-none"
@@ -1229,13 +1361,13 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
       }
     ) });
   }
-), Ft = c(
-  function({ children: t, className: e, ...r }, s) {
-    return /* @__PURE__ */ a(
-      N.Panel,
+), Pe = s(
+  function({ children: t, className: e, ...r }, i) {
+    return /* @__PURE__ */ o(
+      F.Panel,
       {
-        ref: s,
-        className: o(
+        ref: i,
+        className: n(
           "gryt-accordion-panel overflow-hidden text-sm text-gryt-muted",
           // Base UI measures the panel and exposes the height as a variable,
           // which is what makes a real open and close transition possible.
@@ -1245,48 +1377,959 @@ const O = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) eas
           e
         ),
         ...r,
-        children: /* @__PURE__ */ a("div", { className: "px-3 pt-1 pb-3", children: t })
+        children: /* @__PURE__ */ o("div", { className: "px-3 pt-1 pb-3", children: t })
+      }
+    );
+  }
+), Ao = Object.assign(we, { Item: ve, Trigger: Ne, Panel: Pe }), ke = s(
+  function({ className: t, sideOffset: e = 2, ...r }, i) {
+    return /* @__PURE__ */ o(
+      P.Positioner,
+      {
+        ref: i,
+        sideOffset: e,
+        className: n("gryt-context-menu-positioner outline-none", t),
+        ...r
+      }
+    );
+  }
+), Do = {
+  Root: P.Root,
+  Trigger: P.Trigger,
+  Portal: P.Portal,
+  Positioner: ke,
+  Popup: U.Popup,
+  Item: U.Item,
+  Separator: U.Separator,
+  Group: P.Group,
+  GroupLabel: P.GroupLabel,
+  SubmenuRoot: P.SubmenuRoot,
+  SubmenuTrigger: P.SubmenuTrigger
+}, Te = s(
+  function({ className: t, sideOffset: e = 8, ...r }, i) {
+    return /* @__PURE__ */ o(
+      w.Positioner,
+      {
+        ref: i,
+        sideOffset: e,
+        className: n("gryt-popover-positioner outline-none", t),
+        ...r
+      }
+    );
+  }
+), $e = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      w.Popup,
+      {
+        ref: r,
+        className: n(
+          "gryt-popover max-w-[min(20rem,calc(100vw-2rem))] p-4 outline-none",
+          $,
+          C,
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), Ce = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    w.Title,
+    {
+      ref: r,
+      className: n(
+        "gryt-popover-title text-sm font-semibold text-gryt-text",
+        t
+      ),
+      ...e
+    }
+  );
+}), Se = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    w.Description,
+    {
+      ref: r,
+      className: n(
+        "gryt-popover-description mt-1 text-sm leading-6 text-gryt-muted",
+        t
+      ),
+      ...e
+    }
+  );
+}), Mo = {
+  Root: w.Root,
+  Trigger: w.Trigger,
+  Portal: w.Portal,
+  Positioner: Te,
+  Popup: $e,
+  Title: Ce,
+  Description: Se,
+  Close: w.Close,
+  Arrow: w.Arrow
+}, Re = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      v.Viewport,
+      {
+        ref: r,
+        className: n(
+          "gryt-toast-viewport fixed right-4 bottom-4 z-50 flex w-[min(22rem,calc(100vw-2rem))]",
+          "flex-col gap-2 outline-none",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), Ie = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    v.Root,
+    {
+      ref: r,
+      className: n(
+        "gryt-toast relative flex flex-col p-3 pr-9",
+        $,
+        // Swiping is a pointer gesture, so the toast follows the finger
+        // through Base UI's swipe variables before it animates out.
+        "transition-[opacity,transform] duration-(--gryt-dur-spring) ease-spring",
+        "data-starting-style:translate-y-2 data-starting-style:opacity-0",
+        "data-ending-style:translate-y-2 data-ending-style:opacity-0",
+        "motion-reduce:transition-none",
+        t
+      ),
+      ...e
+    }
+  );
+}), Ae = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    v.Title,
+    {
+      ref: r,
+      className: n(
+        "gryt-toast-title text-sm font-semibold text-gryt-text",
+        t
+      ),
+      ...e
+    }
+  );
+}), De = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    v.Description,
+    {
+      ref: r,
+      className: n(
+        "gryt-toast-description mt-0.5 text-sm leading-6 text-gryt-muted",
+        t
+      ),
+      ...e
+    }
+  );
+}), Me = s(function({ className: t, children: e, ...r }, i) {
+  return /* @__PURE__ */ o(
+    v.Close,
+    {
+      ref: i,
+      "aria-label": "Close",
+      className: n(
+        "gryt-toast-close absolute top-2.5 right-2.5 inline-flex h-6 w-6 items-center justify-center",
+        "rounded-(--gryt-radius-full) border-0 bg-transparent text-gryt-muted",
+        "transition-colors hover:bg-white/8 hover:text-gryt-text motion-reduce:transition-none",
+        "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gryt-accent-light",
+        t
+      ),
+      ...r,
+      children: e ?? /* @__PURE__ */ o(nt, { size: 14, weight: "bold" })
+    }
+  );
+}), Le = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    v.Action,
+    {
+      ref: r,
+      className: n(
+        "gryt-toast-action mt-2 self-start rounded-(--gryt-radius-full) border-0",
+        "bg-gryt-accent px-3 py-1.5 text-sm font-medium text-gryt-on-accent",
+        "transition-[scale] duration-(--gryt-dur-spring) ease-spring",
+        "motion-safe:hover:scale-[1.04] motion-safe:active:scale-[0.96]",
+        "focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gryt-accent-light",
+        t
+      ),
+      ...e
+    }
+  );
+}), Lo = {
+  Provider: v.Provider,
+  Portal: v.Portal,
+  Viewport: Re,
+  Root: Ie,
+  Title: Ae,
+  Description: De,
+  Close: Me,
+  Action: Le
+}, jo = v.useToastManager, je = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      L.Root,
+      {
+        ref: r,
+        className: n("gryt-scroll-area relative", t),
+        ...e
+      }
+    );
+  }
+), Ge = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      L.Viewport,
+      {
+        ref: r,
+        className: n(
+          "gryt-scroll-area-viewport h-full w-full overscroll-contain",
+          "focus-visible:outline-2 focus-visible:-outline-offset-1 focus-visible:outline-gryt-accent-light",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), Be = s(
+  function({ className: t, orientation: e, ...r }, i) {
+    return /* @__PURE__ */ o(
+      L.Scrollbar,
+      {
+        ref: i,
+        orientation: e,
+        className: n(
+          "gryt-scroll-area-scrollbar flex touch-none p-0.5 select-none",
+          // Fades in on hover or while scrolling rather than sitting there
+          // permanently — a chat sidebar is mostly not being scrolled.
+          "opacity-0 transition-opacity duration-(--gryt-dur-fast)",
+          "data-hovering:opacity-100 data-scrolling:opacity-100",
+          "motion-reduce:transition-none",
+          e === "horizontal" ? "h-2 flex-col" : "w-2",
+          t
+        ),
+        ...r,
+        children: /* @__PURE__ */ o(L.Thumb, { className: "flex-1 rounded-(--gryt-radius-full) bg-gryt-border transition-colors hover:bg-gryt-muted motion-reduce:transition-none" })
       }
     );
   }
-), Le = Object.assign(At, { Item: Lt, Trigger: Mt, Panel: Ft });
+), Go = {
+  Root: je,
+  Viewport: Ge,
+  Scrollbar: Be,
+  Content: L.Content,
+  Corner: L.Corner
+}, ze = {
+  primary: [
+    "text-gryt-muted hover:not-data-disabled:bg-white/8",
+    "data-pressed:bg-gryt-accent data-pressed:text-gryt-on-accent",
+    "data-pressed:hover:not-data-disabled:bg-gryt-accent"
+  ].join(" "),
+  secondary: [
+    "text-gryt-muted hover:not-data-disabled:bg-white/8",
+    "data-pressed:bg-gryt-secondary data-pressed:text-gryt-on-secondary",
+    "data-pressed:hover:not-data-disabled:bg-gryt-secondary"
+  ].join(" "),
+  neutral: [
+    "text-gryt-muted hover:not-data-disabled:bg-white/8",
+    "data-pressed:bg-gryt-surface-hover data-pressed:text-gryt-text"
+  ].join(" "),
+  // For destructive-while-active controls: mic muted, camera off.
+  danger: [
+    "text-gryt-muted hover:not-data-disabled:bg-white/8",
+    "data-pressed:bg-gryt-danger data-pressed:text-gryt-on-danger",
+    "data-pressed:hover:not-data-disabled:bg-gryt-danger"
+  ].join(" ")
+}, Fe = {
+  xsmall: "h-8 min-w-8 px-2 text-xs",
+  small: "h-9 min-w-9 px-2.5 text-sm",
+  medium: "h-10 min-w-10 px-3 text-sm",
+  large: "h-12 min-w-12 px-4 text-base"
+}, Bo = s(
+  function({ className: t, size: e = "medium", tone: r = "primary", ...i }, c) {
+    return /* @__PURE__ */ o(
+      Ct,
+      {
+        ref: c,
+        className: n(
+          "gryt-toggle",
+          "inline-flex shrink-0 items-center justify-center gap-2 border-0 bg-transparent",
+          "rounded-(--gryt-radius-full) font-medium select-none",
+          // scale rather than transform — see the note in Button.
+          "transition-[scale,background-color,color] duration-(--gryt-dur-spring) ease-spring",
+          "motion-safe:hover:not-data-disabled:scale-[1.06]",
+          "motion-safe:active:not-data-disabled:scale-[0.94]",
+          y,
+          j,
+          Fe[e],
+          ze[r],
+          t
+        ),
+        ...i
+      }
+    );
+  }
+), zo = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      St,
+      {
+        ref: r,
+        className: n(
+          "gryt-toggle-group inline-flex items-center gap-1",
+          "rounded-(--gryt-radius-full) border border-gryt-border bg-gryt-surface p-1",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), Ve = {
+  primary: "bg-gryt-accent",
+  success: "bg-gryt-success",
+  warning: "bg-gryt-warning",
+  danger: "bg-gryt-danger"
+};
+function Fo({
+  className: a,
+  value: t,
+  label: e,
+  showValue: r = !1,
+  tone: i = "primary",
+  ...c
+}) {
+  return /* @__PURE__ */ d(
+    z.Root,
+    {
+      value: t,
+      className: n("gryt-meter flex w-full flex-col gap-1.5", a),
+      ...c,
+      children: [
+        (e || r) && /* @__PURE__ */ d("div", { className: "flex items-baseline justify-between gap-2", children: [
+          e ? /* @__PURE__ */ o(z.Label, { className: "text-sm text-gryt-muted", children: e }) : /* @__PURE__ */ o("span", {}),
+          r && /* @__PURE__ */ o(z.Value, { className: "font-mono text-xs text-gryt-muted tabular-nums" })
+        ] }),
+        /* @__PURE__ */ o(z.Track, { className: "h-1.5 w-full overflow-hidden rounded-(--gryt-radius-full) bg-gryt-surface-raised", children: /* @__PURE__ */ o(
+          z.Indicator,
+          {
+            className: n(
+              "h-full rounded-(--gryt-radius-full)",
+              Ve[i]
+            )
+          }
+        ) })
+      ]
+    }
+  );
+}
+const Ee = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      T.Popup,
+      {
+        ref: r,
+        className: n(
+          "gryt-alert-dialog fixed top-1/2 left-1/2 z-50 -translate-x-1/2 -translate-y-1/2",
+          "flex w-96 max-w-[calc(100vw-3rem)] flex-col gap-4",
+          "rounded-(--gryt-radius-lg) border border-gryt-border bg-gryt-surface p-5 text-gryt-text",
+          "outline-none",
+          "transition-[opacity,scale] duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none",
+          "data-starting-style:scale-[0.98] data-starting-style:opacity-0",
+          "data-ending-style:scale-[0.98] data-ending-style:opacity-0",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), He = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    T.Backdrop,
+    {
+      ref: r,
+      className: n(
+        "gryt-alert-dialog-backdrop fixed inset-0 z-50 min-h-dvh bg-black/60",
+        "backdrop-blur-(--gryt-backdrop-blur)",
+        "transition-opacity duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none",
+        "data-starting-style:opacity-0 data-ending-style:opacity-0",
+        t
+      ),
+      ...e
+    }
+  );
+}), Oe = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    T.Title,
+    {
+      ref: r,
+      className: n(
+        "gryt-alert-dialog-title text-lg font-semibold text-gryt-text",
+        t
+      ),
+      ...e
+    }
+  );
+}), Xe = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    T.Description,
+    {
+      ref: r,
+      className: n(
+        "gryt-alert-dialog-description text-sm leading-6 text-gryt-muted",
+        t
+      ),
+      ...e
+    }
+  );
+}), Vo = {
+  Root: T.Root,
+  Trigger: T.Trigger,
+  Portal: T.Portal,
+  Backdrop: He,
+  Popup: Ee,
+  Title: Oe,
+  Description: Xe,
+  Close: T.Close
+}, dt = [
+  "flex cursor-default items-center gap-2 rounded-(--gryt-radius-md)",
+  "px-3 py-2 text-sm text-gryt-text outline-none select-none",
+  // Base UI drives keyboard and pointer highlight through one attribute, so
+  // arrow keys and the mouse land on identical styling.
+  "data-highlighted:bg-gryt-surface-raised",
+  "data-selected:text-gryt-accent",
+  "data-disabled:cursor-not-allowed data-disabled:opacity-50"
+].join(" "), gt = [
+  "w-full rounded-(--gryt-radius-input) border border-gryt-border bg-gryt-surface-raised",
+  "px-3 py-2 text-sm text-gryt-text outline-none placeholder:text-gryt-muted",
+  y
+].join(" "), Ye = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    g.Input,
+    {
+      ref: r,
+      className: n("gryt-combobox-input", gt, t),
+      ...e
+    }
+  );
+}), Ue = s(function({ className: t, sideOffset: e = 6, ...r }, i) {
+  return /* @__PURE__ */ o(
+    g.Positioner,
+    {
+      ref: i,
+      sideOffset: e,
+      className: n("gryt-combobox-positioner outline-none", t),
+      ...r
+    }
+  );
+}), Qe = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      g.Popup,
+      {
+        ref: r,
+        className: n(
+          "gryt-combobox max-h-64 w-(--anchor-width) overflow-y-auto overscroll-contain p-1 outline-none",
+          $,
+          C,
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), We = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    g.Item,
+    {
+      ref: r,
+      className: n("gryt-combobox-item", dt, t),
+      ...e
+    }
+  );
+}), _e = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    g.Empty,
+    {
+      ref: r,
+      className: n(
+        "gryt-combobox-empty px-3 py-2 text-sm text-gryt-muted",
+        t
+      ),
+      ...e
+    }
+  );
+}), Eo = {
+  Root: g.Root,
+  Input: Ye,
+  InputGroup: g.InputGroup,
+  Trigger: g.Trigger,
+  Icon: g.Icon,
+  Clear: g.Clear,
+  Value: g.Value,
+  Chips: g.Chips,
+  Chip: g.Chip,
+  ChipRemove: g.ChipRemove,
+  Portal: g.Portal,
+  Positioner: Ue,
+  Popup: Qe,
+  List: g.List,
+  Item: We,
+  ItemIndicator: g.ItemIndicator,
+  Group: g.Group,
+  GroupLabel: g.GroupLabel,
+  Empty: _e,
+  Separator: g.Separator
+}, Je = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    u.Input,
+    {
+      ref: r,
+      className: n("gryt-autocomplete-input", gt, t),
+      ...e
+    }
+  );
+}), Ke = s(function({ className: t, sideOffset: e = 6, ...r }, i) {
+  return /* @__PURE__ */ o(
+    u.Positioner,
+    {
+      ref: i,
+      sideOffset: e,
+      className: n("gryt-autocomplete-positioner outline-none", t),
+      ...r
+    }
+  );
+}), Ze = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    u.Popup,
+    {
+      ref: r,
+      className: n(
+        "gryt-autocomplete max-h-64 w-(--anchor-width) overflow-y-auto overscroll-contain p-1 outline-none",
+        $,
+        C,
+        t
+      ),
+      ...e
+    }
+  );
+}), qe = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    u.Item,
+    {
+      ref: r,
+      className: n("gryt-autocomplete-item", dt, t),
+      ...e
+    }
+  );
+}), tr = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    u.Empty,
+    {
+      ref: r,
+      className: n(
+        "gryt-autocomplete-empty px-3 py-2 text-sm text-gryt-muted",
+        t
+      ),
+      ...e
+    }
+  );
+}), Ho = {
+  Root: u.Root,
+  Input: Je,
+  InputGroup: u.InputGroup,
+  Trigger: u.Trigger,
+  Icon: u.Icon,
+  Clear: u.Clear,
+  Value: u.Value,
+  Portal: u.Portal,
+  Positioner: Ke,
+  Popup: Ze,
+  List: u.List,
+  Item: qe,
+  Group: u.Group,
+  GroupLabel: u.GroupLabel,
+  Empty: tr,
+  Separator: u.Separator
+}, Oo = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      Rt,
+      {
+        ref: r,
+        className: n("gryt-checkbox-group flex flex-col gap-2", t),
+        ...e
+      }
+    );
+  }
+), er = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      _.Trigger,
+      {
+        ref: r,
+        className: n(
+          "gryt-collapsible-trigger flex w-full items-center justify-between gap-2",
+          "rounded-(--gryt-radius-md) border-0 bg-transparent px-2 py-2 text-left",
+          "text-sm font-medium text-gryt-text select-none",
+          "transition-colors hover:bg-gryt-surface-raised motion-reduce:transition-none",
+          y,
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), rr = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      _.Panel,
+      {
+        ref: r,
+        className: n(
+          "gryt-collapsible-panel overflow-hidden",
+          // Base UI measures the panel and exposes the height as a variable, so
+          // this animates to the content's real height rather than to a guess.
+          "h-(--collapsible-panel-height) transition-[height] duration-(--gryt-dur-spring) ease-spring",
+          "data-starting-style:h-0 data-ending-style:h-0",
+          "motion-reduce:transition-none",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), Xo = {
+  Root: _.Root,
+  Trigger: er,
+  Panel: rr
+}, Yo = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    It,
+    {
+      ref: r,
+      className: n("gryt-form flex flex-col gap-(--gryt-space-lg)", t),
+      ...e
+    }
+  );
+}), or = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      it.Root,
+      {
+        ref: r,
+        className: n(
+          "gryt-fieldset flex min-w-0 flex-col gap-3 border-0 p-0",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), ar = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    it.Legend,
+    {
+      ref: r,
+      className: n(
+        "gryt-fieldset-legend text-sm font-semibold text-gryt-text",
+        t
+      ),
+      ...e
+    }
+  );
+}), Uo = { Root: or, Legend: ar }, Qo = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      At,
+      {
+        ref: r,
+        className: n(
+          "gryt-menubar flex items-center gap-1",
+          "rounded-(--gryt-radius-md) border border-gryt-border bg-gryt-surface p-1",
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), nr = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    x.Trigger,
+    {
+      ref: r,
+      className: n(
+        "gryt-navigation-menu-trigger flex items-center gap-1.5 rounded-(--gryt-radius-md)",
+        "border-0 bg-transparent px-3 py-2 text-sm font-medium text-gryt-text select-none",
+        "transition-colors hover:bg-gryt-surface-raised motion-reduce:transition-none",
+        "data-popup-open:bg-gryt-surface-raised",
+        y,
+        t
+      ),
+      ...e
+    }
+  );
+}), sr = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    x.Popup,
+    {
+      ref: r,
+      className: n(
+        "gryt-navigation-menu-popup outline-none",
+        $,
+        C,
+        t
+      ),
+      ...e
+    }
+  );
+}), ir = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    x.Viewport,
+    {
+      ref: r,
+      className: n(
+        "gryt-navigation-menu-viewport relative overflow-hidden",
+        t
+      ),
+      ...e
+    }
+  );
+}), cr = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    x.Link,
+    {
+      ref: r,
+      className: n(
+        "gryt-navigation-menu-link block rounded-(--gryt-radius-md) px-3 py-2",
+        "text-sm text-gryt-text no-underline outline-none",
+        "transition-colors hover:bg-gryt-surface-raised motion-reduce:transition-none",
+        y,
+        t
+      ),
+      ...e
+    }
+  );
+}), Wo = {
+  Root: x.Root,
+  List: x.List,
+  Item: x.Item,
+  Trigger: nr,
+  Content: x.Content,
+  Portal: x.Portal,
+  Positioner: x.Positioner,
+  Viewport: ir,
+  Popup: sr,
+  Link: cr,
+  Icon: x.Icon,
+  Arrow: x.Arrow
+}, ot = "flex h-9 w-9 shrink-0 items-center justify-center border-0 bg-transparent text-gryt-muted transition-colors hover:not-data-disabled:bg-white/8 hover:not-data-disabled:text-gryt-text motion-reduce:transition-none disabled:cursor-not-allowed disabled:opacity-50", _o = s(
+  function({ className: t, label: e, scrubbable: r = !1, ...i }, c) {
+    return /* @__PURE__ */ d(
+      S.Root,
+      {
+        ref: c,
+        className: n("gryt-number-field flex flex-col gap-1.5", t),
+        ...i,
+        children: [
+          e && (r ? /* @__PURE__ */ d(S.ScrubArea, { className: "cursor-ew-resize text-sm text-gryt-muted select-none", children: [
+            e,
+            /* @__PURE__ */ o(S.ScrubAreaCursor, {})
+          ] }) : /* @__PURE__ */ o("span", { className: "text-sm text-gryt-muted", children: e })),
+          /* @__PURE__ */ d(
+            S.Group,
+            {
+              className: n(
+                "flex w-fit items-center overflow-hidden rounded-(--gryt-radius-full)",
+                "border border-gryt-border bg-gryt-surface-raised",
+                "focus-within:outline-2 focus-within:outline-offset-2 focus-within:outline-gryt-accent-light",
+                j
+              ),
+              children: [
+                /* @__PURE__ */ o(
+                  S.Decrement,
+                  {
+                    "aria-label": "Decrease",
+                    className: n(ot, "rounded-l-(--gryt-radius-full)"),
+                    children: /* @__PURE__ */ o(Pt, { size: 14, weight: "bold" })
+                  }
+                ),
+                /* @__PURE__ */ o(
+                  S.Input,
+                  {
+                    className: n(
+                      "w-16 border-0 bg-transparent px-1 py-2 text-center",
+                      "font-mono text-sm text-gryt-text tabular-nums outline-none",
+                      y
+                    )
+                  }
+                ),
+                /* @__PURE__ */ o(
+                  S.Increment,
+                  {
+                    "aria-label": "Increase",
+                    className: n(ot, "rounded-r-(--gryt-radius-full)"),
+                    children: /* @__PURE__ */ o(kt, { size: 14, weight: "bold" })
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+), Jo = s(
+  function({ className: t, length: e = 6, ...r }, i) {
+    return /* @__PURE__ */ o(
+      et.Root,
+      {
+        ref: i,
+        length: e,
+        className: n("gryt-otp-field flex gap-2", t),
+        ...r,
+        children: Array.from({ length: e }, (c, l) => /* @__PURE__ */ o(
+          et.Input,
+          {
+            className: n(
+              "gryt-otp-input h-12 w-10 rounded-(--gryt-radius-md) text-center",
+              "border border-gryt-border bg-gryt-surface-raised",
+              "font-mono text-lg text-gryt-text tabular-nums outline-none",
+              "transition-colors duration-(--gryt-dur-fast) motion-reduce:transition-none",
+              "data-filled:border-gryt-accent",
+              y
+            )
+          },
+          l
+        ))
+      }
+    );
+  }
+), lr = s(
+  function({ className: t, sideOffset: e = 8, ...r }, i) {
+    return /* @__PURE__ */ o(
+      D.Positioner,
+      {
+        ref: i,
+        sideOffset: e,
+        className: n("gryt-preview-card-positioner outline-none", t),
+        ...r
+      }
+    );
+  }
+), dr = s(
+  function({ className: t, ...e }, r) {
+    return /* @__PURE__ */ o(
+      D.Popup,
+      {
+        ref: r,
+        className: n(
+          "gryt-preview-card w-64 max-w-[calc(100vw-2rem)] p-4 outline-none",
+          $,
+          C,
+          t
+        ),
+        ...e
+      }
+    );
+  }
+), Ko = {
+  Root: D.Root,
+  Trigger: D.Trigger,
+  Portal: D.Portal,
+  Positioner: lr,
+  Popup: dr,
+  Arrow: D.Arrow
+}, gr = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    M.Root,
+    {
+      ref: r,
+      className: n(
+        "gryt-toolbar flex items-center gap-1",
+        "rounded-(--gryt-radius-full) border border-gryt-border bg-gryt-surface p-1",
+        t
+      ),
+      ...e
+    }
+  );
+}), ur = s(function({ className: t, ...e }, r) {
+  return /* @__PURE__ */ o(
+    M.Separator,
+    {
+      ref: r,
+      className: n("gryt-toolbar-separator mx-1 h-6 w-px bg-gryt-border", t),
+      ...e
+    }
+  );
+}), Zo = {
+  Root: gr,
+  Group: M.Group,
+  Button: M.Button,
+  Link: M.Link,
+  Input: M.Input,
+  Separator: ur
+};
 export {
-  Le as Accordion,
-  $e as Alert,
-  yt as Avatar,
-  ye as Badge,
-  ot as Button,
-  Pe as Card,
-  Re as CardActions,
-  Te as CardContent,
-  Se as CardHeader,
-  be as Checkbox,
-  me as Chip,
-  ge as Composer,
-  ue as ConversationItem,
-  Be as Dialog,
-  Ne as Divider,
-  ze as Drawer,
-  se as GrytProvider,
-  ce as IconButton,
-  je as Menu,
-  de as MessageBubble,
-  Ce as Progress,
-  fe as Radio,
-  pe as RadioGroup,
-  we as Select,
-  De as Skeleton,
-  xe as Slider,
-  Ie as Spinner,
-  ie as Surface,
-  he as Switch,
-  Bt as Tab,
-  Ae as Tabs,
-  le as TextField,
-  ve as Tooltip,
-  ke as TooltipProvider,
-  o as cn,
-  et as createGrytTheme,
-  L as grytTokens
+  Ao as Accordion,
+  ko as Alert,
+  Vo as AlertDialog,
+  Ho as Autocomplete,
+  Xt as Avatar,
+  co as Badge,
+  Gt as Button,
+  wo as Card,
+  Po as CardActions,
+  No as CardContent,
+  vo as CardHeader,
+  go as Checkbox,
+  Oo as CheckboxGroup,
+  lo as Chip,
+  Xo as Collapsible,
+  Eo as Combobox,
+  so as Composer,
+  Do as ContextMenu,
+  io as ConversationItem,
+  So as Dialog,
+  ho as Divider,
+  Ro as Drawer,
+  Uo as Fieldset,
+  Yo as Form,
+  eo as GrytProvider,
+  ro as IconButton,
+  U as Menu,
+  Qo as Menubar,
+  ao as MessageBubble,
+  Fo as Meter,
+  Wo as NavigationMenu,
+  _o as NumberField,
+  Jo as OtpField,
+  Mo as Popover,
+  Ko as PreviewCard,
+  To as Progress,
+  uo as Radio,
+  yo as RadioGroup,
+  Go as ScrollArea,
+  bo as Select,
+  Co as Skeleton,
+  po as Slider,
+  $o as Spinner,
+  oo as Surface,
+  mo as Switch,
+  fe as Tab,
+  Io as Tabs,
+  no as TextField,
+  Lo as Toast,
+  Bo as Toggle,
+  zo as ToggleGroup,
+  Zo as Toolbar,
+  fo as Tooltip,
+  xo as TooltipProvider,
+  n as cn,
+  Dt as createGrytTheme,
+  rt as grytTokens,
+  ee as useMediaQuery,
+  jo as useToastManager
 };
 //# sourceMappingURL=index.js.map