@equal-experts/kuat-react 0.14.0 → 0.15.0-beta.1

package/dist/index.js

@@ -2,33 +2,34 @@ import { c as d } from "./utils-DLUjLwnh.js";
 import { S as be } from "./button-group-enIzvVeN.js";
 import { d as Sa, B as Ha, a as Ta, b as ya, c as Da } from "./button-group-enIzvVeN.js";
 import { jsxs as s, jsx as e, Fragment as M } from "react/jsx-runtime";
-import * as o from "react";
+import * as i from "react";
+import { a as Va, C as Ia } from "./callout-DFmAtUwR.js";
 import { ChevronRight as $, Menu as Ve, ChevronLeft as Ie, X as xe, User as ee, LayoutGrid as ke, ChevronDown as se, MoreHorizontal as Me } from "lucide-react";
 import { B as J } from "./button-C0a1gFoV.js";
-import { d as Va, c as Ia, a as xa, b as Ma } from "./button-C0a1gFoV.js";
+import { d as Ma, c as Ba, a as Oa, b as Pa } from "./button-C0a1gFoV.js";
 import { I as Be } from "./icon-button-B5hCoK1b.js";
-import { b as Oa, a as Pa, e as Ua, d as Fa, c as Za, i as Ka } from "./icon-button-B5hCoK1b.js";
+import { b as Fa, a as Za, e as Ka, d as $a, c as Ga, i as qa } from "./icon-button-B5hCoK1b.js";
 import * as b from "@radix-ui/react-dropdown-menu";
