asheeui 0.6.7 → 0.6.9

package/dist/components/switch/Switch.js

@@ -1,89 +1,85 @@
 "use client";
-import { jsx as r, jsxs as P } from "react/jsx-runtime";
-import { forwardRef as Q, useId as X, useState as Y, useCallback as $ } from "react";
-import { useAsheeConfig as q } from "../../libs/context.js";
-import { resolveCascade as S, resolveRadiusKey as ee, resolveClassKey as l } from "../../utils/resolve-token.js";
-import { FieldShell as se } from "../field/FieldShell.js";
+import { jsx as r, jsxs as Z } from "react/jsx-runtime";
+import { forwardRef as G, useId as O, useState as V, useCallback as J } from "react";
+import { useAsheeConfig as P } from "../../libs/context.js";
+import { resolveCascade as u, resolveRadiusKey as Q, resolveClassKey as l } from "../../utils/resolve-token.js";
+import { FieldShell as X } from "../field/FieldShell.js";
 import { FALLBACK_SWITCH_CONFIG as s } from "./switch-config.js";
-import { SWITCH_TRACK_SIZE_CLASS as re, SWITCH_THUMB_SIZE_CLASS as te, SWITCH_THUMB_TRANSLATE_CLASS as oe, SWITCH_STATUS_BORDER_CLASS as A } from "./switch-styles.js";
-import { RADIUS_CLASS as ie } from "../../shared/radius.js";
-import { resolveVariantClass as le } from "../../shared/variant.js";
+import { SWITCH_TRACK_SIZE_CLASS as Y, SWITCH_THUMB_SIZE_CLASS as $, SWITCH_THUMB_TRANSLATE_CLASS as q } from "./switch-styles.js";
+import { RADIUS_CLASS as ee } from "../../shared/radius.js";
+import { resolveVariantClass as se } from "../../shared/variant.js";
 import { cn as a } from "../../utils/cn.js";
