@gryt/ui 0.13.0 → 0.13.1

package/dist/index.js

@@ -15,7 +15,7 @@ import { Slider as U } from "@base-ui/react/slider";
 import { Select as v } from "@base-ui/react/select";
 import { Separator as ct } from "@base-ui/react/separator";
 import { Progress as oe } from "@base-ui/react/progress";
-import { Dialog as I } from "@base-ui/react/dialog";
+import { Dialog as M } from "@base-ui/react/dialog";
 import { Drawer as k } from "@base-ui/react/drawer";
 import { Menu as j } from "@base-ui/react/menu";
 import { Tabs as Z } from "@base-ui/react/tabs";
@@ -27,9 +27,9 @@ import { ScrollArea as _ } from "@base-ui/react/scroll-area";
 import { Toggle as it } from "@base-ui/react/toggle";
 import { ToggleGroup as dt } from "@base-ui/react/toggle-group";
 import { Meter as O } from "@base-ui/react/meter";
-import { AlertDialog as M } from "@base-ui/react/alert-dialog";
+import { AlertDialog as I } from "@base-ui/react/alert-dialog";
 import { Autocomplete as h } from "@base-ui/react/autocomplete";
-import { Combobox as p } from "@base-ui/react/combobox";
+import { Combobox as b } from "@base-ui/react/combobox";
 import { CheckboxGroup as lt } from "@base-ui/react/checkbox-group";
 import { Collapsible as ge } from "@base-ui/react/collapsible";
 import { Form as ut } from "@base-ui/react/form";
@@ -40,7 +40,7 @@ import { NumberField as D } from "@base-ui/react/number-field";
 import { OTPField as ve } from "@base-ui/react/otp-field";
 import { PreviewCard as z } from "@base-ui/react/preview-card";
 import { Toolbar as B } from "@base-ui/react/toolbar";