-import { C as Ga, a as qa, b as ja, d as Ya, c as za, u as Xa } from "./carousel-B_FcJvc1.js";
-import { K as Ja, a as Qa, b as er, d as ar, c as rr, u as lr } from "./kuat-carousel-DUR-L0dP.js";
-import { b as sr, a as nr, K as ir } from "./kuat-radial-progress-YcpYzHjk.js";
-import { A as dr, c as cr, a as ur, b as hr } from "./accordion-CUlVo4uo.js";
-import { A as pr, i as _r, j as br, d as kr, h as fr, f as Nr, e as gr, b as Cr, a as vr, g as wr, c as Ar } from "./alert-dialog-yHaNWLGX.js";
-import { c as Lr, a as Sr, B as Hr, b as Tr } from "./badge-BZgdEQSD.js";
-import { a as Dr, T as Rr } from "./textarea-B0irOcAM.js";
-import { a as Ir, I as xr } from "./input-DmkHok33.js";
-import { j as Br, F as Or, a as Pr, b as Ur, c as Fr, d as Zr, e as Kr, f as $r, g as Gr, h as qr, i as jr } from "./field-CpIBifwy.js";
-import { K as zr, j as Xr, k as Wr, S as Jr, a as Qr, b as el, c as al, d as rl, e as ll, f as tl, g as sl, h as nl, i as il } from "./select-CkwcI4vN.js";
-import { b as dl, c as cl, C as ul, a as hl } from "./checkbox-field-7OmstdY0.js";
-import { c as pl, d as _l, b as bl, R as kl, a as fl } from "./radio-field-BD77QCpO.js";
-import { b as gl, c as Cl, S as vl, a as wl } from "./switch-field-xn_CPJH7.js";
-import { a as El, b as Ll, T as Sl, c as Hl, d as Tl } from "./constants-Cfitvm6L.js";
-import { a as Dl, S as Rl, b as Vl, t as Il } from "./sonner-content-CXBD6jNn.js";
-const fa = o.forwardRef(function({
+import { C as ja, a as za, b as Xa, d as Wa, c as Ja, u as Qa } from "./carousel-B_FcJvc1.js";
+import { K as ar, a as rr, b as lr, d as tr, c as sr, u as nr } from "./kuat-carousel-DUR-L0dP.js";
+import { b as ir, a as dr, K as cr } from "./kuat-radial-progress-YcpYzHjk.js";
+import { A as hr, c as mr, a as pr, b as _r } from "./accordion-CUlVo4uo.js";
+import { A as kr, i as fr, j as Nr, d as gr, h as Cr, f as vr, e as wr, b as Ar, a as Er, g as Lr, c as Sr } from "./alert-dialog-yHaNWLGX.js";
+import { c as Tr, a as yr, B as Dr, b as Rr } from "./badge-BZgdEQSD.js";
+import { a as Ir, T as xr } from "./textarea-B0irOcAM.js";
+import { a as Br, I as Or } from "./input-DmkHok33.js";
+import { j as Ur, F as Fr, a as Zr, b as Kr, c as $r, d as Gr, e as qr, f as Yr, g as jr, h as zr, i as Xr } from "./field-CpIBifwy.js";
+import { K as Jr, j as Qr, k as el, S as al, a as rl, b as ll, c as tl, d as sl, e as nl, f as ol, g as il, h as dl, i as cl } from "./select-CkwcI4vN.js";
+import { b as hl, c as ml, C as pl, a as _l } from "./checkbox-field-7OmstdY0.js";
+import { c as kl, d as fl, b as Nl, R as gl, a as Cl } from "./radio-field-BD77QCpO.js";
+import { b as wl, c as Al, S as El, a as Ll } from "./switch-field-xn_CPJH7.js";
+import { a as Hl, b as Tl, T as yl, c as Dl, d as Rl } from "./constants-Cfitvm6L.js";
+import { a as Il, S as xl, b as Ml, t as Bl } from "./sonner-content-CXBD6jNn.js";
+const fa = i.forwardRef(function({
   className: r,
   asChild: l = !1,
   width: t = "default",
-  maxWidth: i = "373px",
+  maxWidth: o = "373px",
   imageSrc: u = null,
   imageAlt: h = "",
   contentText: N = null,
@@ -45,8 +46,8 @@ const fa = o.forwardRef(function({
 }, w) {
   const H = `h${V}`, L = t === "fluid" ? "content-card--width-fluid" : t === "custom" ? "content-card--width-custom" : "content-card--width-default", T = t === "custom" ? {
     ...E ?? {},
-    "--content-card-max-width": typeof i == "number" ? `${i}px` : i ?? "373px"
-  } : E, j = /* @__PURE__ */ s(M, { children: [
+    "--content-card-max-width": typeof o == "number" ? `${o}px` : o ?? "373px"
+  } : E, Y = /* @__PURE__ */ s(M, { children: [
     u !== null ? /* @__PURE__ */ e("div", { className: "content-card__media", children: /* @__PURE__ */ e("img", { className: "content-card__media-img", alt: h, src: u }) }) : null,
     /* @__PURE__ */ s("div", { className: "content-card__body", children: [
       /* @__PURE__ */ s("div", { className: "content-card__heading-row", children: [
@@ -72,11 +73,11 @@ const fa = o.forwardRef(function({
     ] })
   ] });
   if (l) {
-    const I = o.Children.only(v);
-    if (!o.isValidElement(I))
+    const I = i.Children.only(v);
+    if (!i.isValidElement(I))
       throw new Error("ContentCard: when `asChild` is true, provide a single React element child.");
     const D = I;
-    return o.cloneElement(
+    return i.cloneElement(
       D,
       {
         ...S,
@@ -88,7 +89,7 @@ const fa = o.forwardRef(function({
           ...T
         } : T ?? D.props.style
       },
-      j
+      Y
     );
   }
   return /* @__PURE__ */ e(
@@ -99,13 +100,13 @@ const fa = o.forwardRef(function({
       className: d("content-card", L, r),
       style: T,
       ...S,
-      children: j
+      children: Y
     }
   );
-}), B = b.Root, O = b.Trigger, G = b.Group, Oe = o.forwardRef(({ className: a, inset: r, children: l, ...t }, i) => /* @__PURE__ */ s(
+}), B = b.Root, O = b.Trigger, G = b.Group, Oe = i.forwardRef(({ className: a, inset: r, children: l, ...t }, o) => /* @__PURE__ */ s(
   b.SubTrigger,
   {
-    ref: i,
+    ref: o,
     className: d(
       "dropdown-menu-sub-trigger",
       r && "dropdown-menu-sub-trigger--inset",
@@ -119,7 +120,7 @@ const fa = o.forwardRef(function({
   }
 ));
 Oe.displayName = b.SubTrigger.displayName;
-const Pe = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
+const Pe = i.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
   b.SubContent,
   {
     ref: l,
@@ -128,7 +129,7 @@ const Pe = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
   }
 ));
 Pe.displayName = b.SubContent.displayName;
-const q = o.forwardRef(({ className: a, sideOffset: r = 4, ...l }, t) => /* @__PURE__ */ e(b.Portal, { children: /* @__PURE__ */ e(
+const q = i.forwardRef(({ className: a, sideOffset: r = 4, ...l }, t) => /* @__PURE__ */ e(b.Portal, { children: /* @__PURE__ */ e(
   b.Content,
   {
     ref: t,
@@ -138,7 +139,7 @@ const q = o.forwardRef(({ className: a, sideOffset: r = 4, ...l }, t) => /* @__P
   }
 ) }));
 q.displayName = b.Content.displayName;
-const P = o.forwardRef(({ className: a, inset: r, ...l }, t) => /* @__PURE__ */ e(
+const P = i.forwardRef(({ className: a, inset: r, ...l }, t) => /* @__PURE__ */ e(
   b.Item,
   {
     ref: t,
@@ -151,10 +152,10 @@ const P = o.forwardRef(({ className: a, inset: r, ...l }, t) => /* @__PURE__ */
   }
 ));
 P.displayName = b.Item.displayName;
-const Ue = o.forwardRef(({ className: a, children: r, checked: l, ...t }, i) => /* @__PURE__ */ e(
+const Ue = i.forwardRef(({ className: a, children: r, checked: l, ...t }, o) => /* @__PURE__ */ e(
   b.CheckboxItem,
   {
-    ref: i,
+    ref: o,
     className: d("dropdown-menu-item", "dropdown-menu-checkbox-item", a),
     checked: l,
     ...t,
@@ -162,7 +163,7 @@ const Ue = o.forwardRef(({ className: a, children: r, checked: l, ...t }, i) =>
   }
 ));
 Ue.displayName = b.CheckboxItem.displayName;
-const Fe = o.forwardRef(({ className: a, children: r, ...l }, t) => /* @__PURE__ */ e(
+const Fe = i.forwardRef(({ className: a, children: r, ...l }, t) => /* @__PURE__ */ e(
   b.RadioItem,
   {
     ref: t,
@@ -172,7 +173,7 @@ const Fe = o.forwardRef(({ className: a, children: r, ...l }, t) => /* @__PURE__
   }
 ));
 Fe.displayName = b.RadioItem.displayName;
-const Ze = o.forwardRef(({ className: a, inset: r, ...l }, t) => /* @__PURE__ */ e(
+const Ze = i.forwardRef(({ className: a, inset: r, ...l }, t) => /* @__PURE__ */ e(
   b.Label,
   {
     ref: t,
@@ -185,7 +186,7 @@ const Ze = o.forwardRef(({ className: a, inset: r, ...l }, t) => /* @__PURE__ */
   }
 ));
 Ze.displayName = b.Label.displayName;
-const Ke = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
+const Ke = i.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
   b.Separator,
   {
     ref: l,
@@ -209,23 +210,23 @@ function Ge(a) {
   return a ? a.loading || a.apps.length > 0 ? !0 : a.empty === "message" : !1;
 }
 function qe(a) {
-  var r, l, t, i, u;
+  var r, l, t, o, u;
   return {
     trigger: ((r = a == null ? void 0 : a.labels) == null ? void 0 : r.trigger) ?? x.trigger,
     nav: ((l = a == null ? void 0 : a.labels) == null ? void 0 : l.nav) ?? x.nav,
     title: ((t = a == null ? void 0 : a.labels) == null ? void 0 : t.title) ?? x.title,
-    teaserTitle: ((i = a == null ? void 0 : a.labels) == null ? void 0 : i.teaserTitle) ?? x.teaserTitle,
+    teaserTitle: ((o = a == null ? void 0 : a.labels) == null ? void 0 : o.teaserTitle) ?? x.teaserTitle,
     teaserDescription: ((u = a == null ? void 0 : a.labels) == null ? void 0 : u.teaserDescription) ?? x.teaserDescription
   };
 }
 function fe(a) {
   return (a == null ? void 0 : a.emptyMessage) ?? $e;
 }
-function je(a) {
+function Ye(a) {
   var r, l;
   return !!((l = (r = a == null ? void 0 : a.mobile) == null ? void 0 : r.items) != null && l.length);
 }
-function Ye(a) {
+function je(a) {
   var r;
   return !!((r = a == null ? void 0 : a.items) != null && r.length);
 }
@@ -242,8 +243,8 @@ function ze(a) {
 }
 function Xe(a) {
   var k, _;
-  const r = a == null ? void 0 : a.labels, l = a == null ? void 0 : a.mobile, t = (_ = (k = a == null ? void 0 : a.items) == null ? void 0 : k[0]) == null ? void 0 : _.label, i = (r == null ? void 0 : r.teaserTitle) ?? (l == null ? void 0 : l.heading) ?? Q.teaserTitle, u = (r == null ? void 0 : r.teaserDescription) ?? (l == null ? void 0 : l.subtitle) ?? (t ? `Signed in as ${t}` : ""), h = (r == null ? void 0 : r.title) ?? (l == null ? void 0 : l.heading) ?? Q.title, N = (r == null ? void 0 : r.nav) ?? Q.nav;
-  return { teaserTitle: i, teaserDescription: u, nav: N, title: h };
+  const r = a == null ? void 0 : a.labels, l = a == null ? void 0 : a.mobile, t = (_ = (k = a == null ? void 0 : a.items) == null ? void 0 : k[0]) == null ? void 0 : _.label, o = (r == null ? void 0 : r.teaserTitle) ?? (l == null ? void 0 : l.heading) ?? Q.teaserTitle, u = (r == null ? void 0 : r.teaserDescription) ?? (l == null ? void 0 : l.subtitle) ?? (t ? `Signed in as ${t}` : ""), h = (r == null ? void 0 : r.title) ?? (l == null ? void 0 : l.heading) ?? Q.title, N = (r == null ? void 0 : r.nav) ?? Q.nav;
+  return { teaserTitle: o, teaserDescription: u, nav: N, title: h };
 }
 function We(a) {
   var r, l;
@@ -355,8 +356,8 @@ function ra({
   variant: r
 }) {
   const l = ze(a), t = Ne(a);
-  return /* @__PURE__ */ e("div", { className: "kuat-header__actions-items", children: a.items.map((i, u) => {
-    const h = i.icon ?? /* @__PURE__ */ e(ee, { className: "h-4 w-4", "aria-hidden": !0 });
+  return /* @__PURE__ */ e("div", { className: "kuat-header__actions-items", children: a.items.map((o, u) => {
+    const h = o.icon ?? /* @__PURE__ */ e(ee, { className: "h-4 w-4", "aria-hidden": !0 });
     return l && u === 0 ? /* @__PURE__ */ s(B, { children: [
       /* @__PURE__ */ e(O, { asChild: !0, children: /* @__PURE__ */ s(
         "button",
@@ -369,26 +370,26 @@ function ra({
           "aria-haspopup": "menu",
           children: [
             h,
-            /* @__PURE__ */ e("span", { className: "hidden sm:inline", children: i.label }),
+            /* @__PURE__ */ e("span", { className: "hidden sm:inline", children: o.label }),
             /* @__PURE__ */ e(se, { className: "h-4 w-4", "aria-hidden": !0 })
           ]
         }
       ) }),
       /* @__PURE__ */ e(Ce, { items: t })
-    ] }, `${i.label}-${i.href}`) : /* @__PURE__ */ s(
+    ] }, `${o.label}-${o.href}`) : /* @__PURE__ */ s(
       "a",
       {
-        href: i.href,
+        href: o.href,
         className: d(
           "kuat-header__action-link",
           r === "bold" && "kuat-header__action-link--bold"
         ),
         children: [
           h,
-          /* @__PURE__ */ e("span", { children: i.label })
+          /* @__PURE__ */ e("span", { children: o.label })
         ]
       },
-      `${i.label}-${i.href}`
+      `${o.label}-${o.href}`
     );
   }) });
 }
@@ -396,7 +397,7 @@ function la({
   config: a,
   labels: r
 }) {
-  const l = fe(a), t = a.apps, i = a.loading, u = a.empty ?? "hide", h = a.linkTarget, N = a.onSelect, k = a.onOpen;
+  const l = fe(a), t = a.apps, o = a.loading, u = a.empty ?? "hide", h = a.linkTarget, N = a.onSelect, k = a.onOpen;
   return /* @__PURE__ */ s(
     B,
     {
@@ -424,7 +425,7 @@ function la({
             id: _e,
             align: "end",
             className: "kuat-header__app-switcher-panel",
-            children: /* @__PURE__ */ e(G, { className: "kuat-header__app-switcher-scroll", children: i ? /* @__PURE__ */ s(M, { children: [
+            children: /* @__PURE__ */ e(G, { className: "kuat-header__app-switcher-scroll", children: o ? /* @__PURE__ */ s(M, { children: [
               /* @__PURE__ */ e("div", { className: "kuat-header__app-switcher-skeleton", "aria-hidden": !0 }),
               /* @__PURE__ */ e("div", { className: "kuat-header__app-switcher-skeleton", "aria-hidden": !0 }),
               /* @__PURE__ */ e("div", { className: "kuat-header__app-switcher-skeleton", "aria-hidden": !0 })
@@ -451,13 +452,13 @@ function la({
     }
   );
 }
-const ta = o.forwardRef(
+const ta = i.forwardRef(
   ({
     className: a,
     variant: r = "default",
     logo: l,
     title: t,
-    navigation: i,
+    navigation: o,
     account: u,
     accountMarkup: h,
     mobileMenuTrigger: N,
@@ -469,22 +470,22 @@ const ta = o.forwardRef(
     ...C
   }, V) => {
     var ue, he;
-    const v = Xe(u), E = je(u), S = Ye(u), w = qe(p), H = Ge(p), L = We({ logo: l, lockup: _ }), T = ea(i), I = !k && (T || S || !!h || H || E), D = Je({
+    const v = Xe(u), E = Ye(u), S = je(u), w = qe(p), H = Ge(p), L = We({ logo: l, lockup: _ }), T = ea(o), I = !k && (T || S || !!h || H || E), D = Je({
       mobileMenuAriaLabel: y,
       showAppSwitcher: H,
       hasStructuredNavigation: T,
       hasAccountMobileTier: E
-    }), [A, Y] = o.useState(!1), [f, U] = o.useState("main"), z = o.useRef(null), F = o.useRef(null), ne = o.useRef(null), ie = o.useRef(null), oe = o.useRef(null), X = o.useRef(null), W = o.useRef(null);
-    o.useEffect(() => {
+    }), [A, j] = i.useState(!1), [f, U] = i.useState("main"), z = i.useRef(null), F = i.useRef(null), ne = i.useRef(null), oe = i.useRef(null), ie = i.useRef(null), X = i.useRef(null), W = i.useRef(null);
+    i.useEffect(() => {
       A || U("main");
-    }, [A]), o.useEffect(() => {
+    }, [A]), i.useEffect(() => {
       if (!A)
         return;
       const n = document.body, c = n.style.overflow;
       return n.style.overflow = "hidden", () => {
         n.style.overflow = c, z.current && z.current.focus();
       };
-    }, [A]), o.useEffect(() => {
+    }, [A]), i.useEffect(() => {
       if (!A)
         return;
       const n = window.requestAnimationFrame(() => {
@@ -493,19 +494,19 @@ const ta = o.forwardRef(
         (m = c == null ? void 0 : c.querySelector("button, a, [tabindex]:not([tabindex='-1'])")) == null || m.focus();
       });
       return () => window.cancelAnimationFrame(n);
-    }, [A, f]), o.useEffect(() => {
-      const n = oe.current, c = X.current, m = W.current;
+    }, [A, f]), i.useEffect(() => {
+      const n = ie.current, c = X.current, m = W.current;
       if (!A) {
         n == null || n.removeAttribute("inert"), c == null || c.removeAttribute("inert"), m == null || m.removeAttribute("inert");
         return;
       }
       n && (f !== "main" ? n.setAttribute("inert", "") : n.removeAttribute("inert")), c && (f !== "apps" ? c.setAttribute("inert", "") : c.removeAttribute("inert")), m && (f !== "account" ? m.setAttribute("inert", "") : m.removeAttribute("inert"));
-    }, [A, f]), o.useEffect(() => {
+    }, [A, f]), i.useEffect(() => {
       if (!A)
         return;
       const n = (c) => {
         if (c.key === "Escape") {
-          c.preventDefault(), Y(!1);
+          c.preventDefault(), j(!1);
           return;
         }
         if (c.key !== "Tab" || !F.current)
@@ -562,7 +563,7 @@ const ta = o.forwardRef(
               t && R === "default" && /* @__PURE__ */ e("h1", { className: "kuat-header__desktop-title", children: t })
             ] }),
             /* @__PURE__ */ s("div", { className: "kuat-header__desktop-right", children: [
-              T ? i.length > 0 && /* @__PURE__ */ e("nav", { "aria-label": "Primary navigation", children: /* @__PURE__ */ e(aa, { items: i, variant: r }) }) : i ? /* @__PURE__ */ e("nav", { className: "flex items-center", children: i }) : null,
+              T ? o.length > 0 && /* @__PURE__ */ e("nav", { "aria-label": "Primary navigation", children: /* @__PURE__ */ e(aa, { items: o, variant: r }) }) : o ? /* @__PURE__ */ e("nav", { className: "flex items-center", children: o }) : null,
               H && p ? /* @__PURE__ */ e("div", { className: "kuat-header__nav-dropdown-wrap", children: /* @__PURE__ */ e(
                 la,
                 {
@@ -598,7 +599,7 @@ const ta = o.forwardRef(
                 "aria-label": "Open menu",
                 "aria-expanded": A,
                 "aria-controls": "kuat-header-mobile-menu",
-                onClick: () => Y(!0),
+                onClick: () => j(!0),
                 children: /* @__PURE__ */ e(Ve, { className: "h-6 w-6", "aria-hidden": !0 })
               }
             ) : null
@@ -632,7 +633,7 @@ const ta = o.forwardRef(
                             const n = f;
                             U("main"), requestAnimationFrame(() => {
                               var c, m;
-                              n === "apps" ? (c = ne.current) == null || c.focus() : (m = ie.current) == null || m.focus();
+                              n === "apps" ? (c = ne.current) == null || c.focus() : (m = oe.current) == null || m.focus();
                             });
                           },
                           children: [
@@ -648,7 +649,7 @@ const ta = o.forwardRef(
                           size: "icon",
                           className: "kuat-header__mobile-close",
                           "aria-label": "Close menu",
-                          onClick: () => Y(!1),
+                          onClick: () => j(!1),
                           children: /* @__PURE__ */ e(xe, { className: "h-6 w-6", "aria-hidden": !0 })
                         }
                       )
@@ -658,7 +659,7 @@ const ta = o.forwardRef(
                 /* @__PURE__ */ s(
                   "div",
                   {
-                    ref: oe,
+                    ref: ie,
                     className: d(
                       "kuat-header__mobile-panel",
                       f !== "main" && "kuat-header__mobile-panel--hidden"
@@ -666,7 +667,7 @@ const ta = o.forwardRef(
                     "aria-hidden": f !== "main",
                     children: [
                       /* @__PURE__ */ s("div", { className: "kuat-header__mobile-panel-inner", children: [
-                        /* @__PURE__ */ e("div", { className: "kuat-header__mobile-sheet-nav", children: T && i.length > 0 && /* @__PURE__ */ e("nav", { "aria-label": "Primary navigation", children: /* @__PURE__ */ e("ul", { className: "kuat-header__mobile-list", children: i.map((n) => {
+                        /* @__PURE__ */ e("div", { className: "kuat-header__mobile-sheet-nav", children: T && o.length > 0 && /* @__PURE__ */ e("nav", { "aria-label": "Primary navigation", children: /* @__PURE__ */ e("ul", { className: "kuat-header__mobile-list", children: o.map((n) => {
                           var c;
                           return /* @__PURE__ */ s("li", { children: [
                             /* @__PURE__ */ e("a", { href: n.url, className: "kuat-header__mobile-link", children: n.label }),
@@ -677,7 +678,7 @@ const ta = o.forwardRef(
                           E ? /* @__PURE__ */ e("div", { className: "kuat-header__mobile-app-teaser-wrap", children: /* @__PURE__ */ s(
                             "button",
                             {
-                              ref: ie,
+                              ref: oe,
                               type: "button",
                               className: "kuat-header__mobile-app-teaser",
                               "aria-label": v.teaserDescription ? `${v.teaserTitle}, ${v.teaserDescription}` : v.teaserTitle,
@@ -808,16 +809,16 @@ function Ca(a) {
   const r = (a == null ? void 0 : a.variant) ?? "default";
   return d("kuat-header", `kuat-header--${r}`);
 }
-const va = ["service", "demo"], wa = ["light", "dark"], sa = o.forwardRef(
+const va = ["service", "demo"], wa = ["light", "dark"], sa = i.forwardRef(
   ({
     className: a,
     title: r,
     use: l = "service",
     mode: t = "light",
-    forceDark: i = !1,
+    forceDark: o = !1,
     ...u
   }, h) => {
-    const N = i ? "dark" : t, k = /* @__PURE__ */ e(
+    const N = o ? "dark" : t, k = /* @__PURE__ */ e(
       ae,
       {
         className: d(
@@ -902,7 +903,7 @@ function Aa({ className: a }) {
     }
   );
 }
-const ve = o.forwardRef(({ className: a, "aria-label": r = "Breadcrumb", ...l }, t) => /* @__PURE__ */ e(
+const ve = i.forwardRef(({ className: a, "aria-label": r = "Breadcrumb", ...l }, t) => /* @__PURE__ */ e(
   "nav",
   {
     ref: t,
@@ -912,24 +913,24 @@ const ve = o.forwardRef(({ className: a, "aria-label": r = "Breadcrumb", ...l },
   }
 ));
 ve.displayName = "BreadcrumbRoot";
-const we = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e("ol", { ref: l, className: d("breadcrumb-list", a), ...r }));
+const we = i.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e("ol", { ref: l, className: d("breadcrumb-list", a), ...r }));
 we.displayName = "BreadcrumbList";
-const re = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e("li", { ref: l, className: d("breadcrumb-item", a), ...r }));
+const re = i.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e("li", { ref: l, className: d("breadcrumb-item", a), ...r }));
 re.displayName = "BreadcrumbItem";
-const Ae = o.forwardRef(({ className: a, render: r, asChild: l = !1, ...t }, i) => {
+const Ae = i.forwardRef(({ className: a, render: r, asChild: l = !1, ...t }, o) => {
   var u;
   if (r) {
     const h = r.props;
-    return o.cloneElement(r, {
+    return i.cloneElement(r, {
       ...t,
-      ref: i,
+      ref: o,
       className: d("breadcrumb-link", h == null ? void 0 : h.className, a)
     });
   }
-  if (l && o.Children.only(t.children)) {
-    const h = o.Children.only(t.children);
-    return o.cloneElement(h, {
-      ref: i,
+  if (l && i.Children.only(t.children)) {
+    const h = i.Children.only(t.children);
+    return i.cloneElement(h, {
+      ref: o,
       className: d("breadcrumb-link", (u = h.props) == null ? void 0 : u.className, a),
       ...t
     });
@@ -937,14 +938,14 @@ const Ae = o.forwardRef(({ className: a, render: r, asChild: l = !1, ...t }, i)
   return /* @__PURE__ */ e(
     "a",
     {
-      ref: i,
+      ref: o,
       className: d("breadcrumb-link", a),
       ...t
     }
   );
 });
 Ae.displayName = "BreadcrumbLink";
-const le = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
+const le = i.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
   "span",
   {
     ref: l,
@@ -956,7 +957,7 @@ const le = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
   }
 ));
 le.displayName = "BreadcrumbPage";
-const te = o.forwardRef(({ className: a, children: r, ...l }, t) => /* @__PURE__ */ e(
+const te = i.forwardRef(({ className: a, children: r, ...l }, t) => /* @__PURE__ */ e(
   "span",
   {
     ref: t,
@@ -968,7 +969,7 @@ const te = o.forwardRef(({ className: a, children: r, ...l }, t) => /* @__PURE__
   }
 ));
 te.displayName = "BreadcrumbSeparator";
-const Ee = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
+const Ee = i.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
   "span",
   {
     ref: l,
@@ -981,16 +982,16 @@ const Ee = o.forwardRef(({ className: a, ...r }, l) => /* @__PURE__ */ e(
 ));
 Ee.displayName = "BreadcrumbEllipsis";
 const na = 640;
-function ia(a = na) {
-  const [r, l] = o.useState(!1);
-  return o.useEffect(() => {
+function oa(a = na) {
+  const [r, l] = i.useState(!1);
+  return i.useEffect(() => {
     if (typeof window > "u" || typeof window.matchMedia != "function")
       return;
-    const t = window.matchMedia(`(max-width: ${a}px)`), i = () => l(t.matches);
-    return i(), t.addEventListener("change", i), () => t.removeEventListener("change", i);
+    const t = window.matchMedia(`(max-width: ${a}px)`), o = () => l(t.matches);
+    return o(), t.addEventListener("change", o), () => t.removeEventListener("change", o);
   }, [a]), r;
 }
-const oa = ({ href: a, children: r, className: l }) => /* @__PURE__ */ e("a", { href: a, className: l, children: r });
+const ia = ({ href: a, children: r, className: l }) => /* @__PURE__ */ e("a", { href: a, className: l, children: r });
 function da(a, r, l, t) {
   return a.children && a.children.length > 0 ? /* @__PURE__ */ s(B, { children: [
     /* @__PURE__ */ e(O, { asChild: !0, children: /* @__PURE__ */ s(
@@ -1025,13 +1026,13 @@ function da(a, r, l, t) {
 }
 function ca({
   items: a,
-  linkComponent: r = oa,
+  linkComponent: r = ia,
   separator: l,
   className: t,
-  "aria-label": i = "Breadcrumb",
+  "aria-label": o = "Breadcrumb",
   ...u
 }, h) {
-  const N = ia();
+  const N = oa();
   if (!a.length) return null;
   const k = N && a.length > 2, _ = k ? [a[0], a[a.length - 1]] : a, y = (k ? a.slice(1, -1) : []).flatMap(
     (g) => g.href ? [{ label: g.label, href: g.href }] : (g.children ?? []).map((C) => ({ label: C.label, href: C.href }))
@@ -1040,12 +1041,12 @@ function ca({
     ve,
     {
       ref: h,
-      "aria-label": i,
+      "aria-label": o,
       className: t,
       ...u,
       children: /* @__PURE__ */ e(we, { children: _.map((g, C) => {
         const V = k ? C === 0 ? 0 : a.length - 1 : C, E = C === _.length - 1 && !g.href && !g.children;
-        return /* @__PURE__ */ s(o.Fragment, { children: [
+        return /* @__PURE__ */ s(i.Fragment, { children: [
           C > 0 && /* @__PURE__ */ e(te, { children: l }),
           k && C === 1 && y.length > 0 && /* @__PURE__ */ s(M, { children: [
             /* @__PURE__ */ e(re, { children: /* @__PURE__ */ s(B, { children: [
@@ -1075,33 +1076,33 @@ function ca({
     }
   );
 }
-const ua = o.forwardRef(
+const ua = i.forwardRef(
   ca
 );
 ua.displayName = "Breadcrumb";
 export {
-  dr as Accordion,
-  cr as AccordionContent,
-  ur as AccordionItem,
-  hr as AccordionTrigger,
-  pr as AlertDialog,
-  _r as AlertDialogAction,
-  br as AlertDialogCancel,
-  kr as AlertDialogContent,
-  fr as AlertDialogDescription,
-  Nr as AlertDialogFooter,
-  gr as AlertDialogHeader,
-  Cr as AlertDialogOverlay,
-  vr as AlertDialogPortal,
-  wr as AlertDialogTitle,
-  Ar as AlertDialogTrigger,
-  Lr as BADGE_ROUNDNESS,
-  Sr as BADGE_VARIANTS,
-  Va as BUTTON_COLORS,
+  hr as Accordion,
+  mr as AccordionContent,
+  pr as AccordionItem,
+  _r as AccordionTrigger,
+  kr as AlertDialog,
+  fr as AlertDialogAction,
+  Nr as AlertDialogCancel,
+  gr as AlertDialogContent,
+  Cr as AlertDialogDescription,
+  vr as AlertDialogFooter,
+  wr as AlertDialogHeader,
+  Ar as AlertDialogOverlay,
+  Er as AlertDialogPortal,
+  Lr as AlertDialogTitle,
+  Sr as AlertDialogTrigger,
+  Tr as BADGE_ROUNDNESS,
+  yr as BADGE_VARIANTS,
+  Ma as BUTTON_COLORS,
   Sa as BUTTON_GROUP_ORIENTATIONS,
-  Ia as BUTTON_SIZES,
-  xa as BUTTON_VARIANTS,
-  Hr as Badge,
+  Ba as BUTTON_SIZES,
+  Oa as BUTTON_VARIANTS,
+  Dr as Badge,
   ua as Breadcrumb,
   Ee as BreadcrumbEllipsis,
   re as BreadcrumbItem,
@@ -1114,93 +1115,95 @@ export {
   Ha as ButtonGroup,
   Ta as ButtonGroupSeparator,
   ya as ButtonGroupText,
-  dl as CHECKBOX_FIELD_APPEARANCES,
-  cl as CHECKBOX_FIELD_LAYOUTS,
-  Ga as Carousel,
-  qa as CarouselContent,
-  ja as CarouselItem,
-  Ya as CarouselNext,
-  za as CarouselPrevious,
-  ul as Checkbox,
-  hl as CheckboxField,
+  Va as CALLOUT_TYPES,
+  hl as CHECKBOX_FIELD_APPEARANCES,
+  ml as CHECKBOX_FIELD_LAYOUTS,
+  Ia as Callout,
+  ja as Carousel,
+  za as CarouselContent,
+  Xa as CarouselItem,
+  Wa as CarouselNext,
+  Ja as CarouselPrevious,
+  pl as Checkbox,
+  _l as CheckboxField,
   fa as ContentCard,
   ae as EELogo,
   Aa as EELogoIcon,
-  Br as FIELD_ORIENTATIONS,
-  Or as Field,
-  Pr as FieldContent,
-  Ur as FieldDescription,
-  Fr as FieldError,
-  Zr as FieldGroup,
-  Kr as FieldLabel,
-  $r as FieldLegend,
-  Gr as FieldSeparator,
-  qr as FieldSet,
-  jr as FieldTitle,
-  Oa as ICON_BUTTON_ROUNDNESS,
-  Pa as ICON_BUTTON_SIZES,
-  Ua as ICON_BUTTON_SIZE_LG_ALIAS,
-  Fa as ICON_BUTTON_SIZE_SM_ALIAS,
-  Za as ICON_BUTTON_VARIANT_DEFAULT_ALIAS,
-  Ir as INPUT_SIZES,
+  Ur as FIELD_ORIENTATIONS,
+  Fr as Field,
+  Zr as FieldContent,
+  Kr as FieldDescription,
+  $r as FieldError,
+  Gr as FieldGroup,
+  qr as FieldLabel,
+  Yr as FieldLegend,
+  jr as FieldSeparator,
+  zr as FieldSet,
+  Xr as FieldTitle,
+  Fa as ICON_BUTTON_ROUNDNESS,
+  Za as ICON_BUTTON_SIZES,
+  Ka as ICON_BUTTON_SIZE_LG_ALIAS,
+  $a as ICON_BUTTON_SIZE_SM_ALIAS,
+  Ga as ICON_BUTTON_VARIANT_DEFAULT_ALIAS,
+  Br as INPUT_SIZES,
   Be as IconButton,
-  xr as Input,
+  Or as Input,
   ga as KUAT_HEADER_APP_SWITCHER_EMPTY,
   Na as KUAT_HEADER_LOCKUP_VARIANTS,
   wa as KUAT_LOGO_LOCKUP_MODE,
   va as KUAT_LOGO_LOCKUP_USE,
-  sr as KUAT_RADIAL_PROGRESS_COLORS,
-  nr as KUAT_RADIAL_PROGRESS_SIZES,
-  Ja as KuatCarousel,
-  Qa as KuatCarouselContent,
-  er as KuatCarouselItem,
-  ar as KuatCarouselNext,
-  rr as KuatCarouselPrevious,
+  ir as KUAT_RADIAL_PROGRESS_COLORS,
+  dr as KUAT_RADIAL_PROGRESS_SIZES,
+  ar as KuatCarousel,
+  rr as KuatCarouselContent,
+  lr as KuatCarouselItem,
+  tr as KuatCarouselNext,
+  sr as KuatCarouselPrevious,
   ta as KuatHeader,
   sa as KuatLogoLockup,
-  ir as KuatRadialProgress,
-  zr as KuatSelect,
-  pl as RADIO_FIELD_APPEARANCES,
-  _l as RADIO_FIELD_LAYOUTS,
-  bl as RadioField,
-  kl as RadioGroup,
-  fl as RadioGroupItem,
-  Xr as SELECT_LINES,
-  Wr as SELECT_SIZES,
-  Dl as SONNER_POSITIONS,
-  gl as SWITCH_FIELD_APPEARANCES,
-  Cl as SWITCH_FIELD_LAYOUTS,
-  Jr as Select,
-  Qr as SelectContent,
-  el as SelectGroup,
-  al as SelectItem,
-  rl as SelectLabel,
-  ll as SelectScrollDownButton,
-  tl as SelectScrollUpButton,
-  sl as SelectSeparator,
-  nl as SelectTrigger,
-  il as SelectValue,
-  Rl as Sonner,
-  Vl as SonnerContent,
-  vl as Switch,
-  wl as SwitchField,
-  Dr as TEXTAREA_RESIZE,
-  El as TOGGLE_SIZES,
-  Ll as TOGGLE_SKINS,
-  Rr as Textarea,
-  Sl as Toggle,
-  Hl as ToggleGroup,
-  Tl as ToggleGroupItem,
-  Tr as badgeVariants,
+  cr as KuatRadialProgress,
+  Jr as KuatSelect,
+  kl as RADIO_FIELD_APPEARANCES,
+  fl as RADIO_FIELD_LAYOUTS,
+  Nl as RadioField,
+  gl as RadioGroup,
+  Cl as RadioGroupItem,
+  Qr as SELECT_LINES,
+  el as SELECT_SIZES,
+  Il as SONNER_POSITIONS,
+  wl as SWITCH_FIELD_APPEARANCES,
+  Al as SWITCH_FIELD_LAYOUTS,
+  al as Select,
+  rl as SelectContent,
+  ll as SelectGroup,
+  tl as SelectItem,
+  sl as SelectLabel,
+  nl as SelectScrollDownButton,
+  ol as SelectScrollUpButton,
+  il as SelectSeparator,
+  dl as SelectTrigger,
+  cl as SelectValue,
+  xl as Sonner,
+  Ml as SonnerContent,
+  El as Switch,
+  Ll as SwitchField,
+  Ir as TEXTAREA_RESIZE,
+  Hl as TOGGLE_SIZES,
+  Tl as TOGGLE_SKINS,
+  xr as Textarea,
+  yl as Toggle,
+  Dl as ToggleGroup,
+  Rl as ToggleGroupItem,
+  Rr as badgeVariants,
   Da as buttonGroupVariants,
-  Ma as buttonVariants,
+  Pa as buttonVariants,
   d as cn,
-  Ka as iconButtonVariants,
+  qa as iconButtonVariants,
   Ca as kuatHeaderVariants,
   qe as resolveAppSwitcherLabels,
   We as resolveHeaderLockup,
   Ge as shouldShowAppSwitcher,
-  Il as toast,
-  Xa as useCarousel,
-  lr as useKuatCarousel
+  Bl as toast,
+  Qa as useCarousel,
+  nr as useKuatCarousel
 };