npm - @aviala-design/spiral - Versions diffs - 2.7.1 → 2.7.2 - Mend

@aviala-design/spiral 2.7.1 → 2.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/dist/component-changelogs.json +10 -0
package/dist/index.cjs +539 -520
package/dist/index.cjs.map +1 -1
package/dist/index.d.cts +15 -5
package/dist/index.d.ts +15 -5
package/dist/index.js +512 -491
package/dist/index.js.map +1 -1
package/dist/props.json +1 -10
package/package.json +2 -2

package/dist/index.js CHANGED Viewed

@@ -958,7 +958,7 @@ Button.displayName = "Button";
 // src/components/input.tsx
 import { cva as cva5 } from "class-variance-authority";
 import {
-  forwardRef as forwardRef5,
+  forwardRef as forwardRef7,
   isValidElement as isValidElement5,
   useState as useState2
 } from "react";
@@ -1104,8 +1104,236 @@ var Badge = forwardRef4(
 );
 Badge.displayName = "Badge";
+// src/components/form-field.tsx
+import { SymbolInformationCircle, SymbolWrongCircle } from "@aviala-design/icons";
+import {
+  createContext as createContext4,
+  forwardRef as forwardRef6,
+  useContext as useContext5,
+  useId,
+  useMemo as useMemo3
+} from "react";
+import {
+  FormProvider,
+  useController
+} from "react-hook-form";
+// src/components/typeface.tsx
+import { forwardRef as forwardRef5 } from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var typefaceLayouts = {
+  allCustom: [
+    { level: "text", children: null },
+    { level: "caption", children: null }
+  ],
+  textCaption: [
+    { level: "text", children: null },
+    { level: "caption", children: null }
+  ],
+  textCaptionSubtitle: [
+    { level: "subtitle", children: null },
+    { level: "text", children: null },
+    { level: "caption", children: null }
+  ],
+  textTitle: [
+    { level: "title", children: null },
+    { level: "text", children: null }
+  ],
+  textHeadline2: [
+    { level: "headline2", children: null },
+    { level: "text", children: null }
+  ],
+  textHeadline1: [
+    { level: "headline1", children: null },
+    { level: "text", children: null }
+  ]
+};
+var Typeface = forwardRef5(
+  ({
+    className,
+    content = "allCustom",
+    primary,
+    secondary,
+    tertiary,
+    primaryContent = "text",
+    secondaryContent = "text",
+    tertiaryContent = "text",
+    tone = "default",
+    children,
+    ...props
+  }, ref) => {
+    const layout = typefaceLayouts[content];
+    const values = resolveTypefaceValues(content, primary, secondary, tertiary, children);
+    return /* @__PURE__ */ jsx9("div", { ref, className: cn("aviala-typeface", className), "data-content": content, ...props, children: layout.map((line, index) => {
+      const value = values[index];
+      if (value === void 0 || value === null || value === false) return null;
+      const lineContent = index === 0 ? primaryContent : index === 1 ? secondaryContent : tertiaryContent;
+      return /* @__PURE__ */ jsx9("span", { className: "aviala-typeface__line", children: /* @__PURE__ */ jsx9(Typography, { level: line.level, content: lineContent, tone, children: value }) }, `${line.level}-${index}`);
+    }) });
+  }
+);
+Typeface.displayName = "Typeface";
+function resolveTypefaceValues(content, primary, secondary, tertiary, children) {
+  if (primary !== void 0 || secondary !== void 0 || tertiary !== void 0) {
+    return [primary, secondary, tertiary];
+  }
+  if (children == null || children === false) {
+    return typefaceLayouts[content].map(() => "Text");
+  }
+  if (Array.isArray(children)) {
+    return children;
+  }
+  return [children];
+}
+var TypefacePair = forwardRef5(
+  ({ title, description, ...props }, ref) => /* @__PURE__ */ jsx9(
+    Typeface,
+    {
+      ref,
+      content: "textCaption",
+      primary: title,
+      secondary: description,
+      ...props
+    }
+  )
+);
+TypefacePair.displayName = "TypefacePair";
+// src/components/form-field.tsx
+import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs3 } from "react/jsx-runtime";
+var FormFieldControlContext = createContext4(null);
+function useResolvedControlError(errorProp) {
+  const ctx = useContext5(FormFieldControlContext);
+  return errorProp ?? ctx?.invalid ?? false;
+}
+var FormFieldLayout = forwardRef6(
+  ({
+    className,
+    label,
+    htmlFor,
+    description,
+    error,
+    info,
+    alert,
+    required,
+    direction = "vertical",
+    children,
+    ...props
+  }, ref) => {
+    const reactId = useId();
+    const labelId = `${reactId}-label`;
+    const hasLabel = label != null && label !== "";
+    const invalid = Boolean(error);
+    const controlContext = useMemo3(() => ({ invalid }), [invalid]);
+    const labelNode = hasLabel || description ? htmlFor ? /* @__PURE__ */ jsx10("label", { htmlFor, className: "aviala-form__label aviala-form__label--control", children: /* @__PURE__ */ jsx10(
+      Typeface,
+      {
+        id: labelId,
+        content: "textCaption",
+        primary: hasLabel ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
+          label,
+          required ? /* @__PURE__ */ jsx10("span", { className: "aviala-form__required", "aria-hidden": true, children: "*" }) : null
+        ] }) : void 0,
+        secondary: description
+      }
+    ) }) : /* @__PURE__ */ jsx10(
+      Typeface,
+      {
+        id: labelId,
+        className: "aviala-form__label",
+        content: "textCaption",
+        primary: hasLabel ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
+          label,
+          required ? /* @__PURE__ */ jsx10("span", { className: "aviala-form__required", "aria-hidden": true, children: "*" }) : null
+        ] }) : void 0,
+        secondary: description
+      }
+    ) : null;
+    return /* @__PURE__ */ jsxs3(
+      "div",
+      {
+        ref,
+        className: cn("aviala-form", className),
+        "data-direction": direction,
+        "aria-labelledby": hasLabel ? labelId : void 0,
+        ...props,
+        children: [
+          labelNode,
+          /* @__PURE__ */ jsxs3("div", { className: "aviala-form__content", children: [
+            /* @__PURE__ */ jsx10(FormFieldControlContext.Provider, { value: controlContext, children }),
+            error ? /* @__PURE__ */ jsxs3("div", { className: "aviala-form__message aviala-form__message--error", role: "alert", children: [
+              /* @__PURE__ */ jsx10(
+                SymbolWrongCircle,
+                {
+                  className: "aviala-form__message-icon",
+                  width: 14,
+                  height: 14,
+                  "aria-hidden": true
+                }
+              ),
+              /* @__PURE__ */ jsx10(Typography, { level: "caption", as: "p", className: "aviala-form__message-text", children: error })
+            ] }) : null,
+            info ? /* @__PURE__ */ jsxs3("div", { className: "aviala-form__message aviala-form__message--info", children: [
+              /* @__PURE__ */ jsx10(
+                SymbolInformationCircle,
+                {
+                  className: "aviala-form__message-icon",
+                  width: 14,
+                  height: 14,
+                  "aria-hidden": true
+                }
+              ),
+              /* @__PURE__ */ jsx10(Typography, { level: "caption", as: "p", className: "aviala-form__message-text", children: info })
+            ] }) : null,
+            alert ? /* @__PURE__ */ jsx10("div", { className: "aviala-form__alert", children: alert }) : null
+          ] })
+        ]
+      }
+    );
+  }
+);
+FormFieldLayout.displayName = "FormFieldLayout";
+var FormFieldControlled = forwardRef6(
+  ({
+    control,
+    name,
+    rules,
+    defaultValue,
+    shouldUnregister,
+    disabled,
+    render,
+    error,
+    ...layoutProps
+  }, ref) => {
+    const id = useId();
+    const { field, fieldState, formState } = useController({
+      name,
+      control,
+      rules,
+      defaultValue,
+      shouldUnregister,
+      disabled
+    });
+    const message = error !== void 0 ? error : fieldState.error?.message ?? null;
+    return /* @__PURE__ */ jsx10(FormFieldLayout, { ref, ...layoutProps, htmlFor: id, error: message, children: render({ field, fieldState, formState, id }) });
+  }
+);
+FormFieldControlled.displayName = "FormFieldControlled";
+function isControlledProps(props) {
+  return "render" in props && typeof props.render === "function" && "name" in props;
+}
+var FormFieldRoot = forwardRef6((props, ref) => {
+  if (isControlledProps(props)) {
+    return /* @__PURE__ */ jsx10(FormFieldControlled, { ref, ...props });
+  }
+  return /* @__PURE__ */ jsx10(FormFieldLayout, { ref, ...props });
+});
+var FormField = FormFieldRoot;
+FormField.displayName = "FormField";
+var Form = FormProvider;
 // src/components/input.tsx