-const ae = Q(
+const re = G(
   ({
-    size: k,
-    color: _,
-    radius: I,
-    status: y,
-    label: T,
-    labelAlign: z,
-    description: x,
-    message: N,
+    size: C,
+    color: k,
+    radius: A,
+    label: y,
+    labelAlign: I,
+    description: _,
     required: p,
     isLoading: n,
-    id: R,
-    className: w,
-    style: H,
-    disabled: K,
+    id: z,
+    className: T,
+    style: x,
+    disabled: N,
     checked: c,
-    defaultChecked: L = !1,
-    onChange: t,
-    ...B
-  }, U) => {
-    var h;
-    const v = q(), e = (h = v.components) == null ? void 0 : h.switch, W = X(), d = R ?? W, [g, E] = Y(L), o = c ?? g, m = S(
-      k,
+    defaultChecked: w = !1,
+    onChange: o,
+    ...K
+  }, H) => {
+    var b;
+    const S = P(), e = (b = S.components) == null ? void 0 : b.switch, L = O(), d = z ?? L, [R, g] = V(w), t = c ?? R, m = u(
+      C,
       e == null ? void 0 : e.size,
       void 0,
       s.size
-    ), F = S(
-      _,
+    ), F = u(
+      k,
       e == null ? void 0 : e.color,
-      v.defaultColor,
+      S.defaultColor,
       s.color
-    ), D = ee(
-      I,
+    ), U = Q(
+      A,
       e == null ? void 0 : e.radius,
       void 0,
       s.radius
-    ), u = y ?? s.status, j = S(
-      z,
+    ), W = u(
+      I,
       e == null ? void 0 : e.labelAlign,
       void 0,
       s.labelAlign
-    ), M = l(
+    ), B = l(
       m,
-      re,
+      Y,
       s.size
-    ), O = l(
+    ), E = l(
       m,
-      te,
+      $,
       s.size
-    ), Z = l(
+    ), j = l(
       m,
-      oe,
+      q,
       s.size
-    ), f = l(
-      D,
-      ie,
+    ), h = l(
+      U,
+      ee,
       s.radius
-    ), G = A[u] ?? A.default, V = le("solid", F), i = K || n, J = $(
-      (b) => {
+    ), D = se("solid", F), i = N || n, M = J(
+      (f) => {
         if (i) return;
-        const C = b.target.checked;
-        c === void 0 && E(C), t == null || t(C, b);
+        const v = f.target.checked;
+        c === void 0 && g(v), o == null || o(v, f);
       },
-      [c, i, t]
+      [c, i, o]
     );
     return /* @__PURE__ */ r(
-      se,
+      X,
       {
         id: d,
-        label: T,
-        labelAlign: j,
-        description: x,
-        message: N,
-        status: u,
+        label: y,
+        labelAlign: W,
+        description: _,
         required: p,
         isLoading: n,
         children: /* @__PURE__ */ r(
@@ -94,44 +90,42 @@ const ae = Q(
               "inline-flex items-center gap-3 select-none cursor-pointer shrink-0",
               i && "opacity-50 pointer-events-none cursor-not-allowed"
             ),
-            children: /* @__PURE__ */ P(
+            children: /* @__PURE__ */ Z(
               "div",
               {
                 className: a(
                   "relative shrink-0 inline-flex items-center",
-                  M
+                  B
                 ),
                 children: [
                   /* @__PURE__ */ r(
                     "input",
                     {
-                      ref: U,
+                      ref: H,
                       id: d,
                       type: "checkbox",
                       role: "switch",
-                      checked: o,
+                      checked: t,
                       disabled: i,
                       required: p,
-                      "aria-checked": o,
-                      "aria-invalid": u === "error",
+                      "aria-checked": t,
                       "aria-busy": n,
-                      onChange: J,
+                      onChange: M,
                       className: "sr-only peer",
-                      ...B
+                      ...K
                     }
                   ),
                   /* @__PURE__ */ r(
                     "div",
                     {
                       className: a(
-                        "absolute inset-0 border transition-colors duration-200 shrink-0",
+                        "absolute inset-0 border border-border/60 transition-colors duration-200 shrink-0",
                         "peer-focus-visible:ring-2 peer-focus-visible:ring-primary peer-focus-visible:ring-offset-2",
-                        G,
-                        f,
-                        o ? V : "bg-secondary/60",
-                        w
+                        h,
+                        t ? D : "bg-secondary",
+                        T
                       ),
-                      style: H
+                      style: x
                     }
                   ),
                   /* @__PURE__ */ r(
@@ -140,9 +134,9 @@ const ae = Q(
                       className: a(
                         "relative z-10 bg-background shadow-sm pointer-events-none shrink-0",
                         "transition-transform duration-200 ease-in-out transform-gpu",
-                        f,
-                        O,
-                        o ? Z : "translate-x-0"
+                        h,
+                        E,
+                        t ? j : "translate-x-0"
                       )
                     }
                   )
@@ -155,7 +149,7 @@ const ae = Q(
     );
   }
 );
-ae.displayName = "Switch";
+re.displayName = "Switch";
 export {
-  ae as Switch
+  re as Switch
 };

package/dist/components/switch/switch-styles.d.ts

@@ -1,4 +1,4 @@
-import { FieldSizeKey, FieldStatus } from '../field/field-config';
+import { FieldSizeKey } from '../field/field-config';
 /**
  * CSS classes for switch track size.
  * Maps size keys to Tailwind width, height, and padding classes.
@@ -15,9 +15,4 @@ export declare const SWITCH_THUMB_SIZE_CLASS: Record<FieldSizeKey, string>;
  * the thumb moves when checked.
  */
 export declare const SWITCH_THUMB_TRANSLATE_CLASS: Record<FieldSizeKey, string>;
-/**
- * CSS classes for switch status border styles.
- * Re-exports the FIELD_STATUS_BORDER_CLASS for consistent validation styling.
- */
-export declare const SWITCH_STATUS_BORDER_CLASS: Record<FieldStatus, string>;
 //# sourceMappingURL=switch-styles.d.ts.map

package/dist/components/switch/switch-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switch-styles.d.ts","sourceRoot":"","sources":["../../../src/components/switch/switch-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAEvE;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIhE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIhE,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIrE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,0BAA0B,EAAE,MAAM,CAAC,WAAW,EAAE,MAAM,CAKlE,CAAC"}
+{"version":3,"file":"switch-styles.d.ts","sourceRoot":"","sources":["../../../src/components/switch/switch-styles.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAE1D;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIhE,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIhE,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,4BAA4B,EAAE,MAAM,CAAC,YAAY,EAAE,MAAM,CAIrE,CAAC"}

package/dist/components/switch/switch-styles.js

@@ -1,25 +1,19 @@
 "use client";
-const r = {
+const s = {
   sm: "w-8 h-4.5 p-0.5",
   md: "w-11 h-6 p-0.5",
   lg: "w-14 h-7.5 p-1"
-}, s = {
+}, S = {
   sm: "size-3.5",
   md: "size-5",
   lg: "size-5.5"
-}, e = {
+}, t = {
   sm: "translate-x-3.5",
   md: "translate-x-5",
   lg: "translate-x-6"
-}, S = {
-  default: "border-border/60",
-  error: "border-danger",
-  warning: "border-warning",
-  success: "border-success"
 };
 export {
-  S as SWITCH_STATUS_BORDER_CLASS,
-  s as SWITCH_THUMB_SIZE_CLASS,
-  e as SWITCH_THUMB_TRANSLATE_CLASS,
-  r as SWITCH_TRACK_SIZE_CLASS
+  S as SWITCH_THUMB_SIZE_CLASS,
+  t as SWITCH_THUMB_TRANSLATE_CLASS,
+  s as SWITCH_TRACK_SIZE_CLASS
 };

package/dist/components/tabs/Tabs.js

@@ -138,7 +138,7 @@ const pe = ae(
               role: "tablist",
               "aria-orientation": "horizontal",
               className: g(
-                "flex flex-row w-full items-center overflow-x-auto scrollbar-hide shrink-0",
+                "flex flex-row w-full items-center overflow-x-auto scrollable-hidden shrink-0",
                 le,
                 v !== "underline" && ie,
                 F

package/dist/components/textarea/Textarea.d.ts

@@ -1,4 +1,5 @@
 import { default as React, TextareaHTMLAttributes } from 'react';
+import { KeyboardOpenOptions } from '../keyboard';
 import { TextAreaConfig } from './textarea-config';
 type BaseTextAreaProps = TextAreaConfig & Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size" | "color" | "children">;
 /**
@@ -38,9 +39,12 @@ export interface TextAreaProps extends BaseTextAreaProps {
      * Whether the virtual keyboard should be enabled for mobile devices.
      * Controls the inputmode attribute.
      *
+     * When enabled, the textarea will use the virtual keyboard system.
+     * Can also be an object to configure the keyboard behavior.
+     *
      * @default true
      */
-    enableVirtualKeyboard?: boolean;
+    enableVirtualKeyboard?: boolean | KeyboardOpenOptions;
 }
 /**
  * A multi-line text input with label, description, validation message,
@@ -106,9 +110,23 @@ export interface TextAreaProps extends BaseTextAreaProps {
  * />
  * ```
  *
+ * @example
+ * ```tsx
+ * // With virtual keyboard configuration
+ * <TextArea
+ *   label="Numeric Input"
+ *   enableVirtualKeyboard={{
+ *     layout: "numeric",
+ *     size: "lg",
+ *     color: "primary"
+ *   }}
+ * />
+ * ```
+ *
  * @see TextAreaConfig - The configuration type for component defaults.
  * @see FieldShell - The wrapper component for label and validation.
  * @see useAsheeConfig - Hook for accessing the global configuration.
+ * @see useKeyboardField - Hook for connecting inputs to the virtual keyboard.
  */
 export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
 export {};

package/dist/components/textarea/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/Textarea.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,EAEZ,KAAK,sBAAsB,EAK5B,MAAM,OAAO,CAAC;AAkBf,OAAO,EAEL,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAC;AAQ3B,KAAK,iBAAiB,GAAG,cAAc,GACrC,IAAI,CACF,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,GAAG,OAAO,GAAG,UAAU,CAC9B,CAAC;AAEJ;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,iBAAiB;IACtD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;OAKG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,eAAO,MAAM,QAAQ,2FA4KpB,CAAC"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/textarea/Textarea.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,EAEZ,KAAK,sBAAsB,EAK5B,MAAM,OAAO,CAAC;AAiBf,OAAO,EAAE,KAAK,mBAAmB,EAAoB,MAAM,aAAa,CAAC;AACzE,OAAO,EAEL,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAC;AAQ3B,KAAK,iBAAiB,GAAG,cAAc,GACrC,IAAI,CACF,sBAAsB,CAAC,mBAAmB,CAAC,EAC3C,MAAM,GAAG,OAAO,GAAG,UAAU,CAC9B,CAAC;AAEJ;;GAEG;AACH,MAAM,WAAW,aAAc,SAAQ,iBAAiB;IACtD;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;;;OAQG;IACH,qBAAqB,CAAC,EAAE,OAAO,GAAG,mBAAmB,CAAC;CACvD;AAID;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiFG;AACH,eAAO,MAAM,QAAQ,2FAyLpB,CAAC"}

package/dist/components/textarea/Textarea.js

@@ -1,134 +1,139 @@
 "use client";
-import { jsx as h } from "react/jsx-runtime";
-import { forwardRef as W, useRef as Y, useImperativeHandle as g, useId as q, useCallback as K } from "react";
-import { useAsheeConfig as ee } from "../../libs/context.js";
-import { resolveCascade as o, resolveRadiusKey as re, resolveClassKey as se } from "../../utils/resolve-token.js";
+import { jsx as T } from "react/jsx-runtime";
+import { forwardRef as q, useRef as V, useImperativeHandle as ee, useId as re, useCallback as E } from "react";
+import { useAsheeConfig as se } from "../../libs/context.js";
+import { resolveCascade as t, resolveRadiusKey as oe, resolveClassKey as te } from "../../utils/resolve-token.js";
 import { FieldShell as ae } from "../field/FieldShell.js";
 import { FALLBACK_TEXTAREA_CONFIG as r } from "./textarea-config.js";
-import { TEXTAREA_STATUS_BORDER_CLASS as oe, TEXTAREA_SIZE_CLASS as le } from "./textarea-styles.js";
-import { useKeyboardField as te } from "../keyboard/use-keyboard-field.js";
-import { resolveVariantClass as de } from "../../shared/variant.js";
-import { RADIUS_CLASS as ie } from "../../shared/radius.js";
-import { cn as ne } from "../../utils/cn.js";
-const ue = W(
+import { TEXTAREA_STATUS_BORDER_CLASS as le, TEXTAREA_SIZE_CLASS as de } from "./textarea-styles.js";
+import { useKeyboardField as ie } from "../keyboard/use-keyboard-field.js";
+import { resolveVariantClass as ne } from "../../shared/variant.js";
+import { RADIUS_CLASS as ce } from "../../shared/radius.js";
+import { cn as ue } from "../../utils/cn.js";
+const me = q(
   ({
-    size: T,
-    radius: I,
-    variant: x,
-    color: E,
-    status: _,
-    label: w,
-    labelAlign: L,
+    size: I,
+    radius: x,
+    variant: K,
+    color: _,
+    status: w,
+    label: L,
+    labelAlign: z,
     description: u,
-    message: c,
-    required: m,
-    isLoading: v,
-    rows: z,
+    message: m,
+    required: v,
+    isLoading: f,
+    rows: B,
     id: C,
-    className: B,
-    disabled: F,
-    style: N,
-    onFocus: l,
-    onBlur: t,
-    enableVirtualKeyboard: X = !0,
-    ...j
-  }, k) => {
-    var S;
-    const d = ee(), e = (S = d.components) == null ? void 0 : S.textarea, n = Y(null);
-    g(k, () => n.current);
-    const D = q(), a = C ?? D, f = u ? `${a}-description` : void 0, A = c ? `${a}-message` : void 0, O = [f, A].filter(Boolean).join(" ") || void 0, { handleFocus: p, handleBlur: b } = te(a, n, X), U = K(
+    className: j,
+    disabled: k,
+    style: F,
+    onFocus: a,
+    onBlur: l,
+    enableVirtualKeyboard: d = !0,
+    ...N
+  }, O) => {
+    var h;
+    const i = se(), e = (h = i.components) == null ? void 0 : h.textarea, c = V(null);
+    ee(O, () => c.current);
+    const X = re(), o = C ?? X, p = u ? `${o}-description` : void 0, A = m ? `${o}-message` : void 0, D = [p, A].filter(Boolean).join(" ") || void 0, U = !!d, $ = typeof d == "object" && d !== null ? d : void 0, { handleFocus: y, handleBlur: b } = ie(
+      o,
+      c,
+      U,
+      $
+    ), G = E(
       (s) => {
-        p(s), l == null || l(s);
+        y(s), a == null || a(s);
       },
-      [p, l]
-    ), V = K(
+      [y, a]
+    ), H = E(
       (s) => {
-        b(), t == null || t(s);
+        b(), l == null || l(s);
       },
-      [b, t]
-    ), $ = o(
-      T,
+      [b, l]
+    ), Z = t(
+      I,
       e == null ? void 0 : e.size,
       void 0,
       r.size
-    ), y = o(
-      x,
+    ), R = t(
+      K,
       e == null ? void 0 : e.variant,
-      d.defaultVariant,
+      i.defaultVariant,
       r.variant
-    ), G = o(
-      E,
+    ), J = t(
+      _,
       e == null ? void 0 : e.color,
-      d.defaultColor,
+      i.defaultColor,
       r.color
-    ), R = (s) => s === "full" ? "xl" : s, H = re(
-      R(I),
-      R(e == null ? void 0 : e.radius),
-      d.defaultRadius,
+    ), S = (s) => s === "full" ? "xl" : s, M = oe(
+      S(x),
+      S(e == null ? void 0 : e.radius),
+      i.defaultRadius,
       r.radius
-    ), i = _ ?? r.status, Z = o(
-      L,
+    ), n = w ?? r.status, P = t(
+      z,
       e == null ? void 0 : e.labelAlign,
       void 0,
       r.labelAlign
-    ), J = o(
-      z,
+    ), Q = t(
+      B,
       e == null ? void 0 : e.rows,
       void 0,
       r.rows
-    ), M = de(
-      y,
-      G
-    ), P = i !== "default" ? oe[i] : "", Q = y === "underlined" ? "rounded-none" : se(
-      H,
-      ie,
+    ), W = ne(
+      R,
+      J
+    ), Y = n !== "default" ? le[n] : "", g = R === "underlined" ? "rounded-none" : te(
+      M,
+      ce,
       r.radius
     );
-    return /* @__PURE__ */ h(
+    return /* @__PURE__ */ T(
       ae,
       {
-        id: a,
-        label: w,
-        labelAlign: Z,
+        id: o,
+        label: L,
+        labelAlign: P,
         description: u,
-        descriptionId: f,
-        message: c,
+        descriptionId: p,
+        message: m,
         messageId: A,
-        status: i,
-        required: m,
-        isLoading: v,
-        children: /* @__PURE__ */ h(
+        status: n,
+        required: v,
+        isLoading: f,
+        children: /* @__PURE__ */ T(
           "textarea",
           {
-            ref: n,
-            id: a,
-            disabled: F,
-            required: m,
-            rows: J,
-            "aria-busy": v,
-            "aria-invalid": i === "error",
-            "aria-describedby": O,
-            onFocus: U,
-            onBlur: V,
-            className: ne(
+            ref: c,
+            id: o,
+            disabled: k,
+            required: v,
+            rows: Q,
+            "aria-busy": f,
+            "aria-invalid": n === "error",
+            "aria-describedby": D,
+            onFocus: G,
+            onBlur: H,
+            className: ue(
               "resize-y w-full text-foreground outline-none transition-colors shrink-0",
               "focus-visible:ring-2 focus-visible:ring-offset-2",
               "disabled:pointer-events-none disabled:opacity-50",
-              le[$],
-              M,
-              P,
-              Q,
-              B
+              de[Z],
+              W,
+              Y,
+              g,
+              j
             ),
-            style: N,
-            ...j
+            style: F,
+            ...N
           }
         )
       }
     );
   }
 );
-ue.displayName = "TextArea";
+me.displayName = "TextArea";
 export {
-  ue as TextArea
+  me as TextArea
 };