-function Ie(a) {
+function Me(a) {
   return a <= 0.04045 ? a / 12.92 : ((a + 0.055) / 1.055) ** 2.4;
 }
 function ne(a) {
@@ -57,12 +57,12 @@ function X(a) {
     parseInt(r.slice(4, 6), 16) / 255
   ];
 }
-function Me([a, t, r]) {
+function Ie([a, t, r]) {
   const e = (n) => Math.round(Y(n) * 255).toString(16).padStart(2, "0");
   return `#${e(a)}${e(t)}${e(r)}`;
 }
 function J(a) {
-  const [t, r, e] = X(a).map(Ie), n = Math.cbrt(
+  const [t, r, e] = X(a).map(Me), n = Math.cbrt(
     0.4122214708 * t + 0.5363325363 * r + 0.0514459929 * e
   ), c = Math.cbrt(
     0.2119034982 * t + 0.6806995451 * r + 0.1073969566 * e
@@ -77,7 +77,7 @@ function J(a) {
 }
 function $({ l: a, c: t, h: r }) {
   const e = t * Math.cos(r * Math.PI / 180), n = t * Math.sin(r * Math.PI / 180), c = (a + 0.3963377774 * e + 0.2158037573 * n) ** 3, d = (a - 0.1055613458 * e - 0.0638541728 * n) ** 3, l = (a - 0.0894841775 * e - 1.291485548 * n) ** 3;
-  return Me([
+  return Ie([
     ne(Y(4.0767416621 * c - 3.3077115913 * d + 0.2309699292 * l)),
     ne(Y(-1.2684380046 * c + 2.6097574011 * d - 0.3413193965 * l)),
     ne(Y(-0.0041960863 * c - 0.7034186147 * d + 1.707614701 * l))
@@ -103,7 +103,7 @@ const mt = [
   0.57,
   0.627,
   0.908
-], bt = [
+], pt = [
   0.011,
   0.014,
   0.016,
@@ -127,7 +127,7 @@ function He(a) {
     11: a.text
   }, r = J(a.border).h;
   return mt.map(
-    (e, n) => t[n] ?? $({ l: e, c: bt[n], h: r })
+    (e, n) => t[n] ?? $({ l: e, c: pt[n], h: r })
   );
 }
 function Q(a, t) {
@@ -136,17 +136,17 @@ function Q(a, t) {
     const n = X(e);
     let c = 0;
     for (let f = 0; f < 3; f++) {
-      const b = n[f], P = r[f];
-      b > P ? c = Math.max(c, P < 1 ? (b - P) / (1 - P) : 0) : b < P && (c = Math.max(c, P > 0 ? (P - b) / P : 0));
+      const p = n[f], P = r[f];
+      p > P ? c = Math.max(c, P < 1 ? (p - P) / (1 - P) : 0) : p < P && (c = Math.max(c, P > 0 ? (P - p) / P : 0));
     }
     if (c < 1e-6) return "transparent";
-    const d = Me(
-      n.map((f, b) => Y(r[b] + (f - r[b]) / c))
+    const d = Ie(
+      n.map((f, p) => Y(r[p] + (f - r[p]) / c))
     ), [l, g, y] = X(d).map((f) => Math.round(f * 255));
     return `rgb(${l} ${g} ${y} / ${(c * 100).toFixed(1)}%)`;
   });
 }
-const pt = [
+const bt = [
   0.962,
   1,
   0.978,
@@ -182,7 +182,7 @@ function De(a) {
     10: a.muted,
     11: a.text
   }, r = J(a.border).h;
-  return pt.map(
+  return bt.map(
     (e, n) => t[n] ?? $({ l: e, c: ht[n], h: r })
   );
 }
@@ -193,10 +193,10 @@ function S(a) {
   return n.push(a), n.push($({ l: Math.max(0, t - 0.07), c: r, h: e })), n.push($({ l: 0.46, c: 0.15, h: e })), n.push($({ l: 0.33, c: 0.1, h: e })), n;
 }
 function Ne(a) {
-  const [t, r, e] = X(a).map(Ie);
+  const [t, r, e] = X(a).map(Me);
   return 0.2126 * t + 0.7152 * r + 0.0722 * e;
 }
-function qa(a, t) {
+function eo(a, t) {
   const r = Ne(a), e = Ne(t);
   return (Math.max(r, e) + 0.05) / (Math.min(r, e) + 0.05);
 }
@@ -262,10 +262,10 @@ const u = {
   success: S(u.color.success),
   danger: S(u.color.danger),
   warning: S(u.color.warning)
-}, Ge = le.neutral[3], eo = {
+}, Ge = le.neutral[3], to = {
   neutral: Q(Pe.neutral, u.color.bg),
   accent: Q(Pe.accent, u.color.bg)
-}, to = {
+}, ro = {
   neutral: Q(le.neutral, T.bg),
   accent: Q(le.accent, T.bg)
 };
@@ -297,8 +297,8 @@ function vt(a = {}) {
     warning: L(e.warning, e.warning)
   }, l = {};
   for (const [g, y] of Object.entries(d))
-    y.forEach((f, b) => {
-      l[`--gryt-${g}-${b + 1}`] = f, l[`--color-gryt-${g}-${b + 1}`] = f;
+    y.forEach((f, p) => {
+      l[`--gryt-${g}-${p + 1}`] = f, l[`--color-gryt-${g}-${p + 1}`] = f;
     });
   for (const g of ["neutral", "accent"])
     Q(d[g], e.bg).forEach((y, f) => {
@@ -355,7 +355,7 @@ function vt(a = {}) {
 function Nt(a) {
   return Object.keys(a).some((t) => t.startsWith("--"));
 }
-function ro({
+function ao({
   children: a,
   className: t,
   theme: r,
@@ -436,7 +436,7 @@ function Ee(a) {
 function kt(a, t) {
   return t === "light" && a.lightHue !== null ? a.lightHue : a.hue;
 }
-function ao(a, t) {
+function oo(a, t) {
   return {
     appearance: t,
     color: { ...kt(a, t), ...a[t] },
@@ -471,7 +471,7 @@ function me(a) {
   const t = a.trim().toLowerCase();
   return t.length === 4 ? `#${t[1]}${t[1]}${t[2]}${t[2]}${t[3]}${t[3]}` : t;
 }
-function oo(a, t) {
+function no(a, t) {
   const r = new URLSearchParams(), e = (c) => me(c).slice(1), n = ye(a.name ?? "");
   n !== "" && r.set("name", n);
   for (const c of ee)
@@ -488,7 +488,7 @@ function oo(a, t) {
     a.radius[c] !== F.radius[c] && r.set(`r-${c}`, String(a.radius[c]));
   return t === "light" && r.set("mode", "light"), r;
 }
-function no(a) {
+function so(a) {
   const t = a.trim();
   if (t === "") return null;
   if (t.startsWith("{")) return St(t);
@@ -1092,7 +1092,7 @@ const se = { sm: 8, md: 12, lg: 20, xl: 28, full: 999 }, ce = { sm: 6, md: 8, lg
       radius: ke
     }
   }
-], so = new Map(
+], co = new Map(
   Ct.map((a) => [a.id, a])
 );
 function s(...a) {
@@ -1104,12 +1104,12 @@ const At = {
   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"
-}, It = {
+}, Mt = {
   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"
-}, Mt = i(
+}, It = i(
   function({
     children: t,
     className: r,
@@ -1144,7 +1144,7 @@ const At = {
           "motion-safe:not-[[aria-haspopup]]: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",
-          It[n],
+          Mt[n],
           At[d],
           r
         ),
@@ -1212,7 +1212,7 @@ const At = {
   small: "h-9 w-9",
   medium: "h-10 w-10",
   large: "h-12 w-12"
-}, co = i(
+}, io = i(
   function({ className: t, size: r = "medium", tone: e = "neutral", ...n }, c) {
     return /* @__PURE__ */ o(
       Se,
@@ -1242,7 +1242,7 @@ const At = {
       }
     );
   }
-), io = i(
+), lo = i(
   function({ className: t, elevated: r = !1, ...e }, n) {
     return /* @__PURE__ */ o(
       "div",
@@ -1257,7 +1257,7 @@ const At = {
       }
     );
   }
-), lo = i(
+), uo = i(
   function({ children: t, className: r, from: e = "assistant", ...n }, c) {
     return /* @__PURE__ */ o(
       "div",
@@ -1275,7 +1275,7 @@ const At = {
       }
     );
   }
-), uo = i(
+), go = i(
   function({
     className: t,
     error: r = !1,
@@ -1287,7 +1287,7 @@ const At = {
     size: g = "medium",
     ...y
   }, f) {
-    const b = /* @__PURE__ */ o(
+    const p = /* @__PURE__ */ o(
       q.Control,
       {
         ref: f,
@@ -1312,7 +1312,7 @@ const At = {
         ),
         children: [
           c ? /* @__PURE__ */ o(q.Label, { className: "text-xs font-medium text-gryt-muted", children: c }) : null,
-          b,
+          p,
           n ? /* @__PURE__ */ o(
             q.Description,
             {
@@ -1327,7 +1327,7 @@ const At = {
       }
     );
   }
-), go = i(
+), fo = i(
   function({
     className: t,
     disabled: r = !1,
@@ -1338,17 +1338,17 @@ const At = {
     submitLabel: l = "Send",
     ...g
   }, y) {
-    const f = Re(null), b = de(() => {
+    const f = Re(null), p = de(() => {
       const w = f.current;
       if (!w)
         return;
-      const re = window.getComputedStyle(w), be = parseFloat(re.lineHeight) || 24, pe = parseFloat(re.paddingTop) + parseFloat(re.paddingBottom);
+      const re = window.getComputedStyle(w), pe = parseFloat(re.lineHeight) || 24, be = parseFloat(re.paddingTop) + parseFloat(re.paddingBottom);
       w.style.height = "auto", w.style.height = `${Math.min(
-        Math.max(w.scrollHeight, be * n + pe),
-        be * e + pe
+        Math.max(w.scrollHeight, pe * n + be),
+        pe * e + be
       )}px`;
     }, [e, n]);
-    Xe(b, [b, g.value]);
+    Xe(p, [p, g.value]);
     function P(w) {
       if (!c) {
         w.preventDefault();
@@ -1366,13 +1366,13 @@ const At = {
           rows: n,
           disabled: r,
           placeholder: d,
-          onInput: b,
+          onInput: p,
           className: "gryt-composer-textarea disabled:cursor-not-allowed disabled:opacity-60",
           ...g
         }
       ),
       /* @__PURE__ */ o(
-        Mt,
+        It,
         {
           type: "submit",
           disabled: r,
@@ -1412,7 +1412,7 @@ const At = {
       ]
     }
   );
-}), fo = i(function({ active: t = !1, avatar: r, className: e, subtitle: n, title: c, ...d }, l) {
+}), yo = i(function({ active: t = !1, avatar: r, className: e, subtitle: n, title: c, ...d }, l) {
   return /* @__PURE__ */ m(
     "button",
     {
@@ -1451,7 +1451,7 @@ const At = {
       ]
     }
   );
-}), yo = i(function({ badgeContent: t, children: r, className: e, max: n = 99, showZero: c = !1, ...d }, l) {
+}), mo = i(function({ badgeContent: t, children: r, className: e, max: n = 99, showZero: c = !1, ...d }, l) {
   const g = typeof t == "number" ? t : null, y = g !== null && g === 0 && !c, f = g !== null && g > n ? `${n}+` : t;
   return /* @__PURE__ */ m(
     "span",
@@ -1483,7 +1483,7 @@ const At = {
   success: "border-gryt-success-6 bg-gryt-success-3 text-gryt-success-11",
   warning: "border-gryt-warning-6 bg-gryt-warning-3 text-gryt-warning-11",
   danger: "border-gryt-danger-6 bg-gryt-danger-3 text-gryt-danger-11"
-}, mo = i(function({ children: t, className: r, icon: e, label: n, onDelete: c, tone: d = "neutral", ...l }, g) {
+}, po = i(function({ children: t, className: r, icon: e, label: n, onDelete: c, tone: d = "neutral", ...l }, g) {
   return /* @__PURE__ */ m(
     "span",
     {
@@ -1557,7 +1557,7 @@ const At = {
       }
     );
   }
-), po = i(function({ className: t, tone: r = "primary", ...e }, n) {
+), ho = i(function({ className: t, tone: r = "primary", ...e }, n) {
   return /* @__PURE__ */ o(
     xe.Root,
     {
@@ -1592,7 +1592,7 @@ const At = {
       )
     }
   );
-}), ho = i(
+}), xo = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
       st,
@@ -1603,7 +1603,7 @@ const At = {
       }
     );
   }
-), xo = i(
+), wo = i(
   function({ className: t, tone: r = "primary", ...e }, n) {
     return /* @__PURE__ */ o(
       we.Root,
@@ -1637,7 +1637,7 @@ const At = {
     );
   }
 ), Te = 3;
-function wo({
+function vo({
   className: a,
   tone: t = "primary",
   "aria-label": r,
@@ -1658,10 +1658,10 @@ function wo({
     d.current = { x: f.clientX, y: f.clientY };
   }
   function g(f) {
-    const b = d.current;
-    if (b === null || n)
+    const p = d.current;
+    if (p === null || n)
       return;
-    (Math.abs(f.clientX - b.x) > Te || Math.abs(f.clientY - b.y) > Te) && c(!0);
+    (Math.abs(f.clientX - p.x) > Te || Math.abs(f.clientY - p.y) > Te) && c(!0);
   }
   const y = n ? "transition-none" : "duration-(--gryt-dur-spring) ease-spring-tight motion-reduce:transition-none";
   return /* @__PURE__ */ o(U.Root, { className: s("gryt-slider w-full", a), ...e, children: /* @__PURE__ */ o(
@@ -1717,7 +1717,7 @@ const Vt = {
   small: "min-h-9 px-3 text-sm",
   medium: "min-h-11 px-4 text-sm"
 };
-function vo({
+function No({
   className: a,
   label: t,
   options: r = [],
@@ -1747,33 +1747,40 @@ function vo({
         }
       )
     ] }),
-    /* @__PURE__ */ o(v.Portal, { children: /* @__PURE__ */ o(v.Positioner, { sideOffset: 6, className: "outline-none", children: /* @__PURE__ */ o(
-      v.Popup,
+    /* @__PURE__ */ o(v.Portal, { children: /* @__PURE__ */ o(
+      v.Positioner,
       {
-        className: s("min-w-(--anchor-width) p-1", E, H),
-        children: /* @__PURE__ */ o(v.List, { children: r.map((d) => /* @__PURE__ */ m(
-          v.Item,
+        sideOffset: 6,
+        className: "gryt-select-positioner outline-none",
+        children: /* @__PURE__ */ o(
+          v.Popup,
           {
-            value: d.value,
-            disabled: d.disabled,
-            className: s(
-              "flex cursor-pointer 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__ */ o(v.ItemText, { children: d.label }),
-              /* @__PURE__ */ o(v.ItemIndicator, { className: "text-gryt-accent-11", children: /* @__PURE__ */ o(Ce, { size: 14, weight: "bold" }) })
-            ]
-          },
-          String(d.value)
-        )) })
+            className: s("min-w-(--anchor-width) p-1", E, H),
+            children: /* @__PURE__ */ o(v.List, { children: r.map((d) => /* @__PURE__ */ m(
+              v.Item,
+              {
+                value: d.value,
+                disabled: d.disabled,
+                className: s(
+                  "flex cursor-pointer 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__ */ o(v.ItemText, { children: d.label }),
+                  /* @__PURE__ */ o(v.ItemIndicator, { className: "text-gryt-accent-11", children: /* @__PURE__ */ o(Ce, { size: 14, weight: "bold" }) })
+                ]
+              },
+              String(d.value)
+            )) })
+          }
+        )
       }
-    ) }) })
+    ) })
   ] });
 }
-function No({
+function Po({
   children: a,
   className: t,
   side: r = "top",
@@ -1782,21 +1789,29 @@ function No({
 }) {
   return /* @__PURE__ */ m(G.Root, { children: [
     /* @__PURE__ */ o(G.Trigger, { render: a }),
-    /* @__PURE__ */ o(G.Portal, { children: /* @__PURE__ */ o(G.Positioner, { side: r, sideOffset: e, children: /* @__PURE__ */ o(
-      G.Popup,
+    /* @__PURE__ */ o(G.Portal, { children: /* @__PURE__ */ o(
+      G.Positioner,
       {
-        className: s(
-          "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",
-          H,
-          t
-        ),
-        children: n
+        side: r,
+        sideOffset: e,
+        className: "gryt-tooltip-positioner",
+        children: /* @__PURE__ */ o(
+          G.Popup,
+          {
+            className: s(
+              "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",
+              H,
+              t
+            ),
+            children: n
+          }
+        )
       }
-    ) }) })
+    ) })
   ] });
 }
-const Po = G.Provider, ko = i(
+const ko = G.Provider, To = i(
   function({ className: t, orientation: r = "horizontal", ...e }, n) {
     return /* @__PURE__ */ o(
       ct,
@@ -1812,7 +1827,7 @@ const Po = G.Provider, ko = i(
       }
     );
   }
-), To = i(function({ className: t, ...r }, e) {
+), Lo = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     "div",
     {
@@ -1825,7 +1840,7 @@ const Po = G.Provider, ko = i(
     }
   );
 });
-function Lo({
+function So({
   children: a,
   className: t,
   subheader: r,
@@ -1845,7 +1860,7 @@ function Lo({
     }
   );
 }
-function So({
+function Ro({
   className: a,
   ...t
 }) {
@@ -1860,7 +1875,7 @@ function So({
     }
   );
 }
-function Ro({
+function $o({
   className: a,
   ...t
 }) {
@@ -1880,7 +1895,7 @@ const Ut = {
   success: "border-gryt-success-6 bg-gryt-success-3 text-gryt-success-11",
   warning: "border-gryt-warning-6 bg-gryt-warning-3 text-gryt-warning-11",
   error: "border-gryt-danger-6 bg-gryt-danger-3 text-gryt-danger-11"
-}, $o = i(function({ className: t, severity: r = "info", ...e }, n) {
+}, Co = i(function({ className: t, severity: r = "info", ...e }, n) {
   return /* @__PURE__ */ o(
     "div",
     {
@@ -1895,7 +1910,7 @@ const Ut = {
     }
   );
 });
-function Co({ className: a, value: t = null, ...r }) {
+function Ao({ className: a, value: t = null, ...r }) {
   return /* @__PURE__ */ o(
     oe.Root,
     {
@@ -1906,7 +1921,7 @@ function Co({ className: a, value: t = null, ...r }) {
     }
   );
 }
-function Ao({
+function Mo({
   className: a,
   size: t = 24,
   "aria-label": r = "Loading"
@@ -1967,7 +1982,7 @@ function Io({
 const Ue = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ease-spring motion-reduce:transition-none", Yt = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
-      I.Backdrop,
+      M.Backdrop,
       {
         ref: e,
         className: s(
@@ -1984,7 +1999,7 @@ const Ue = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ea
 ), Xt = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
-      I.Popup,
+      M.Popup,
       {
         ref: e,
         className: s(
@@ -2003,7 +2018,7 @@ const Ue = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ea
 ), Wt = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
-      I.Title,
+      M.Title,
       {
         ref: e,
         className: s(
@@ -2017,7 +2032,7 @@ const Ue = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ea
 ), Kt = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
-      I.Description,
+      M.Description,
       {
         ref: e,
         className: s(
@@ -2042,11 +2057,11 @@ const Ue = "transition-[opacity,scale,translate] duration-(--gryt-dur-spring) ea
       }
     );
   }
-), Mo = {
-  Root: I.Root,
-  Trigger: I.Trigger,
-  Portal: I.Portal,
-  Close: I.Close,
+), Ho = {
+  Root: M.Root,
+  Trigger: M.Trigger,
+  Portal: M.Portal,
+  Close: M.Close,
   Backdrop: Yt,
   Popup: Xt,
   Title: Wt,
@@ -2194,7 +2209,7 @@ function cr({ className: a }) {
     }
   );
 }
-const Ho = {
+const Do = {
   Root: ar,
   Trigger: k.Trigger,
   Portal: k.Portal,
@@ -2352,7 +2367,7 @@ const Ho = {
       }
     );
   }
-), br = i(function({ className: t, ...r }, e) {
+), pr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     Z.Panel,
     {
@@ -2368,7 +2383,7 @@ const Ho = {
       ...r
     }
   );
-}), Do = Object.assign(gr, { List: fr, Tab: yr, Panel: br, Indicator: mr }), pr = i(function({ className: t, ...r }, e) {
+}), Go = Object.assign(gr, { List: fr, Tab: yr, Panel: pr, Indicator: mr }), br = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     K.Root,
     {
@@ -2440,7 +2455,7 @@ const Ho = {
       }
     );
   }
-), Go = Object.assign(pr, { Item: hr, Trigger: xr, Panel: wr }), vr = i(
+), jo = Object.assign(br, { Item: hr, Trigger: xr, Panel: wr }), vr = i(
   function({ className: t, sideOffset: r = 2, ...e }, n) {
     return /* @__PURE__ */ o(
       A.Positioner,
@@ -2452,7 +2467,7 @@ const Ho = {
       }
     );
   }
-), jo = {
+), Eo = {
   Root: A.Root,
   Trigger: A.Trigger,
   Portal: A.Portal,
@@ -2516,7 +2531,7 @@ const Ho = {
       ...r
     }
   );
-}), Eo = {
+}), zo = {
   Root: R.Root,
   Trigger: R.Trigger,
   Portal: R.Portal,
@@ -2613,7 +2628,7 @@ const Ho = {
       children: r ?? /* @__PURE__ */ o($e, { size: 14, weight: "bold" })
     }
   );
-}), Ir = i(function({ className: t, ...r }, e) {
+}), Mr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     C.Action,
     {
@@ -2629,7 +2644,7 @@ const Ho = {
       ...r
     }
   );
-}), zo = {
+}), Bo = {
   Provider: C.Provider,
   Portal: C.Portal,
   Viewport: Sr,
@@ -2637,8 +2652,8 @@ const Ho = {
   Title: $r,
   Description: Cr,
   Close: Ar,
-  Action: Ir
-}, Bo = C.useToastManager, Mr = i(
+  Action: Mr
+}, Fo = C.useToastManager, Ir = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
       _.Root,
@@ -2686,8 +2701,8 @@ const Ho = {
       }
     );
   }
-), Fo = {
-  Root: Mr,
+), _o = {
+  Root: Ir,
   Viewport: Hr,
   Scrollbar: Dr,
   Content: _.Content,
@@ -2718,7 +2733,7 @@ const Ho = {
   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"
-}, _o = i(
+}, Vo = i(
   function({ className: t, size: r = "medium", tone: e = "primary", ...n }, c) {
     return /* @__PURE__ */ o(
       it,
@@ -2742,7 +2757,7 @@ const Ho = {
       }
     );
   }
-), Vo = i(
+), Uo = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
       dt,
@@ -2763,7 +2778,7 @@ const Ho = {
   warning: "bg-gryt-warning",
   danger: "bg-gryt-danger"
 };
-function Uo({
+function Oo({
   className: a,
   value: t,
   label: r,
@@ -2799,7 +2814,7 @@ function Uo({
 const zr = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
-      M.Popup,
+      I.Popup,
       {
         ref: e,
         className: s(
@@ -2818,7 +2833,7 @@ const zr = i(
   }
 ), Br = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
-    M.Backdrop,
+    I.Backdrop,
     {
       ref: e,
       className: s(
@@ -2833,7 +2848,7 @@ const zr = i(
   );
 }), Fr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
-    M.Title,
+    I.Title,
     {
       ref: e,
       className: s(
@@ -2845,7 +2860,7 @@ const zr = i(
   );
 }), _r = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
-    M.Description,
+    I.Description,
     {
       ref: e,
       className: s(
@@ -2855,15 +2870,15 @@ const zr = i(
       ...r
     }
   );
-}), Oo = {
-  Root: M.Root,
-  Trigger: M.Trigger,
-  Portal: M.Portal,
+}), Yo = {
+  Root: I.Root,
+  Trigger: I.Trigger,
+  Portal: I.Portal,
   Backdrop: Br,
   Popup: zr,
   Title: Fr,
   Description: _r,
-  Close: M.Close
+  Close: I.Close
 }, Oe = [
   "flex cursor-default items-center gap-2 rounded-(--gryt-radius-md)",
   "px-3 py-2 text-sm text-gryt-text outline-none select-none",
@@ -2879,7 +2894,7 @@ const zr = i(
   x
 ].join(" "), Vr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
-    p.Input,
+    b.Input,
     {
       ref: e,
       className: s("gryt-combobox-input", Ye, t),
@@ -2888,7 +2903,7 @@ const zr = i(
   );
 }), Ur = i(function({ className: t, sideOffset: r = 6, ...e }, n) {
   return /* @__PURE__ */ o(
-    p.Positioner,
+    b.Positioner,
     {
       ref: n,
       sideOffset: r,
@@ -2899,7 +2914,7 @@ const zr = i(
 }), Or = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
-      p.Popup,
+      b.Popup,
       {
         ref: e,
         className: s(
@@ -2914,7 +2929,7 @@ const zr = i(
   }
 ), Yr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
-    p.Item,
+    b.Item,
     {
       ref: e,
       className: s("gryt-combobox-item", Oe, t),
@@ -2923,7 +2938,7 @@ const zr = i(
   );
 }), Xr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
-    p.Empty,
+    b.Empty,
     {
       ref: e,
       className: s(
@@ -2933,27 +2948,27 @@ const zr = i(
       ...r
     }
   );
-}), Yo = {
-  Root: p.Root,
+}), Xo = {
+  Root: b.Root,
   Input: Vr,
-  InputGroup: p.InputGroup,
-  Trigger: p.Trigger,
-  Icon: p.Icon,
-  Clear: p.Clear,
-  Value: p.Value,
-  Chips: p.Chips,
-  Chip: p.Chip,
-  ChipRemove: p.ChipRemove,
-  Portal: p.Portal,
+  InputGroup: b.InputGroup,
+  Trigger: b.Trigger,
+  Icon: b.Icon,
+  Clear: b.Clear,
+  Value: b.Value,
+  Chips: b.Chips,
+  Chip: b.Chip,
+  ChipRemove: b.ChipRemove,
+  Portal: b.Portal,
   Positioner: Ur,
   Popup: Or,
-  List: p.List,
+  List: b.List,
   Item: Yr,
-  ItemIndicator: p.ItemIndicator,
-  Group: p.Group,
-  GroupLabel: p.GroupLabel,
+  ItemIndicator: b.ItemIndicator,
+  Group: b.Group,
+  GroupLabel: b.GroupLabel,
   Empty: Xr,
-  Separator: p.Separator
+  Separator: b.Separator
 }, Wr = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     h.Input,
@@ -3008,7 +3023,7 @@ const zr = i(
       ...r
     }
   );
-}), Xo = {
+}), Wo = {
   Root: h.Root,
   Input: Wr,
   InputGroup: h.InputGroup,
@@ -3025,7 +3040,7 @@ const zr = i(
   GroupLabel: h.GroupLabel,
   Empty: Zr,
   Separator: h.Separator
-}, Wo = i(
+}, Ko = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
       lt,
@@ -3073,11 +3088,11 @@ const zr = i(
       }
     );
   }
-), Ko = {
+), Jo = {
   Root: ge.Root,
   Trigger: qr,
   Panel: ea
-}, Jo = i(function({ className: t, ...r }, e) {
+}, Qo = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     ut,
     {
@@ -3112,7 +3127,7 @@ const zr = i(
       ...r
     }
   );
-}), Qo = { Root: ta, Legend: ra }, Zo = i(
+}), Zo = { Root: ta, Legend: ra }, qo = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
       gt,
@@ -3158,6 +3173,15 @@ const zr = i(
     }
   );
 }), na = i(function({ className: t, ...r }, e) {
+  return /* @__PURE__ */ o(
+    N.Positioner,
+    {
+      ref: e,
+      className: s("gryt-navigation-menu-positioner outline-none", t),
+      ...r
+    }
+  );
+}), sa = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     N.Viewport,
     {
@@ -3169,7 +3193,7 @@ const zr = i(
       ...r
     }
   );
-}), sa = i(function({ className: t, ...r }, e) {
+}), ca = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     N.Link,
     {
@@ -3184,20 +3208,20 @@ const zr = i(
       ...r
     }
   );
-}), qo = {
+}), en = {
   Root: N.Root,
   List: N.List,
   Item: N.Item,
   Trigger: aa,
   Content: N.Content,
   Portal: N.Portal,
-  Positioner: N.Positioner,
-  Viewport: na,
+  Positioner: na,
+  Viewport: sa,
   Popup: oa,
-  Link: sa,
+  Link: ca,
   Icon: N.Icon,
   Arrow: N.Arrow
-}, Le = "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", en = i(
+}, Le = "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", tn = i(
   function({ className: t, label: r, scrubbable: e = !1, ...n }, c) {
     return /* @__PURE__ */ m(
       D.Root,
@@ -3253,7 +3277,7 @@ const zr = i(
       }
     );
   }
-), tn = i(
+), rn = i(
   function({ className: t, length: r = 6, ...e }, n) {
     return /* @__PURE__ */ o(
       ve.Root,
@@ -3279,7 +3303,7 @@ const zr = i(
       }
     );
   }
-), ca = i(
+), ia = i(
   function({ className: t, sideOffset: r = 8, ...e }, n) {
     return /* @__PURE__ */ o(
       z.Positioner,
@@ -3291,7 +3315,7 @@ const zr = i(
       }
     );
   }
-), ia = i(
+), da = i(
   function({ className: t, ...r }, e) {
     return /* @__PURE__ */ o(
       z.Popup,
@@ -3307,14 +3331,14 @@ const zr = i(
       }
     );
   }
-), rn = {
+), an = {
   Root: z.Root,
   Trigger: z.Trigger,
   Portal: z.Portal,
-  Positioner: ca,
-  Popup: ia,
+  Positioner: ia,
+  Popup: da,
   Arrow: z.Arrow
-}, da = i(function({ className: t, ...r }, e) {
+}, la = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     B.Root,
     {
@@ -3327,7 +3351,7 @@ const zr = i(
       ...r
     }
   );
-}), la = i(function({ className: t, ...r }, e) {
+}), ua = i(function({ className: t, ...r }, e) {
   return /* @__PURE__ */ o(
     B.Separator,
     {
@@ -3336,89 +3360,89 @@ const zr = i(
       ...r
     }
   );
-}), an = {
-  Root: da,
+}), on = {
+  Root: la,
   Group: B.Group,
   Button: B.Button,
   Link: B.Link,
   Input: B.Input,
-  Separator: la
+  Separator: ua
 };
 export {
-  Go as Accordion,
-  $o as Alert,
-  Oo as AlertDialog,
-  Xo as Autocomplete,
+  jo as Accordion,
+  Co as Alert,
+  Yo as AlertDialog,
+  Wo as Autocomplete,
   Ft as Avatar,
-  yo as Badge,
-  Mt as Button,
-  To as Card,
-  Ro as CardActions,
-  So as CardContent,
-  Lo as CardHeader,
+  mo as Badge,
+  It as Button,
+  Lo as Card,
+  $o as CardActions,
+  Ro as CardContent,
+  So as CardHeader,
   bo as Checkbox,
-  Wo as CheckboxGroup,
-  mo as Chip,
-  Ko as Collapsible,
-  Yo as Combobox,
-  go as Composer,
-  jo as ContextMenu,
-  fo as ConversationItem,
-  Mo as Dialog,
-  ko as Divider,
-  Ho as Drawer,
-  Qo as Fieldset,
-  Jo as Form,
+  Ko as CheckboxGroup,
+  po as Chip,
+  Jo as Collapsible,
+  Xo as Combobox,
+  fo as Composer,
+  Eo as ContextMenu,
+  yo as ConversationItem,
+  Ho as Dialog,
+  To as Divider,
+  Do as Drawer,
+  Zo as Fieldset,
+  Qo as Form,
   ee as GRYT_HUE_KEYS,
   je as GRYT_NEUTRAL_KEYS,
   fe as GRYT_RADIUS_KEYS,
   Pt as GRYT_THEME_NAME_MAX,
-  ro as GrytProvider,
-  co as IconButton,
+  ao as GrytProvider,
+  io as IconButton,
   ie as Menu,
-  Zo as Menubar,
-  lo as MessageBubble,
-  Uo as Meter,
-  qo as NavigationMenu,
-  en as NumberField,
-  tn as OtpField,
-  Eo as Popover,
-  rn as PreviewCard,
-  Co as Progress,
-  po as Radio,
-  ho as RadioGroup,
-  Fo as ScrollArea,
-  vo as Select,
+  qo as Menubar,
+  uo as MessageBubble,
+  Oo as Meter,
+  en as NavigationMenu,
+  tn as NumberField,
+  rn as OtpField,
+  zo as Popover,
+  an as PreviewCard,
+  Ao as Progress,
+  ho as Radio,
+  xo as RadioGroup,
+  _o as ScrollArea,
+  No as Select,
   Io as Skeleton,
-  wo as Slider,
-  Ao as Spinner,
-  io as Surface,
-  xo as Switch,
+  vo as Slider,
+  Mo as Spinner,
+  lo as Surface,
+  wo as Switch,
   yr as Tab,
-  Do as Tabs,
-  uo as TextField,
-  zo as Toast,
-  _o as Toggle,
-  Vo as ToggleGroup,
-  an as Toolbar,
-  No as Tooltip,
-  Po as TooltipProvider,
+  Go as Tabs,
+  go as TextField,
+  Bo as Toast,
+  Vo as Toggle,
+  Uo as ToggleGroup,
+  on as Toolbar,
+  Po as Tooltip,
+  ko as TooltipProvider,
   Ee as cloneGrytTheme,
   s as cn,
-  qa as contrast,
+  eo as contrast,
   vt as createGrytTheme,
-  no as decodeGrytTheme,
-  oo as encodeGrytTheme,
-  eo as grytAlphaScales,
-  to as grytAlphaScalesLight,
+  so as decodeGrytTheme,
+  no as encodeGrytTheme,
+  to as grytAlphaScales,
+  ro as grytAlphaScalesLight,
   T as grytLightTokens,
   Ct as grytPresets,
-  so as grytPresetsById,
+  co as grytPresetsById,
   Pe as grytScales,
   le as grytScalesLight,
   F as grytTheme,
   kt as grytThemeHues,
-  ao as grytThemeToOptions,
+  oo as grytThemeToOptions,
   u as grytTokens,
   J as hexToOklch,
   Be as isHexColor,
@@ -3426,6 +3450,6 @@ export {
   ye as normalizeThemeName,
   $ as oklchToHex,
   Zt as useMediaQuery,
-  Bo as useToastManager
+  Fo as useToastManager
 };
 //# sourceMappingURL=index.js.map