-import { jsx as jsx9, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs4 } from "react/jsx-runtime";
 function resolveInputState(value, defaultValue, focused) {
   const current = value ?? defaultValue ?? "";
   if (String(current).length === 0) return "empty";
@@ -1124,9 +1352,9 @@ var inputRootVariants = cva5("aviala-input relative min-w-0 font-sans", {
 });
 function renderBadgeArea(node) {
   if (node == null || node === false) return null;
-  return /* @__PURE__ */ jsx9("span", { className: "aviala-input__badge-area", children: isValidElement5(node) && node.type === Badge ? node : /* @__PURE__ */ jsx9(Badge, { children: node }) });
+  return /* @__PURE__ */ jsx11("span", { className: "aviala-input__badge-area", children: isValidElement5(node) && node.type === Badge ? node : /* @__PURE__ */ jsx11(Badge, { children: node }) });
 }
-var Input = forwardRef5(
+var Input = forwardRef7(
   ({
     className,
     size = "regular",
@@ -1136,7 +1364,7 @@ var Input = forwardRef5(
     leftBadge,
     rightBadge,
     fullWidth = true,
-    error = false,
+    error,
     disabled,
     type = "text",
     value,
@@ -1150,25 +1378,26 @@ var Input = forwardRef5(
     const [internalValue, setInternalValue] = useState2(() => String(defaultValue ?? ""));
     const resolvedValue = value !== void 0 ? String(value) : internalValue;
     const inputState = resolveInputState(resolvedValue, void 0, focused);
-    return /* @__PURE__ */ jsxs3(
+    const resolvedError = useResolvedControlError(error);
+    return /* @__PURE__ */ jsxs4(
       "div",
       {
         className: cn(inputRootVariants({ fullWidth }), className),
         "data-size": size,
         "data-all-round": allRound ? "true" : void 0,
         "data-input-state": inputState,
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
         "data-disabled": disabled ? "true" : void 0,
         ...spiralDebugId("input"),
         children: [
           renderSlotIcon(leftIcon, "aviala-input__slot", "input.left-icon"),
           renderBadgeArea(leftBadge),
-          /* @__PURE__ */ jsx9(
+          /* @__PURE__ */ jsx11(
             "div",
             {
               className: "aviala-input__field relative z-[1] flex min-w-0 flex-1 flex-col justify-center",
               ...spiralDebugId("input.field"),
-              children: /* @__PURE__ */ jsx9(
+              children: /* @__PURE__ */ jsx11(
                 "input",
                 {
                   ref,
@@ -1176,7 +1405,7 @@ var Input = forwardRef5(
                   disabled,
                   value,
                   defaultValue,
-                  "aria-invalid": error || void 0,
+                  "aria-invalid": resolvedError || void 0,
                   className: cn(
                     typographyVariants({ level: "text" }),
                     "w-full min-w-0 border-0 bg-transparent p-0 text-[var(--input-fg,#343333)] outline-none",
@@ -1216,12 +1445,12 @@ import {
   DirectionArrowUpLight
 } from "@aviala-design/icons";
 import {
-  forwardRef as forwardRef6,
+  forwardRef as forwardRef8,
   isValidElement as isValidElement6,
   useRef,
   useState as useState3
 } from "react";
-import { jsx as jsx10, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs5 } from "react/jsx-runtime";
 function assignRef(ref, value) {
   if (!ref) return;
   if (typeof ref === "function") {
@@ -1265,10 +1494,10 @@ function decimalPlaces(n) {
 }
 function renderBadgeArea2(node) {
   if (node == null || node === false) return null;
-  return /* @__PURE__ */ jsx10("span", { className: "aviala-input__badge-area", children: isValidElement6(node) && node.type === Badge ? node : /* @__PURE__ */ jsx10(Badge, { children: node }) });
+  return /* @__PURE__ */ jsx12("span", { className: "aviala-input__badge-area", children: isValidElement6(node) && node.type === Badge ? node : /* @__PURE__ */ jsx12(Badge, { children: node }) });
 }
 var numberInputRootVariants = inputRootVariants;
-var NumberInput = forwardRef6(
+var NumberInput = forwardRef8(
   ({
     className,
     size = "regular",
@@ -1280,7 +1509,7 @@ var NumberInput = forwardRef6(
     rightBadge,
     showControls = true,
     fullWidth = true,
-    error = false,
+    error,
     disabled,
     value,
     defaultValue,
@@ -1303,6 +1532,7 @@ var NumberInput = forwardRef6(
     const isControlled = value !== void 0;
     const resolvedValue = isControlled ? value === "" || value === null || value === void 0 ? "" : String(value) : internalValue;
     const inputState = resolveInputState2(resolvedValue, void 0, focused);
+    const resolvedError = useResolvedControlError(error);
     const numeric = parseNumeric(resolvedValue);
     const stepAmount = Number.isFinite(step) && step !== 0 ? Math.abs(step) : 1;
     const commitString = (next) => {
@@ -1319,7 +1549,7 @@ var NumberInput = forwardRef6(
       commitString(String(next));
       inputRef.current?.focus();
     };
-    return /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsxs5(
       "div",
       {
         className: cn(
@@ -1331,18 +1561,18 @@ var NumberInput = forwardRef6(
         "data-all-round": allRound ? "true" : void 0,
         "data-input-state": inputState,
         "data-input-style": inputStyle,
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
         "data-disabled": disabled ? "true" : void 0,
         ...spiralDebugId("number-input"),
         children: [
           renderSlotIcon(leftIcon, "aviala-input__slot", "number-input.left-icon"),
           renderBadgeArea2(leftBadge),
-          /* @__PURE__ */ jsx10(
+          /* @__PURE__ */ jsx12(
             "div",
             {
               className: "aviala-input__field relative z-[1] flex min-w-0 flex-1 flex-col justify-center",
               ...spiralDebugId("number-input.field"),
-              children: /* @__PURE__ */ jsx10(
+              children: /* @__PURE__ */ jsx12(
                 "input",
                 {
                   ref: (node) => {
@@ -1356,7 +1586,7 @@ var NumberInput = forwardRef6(
                   step: stepAmount,
                   min,
                   max,
-                  "aria-invalid": error || void 0,
+                  "aria-invalid": resolvedError || void 0,
                   className: cn(
                     typographyVariants({ level: "text" }),
                     "aviala-number-input__input w-full min-w-0 border-0 bg-transparent p-0 text-[var(--input-fg,#343333)] outline-none",
@@ -1401,13 +1631,13 @@ var NumberInput = forwardRef6(
           ),
           renderBadgeArea2(rightBadge),
           renderSlotIcon(rightIcon, "aviala-input__slot", "number-input.right-icon"),
-          showControls ? /* @__PURE__ */ jsxs4(
+          showControls ? /* @__PURE__ */ jsxs5(
             "div",
             {
               className: "aviala-number-input__controls",
               ...spiralDebugId("number-input.controls"),
               children: [
-                /* @__PURE__ */ jsx10(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     type: "button",
@@ -1418,10 +1648,10 @@ var NumberInput = forwardRef6(
                     onMouseDown: (event) => event.preventDefault(),
                     onClick: () => applyStep(1),
                     ...spiralDebugId("number-input.step-up"),
-                    children: /* @__PURE__ */ jsx10(DirectionArrowUpLight, { level: "text", biggerSize: true, "aria-hidden": true })
+                    children: /* @__PURE__ */ jsx12(DirectionArrowUpLight, { level: "text", biggerSize: true, "aria-hidden": true })
                   }
                 ),
-                /* @__PURE__ */ jsx10(
+                /* @__PURE__ */ jsx12(
                   "button",
                   {
                     type: "button",
@@ -1432,7 +1662,7 @@ var NumberInput = forwardRef6(
                     onMouseDown: (event) => event.preventDefault(),
                     onClick: () => applyStep(-1),
                     ...spiralDebugId("number-input.step-down"),
-                    children: /* @__PURE__ */ jsx10(DirectionArrowDownLight, { level: "text", biggerSize: true, "aria-hidden": true })
+                    children: /* @__PURE__ */ jsx12(DirectionArrowDownLight, { level: "text", biggerSize: true, "aria-hidden": true })
                   }
                 )
               ]
@@ -1448,13 +1678,13 @@ NumberInput.displayName = "NumberInput";
 // src/components/textarea.tsx
 import { SymbolResize } from "@aviala-design/icons";
 import {
-  forwardRef as forwardRef7,
+  forwardRef as forwardRef9,
   useCallback as useCallback2,
   useEffect,
   useRef as useRef2,
   useState as useState4
 } from "react";
-import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs6 } from "react/jsx-runtime";
 function assignRef2(ref, value) {
   if (!ref) return;
   if (typeof ref === "function") {
@@ -1468,7 +1698,7 @@ function resolveTextareaState(value, defaultValue, focused) {
   if (String(current).length === 0) return "empty";
   return focused ? "typing" : "fill";
 }
-var Textarea = forwardRef7(
+var Textarea = forwardRef9(
   ({
     className,
     size = "regular",
@@ -1476,7 +1706,7 @@ var Textarea = forwardRef7(
     rightIcon,
     showController: showControllerProp,
     maxLength,
-    error = false,
+    error,
     disabled,
     value,
     defaultValue,
@@ -1497,6 +1727,7 @@ var Textarea = forwardRef7(
     const resolvedValue = value !== void 0 ? String(value) : internalValue;
     const displayLength = resolvedValue.length;
     const inputState = resolveTextareaState(resolvedValue, void 0, focused);
+    const resolvedError = useResolvedControlError(error);
     const setTextareaRef = useCallback2(
       (node) => {
         textareaRef.current = node;
@@ -1565,14 +1796,14 @@ var Textarea = forwardRef7(
         document.body.style.userSelect = previousUserSelect;
       };
     }, [resizing]);
-    return /* @__PURE__ */ jsxs5(
+    return /* @__PURE__ */ jsxs6(
       "div",
       {
         ref: rootRef,
         className: cn("aviala-textarea", className),
         "data-size": resolvedSize,
         "data-input-state": inputState,
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
         "data-has-controller": showController ? "true" : void 0,
         "data-disabled": disabled ? "true" : void 0,
         "data-resizing": resizing ? "true" : void 0,
@@ -1581,7 +1812,7 @@ var Textarea = forwardRef7(
         ...spiralDebugId("textarea"),
         children: [
           renderSlotIcon(leftIcon, "aviala-textarea__slot", "textarea.left-icon"),
-          /* @__PURE__ */ jsx11("div", { className: "aviala-textarea__field", ...spiralDebugId("textarea.field"), children: /* @__PURE__ */ jsx11(
+          /* @__PURE__ */ jsx13("div", { className: "aviala-textarea__field", ...spiralDebugId("textarea.field"), children: /* @__PURE__ */ jsx13(
             "textarea",
             {
               ref: setTextareaRef,
@@ -1589,7 +1820,7 @@ var Textarea = forwardRef7(
               maxLength,
               value,
               defaultValue,
-              "aria-invalid": error || void 0,
+              "aria-invalid": resolvedError || void 0,
               className: cn("aviala-textarea__input", typographyVariants({ level: "text" })),
               onChange: (event) => {
                 if (value === void 0) {
@@ -1609,8 +1840,8 @@ var Textarea = forwardRef7(
             }
           ) }),
           renderSlotIcon(rightIcon, "aviala-textarea__slot", "textarea.right-icon"),
-          showController ? /* @__PURE__ */ jsxs5("div", { className: "aviala-textarea__controller", ...spiralDebugId("textarea.controller"), children: [
-            /* @__PURE__ */ jsxs5(
+          showController ? /* @__PURE__ */ jsxs6("div", { className: "aviala-textarea__controller", ...spiralDebugId("textarea.controller"), children: [
+            /* @__PURE__ */ jsxs6(
               "span",
               {
                 className: cn("aviala-textarea__counter", typographyVariants({ level: "caption" })),
@@ -1621,7 +1852,7 @@ var Textarea = forwardRef7(
                 ]
               }
             ),
-            /* @__PURE__ */ jsx11(
+            /* @__PURE__ */ jsx13(
               "button",
               {
                 type: "button",
@@ -1631,7 +1862,7 @@ var Textarea = forwardRef7(
                 tabIndex: disabled ? -1 : 0,
                 onPointerDown: handleResizePointerDown,
                 ...spiralDebugId("textarea.resize"),
-                children: /* @__PURE__ */ jsx11(SymbolResize, { thickness: "Regular", mode: "default", "aria-hidden": true })
+                children: /* @__PURE__ */ jsx13(SymbolResize, { thickness: "Regular", mode: "default", "aria-hidden": true })
               }
             )
           ] }) : null
@@ -1654,13 +1885,13 @@ import {
 } from "@aviala-design/icons";
 import {
   Children,
-  createContext as createContext4,
-  forwardRef as forwardRef9,
+  createContext as createContext5,
+  forwardRef as forwardRef11,
   useCallback as useCallback3,
-  useContext as useContext5,
+  useContext as useContext6,
   useEffect as useEffect2,
-  useId,
-  useMemo as useMemo3,
+  useId as useId2,
+  useMemo as useMemo4,
   useRef as useRef3,
   useState as useState5,
   isValidElement as isValidElement7
@@ -1669,9 +1900,9 @@ import {
 // src/components/link.tsx
 import { Slot as Slot3 } from "@radix-ui/react-slot";
 import {
-  forwardRef as forwardRef8
+  forwardRef as forwardRef10
 } from "react";
-import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
 var levelStyles = {
   caption: {
     className: typographyVariants({ level: "caption" }),
@@ -1690,7 +1921,7 @@ function renderIcon2(node, level) {
     level: iconLevel,
     biggerSize: true
   });
-  return /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsx14(
     "span",
     {
       className: cn(
@@ -1701,7 +1932,7 @@ function renderIcon2(node, level) {
     }
   );
 }
-var Link = forwardRef8(
+var Link = forwardRef10(
   ({
     className,
     level = "caption",
@@ -1731,7 +1962,7 @@ var Link = forwardRef8(
       onClick?.(e);
     };
     if (asChild) {
-      return /* @__PURE__ */ jsx12(
+      return /* @__PURE__ */ jsx14(
         Comp,
         {
           className: sharedClassName,
@@ -1747,7 +1978,7 @@ var Link = forwardRef8(
         }
       );
     }
-    return /* @__PURE__ */ jsxs6(
+    return /* @__PURE__ */ jsxs7(
       Comp,
       {
         className: sharedClassName,
@@ -1761,7 +1992,7 @@ var Link = forwardRef8(
         onClick: handleClick,
         children: [
           renderIcon2(leftIcon ?? (iconOnly ? rightIcon : void 0), resolvedLevel),
-          !iconOnly && children !== void 0 && children !== null && /* @__PURE__ */ jsx12(
+          !iconOnly && children !== void 0 && children !== null && /* @__PURE__ */ jsx14(
             "span",
             {
               className: cn(
@@ -1780,20 +2011,20 @@ var Link = forwardRef8(
 Link.displayName = "Link";
 // src/components/select.tsx
-import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
 var SELECT_SUB_MENU_CLOSE_DELAY_MS = 250;
 var SELECT_SUB_MENU_EXIT_ANIM_MS = 150;
-var SelectSubMenuContext = createContext4(null);
-var SelectDismissContext = createContext4(null);
+var SelectSubMenuContext = createContext5(null);
+var SelectDismissContext = createContext5(null);
 function useSelectSubMenuContext() {
-  const context = useContext5(SelectSubMenuContext);
+  const context = useContext6(SelectSubMenuContext);
   if (!context) {
     throw new Error("Select sub-menu components must be used within SelectContent.");
   }
   return context;
 }
 function useSelectSubMenuLayer() {
-  const contentId = useId();
+  const contentId = useId2();
   const [activeSubItemId, setActiveSubItemId] = useState5(null);
   const [exitingSubItemId, setExitingSubItemId] = useState5(null);
   const itemsRef = useRef3(/* @__PURE__ */ new Map());
@@ -1960,7 +2191,7 @@ function useSelectSubMenuLayer() {
       document.removeEventListener("keydown", handleEscape, true);
     };
   }, [activeSubItemId, beginExit, clearExitTimer, exitingSubItemId]);
-  return useMemo3(
+  return useMemo4(
     () => ({
       contentId,
       registerSubItem,
@@ -2020,7 +2251,7 @@ function renderItemIcon(node, iconLevel = "text", debugId) {
     level: iconLevel,
     biggerSize: true
   });
-  return /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15(
     "span",
     {
       className: cn(
@@ -2035,16 +2266,16 @@ function renderItemIcon(node, iconLevel = "text", debugId) {
 }
 function renderBadgeSlot(node) {
   if (node == null || node === false) return null;
-  return /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__badge", children: isValidElement7(node) && node.type === Badge ? node : /* @__PURE__ */ jsx13(Badge, { children: node }) });
+  return /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__badge", children: isValidElement7(node) && node.type === Badge ? node : /* @__PURE__ */ jsx15(Badge, { children: node }) });
 }
 function SelectItemFormRadio() {
-  return /* @__PURE__ */ jsxs7("span", { className: "aviala-select-item__form-radio", "aria-hidden": true, children: [
-    /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__form-radio-surface" }),
-    /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__form-radio-indicator" })
+  return /* @__PURE__ */ jsxs8("span", { className: "aviala-select-item__form-radio", "aria-hidden": true, children: [
+    /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__form-radio-surface" }),
+    /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__form-radio-indicator" })
   ] });
 }
 function SelectItemFormCheckbox() {
-  return /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__form-checkbox", "aria-hidden": true, children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__form-checkbox", "aria-hidden": true, children: /* @__PURE__ */ jsx15(
     SymbolRight,
     {
       className: "aviala-select-item__form-checkbox-icon",
@@ -2055,25 +2286,25 @@ function SelectItemFormCheckbox() {
   ) });
 }
 function SelectItemTrailingRadio() {
-  return /* @__PURE__ */ jsx13(SelectPrimitive.ItemIndicator, { className: "aviala-select-item__trailing-radio", "aria-hidden": true, children: /* @__PURE__ */ jsx13(SymbolRight, { level: "text", biggerSize: true, "aria-hidden": true }) });
+  return /* @__PURE__ */ jsx15(SelectPrimitive.ItemIndicator, { className: "aviala-select-item__trailing-radio", "aria-hidden": true, children: /* @__PURE__ */ jsx15(SymbolRight, { level: "text", biggerSize: true, "aria-hidden": true }) });
 }
 function SelectItemTrailingCheckbox() {
-  return /* @__PURE__ */ jsx13(SelectPrimitive.ItemIndicator, { className: "aviala-select-item__trailing-checkbox", "aria-hidden": true, children: /* @__PURE__ */ jsx13(SymbolRight, { level: "text", biggerSize: true, "aria-hidden": true }) });
+  return /* @__PURE__ */ jsx15(SelectPrimitive.ItemIndicator, { className: "aviala-select-item__trailing-checkbox", "aria-hidden": true, children: /* @__PURE__ */ jsx15(SymbolRight, { level: "text", biggerSize: true, "aria-hidden": true }) });
 }
 function SelectItemDefaultAvatar() {
-  return /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__avatar", "aria-hidden": true, children: /* @__PURE__ */ jsx13(UsersUserCircle, { level: "text", biggerSize: true, "aria-hidden": true }) });
+  return /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__avatar", "aria-hidden": true, children: /* @__PURE__ */ jsx15(UsersUserCircle, { level: "text", biggerSize: true, "aria-hidden": true }) });
 }
 function SelectExpandChevron() {
   const rtl = useRtl();
   const Icon2 = rtl ? DirectionArrowLeft : DirectionArrowRight;
-  return /* @__PURE__ */ jsx13(Icon2, { level: "text", biggerSize: true, "aria-hidden": true });
+  return /* @__PURE__ */ jsx15(Icon2, { level: "text", biggerSize: true, "aria-hidden": true });
 }
 function renderFunctionSlot(itemFunction, layout, showFunctionIcon, icon) {
   if (!showFunctionIcon) return null;
   if (layout === "checked") return null;
   const functionStyle = icon ? iconSlotCssVarStyle(icon, "--select-item-function-icon-size", "text", true) : void 0;
   if (icon !== void 0) {
-    return /* @__PURE__ */ jsx13(
+    return /* @__PURE__ */ jsx15(
       "span",
       {
         className: "aviala-select-item__function",
@@ -2085,19 +2316,19 @@ function renderFunctionSlot(itemFunction, layout, showFunctionIcon, icon) {
   }
   switch (itemFunction) {
     case "radio":
-      return /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__function", ...spiralDebugId("select.content.item.function"), children: /* @__PURE__ */ jsx13(SelectItemTrailingRadio, {}) });
+      return /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__function", ...spiralDebugId("select.content.item.function"), children: /* @__PURE__ */ jsx15(SelectItemTrailingRadio, {}) });
     case "checkbox":
-      return /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__function", ...spiralDebugId("select.content.item.function"), children: /* @__PURE__ */ jsx13(SelectItemTrailingCheckbox, {}) });
+      return /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__function", ...spiralDebugId("select.content.item.function"), children: /* @__PURE__ */ jsx15(SelectItemTrailingCheckbox, {}) });
     case "simple":
     case "action":
     default:
-      return /* @__PURE__ */ jsx13(
+      return /* @__PURE__ */ jsx15(
         "span",
         {
           className: "aviala-select-item__function",
           style: iconLevelCssVarStyle("text", true, "--select-item-function-icon-size"),
           ...spiralDebugId("select.content.item.function"),
-          children: /* @__PURE__ */ jsx13(SelectExpandChevron, {})
+          children: /* @__PURE__ */ jsx15(SelectExpandChevron, {})
         }
       );
   }
@@ -2114,7 +2345,7 @@ function Select({
   const windowBlurCloseRef = useRef3(false);
   const pointerDownCloseRef = useRef3(false);
   const triggerRef = useRef3(null);
-  const dismissContextValue = useMemo3(
+  const dismissContextValue = useMemo4(
     () => ({ pointerDownCloseRef, triggerRef }),
     []
   );
@@ -2150,7 +2381,7 @@ function Select({
     },
     [isControlled, onOpenChange]
   );
-  return /* @__PURE__ */ jsx13(SelectDismissContext.Provider, { value: dismissContextValue, children: /* @__PURE__ */ jsx13(SelectPrimitive.Root, { open, onOpenChange: handleOpenChange, ...props }) });
+  return /* @__PURE__ */ jsx15(SelectDismissContext.Provider, { value: dismissContextValue, children: /* @__PURE__ */ jsx15(SelectPrimitive.Root, { open, onOpenChange: handleOpenChange, ...props }) });
 }
 var SelectValue = SelectPrimitive.Value;
 var SelectGroup = SelectPrimitive.Group;
@@ -2185,7 +2416,7 @@ function wrapUngroupedSelectItems(children) {
   const flushBareItems = () => {
     if (bareItems.length === 0) return;
     wrapped.push(
-      /* @__PURE__ */ jsx13(SelectGroup, { className: "aviala-select-group", children: /* @__PURE__ */ jsx13("div", { className: "aviala-select-group__slot", children: bareItems }) }, `__select-auto-group-${autoGroupIndex++}`)
+      /* @__PURE__ */ jsx15(SelectGroup, { className: "aviala-select-group", children: /* @__PURE__ */ jsx15("div", { className: "aviala-select-group__slot", children: bareItems }) }, `__select-auto-group-${autoGroupIndex++}`)
     );
     bareItems = [];
   };
@@ -2203,7 +2434,7 @@ function wrapUngroupedSelectItems(children) {
   flushBareItems();
   return wrapped.length === 1 ? wrapped[0] : wrapped;
 }
-var SelectTrigger = forwardRef9(
+var SelectTrigger = forwardRef11(
   ({
     className,
     size = "regular",
@@ -2212,11 +2443,12 @@ var SelectTrigger = forwardRef9(
     rightIcon,
     expandIcon,
     placeholder,
-    error = false,
+    error,
     ...props
   }, ref) => {
-    const dismissContext = useContext5(SelectDismissContext);
-    return /* @__PURE__ */ jsxs7(
+    const dismissContext = useContext6(SelectDismissContext);
+    const resolvedError = useResolvedControlError(error);
+    return /* @__PURE__ */ jsxs8(
       SelectPrimitive.Trigger,
       {
         ref: (node) => {
@@ -2232,12 +2464,13 @@ var SelectTrigger = forwardRef9(
         className: cn("aviala-select-trigger aviala-focus-ring", className),
         "data-size": size,
         "data-all-round": allRound ? "true" : "false",
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
+        "aria-invalid": resolvedError || void 0,
         ...spiralDebugId("select.trigger"),
         ...props,
         children: [
           renderSlotIcon(leftIcon, "aviala-select-trigger__slot", "select.trigger.icon-left"),
-          /* @__PURE__ */ jsx13("span", { className: "aviala-select-trigger__field", children: /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx15("span", { className: "aviala-select-trigger__field", children: /* @__PURE__ */ jsx15(
             SelectPrimitive.Value,
             {
               placeholder,
@@ -2246,14 +2479,14 @@ var SelectTrigger = forwardRef9(
             }
           ) }),
           renderSlotIcon(rightIcon, "aviala-select-trigger__slot", "select.trigger.icon-right"),
-          /* @__PURE__ */ jsx13(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx13(
+          /* @__PURE__ */ jsx15(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ jsx15(
             "span",
             {
               className: "aviala-select-trigger__expand",
               "aria-hidden": true,
               style: expandIcon ? iconSlotCssVarStyle(expandIcon, "--input-slot-icon-size", "text", true) : iconLevelCssVarStyle("text", true, "--input-slot-icon-size"),
               ...spiralDebugId("select.trigger.expand"),
-              children: expandIcon ?? /* @__PURE__ */ jsx13(
+              children: expandIcon ?? /* @__PURE__ */ jsx15(
                 DirectionArrowDownLight2,
                 {
                   className: "aviala-select-trigger__expand-icon",
@@ -2270,7 +2503,7 @@ var SelectTrigger = forwardRef9(
   }
 );
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectContent = forwardRef9(
+var SelectContent = forwardRef11(
   ({
     className,
     children,
@@ -2281,7 +2514,7 @@ var SelectContent = forwardRef9(
     ...props
   }, ref) => {
     const subMenuLayer = useSelectSubMenuLayer();
-    const dismissContext = useContext5(SelectDismissContext);
+    const dismissContext = useContext6(SelectDismissContext);
     const handleCloseAutoFocus = (event) => {
       onCloseAutoFocus?.(event);
       if (event.defaultPrevented) {
@@ -2296,7 +2529,7 @@ var SelectContent = forwardRef9(
         dismissContext.pointerDownCloseRef.current = false;
       }
     };
-    const content = /* @__PURE__ */ jsx13(SelectSubMenuContext.Provider, { value: subMenuLayer, children: /* @__PURE__ */ jsx13(
+    const content = /* @__PURE__ */ jsx15(SelectSubMenuContext.Provider, { value: subMenuLayer, children: /* @__PURE__ */ jsx15(
       SelectPrimitive.Content,
       {
         ref,
@@ -2306,7 +2539,7 @@ var SelectContent = forwardRef9(
         onCloseAutoFocus: handleCloseAutoFocus,
         ...spiralDebugId("select.content"),
         ...props,
-        children: /* @__PURE__ */ jsx13(
+        children: /* @__PURE__ */ jsx15(
           SelectPrimitive.Viewport,
           {
             className: "aviala-select-viewport",
@@ -2317,11 +2550,11 @@ var SelectContent = forwardRef9(
       }
     ) });
     if (!portalled) return content;
-    return /* @__PURE__ */ jsx13(SelectPrimitive.Portal, { children: content });
+    return /* @__PURE__ */ jsx15(SelectPrimitive.Portal, { children: content });
   }
 );
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = forwardRef9(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
+var SelectLabel = forwardRef11(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
   SelectPrimitive.Label,
   {
     ref,
@@ -2330,7 +2563,7 @@ var SelectLabel = forwardRef9(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = forwardRef9(
+var SelectItem = forwardRef11(
   ({
     className,
     children,
@@ -2356,23 +2589,23 @@ var SelectItem = forwardRef9(
     const leftIconLevel = isTitle ? "caption" : "text";
     const showTrailingFunction = showFunctionIcon && layout !== "checked" && itemFunction !== "form-radio" && itemFunction !== "form-checkbox";
     const textLevel = isTitle ? "caption" : "text";
-    const textContent = isPeople ? /* @__PURE__ */ jsxs7("span", { className: "aviala-select-item__content", children: [
-      /* @__PURE__ */ jsx13(
+    const textContent = isPeople ? /* @__PURE__ */ jsxs8("span", { className: "aviala-select-item__content", children: [
+      /* @__PURE__ */ jsx15(
         SelectPrimitive.ItemText,
         {
           className: cn("aviala-select-item__text", typographyVariants({ level: textLevel })),
           children
         }
       ),
-      subtitle != null && subtitle !== false ? /* @__PURE__ */ jsx13("span", { className: cn("aviala-select-item__subtitle", typographyVariants({ level: "caption" })), children: subtitle }) : null
-    ] }) : /* @__PURE__ */ jsx13(
+      subtitle != null && subtitle !== false ? /* @__PURE__ */ jsx15("span", { className: cn("aviala-select-item__subtitle", typographyVariants({ level: "caption" })), children: subtitle }) : null
+    ] }) : /* @__PURE__ */ jsx15(
       SelectPrimitive.ItemText,
       {
         className: cn("aviala-select-item__text", typographyVariants({ level: textLevel })),
         children
       }
     );
-    return /* @__PURE__ */ jsxs7(
+    return /* @__PURE__ */ jsxs8(
       SelectPrimitive.Item,
       {
         ref,
@@ -2382,14 +2615,14 @@ var SelectItem = forwardRef9(
         ...spiralDebugId("select.content.item"),
         ...props,
         children: [
-          isFormLeading && itemFunction === "form-radio" ? /* @__PURE__ */ jsx13(SelectItemFormRadio, {}) : null,
-          isFormLeading && itemFunction === "form-checkbox" ? /* @__PURE__ */ jsx13(SelectItemFormCheckbox, {}) : null,
+          isFormLeading && itemFunction === "form-radio" ? /* @__PURE__ */ jsx15(SelectItemFormRadio, {}) : null,
+          isFormLeading && itemFunction === "form-checkbox" ? /* @__PURE__ */ jsx15(SelectItemFormCheckbox, {}) : null,
           showLeftIcon && leftIcon ? renderItemIcon(leftIcon, leftIconLevel, "select.content.item.icon-left") : null,
-          isPeople ? avatar ?? /* @__PURE__ */ jsx13(SelectItemDefaultAvatar, {}) : null,
+          isPeople ? avatar ?? /* @__PURE__ */ jsx15(SelectItemDefaultAvatar, {}) : null,
           textContent,
           showBadge ? renderBadgeSlot(badge ?? "Text") : null,
           showRightIcon && rightIcon ? renderItemIcon(rightIcon, leftIconLevel, "select.content.item.icon-right") : null,
-          showMoreFunction ? /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__more", children: moreAction ?? /* @__PURE__ */ jsx13(Link, { level: "text", href: "#", onClick: (event) => event.preventDefault(), children: "Text" }) }) : null,
+          showMoreFunction ? /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__more", children: moreAction ?? /* @__PURE__ */ jsx15(Link, { level: "text", href: "#", onClick: (event) => event.preventDefault(), children: "Text" }) }) : null,
           renderFunctionSlot(itemFunction, layout, showTrailingFunction, icon)
         ]
       }
@@ -2397,7 +2630,7 @@ var SelectItem = forwardRef9(
   }
 );
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSubItem = forwardRef9(
+var SelectSubItem = forwardRef11(
   ({
     className,
     children,
@@ -2433,8 +2666,8 @@ var SelectSubItem = forwardRef9(
     if (!subMenu) {
       throw new Error("SelectSubItem requires a SelectSubMenu child.");
     }
-    const subItemId = useId();
-    const subMenuId = useId();
+    const subItemId = useId2();
+    const subMenuId = useId2();
     const rootRef = useRef3(null);
     const contentRef = useRef3(null);
     const rtl = useRtl();
@@ -2469,10 +2702,10 @@ var SelectSubItem = forwardRef9(
     const leftIconLevel = isTitle ? "caption" : "text";
     const showTrailingFunction = showFunctionIcon && layout !== "checked" && itemFunction !== "form-radio" && itemFunction !== "form-checkbox";
     const textLevel = isTitle ? "caption" : "text";
-    const textContent = isPeople ? /* @__PURE__ */ jsxs7("span", { className: "aviala-select-item__content", children: [
-      /* @__PURE__ */ jsx13("span", { className: cn("aviala-select-item__text", typographyVariants({ level: textLevel })), children: itemChildren }),
-      subtitle != null && subtitle !== false ? /* @__PURE__ */ jsx13("span", { className: cn("aviala-select-item__subtitle", typographyVariants({ level: "caption" })), children: subtitle }) : null
-    ] }) : /* @__PURE__ */ jsx13("span", { className: cn("aviala-select-item__text", typographyVariants({ level: textLevel })), children: itemChildren });
+    const textContent = isPeople ? /* @__PURE__ */ jsxs8("span", { className: "aviala-select-item__content", children: [
+      /* @__PURE__ */ jsx15("span", { className: cn("aviala-select-item__text", typographyVariants({ level: textLevel })), children: itemChildren }),
+      subtitle != null && subtitle !== false ? /* @__PURE__ */ jsx15("span", { className: cn("aviala-select-item__subtitle", typographyVariants({ level: "caption" })), children: subtitle }) : null
+    ] }) : /* @__PURE__ */ jsx15("span", { className: cn("aviala-select-item__text", typographyVariants({ level: textLevel })), children: itemChildren });
     const handleTriggerBlur = (event) => {
       scheduleCloseSubItem(subItemId, event.relatedTarget);
     };
@@ -2490,7 +2723,7 @@ var SelectSubItem = forwardRef9(
         closeActiveSubItem();
       }
     };
-    const itemRow = /* @__PURE__ */ jsxs7(
+    const itemRow = /* @__PURE__ */ jsxs8(
       "button",
       {
         type: "button",
@@ -2508,19 +2741,19 @@ var SelectSubItem = forwardRef9(
         onBlur: handleTriggerBlur,
         onKeyDown: handleKeyDown,
         children: [
-          isFormLeading && itemFunction === "form-radio" ? /* @__PURE__ */ jsx13(SelectItemFormRadio, {}) : null,
-          isFormLeading && itemFunction === "form-checkbox" ? /* @__PURE__ */ jsx13(SelectItemFormCheckbox, {}) : null,
+          isFormLeading && itemFunction === "form-radio" ? /* @__PURE__ */ jsx15(SelectItemFormRadio, {}) : null,
+          isFormLeading && itemFunction === "form-checkbox" ? /* @__PURE__ */ jsx15(SelectItemFormCheckbox, {}) : null,
           showLeftIcon && leftIcon ? renderItemIcon(leftIcon, leftIconLevel) : null,
-          isPeople ? avatar ?? /* @__PURE__ */ jsx13(SelectItemDefaultAvatar, {}) : null,
+          isPeople ? avatar ?? /* @__PURE__ */ jsx15(SelectItemDefaultAvatar, {}) : null,
           textContent,
           showBadge ? renderBadgeSlot(badge ?? "Text") : null,
           showRightIcon && rightIcon ? renderItemIcon(rightIcon, leftIconLevel) : null,
-          showMoreFunction ? /* @__PURE__ */ jsx13("span", { className: "aviala-select-item__more", children: moreAction ?? /* @__PURE__ */ jsx13(Link, { level: "text", href: "#", onClick: (event) => event.preventDefault(), children: "Text" }) }) : null,
+          showMoreFunction ? /* @__PURE__ */ jsx15("span", { className: "aviala-select-item__more", children: moreAction ?? /* @__PURE__ */ jsx15(Link, { level: "text", href: "#", onClick: (event) => event.preventDefault(), children: "Text" }) }) : null,
           renderFunctionSlot(itemFunction, layout, showTrailingFunction, icon)
         ]
       }
     );
-    const flyout = /* @__PURE__ */ jsx13(
+    const flyout = /* @__PURE__ */ jsx15(
       PopoverPrimitive.Content,
       {
         ref: contentRef,
@@ -2538,10 +2771,10 @@ var SelectSubItem = forwardRef9(
         onPointerEnter: handleOpen,
         onPointerLeave: handlePointerLeave,
         onPointerDownOutside: (event) => event.preventDefault(),
-        children: /* @__PURE__ */ jsx13("div", { className: "aviala-select-viewport aviala-select-sub-content__viewport", children: wrapUngroupedSelectItems(subMenu.children) })
+        children: /* @__PURE__ */ jsx15("div", { className: "aviala-select-viewport aviala-select-sub-content__viewport", children: wrapUngroupedSelectItems(subMenu.children) })
       }
     );
-    return /* @__PURE__ */ jsx13(PopoverPrimitive.Root, { open, modal: false, children: /* @__PURE__ */ jsxs7(
+    return /* @__PURE__ */ jsx15(PopoverPrimitive.Root, { open, modal: false, children: /* @__PURE__ */ jsxs8(
       "div",
       {
         ref: (node) => {
@@ -2556,21 +2789,21 @@ var SelectSubItem = forwardRef9(
         onPointerEnter: handleOpen,
         onPointerLeave: handlePointerLeave,
         children: [
-          /* @__PURE__ */ jsx13(PopoverPrimitive.Anchor, { asChild: true, children: itemRow }),
-          portalled ? /* @__PURE__ */ jsx13(PopoverPrimitive.Portal, { children: flyout }) : flyout
+          /* @__PURE__ */ jsx15(PopoverPrimitive.Anchor, { asChild: true, children: itemRow }),
+          portalled ? /* @__PURE__ */ jsx15(PopoverPrimitive.Portal, { children: flyout }) : flyout
         ]
       }
     ) });
   }
 );
 SelectSubItem.displayName = "SelectSubItem";
-var SelectSubItemPeople = forwardRef9(
-  (props, ref) => /* @__PURE__ */ jsx13(SelectSubItem, { ref, layout: "people", ...props })
+var SelectSubItemPeople = forwardRef11(
+  (props, ref) => /* @__PURE__ */ jsx15(SelectSubItem, { ref, layout: "people", ...props })
 );
 SelectSubItemPeople.displayName = "SelectSubItemPeople";
-var SelectItemPeople = forwardRef9((props, ref) => /* @__PURE__ */ jsx13(SelectItem, { ref, layout: "people", ...props }));
+var SelectItemPeople = forwardRef11((props, ref) => /* @__PURE__ */ jsx15(SelectItem, { ref, layout: "people", ...props }));
 SelectItemPeople.displayName = "SelectItemPeople";
-var SelectSeparator = forwardRef9(({ className, ...props }, ref) => /* @__PURE__ */ jsx13(
+var SelectSeparator = forwardRef11(({ className, ...props }, ref) => /* @__PURE__ */ jsx15(
   SelectPrimitive.Separator,
   {
     ref,
@@ -2585,18 +2818,18 @@ function SelectItemGroup({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs7(SelectGroup, { className: cn("aviala-select-group", className), children: [
-    label ? /* @__PURE__ */ jsx13(SelectLabel, { children: label }) : null,
-    /* @__PURE__ */ jsx13("div", { className: "aviala-select-group__slot", children }),
-    showDivider ? /* @__PURE__ */ jsx13(SelectSeparator, {}) : null
+  return /* @__PURE__ */ jsxs8(SelectGroup, { className: cn("aviala-select-group", className), children: [
+    label ? /* @__PURE__ */ jsx15(SelectLabel, { children: label }) : null,
+    /* @__PURE__ */ jsx15("div", { className: "aviala-select-group__slot", children }),
+    showDivider ? /* @__PURE__ */ jsx15(SelectSeparator, {}) : null
   ] });
 }
 // src/components/label.tsx
 import * as LabelPrimitive from "@radix-ui/react-label";
-import { forwardRef as forwardRef10 } from "react";
-import { jsx as jsx14 } from "react/jsx-runtime";
-var Label2 = forwardRef10(({ className, ...props }, ref) => /* @__PURE__ */ jsx14(
+import { forwardRef as forwardRef12 } from "react";
+import { jsx as jsx16 } from "react/jsx-runtime";
+var Label2 = forwardRef12(({ className, ...props }, ref) => /* @__PURE__ */ jsx16(
   LabelPrimitive.Root,
   {
     ref,
@@ -2614,10 +2847,10 @@ Label2.displayName = LabelPrimitive.Root.displayName;
 import { cva as cva6 } from "class-variance-authority";
 import {
   cloneElement as cloneElement3,
-  forwardRef as forwardRef11,
+  forwardRef as forwardRef13,
   isValidElement as isValidElement8
 } from "react";
-import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs9 } from "react/jsx-runtime";
 var avatarVariants = cva6("aviala-avatar", {
   variants: {
     level: {
@@ -2675,7 +2908,7 @@ function renderAvatarIcon(node, level) {
   }
   return node;
 }
-var Avatar = forwardRef11(
+var Avatar = forwardRef13(
   ({
     className,
     level = "text",
@@ -2690,7 +2923,7 @@ var Avatar = forwardRef11(
   }, ref) => {
     const resolvedLevel = level ?? "text";
     const resolvedContent = content ?? "text";
-    return /* @__PURE__ */ jsx15(
+    return /* @__PURE__ */ jsx17(
       "span",
       {
         ref,
@@ -2706,8 +2939,8 @@ var Avatar = forwardRef11(
         "data-content": resolvedContent,
         "data-line-height-fix": lineHeightFix ? "true" : "false",
         ...props,
-        children: /* @__PURE__ */ jsxs8("span", { className: "aviala-avatar__surface", children: [
-          resolvedContent === "picture" && src ? /* @__PURE__ */ jsx15(
+        children: /* @__PURE__ */ jsxs9("span", { className: "aviala-avatar__surface", children: [
+          resolvedContent === "picture" && src ? /* @__PURE__ */ jsx17(
             "img",
             {
               className: "aviala-avatar__image",
@@ -2716,8 +2949,8 @@ var Avatar = forwardRef11(
               ...imgProps
             }
           ) : null,
-          resolvedContent === "icon" ? /* @__PURE__ */ jsx15("span", { className: "aviala-avatar__icon", "aria-hidden": true, children: renderAvatarIcon(icon, resolvedLevel) }) : null,
-          resolvedContent === "text" ? /* @__PURE__ */ jsx15(
+          resolvedContent === "icon" ? /* @__PURE__ */ jsx17("span", { className: "aviala-avatar__icon", "aria-hidden": true, children: renderAvatarIcon(icon, resolvedLevel) }) : null,
+          resolvedContent === "text" ? /* @__PURE__ */ jsx17(
             Typography,
             {
               level: AVATAR_TEXT_LEVEL[resolvedLevel],
@@ -2738,10 +2971,10 @@ import { resolveIconSizeToken as resolveIconSizeToken4, SymbolWrong } from "@avi
 import { cva as cva7 } from "class-variance-authority";
 import {
   cloneElement as cloneElement4,
-  forwardRef as forwardRef12,
+  forwardRef as forwardRef14,
   isValidElement as isValidElement9
 } from "react";
-import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
 var tagVariants = cva7("aviala-tag", {
   variants: {
     level: {
@@ -2789,22 +3022,22 @@ function renderTagIcon(node, level) {
       )
     }
   ) : node;
-  return /* @__PURE__ */ jsx16("span", { className: "aviala-tag__icon", "aria-hidden": true, children: content });
+  return /* @__PURE__ */ jsx18("span", { className: "aviala-tag__icon", "aria-hidden": true, children: content });
 }
-var TagClose = forwardRef12(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx16(
+var TagClose = forwardRef14(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx18(
     "button",
     {
       ref,
       type: "button",
       className: cn("aviala-tag__close aviala-focus-ring", className),
       ...props,
-      children: children ?? /* @__PURE__ */ jsx16(SymbolWrong, { "aria-hidden": true, width: 14, height: 14 })
+      children: children ?? /* @__PURE__ */ jsx18(SymbolWrong, { "aria-hidden": true, width: 14, height: 14 })
     }
   )
 );
 TagClose.displayName = "TagClose";
-var Tag = forwardRef12(
+var Tag = forwardRef14(
   ({
     className,
     children,
@@ -2828,8 +3061,8 @@ var Tag = forwardRef12(
     const resolvedContent = content ?? "text";
     const resolvedLhf = resolveLineHeightFix2(resolvedLevel, lineHeightFix);
     const typographyLevel = resolvedLevel;
-    const peopleAvatar = avatar ?? (avatarSrc ? /* @__PURE__ */ jsx16(Avatar, { level: "text", content: "picture", src: avatarSrc, lineHeightFix: false }) : /* @__PURE__ */ jsx16(Avatar, { level: "text", content: "text", lineHeightFix: false, children: avatarText ?? (typeof children === "string" ? children.charAt(0) : "?") }));
-    return /* @__PURE__ */ jsxs9(
+    const peopleAvatar = avatar ?? (avatarSrc ? /* @__PURE__ */ jsx18(Avatar, { level: "text", content: "picture", src: avatarSrc, lineHeightFix: false }) : /* @__PURE__ */ jsx18(Avatar, { level: "text", content: "text", lineHeightFix: false, children: avatarText ?? (typeof children === "string" ? children.charAt(0) : "?") }));
+    return /* @__PURE__ */ jsxs10(
       "span",
       {
         ref,
@@ -2848,8 +3081,8 @@ var Tag = forwardRef12(
         "aria-disabled": disabled || void 0,
         ...props,
         children: [
-          resolvedContent === "people" ? /* @__PURE__ */ jsx16("span", { className: "aviala-tag__avatar", children: peopleAvatar }) : renderTagIcon(leftIcon, resolvedLevel),
-          /* @__PURE__ */ jsx16(
+          resolvedContent === "people" ? /* @__PURE__ */ jsx18("span", { className: "aviala-tag__avatar", children: peopleAvatar }) : renderTagIcon(leftIcon, resolvedLevel),
+          /* @__PURE__ */ jsx18(
             Typography,
             {
               level: typographyLevel,
@@ -2859,7 +3092,7 @@ var Tag = forwardRef12(
             }
           ),
           resolvedContent === "text" ? renderTagIcon(rightIcon, resolvedLevel) : null,
-          closable ? /* @__PURE__ */ jsx16(
+          closable ? /* @__PURE__ */ jsx18(
             TagClose,
             {
               "aria-label": resolvedCloseLabel,
@@ -2879,8 +3112,8 @@ Tag.displayName = "Tag";
 // src/components/progress.tsx
 import { cva as cva8 } from "class-variance-authority";
-import { forwardRef as forwardRef13 } from "react";
-import { Fragment as Fragment2, jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+import { forwardRef as forwardRef15 } from "react";
+import { Fragment as Fragment3, jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
 var progressVariants = cva8("aviala-progress", {
   variants: {
     type: {
@@ -2907,7 +3140,7 @@ function clampPercent(value) {
   if (!Number.isFinite(value)) return 0;
   return Math.min(100, Math.max(0, value));
 }
-var Progress = forwardRef13(
+var Progress = forwardRef15(
   ({
     className,
     type = "default",
@@ -2929,7 +3162,7 @@ var Progress = forwardRef13(
     const normalizedRadius = center - stroke / 2;
     const circumference = normalizedRadius * 2 * Math.PI;
     const strokeDashoffset = circumference - percent / 100 * circumference;
-    return /* @__PURE__ */ jsx17(
+    return /* @__PURE__ */ jsx19(
       "div",
       {
         ref,
@@ -2950,15 +3183,15 @@ var Progress = forwardRef13(
         "data-size": resolvedSize,
         "data-shape": resolvedShape,
         ...props,
-        children: resolvedShape === "bar" ? /* @__PURE__ */ jsxs10(Fragment2, { children: [
-          /* @__PURE__ */ jsx17("div", { className: "aviala-progress__track", children: /* @__PURE__ */ jsx17(
+        children: resolvedShape === "bar" ? /* @__PURE__ */ jsxs11(Fragment3, { children: [
+          /* @__PURE__ */ jsx19("div", { className: "aviala-progress__track", children: /* @__PURE__ */ jsx19(
             "div",
             {
               className: "aviala-progress__fill",
               style: { width: `${percent}%` }
             }
           ) }),
-          showLabel ? /* @__PURE__ */ jsx17(
+          showLabel ? /* @__PURE__ */ jsx19(
             Typography,
             {
               level: "caption",
@@ -2968,7 +3201,7 @@ var Progress = forwardRef13(
               children: displayLabel
             }
           ) : null
-        ] }) : /* @__PURE__ */ jsxs10(
+        ] }) : /* @__PURE__ */ jsxs11(
           "svg",
           {
             className: "aviala-progress__ring",
@@ -2977,7 +3210,7 @@ var Progress = forwardRef13(
             viewBox: `0 0 ${diameter} ${diameter}`,
             "aria-hidden": true,
             children: [
-              /* @__PURE__ */ jsx17(
+              /* @__PURE__ */ jsx19(
                 "circle",
                 {
                   className: "aviala-progress__ring-track",
@@ -2988,7 +3221,7 @@ var Progress = forwardRef13(
                   strokeWidth: stroke
                 }
               ),
-              /* @__PURE__ */ jsx17(
+              /* @__PURE__ */ jsx19(
                 "circle",
                 {
                   className: "aviala-progress__ring-fill",
@@ -3014,8 +3247,8 @@ Progress.displayName = "Progress";
 // src/components/scroll.tsx
 import { cva as cva9 } from "class-variance-authority";
-import { forwardRef as forwardRef14 } from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { forwardRef as forwardRef16 } from "react";
+import { jsx as jsx20 } from "react/jsx-runtime";
 var scrollVariants = cva9("aviala-scroll", {
   variants: {
     size: {
@@ -3032,14 +3265,14 @@ var scrollVariants = cva9("aviala-scroll", {
     orientation: "vertical"
   }
 });
-var Scroll = forwardRef14(
+var Scroll = forwardRef16(
   ({
     className,
     size = "default",
     orientation = "vertical",
     children,
     ...props
-  }, ref) => /* @__PURE__ */ jsx18(
+  }, ref) => /* @__PURE__ */ jsx20(
     "div",
     {
       ref,
@@ -3060,97 +3293,16 @@ Scroll.displayName = "Scroll";
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import {
   cloneElement as cloneElement5,
-  forwardRef as forwardRef16,
+  forwardRef as forwardRef17,
   isValidElement as isValidElement10,
   useEffect as useEffect3,
   useState as useState6
 } from "react";
-// src/components/typeface.tsx
-import { forwardRef as forwardRef15 } from "react";
-import { jsx as jsx19 } from "react/jsx-runtime";
-var typefaceLayouts = {
-  allCustom: [
-    { level: "text", children: null },
-    { level: "caption", children: null }
-  ],
-  textCaption: [
-    { level: "text", children: null },
-    { level: "caption", children: null }
-  ],
-  textCaptionSubtitle: [
-    { level: "subtitle", children: null },
-    { level: "text", children: null },
-    { level: "caption", children: null }
-  ],
-  textTitle: [
-    { level: "title", children: null },
-    { level: "text", children: null }
-  ],
-  textHeadline2: [
-    { level: "headline2", children: null },
-    { level: "text", children: null }
-  ],
-  textHeadline1: [
-    { level: "headline1", children: null },
-    { level: "text", children: null }
-  ]
-};
-var Typeface = forwardRef15(
-  ({
-    className,
-    content = "allCustom",
-    primary,
-    secondary,
-    tertiary,
-    primaryContent = "text",
-    secondaryContent = "text",
-    tertiaryContent = "text",
-    tone = "default",
-    children,
-    ...props
-  }, ref) => {
-    const layout = typefaceLayouts[content];
-    const values = resolveTypefaceValues(content, primary, secondary, tertiary, children);
-    return /* @__PURE__ */ jsx19("div", { ref, className: cn("aviala-typeface", className), "data-content": content, ...props, children: layout.map((line, index) => {
-      const value = values[index];
-      if (value === void 0 || value === null || value === false) return null;
-      const lineContent = index === 0 ? primaryContent : index === 1 ? secondaryContent : tertiaryContent;
-      return /* @__PURE__ */ jsx19("span", { className: "aviala-typeface__line", children: /* @__PURE__ */ jsx19(Typography, { level: line.level, content: lineContent, tone, children: value }) }, `${line.level}-${index}`);
-    }) });
-  }
-);
-Typeface.displayName = "Typeface";
-function resolveTypefaceValues(content, primary, secondary, tertiary, children) {
-  if (primary !== void 0 || secondary !== void 0 || tertiary !== void 0) {
-    return [primary, secondary, tertiary];
-  }
-  if (children == null || children === false) {
-    return typefaceLayouts[content].map(() => "Text");
-  }
-  if (Array.isArray(children)) {
-    return children;
-  }
-  return [children];
-}
-var TypefacePair = forwardRef15(
-  ({ title, description, ...props }, ref) => /* @__PURE__ */ jsx19(
-    Typeface,
-    {
-      ref,
-      content: "textCaption",
-      primary: title,
-      secondary: description,
-      ...props
-    }
-  )
-);
-TypefacePair.displayName = "TypefacePair";
 // src/components/checkbox-check-icon.tsx
-import { jsx as jsx20 } from "react/jsx-runtime";
+import { jsx as jsx21 } from "react/jsx-runtime";
 function CheckboxCheckIcon({ className, ...props }) {
-  return /* @__PURE__ */ jsx20(
+  return /* @__PURE__ */ jsx21(
     "svg",
     {
       className: cn("aviala-checkbox__check-icon", className),
@@ -3160,7 +3312,7 @@ function CheckboxCheckIcon({ className, ...props }) {
       "aria-hidden": true,
       overflow: "visible",
       ...props,
-      children: /* @__PURE__ */ jsx20(
+      children: /* @__PURE__ */ jsx21(
         "path",
         {
           className: "aviala-checkbox__check-path",
@@ -3177,14 +3329,14 @@ function CheckboxCheckIcon({ className, ...props }) {
 }
 // src/components/checkbox.tsx
-import { jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
-var Checkbox = forwardRef16(({ className, round = false, size = "default", ...props }, ref) => {
+import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
+var Checkbox = forwardRef17(({ className, round = false, size = "default", ...props }, ref) => {
   const [motionReady, setMotionReady] = useState6(false);
   useEffect3(() => {
     const id = requestAnimationFrame(() => setMotionReady(true));
     return () => cancelAnimationFrame(id);
   }, []);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs12(
     CheckboxPrimitive.Root,
     {
       ref,
@@ -3194,10 +3346,10 @@ var Checkbox = forwardRef16(({ className, round = false, size = "default", ...pr
       "data-motion": motionReady ? "ready" : "boot",
       ...props,
       children: [
-        /* @__PURE__ */ jsx21("span", { "aria-hidden": true, className: "aviala-checkbox__surface" }),
-        /* @__PURE__ */ jsxs11(CheckboxPrimitive.Indicator, { forceMount: true, className: "aviala-checkbox__indicator", children: [
-          /* @__PURE__ */ jsx21(CheckboxCheckIcon, { className: "aviala-checkbox__indicator-icon aviala-checkbox__indicator-icon--check" }),
-          /* @__PURE__ */ jsx21(
+        /* @__PURE__ */ jsx22("span", { "aria-hidden": true, className: "aviala-checkbox__surface" }),
+        /* @__PURE__ */ jsxs12(CheckboxPrimitive.Indicator, { forceMount: true, className: "aviala-checkbox__indicator", children: [
+          /* @__PURE__ */ jsx22(CheckboxCheckIcon, { className: "aviala-checkbox__indicator-icon aviala-checkbox__indicator-icon--check" }),
+          /* @__PURE__ */ jsx22(
             "span",
             {
               "aria-hidden": true,
@@ -3210,8 +3362,8 @@ var Checkbox = forwardRef16(({ className, round = false, size = "default", ...pr
   );
 });
 Checkbox.displayName = CheckboxPrimitive.Root.displayName;
-var CheckboxGroup = forwardRef16(
-  ({ className, direction = "vertical", ...props }, ref) => /* @__PURE__ */ jsx21(
+var CheckboxGroup = forwardRef17(
+  ({ className, direction = "vertical", ...props }, ref) => /* @__PURE__ */ jsx22(
     "div",
     {
       ref,
@@ -3233,9 +3385,9 @@ function renderIcon3(node) {
       "shrink-0"
     )
   }) : node;
-  return /* @__PURE__ */ jsx21("span", { className: "aviala-checkbox-input__icon", children: content });
+  return /* @__PURE__ */ jsx22("span", { className: "aviala-checkbox-input__icon", children: content });
 }
-var CheckboxInput = forwardRef16(
+var CheckboxInput = forwardRef17(
   ({
     className,
     title,
@@ -3244,16 +3396,16 @@ var CheckboxInput = forwardRef16(
     disabled,
     id,
     ...props
-  }, ref) => /* @__PURE__ */ jsxs11(
+  }, ref) => /* @__PURE__ */ jsxs12(
     "label",
     {
       htmlFor: id,
       className: cn("aviala-checkbox-input", className),
       "data-disabled": disabled ? "true" : void 0,
       children: [
-        /* @__PURE__ */ jsx21(Checkbox, { ref, id, disabled, ...props }),
+        /* @__PURE__ */ jsx22(Checkbox, { ref, id, disabled, ...props }),
         renderIcon3(icon),
-        /* @__PURE__ */ jsx21(
+        /* @__PURE__ */ jsx22(
           TypefacePair,
           {
             className: "aviala-checkbox-input__content min-w-0 flex-1",
@@ -3271,11 +3423,11 @@ CheckboxInput.displayName = "CheckboxInput";
 import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
 import {
   cloneElement as cloneElement6,
-  forwardRef as forwardRef17,
+  forwardRef as forwardRef18,
   isValidElement as isValidElement11
 } from "react";
-import { jsx as jsx22, jsxs as jsxs12 } from "react/jsx-runtime";
-var RadioGroup = forwardRef17(({ className, direction = "vertical", ...props }, ref) => /* @__PURE__ */ jsx22(
+import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
+var RadioGroup = forwardRef18(({ className, direction = "vertical", ...props }, ref) => /* @__PURE__ */ jsx23(
   RadioGroupPrimitive.Root,
   {
     className: cn("aviala-radio-group", className),
@@ -3285,15 +3437,15 @@ var RadioGroup = forwardRef17(({ className, direction = "vertical", ...props },
   }
 ));
 RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = forwardRef17(({ className, ...props }, ref) => /* @__PURE__ */ jsxs12(
+var RadioGroupItem = forwardRef18(({ className, ...props }, ref) => /* @__PURE__ */ jsxs13(
   RadioGroupPrimitive.Item,
   {
     ref,
     className: cn("aviala-radio aviala-focus-ring", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx22("span", { "aria-hidden": true, className: "aviala-radio__surface" }),
-      /* @__PURE__ */ jsx22("span", { "aria-hidden": true, className: "aviala-radio__indicator" })
+      /* @__PURE__ */ jsx23("span", { "aria-hidden": true, className: "aviala-radio__surface" }),
+      /* @__PURE__ */ jsx23("span", { "aria-hidden": true, className: "aviala-radio__indicator" })
     ]
   }
 ));
@@ -3309,9 +3461,9 @@ function renderIcon4(node) {
       "shrink-0"
     )
   }) : node;
-  return /* @__PURE__ */ jsx22("span", { className: "aviala-radio-input__icon", children: content });
+  return /* @__PURE__ */ jsx23("span", { className: "aviala-radio-input__icon", children: content });
 }
-var RadioInput = forwardRef17(
+var RadioInput = forwardRef18(
   ({
     className,
     title,
@@ -3321,7 +3473,7 @@ var RadioInput = forwardRef17(
     disabled,
     id,
     ...props
-  }, ref) => /* @__PURE__ */ jsxs12(
+  }, ref) => /* @__PURE__ */ jsxs13(
     "label",
     {
       htmlFor: id,
@@ -3329,9 +3481,9 @@ var RadioInput = forwardRef17(
       "data-style": variant,
       "data-disabled": disabled ? "true" : void 0,
       children: [
-        /* @__PURE__ */ jsx22(RadioGroupItem, { ref, id, disabled, ...props }),
+        /* @__PURE__ */ jsx23(RadioGroupItem, { ref, id, disabled, ...props }),
         renderIcon4(icon),
-        /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx23(
           TypefacePair,
           {
             className: "aviala-radio-input__content min-w-0 flex-1",
@@ -3347,9 +3499,9 @@ RadioInput.displayName = "RadioInput";
 // src/components/switch.tsx
 import * as SwitchPrimitive from "@radix-ui/react-switch";
-import { forwardRef as forwardRef18 } from "react";
-import { jsx as jsx23, jsxs as jsxs13 } from "react/jsx-runtime";
-var Switch = forwardRef18(({ className, size = "regular", ...props }, ref) => /* @__PURE__ */ jsxs13(
+import { forwardRef as forwardRef19 } from "react";
+import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
+var Switch = forwardRef19(({ className, size = "regular", ...props }, ref) => /* @__PURE__ */ jsxs14(
   SwitchPrimitive.Root,
   {
     className: cn(
@@ -3360,8 +3512,8 @@ var Switch = forwardRef18(({ className, size = "regular", ...props }, ref) => /*
     ref,
     ...props,
     children: [
-      /* @__PURE__ */ jsx23("span", { "aria-hidden": true, className: "aviala-switch__surface" }),
-      /* @__PURE__ */ jsx23(SwitchPrimitive.Thumb, { className: "aviala-switch__thumb" })
+      /* @__PURE__ */ jsx24("span", { "aria-hidden": true, className: "aviala-switch__surface" }),
+      /* @__PURE__ */ jsx24(SwitchPrimitive.Thumb, { className: "aviala-switch__thumb" })
     ]
   }
 ));
@@ -3370,14 +3522,14 @@ Switch.displayName = SwitchPrimitive.Root.displayName;
 // src/components/anchor.tsx
 import { Slot as Slot4 } from "@radix-ui/react-slot";
 import {
-  forwardRef as forwardRef19
+  forwardRef as forwardRef20
 } from "react";
-import { jsx as jsx24, jsxs as jsxs14 } from "react/jsx-runtime";
-var Anchor2 = forwardRef19(
-  ({ className, as: Tag2 = "nav", ...props }, ref) => /* @__PURE__ */ jsx24(Tag2, { ref, className: cn("aviala-anchor", className), ...props })
+import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
+var Anchor2 = forwardRef20(
+  ({ className, as: Tag2 = "nav", ...props }, ref) => /* @__PURE__ */ jsx25(Tag2, { ref, className: cn("aviala-anchor", className), ...props })
 );
 Anchor2.displayName = "Anchor";
-var AnchorItem = forwardRef19(
+var AnchorItem = forwardRef20(
   ({
     className,
     activated = false,
@@ -3387,7 +3539,7 @@ var AnchorItem = forwardRef19(
     ...props
   }, ref) => {
     const Comp = asChild ? Slot4 : "a";
-    return /* @__PURE__ */ jsxs14(
+    return /* @__PURE__ */ jsxs15(
       Comp,
       {
         ref,
@@ -3396,8 +3548,8 @@ var AnchorItem = forwardRef19(
         "data-indent": String(indentLevel),
         ...props,
         children: [
-          /* @__PURE__ */ jsx24("span", { className: "aviala-anchor-item__rail", "aria-hidden": true }),
-          /* @__PURE__ */ jsx24("span", { className: "aviala-anchor-item__content", children: /* @__PURE__ */ jsx24(Typography, { level: "text", as: "span", className: "aviala-anchor-item__label", children }) })
+          /* @__PURE__ */ jsx25("span", { className: "aviala-anchor-item__rail", "aria-hidden": true }),
+          /* @__PURE__ */ jsx25("span", { className: "aviala-anchor-item__content", children: /* @__PURE__ */ jsx25(Typography, { level: "text", as: "span", className: "aviala-anchor-item__label", children }) })
         ]
       }
     );
@@ -3407,20 +3559,20 @@ AnchorItem.displayName = "AnchorItem";
 // src/components/segmentator.tsx
 import {
-  createContext as createContext5,
-  forwardRef as forwardRef20,
+  createContext as createContext6,
+  forwardRef as forwardRef21,
   useCallback as useCallback4,
-  useContext as useContext6,
+  useContext as useContext7,
   useEffect as useEffect4,
   useLayoutEffect as useLayoutEffect3,
-  useMemo as useMemo4,
+  useMemo as useMemo5,
   useRef as useRef4,
   useState as useState7
 } from "react";
-import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
-var SegmentatorContext = createContext5(null);
+import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
+var SegmentatorContext = createContext6(null);
 function useSegmentatorContext() {
-  const ctx = useContext6(SegmentatorContext);
+  const ctx = useContext7(SegmentatorContext);
   if (!ctx) {
     throw new Error("SegmentatorItem must be used within SegmentatorGroup");
   }
@@ -3432,7 +3584,7 @@ function renderIcon5(node, dimmed) {
     level: "text",
     biggerSize: true
   });
-  return /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsx26(
     "span",
     {
       className: cn(
@@ -3775,7 +3927,7 @@ function useSegmentatorThumb(groupRef, selectedValue, layoutKey, dragState) {
   }, [layoutKey, remeasureThumb]);
   return { thumb, onThumbRef, writeThumbMetrics, writeThumbMetricsLive };
 }
-var SegmentatorGroup = forwardRef20(
+var SegmentatorGroup = forwardRef21(
   ({
     className,
     value,
@@ -3951,10 +4103,10 @@ var SegmentatorGroup = forwardRef20(
       group.setPointerCapture(event.pointerId);
     };
     const thumbStyle = thumb ? buildThumbStyle() : void 0;
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx26(
       SegmentatorContext.Provider,
       {
-        value: useMemo4(
+        value: useMemo5(
           () => ({
             value: currentValue,
             onValueChange: setValue,
@@ -3966,7 +4118,7 @@ var SegmentatorGroup = forwardRef20(
           }),
           [currentValue, setValue, mode, direction, allRound, disabled]
         ),
-        children: /* @__PURE__ */ jsxs15(
+        children: /* @__PURE__ */ jsxs16(
           "div",
           {
             ref: (node) => {
@@ -3989,7 +4141,7 @@ var SegmentatorGroup = forwardRef20(
             onLostPointerCapture: finishPointerDrag,
             children: [
               children,
-              thumb && /* @__PURE__ */ jsx25(
+              thumb && /* @__PURE__ */ jsx26(
                 "span",
                 {
                   ref: onThumbRef,
@@ -4009,7 +4161,7 @@ var SegmentatorGroup = forwardRef20(
   }
 );
 SegmentatorGroup.displayName = "SegmentatorGroup";
-var SegmentatorItem = forwardRef20(
+var SegmentatorItem = forwardRef21(
   ({
     className,
     value,
@@ -4027,7 +4179,7 @@ var SegmentatorItem = forwardRef20(
     const isDisabled = disabled || ctx.disabled;
     const dimmed = isDisabled;
     const icon = iconOnly ? leftIcon ?? rightIcon : leftIcon;
-    return /* @__PURE__ */ jsx25(
+    return /* @__PURE__ */ jsx26(
       "button",
       {
         ref,
@@ -4049,9 +4201,9 @@ var SegmentatorItem = forwardRef20(
           onClick?.(e);
         },
         ...props,
-        children: /* @__PURE__ */ jsxs15("span", { className: "aviala-segmentator-item__content", children: [
+        children: /* @__PURE__ */ jsxs16("span", { className: "aviala-segmentator-item__content", children: [
           renderIcon5(icon, dimmed && !!icon),
-          !iconOnly && /* @__PURE__ */ jsx25(
+          !iconOnly && /* @__PURE__ */ jsx26(
             "span",
             {
               className: cn(
@@ -4070,141 +4222,6 @@ var SegmentatorItem = forwardRef20(
 );
 SegmentatorItem.displayName = "SegmentatorItem";
-// src/components/form-field.tsx
-import { SymbolInformationCircle, SymbolWrongCircle } from "@aviala-design/icons";
-import {
-  forwardRef as forwardRef21,
-  useId as useId2
-} from "react";
-import {
-  FormProvider,
-  useController
-} from "react-hook-form";
-import { Fragment as Fragment3, jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
-var FormFieldLayout = forwardRef21(
-  ({
-    className,
-    label,
-    htmlFor,
-    description,
-    error,
-    info,
-    alert,
-    required,
-    direction = "vertical",
-    children,
-    ...props
-  }, ref) => {
-    const reactId = useId2();
-    const labelId = `${reactId}-label`;
-    const hasLabel = label != null && label !== "";
-    const labelNode = hasLabel || description ? htmlFor ? /* @__PURE__ */ jsx26("label", { htmlFor, className: "aviala-form__label aviala-form__label--control", children: /* @__PURE__ */ jsx26(
-      Typeface,
-      {
-        id: labelId,
-        content: "textCaption",
-        primary: hasLabel ? /* @__PURE__ */ jsxs16(Fragment3, { children: [
-          label,
-          required ? /* @__PURE__ */ jsx26("span", { className: "aviala-form__required", "aria-hidden": true, children: "*" }) : null
-        ] }) : void 0,
-        secondary: description
-      }
-    ) }) : /* @__PURE__ */ jsx26(
-      Typeface,
-      {
-        id: labelId,
-        className: "aviala-form__label",
-        content: "textCaption",
-        primary: hasLabel ? /* @__PURE__ */ jsxs16(Fragment3, { children: [
-          label,
-          required ? /* @__PURE__ */ jsx26("span", { className: "aviala-form__required", "aria-hidden": true, children: "*" }) : null
-        ] }) : void 0,
-        secondary: description
-      }
-    ) : null;
-    return /* @__PURE__ */ jsxs16(
-      "div",
-      {
-        ref,
-        className: cn("aviala-form", className),
-        "data-direction": direction,
-        "aria-labelledby": hasLabel ? labelId : void 0,
-        ...props,
-        children: [
-          labelNode,
-          /* @__PURE__ */ jsxs16("div", { className: "aviala-form__content", children: [
-            children,
-            error ? /* @__PURE__ */ jsxs16("div", { className: "aviala-form__message aviala-form__message--error", role: "alert", children: [
-              /* @__PURE__ */ jsx26(
-                SymbolWrongCircle,
-                {
-                  className: "aviala-form__message-icon",
-                  width: 14,
-                  height: 14,
-                  "aria-hidden": true
-                }
-              ),
-              /* @__PURE__ */ jsx26(Typography, { level: "caption", as: "p", className: "aviala-form__message-text", children: error })
-            ] }) : null,
-            info ? /* @__PURE__ */ jsxs16("div", { className: "aviala-form__message aviala-form__message--info", children: [
-              /* @__PURE__ */ jsx26(
-                SymbolInformationCircle,
-                {
-                  className: "aviala-form__message-icon",
-                  width: 14,
-                  height: 14,
-                  "aria-hidden": true
-                }
-              ),
-              /* @__PURE__ */ jsx26(Typography, { level: "caption", as: "p", className: "aviala-form__message-text", children: info })
-            ] }) : null,
-            alert ? /* @__PURE__ */ jsx26("div", { className: "aviala-form__alert", children: alert }) : null
-          ] })
-        ]
-      }
-    );
-  }
-);
-FormFieldLayout.displayName = "FormFieldLayout";
-var FormFieldControlled = forwardRef21(
-  ({
-    control,
-    name,
-    rules,
-    defaultValue,
-    shouldUnregister,
-    disabled,
-    render,
-    error,
-    ...layoutProps
-  }, ref) => {
-    const id = useId2();
-    const { field, fieldState, formState } = useController({
-      name,
-      control,
-      rules,
-      defaultValue,
-      shouldUnregister,
-      disabled
-    });
-    const message = error !== void 0 ? error : fieldState.error?.message ?? null;
-    return /* @__PURE__ */ jsx26(FormFieldLayout, { ref, ...layoutProps, htmlFor: id, error: message, children: render({ field, fieldState, formState, id }) });
-  }
-);
-FormFieldControlled.displayName = "FormFieldControlled";
-function isControlledProps(props) {
-  return "render" in props && typeof props.render === "function" && "name" in props;
-}
-var FormFieldRoot = forwardRef21((props, ref) => {
-  if (isControlledProps(props)) {
-    return /* @__PURE__ */ jsx26(FormFieldControlled, { ref, ...props });
-  }
-  return /* @__PURE__ */ jsx26(FormFieldLayout, { ref, ...props });
-});
-var FormField = FormFieldRoot;
-FormField.displayName = "FormField";
-var Form = FormProvider;
 // src/components/input-group.tsx
 import { forwardRef as forwardRef22 } from "react";
 import { jsx as jsx27 } from "react/jsx-runtime";
@@ -4384,17 +4401,17 @@ function clamp01(n) {
 }
 // src/components/color-picker/color-picker-context.tsx
-import { createContext as createContext6, useContext as useContext7 } from "react";
-var ColorPickerContext = createContext6(null);
+import { createContext as createContext7, useContext as useContext8 } from "react";
+var ColorPickerContext = createContext7(null);
 function useColorPickerContext() {
-  const ctx = useContext7(ColorPickerContext);
+  const ctx = useContext8(ColorPickerContext);
   if (!ctx) {
     throw new Error("ColorPicker compound components must be used within <ColorPicker>");
   }
   return ctx;
 }
 function useOptionalColorPickerContext() {
-  return useContext7(ColorPickerContext);
+  return useContext8(ColorPickerContext);
 }
 // src/components/color-picker/use-pointer-drag.ts
@@ -5312,21 +5329,21 @@ import {
   SymbolRight as SymbolRight2
 } from "@aviala-design/icons";
 import {
-  createContext as createContext7,
+  createContext as createContext8,
   forwardRef as forwardRef27,
   isValidElement as isValidElement12,
   useCallback as useCallback10,
-  useContext as useContext8,
+  useContext as useContext9,
   useEffect as useEffect7,
   useLayoutEffect as useLayoutEffect4,
-  useMemo as useMemo5,
+  useMemo as useMemo6,
   useRef as useRef7,
   useState as useState12
 } from "react";
 import { jsx as jsx38, jsxs as jsxs25 } from "react/jsx-runtime";
-var CascaderContext = createContext7(null);
+var CascaderContext = createContext8(null);
 function useCascaderContext() {
-  const context = useContext8(CascaderContext);
+  const context = useContext9(CascaderContext);
   if (!context) {
     throw new Error("Cascader compound components must be used within Cascader.");
   }
@@ -5529,7 +5546,7 @@ function Cascader({
     },
     [changeOnSelect, commitValue, expandTo, handleOpenChange, options]
   );
-  const contextValue = useMemo5(
+  const contextValue = useMemo6(
     () => ({
       open,
       disabled,
@@ -5571,7 +5588,7 @@ var CascaderTrigger = forwardRef27(
     rightIcon,
     expandIcon,
     placeholder,
-    error = false,
+    error,
     displayValue,
     separator = "/",
     disabled: disabledProp,
@@ -5582,6 +5599,7 @@ var CascaderTrigger = forwardRef27(
     const { open, disabled: disabledContext, size: sizeContext, selectedPath, getOptionAtPath } = useCascaderContext();
     const size = sizeProp ?? sizeContext;
     const disabled = disabledProp ?? disabledContext;
+    const resolvedError = useResolvedControlError(error);
     const labels = selectedPath.map((_, index) => getOptionAtPath(selectedPath.slice(0, index + 1))?.label).filter((label) => label != null && label !== false);
     const resolvedDisplay = displayValue ?? (labels.length > 0 ? labels.map((label, index) => /* @__PURE__ */ jsxs25("span", { children: [
       index > 0 ? separator : null,
@@ -5597,7 +5615,7 @@ var CascaderTrigger = forwardRef27(
         "data-size": size,
         "data-all-round": allRound ? "true" : "false",
         "data-state": open ? "open" : "closed",
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
         disabled,
         "aria-expanded": open,
         "aria-haspopup": "listbox",
@@ -5823,7 +5841,7 @@ function CascaderOptionsMenu({ className }) {
   const menuRef = useRef7(null);
   const columnElRefs = useRef7(/* @__PURE__ */ new Map());
   const [columns, setColumns] = useState12([]);
-  const columnPaths = useMemo5(() => {
+  const columnPaths = useMemo6(() => {
     const paths = [[]];
     const expansion = activePath.length > 0 ? activePath : selectedPath.slice(0, -1);
     for (let index = 0; index < expansion.length; index += 1) {
@@ -6016,15 +6034,15 @@ import {
   useEffect as useEffect9,
   useId as useId4,
   useLayoutEffect as useLayoutEffect6,
-  useMemo as useMemo8,
+  useMemo as useMemo9,
   useRef as useRef9,
   useState as useState13
 } from "react";
 // src/components/date-picker/date-picker-context.tsx
-import { createContext as createContext8, useContext as useContext9 } from "react";
+import { createContext as createContext9, useContext as useContext10 } from "react";
 import { jsx as jsx39 } from "react/jsx-runtime";
-var DatePickerContext = createContext8(null);
+var DatePickerContext = createContext9(null);
 function DatePickerProvider({
   value,
   children
@@ -6032,7 +6050,7 @@ function DatePickerProvider({
   return /* @__PURE__ */ jsx39(DatePickerContext.Provider, { value, children });
 }
 function useDatePickerContext() {
-  const context = useContext9(DatePickerContext);
+  const context = useContext10(DatePickerContext);
   if (!context) {
     throw new Error("DatePicker compound components must be used within DatePicker.");
   }
@@ -6223,14 +6241,14 @@ function parseDateRangeInput(text) {
 }
 // src/components/date-picker/date-picker-month-wheels.tsx
-import { useMemo as useMemo7 } from "react";
+import { useMemo as useMemo8 } from "react";
 // src/components/date-picker/date-picker-time-wheel.tsx
 import {
   useCallback as useCallback11,
   useEffect as useEffect8,
   useLayoutEffect as useLayoutEffect5,
-  useMemo as useMemo6,
+  useMemo as useMemo7,
   useRef as useRef8
 } from "react";
@@ -6370,7 +6388,7 @@ function DatePickerTimeWheelColumn({
   const wheelAccumIdleTimerRef = useRef8(void 0);
   const selectedValueRef = useRef8(value);
   selectedValueRef.current = value;
-  const repeatedValues = useMemo6(() => {
+  const repeatedValues = useMemo7(() => {
     if (!loop) return [...values];
     return Array.from({ length: LOOP_SECTIONS }, () => values).flat();
   }, [loop, values]);
@@ -6708,7 +6726,7 @@ function DatePickerMonthYearWheels({
   const { viewMonth, setViewMonth, minDate, maxDate } = useDatePickerContext();
   const year = viewMonth.getFullYear();
   const month = viewMonth.getMonth() + 1;
-  const yearValues = useMemo7(() => {
+  const yearValues = useMemo8(() => {
     const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
     const start = minDate?.getFullYear() ?? currentYear - 100;
     const end = maxDate?.getFullYear() ?? currentYear + 100;
@@ -7071,7 +7089,7 @@ function DatePicker(props) {
       viewMonth
     ]
   );
-  const contextValue = useMemo8(
+  const contextValue = useMemo9(
     () => ({
       open,
       setOpen: handleOpenChange,
@@ -7139,7 +7157,7 @@ var DatePickerTrigger = forwardRef28(
     rightIcon,
     placeholder,
     rangePlaceholder,
-    error = false,
+    error,
     displayValue,
     rangeSeparator = " - ",
     disabled: disabledProp,
@@ -7164,6 +7182,7 @@ var DatePickerTrigger = forwardRef28(
     } = useDatePickerContext();
     const size = sizeProp ?? sizeContext;
     const disabled = disabledProp ?? disabledContext;
+    const resolvedError = useResolvedControlError(error);
     const resolvedPlaceholder = placeholder ?? locale.placeholder;
     const resolvedRangePlaceholder = rangePlaceholder ?? locale.rangePlaceholder;
     const inputRef = useRef9(null);
@@ -7218,7 +7237,7 @@ var DatePickerTrigger = forwardRef28(
           "data-size": size,
           "data-all-round": allRound ? "true" : "false",
           "data-state": open ? "open" : "closed",
-          "data-error": error ? "true" : void 0,
+          "data-error": resolvedError ? "true" : void 0,
           disabled,
           "aria-expanded": open,
           "aria-haspopup": "dialog",
@@ -7250,7 +7269,7 @@ var DatePickerTrigger = forwardRef28(
         "data-size": size,
         "data-all-round": allRound ? "true" : "false",
         "data-state": open ? "open" : "closed",
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
         "data-disabled": disabled ? "true" : void 0,
         onMouseDown: (event) => {
           if (disabled) return;
@@ -7440,8 +7459,8 @@ function DatePickerCalendar({ className }) {
     setActivePanel,
     enableTime
   } = useDatePickerContext();
-  const today = useMemo8(() => startOfDay(/* @__PURE__ */ new Date()), []);
-  const days = useMemo8(() => getCalendarDays(viewMonth), [viewMonth]);
+  const today = useMemo9(() => startOfDay(/* @__PURE__ */ new Date()), []);
+  const days = useMemo9(() => getCalendarDays(viewMonth), [viewMonth]);
   const prevViewMonthRef = useRef9(viewMonth);
   const dayGridRef = useRef9(null);
   const pendingDayFocusRef = useRef9(false);
@@ -7516,7 +7535,7 @@ function DatePickerCalendar({ className }) {
     pendingDayFocusRef.current = false;
     target.focus();
   }, [focusedDay, days, monthSlide]);
-  const outgoingDays = useMemo8(
+  const outgoingDays = useMemo9(
     () => monthSlide ? getCalendarDays(monthSlide.outgoingMonth) : null,
     [monthSlide]
   );
@@ -7931,15 +7950,15 @@ import {
   forwardRef as forwardRef29,
   useCallback as useCallback13,
   useEffect as useEffect10,
-  useMemo as useMemo9,
+  useMemo as useMemo10,
   useRef as useRef10,
   useState as useState14
 } from "react";
 // src/components/time-picker/time-picker-context.tsx
-import { createContext as createContext9, useContext as useContext10 } from "react";
+import { createContext as createContext10, useContext as useContext11 } from "react";
 import { jsx as jsx44 } from "react/jsx-runtime";
-var TimePickerContext = createContext9(null);
+var TimePickerContext = createContext10(null);
 function TimePickerProvider({
   value,
   children
@@ -7947,7 +7966,7 @@ function TimePickerProvider({
   return /* @__PURE__ */ jsx44(TimePickerContext.Provider, { value, children });
 }
 function useTimePickerContext() {
-  const context = useContext10(TimePickerContext);
+  const context = useContext11(TimePickerContext);
   if (!context) {
     throw new Error("TimePicker compound components must be used within TimePicker.");
   }
@@ -8018,7 +8037,7 @@ function TimePicker({
     },
     [disabled, isOpenControlled, onOpenChange]
   );
-  const contextValue = useMemo9(
+  const contextValue = useMemo10(
     () => ({
       open,
       disabled,
@@ -8038,7 +8057,7 @@ var TimePickerTrigger = forwardRef29(
     leftIcon,
     rightIcon,
     placeholder,
-    error = false,
+    error,
     displayValue,
     disabled: disabledProp,
     ...props
@@ -8047,6 +8066,7 @@ var TimePickerTrigger = forwardRef29(
     const { open, disabled: disabledContext, size: sizeContext, value } = useTimePickerContext();
     const size = sizeProp ?? sizeContext;
     const disabled = disabledProp ?? disabledContext;
+    const resolvedError = useResolvedControlError(error);
     const resolvedPlaceholder = placeholder ?? locale.placeholder;
     const formatted = displayValue !== void 0 ? displayValue : formatTimeValue(value.hours, value.minutes);
     const hasValue = formatted != null && formatted !== "";
@@ -8059,7 +8079,7 @@ var TimePickerTrigger = forwardRef29(
         "data-size": size,
         "data-all-round": allRound ? "true" : "false",
         "data-state": open ? "open" : "closed",
-        "data-error": error ? "true" : void 0,
+        "data-error": resolvedError ? "true" : void 0,
         disabled,
         "aria-expanded": open,
         "aria-haspopup": "dialog",
@@ -9318,13 +9338,13 @@ ListItem.displayName = "ListItem";
 import * as PopoverPrimitive7 from "@radix-ui/react-popover";
 import { Slot as Slot5 } from "@radix-ui/react-slot";
 import {
-  createContext as createContext10,
+  createContext as createContext11,
   forwardRef as forwardRef36,
   useCallback as useCallback17,
-  useContext as useContext11,
+  useContext as useContext12,
   useEffect as useEffect14,
   useLayoutEffect as useLayoutEffect7,
-  useMemo as useMemo10,
+  useMemo as useMemo11,
   useRef as useRef13,
   useState as useState19
 } from "react";
@@ -9332,9 +9352,9 @@ import { Fragment as Fragment8, jsx as jsx54, jsxs as jsxs39 } from "react/jsx-r
 function navigationItemButtonMode(active) {
   return active ? "second" : "noBackgroundCustom";
 }
-var NavigationDirectionContext = createContext10("vertical");
+var NavigationDirectionContext = createContext11("vertical");
 function useNavigationDirection() {
-  return useContext11(NavigationDirectionContext);
+  return useContext12(NavigationDirectionContext);
 }
 var NAVIGATION_ANIMATION_MS_FALLBACK = 300;
 var NAVIGATION_ANIMATION_EASING_FALLBACK = "cubic-bezier(0.16, 1, 0.3, 1)";
@@ -9934,9 +9954,9 @@ var NavigationActionsSlot = forwardRef36(({ className, ...props }, ref) => /* @_
 ));
 NavigationActionsSlot.displayName = "NavigationActionsSlot";
 var NAVIGATION_MENU_CLOSE_DELAY_MS = 150;
-var NavigationItemMenuContext = createContext10(null);
+var NavigationItemMenuContext = createContext11(null);
 function useNavigationItemMenuContext(component) {
-  const context = useContext11(NavigationItemMenuContext);
+  const context = useContext12(NavigationItemMenuContext);
   if (!context) {
     throw new Error(`${component} must be used within <NavigationItemMenu>`);
   }
@@ -9996,7 +10016,7 @@ function NavigationItemMenu({
     [cancelClose, isValueControlled, onValueChange, setOpen]
   );
   useEffect14(() => cancelClose, [cancelClose]);
-  const contextValue = useMemo10(
+  const contextValue = useMemo11(
     () => ({
       value,
       hasSelection: value != null && value !== "",
@@ -10156,20 +10176,20 @@ NavigationItemMenuItem.displayName = "NavigationItemMenuItem";
 // src/components/tab.tsx
 import {
-  createContext as createContext11,
+  createContext as createContext12,
   forwardRef as forwardRef37,
   useCallback as useCallback18,
-  useContext as useContext12,
+  useContext as useContext13,
   useEffect as useEffect15,
   useLayoutEffect as useLayoutEffect8,
-  useMemo as useMemo11,
+  useMemo as useMemo12,
   useRef as useRef14,
   useState as useState20
 } from "react";
 import { jsx as jsx55, jsxs as jsxs40 } from "react/jsx-runtime";
-var TabContext = createContext11(null);
+var TabContext = createContext12(null);
 function useTabContext() {
-  const ctx = useContext12(TabContext);
+  const ctx = useContext13(TabContext);
   if (!ctx) {
     throw new Error("TabItem must be used within Tab");
   }
@@ -10318,7 +10338,7 @@ var Tab = forwardRef37(
       },
       []
     );
-    const ctx = useMemo11(
+    const ctx = useMemo12(
       () => ({
         value,
         onValueChange: setValue,
@@ -10623,7 +10643,7 @@ import {
   useEffect as useEffect16,
   useId as useId5,
   useLayoutEffect as useLayoutEffect9,
-  useMemo as useMemo12,
+  useMemo as useMemo13,
   useRef as useRef16
 } from "react";
 import { jsx as jsx57, jsxs as jsxs42 } from "react/jsx-runtime";
@@ -10684,7 +10704,7 @@ function ScrollPickerColumn({
     },
     [values]
   );
-  const repeatedValues = useMemo12(() => {
+  const repeatedValues = useMemo13(() => {
     if (!loop) return [...values];
     return Array.from({ length: LOOP_SECTIONS2 }, () => values).flat();
   }, [loop, values]);
@@ -11007,14 +11027,14 @@ import {
 } from "@aviala-design/icons";
 import { cva as cva15 } from "class-variance-authority";
 import {
-  createContext as createContext12,
+  createContext as createContext13,
   forwardRef as forwardRef39,
   useCallback as useCallback20,
-  useContext as useContext13,
+  useContext as useContext14,
   useState as useState22
 } from "react";
 import { Fragment as Fragment9, jsx as jsx58, jsxs as jsxs43 } from "react/jsx-runtime";
-var BreadcrumbSizeContext = createContext12("default");
+var BreadcrumbSizeContext = createContext13("default");
 function breadcrumbTypeLevel(size) {
   return size === "small" ? "caption" : "text";
 }
@@ -11049,7 +11069,7 @@ var Breadcrumb = forwardRef39(
 Breadcrumb.displayName = "Breadcrumb";
 var BreadcrumbItem = forwardRef39(
   ({ className, href, current = false, icon, onClick, children, ...props }, ref) => {
-    const size = useContext13(BreadcrumbSizeContext);
+    const size = useContext14(BreadcrumbSizeContext);
     const label = /* @__PURE__ */ jsxs43(Fragment9, { children: [
       icon ? /* @__PURE__ */ jsx58("span", { className: "aviala-breadcrumb-item__icon", children: icon }) : null,
       children != null ? /* @__PURE__ */ jsx58(
@@ -11103,7 +11123,7 @@ var BreadcrumbItem = forwardRef39(
 BreadcrumbItem.displayName = "BreadcrumbItem";
 var BreadcrumbSeparator = forwardRef39(
   ({ className, children = "/", ...props }, ref) => {
-    const size = useContext13(BreadcrumbSizeContext);
+    const size = useContext14(BreadcrumbSizeContext);
     return /* @__PURE__ */ jsx58(
       "li",
       {
@@ -11173,7 +11193,7 @@ var BreadcrumbEllipsis = forwardRef39(
     ...props
   }, ref) => {
     const locale = useLocaleMessages("Breadcrumb");
-    const size = useContext13(BreadcrumbSizeContext);
+    const size = useContext14(BreadcrumbSizeContext);
     const [uncontrolledActivated, setUncontrolledActivated] = useState22(defaultActivated);
     const isControlled = activatedProp !== void 0;
     const activated = isControlled ? Boolean(activatedProp) : uncontrolledActivated;
@@ -12126,6 +12146,7 @@ export {
   useDirection,
   useLocale,
   useLocaleMessages,
+  useResolvedControlError,
   useRtl,
   useTheme,
   useThemeLayoutKey,