@okam/stack-ui 2.0.3 → 2.1.0

package/index43.mjs

@@ -1,67 +1,70 @@
 "use client";
-import { jsxs as c, jsx as e } from "react/jsx-runtime";
-import { useRef as x, useCallback as T } from "react";
-import { useSearchField as v, FocusRing as w } from "react-aria";
+import { jsxs as p, jsx as t } from "react/jsx-runtime";
+import { useRef as w, useCallback as B } from "react";
+import { useSearchField as A } from "react-aria";
 import { useSearchFieldState as F } from "react-stately";
-import I from "./index88.mjs";
-import { useUserQueryValHook as M } from "./index90.mjs";
+import M from "./index88.mjs";
+import { useUserQueryValHook as j } from "./index90.mjs";
 import { Box as m } from "./index7.mjs";
-import { Button as R } from "./index8.mjs";
-import j from "./index99.mjs";
-import Q from "./index130.mjs";
-import { Typography as U } from "./index74.mjs";
-function E({ value: t }) {
-  return t === "" ? /* @__PURE__ */ e(Q, { width: "16", height: "16" }) : /* @__PURE__ */ e(j, { width: "16", height: "16" });
+import { Button as I } from "./index8.mjs";
+import Q from "./index99.mjs";
+import U from "./index130.mjs";
+import { Typography as E } from "./index74.mjs";
+function H({ value: n, clearButtonProps: r, isDisabled: a, tokens: e, themeName: l }) {
+  return n === "" ? /* @__PURE__ */ t(m, { as: "span", themeName: `${l}.icon`, tokens: e, "aria-hidden": "true", children: /* @__PURE__ */ t(U, { width: "16", height: "16" }) }) : /* @__PURE__ */ t(
+    I,
+    {
+      ...r,
+      isDisabled: a,
+      handlePress: r.onPress,
+      tokens: { ...e, isIconOnly: !0, buttonStyle: "hollow" },
+      themeName: `${l}.button`,
+      children: /* @__PURE__ */ t(Q, { width: "16", height: "16" })
+    }
+  );
 }
-function X(t) {
-  const { setUserSearchQuery: u } = M(), {
-    label: h,
-    themeName: s = "search",
-    tokens: f,
-    customTheme: b,
-    disabled: g,
-    errorMessage: a,
-    placeholder: k,
-    icon: l,
-    isDisabled: C
-  } = t, o = C || g, d = { ...t, isDisabled: o }, n = F(d), p = x(null), { labelProps: N, inputProps: i, errorMessageProps: P, clearButtonProps: S } = v(d, n, p), y = T(
-    ($) => {
-      u(n.value), i.onChange?.($);
+function Y(n) {
+  const { setUserSearchQuery: r } = j(), {
+    label: a,
+    themeName: e = "search",
+    tokens: l,
+    customTheme: f,
+    disabled: b,
+    errorMessage: c,
+    placeholder: g,
+    renderAction: k,
+    isDisabled: N
+  } = n, s = N || b, u = { ...n, isDisabled: s }, i = F(u), d = w(null), { labelProps: C, inputProps: h, errorMessageProps: P, clearButtonProps: S } = A(u, i, d), $ = B(
+    (v) => {
+      r(i.value), h.onChange?.(v);
     },
-    [u, n.value, i]
-  ), B = a != null, r = { ...f, isError: B, isDisabled: o ?? !1 }, D = I(`${s}.input`, r, b);
-  return /* @__PURE__ */ c(m, { themeName: `${s}.wrapper`, tokens: r, "aria-disabled": o ?? !1, children: [
-    h != null && /* @__PURE__ */ e(m, { ...N, as: "label", themeName: `${s}.label`, tokens: r, children: h }),
-    /* @__PURE__ */ c(m, { themeName: `${s}.container`, tokens: r, children: [
-      /* @__PURE__ */ e(
+    [r, i.value, h]
+  ), y = c != null, o = { ...l, isError: y, isDisabled: s ?? !1 }, D = M(`${e}.input`, o, f), x = k ?? H, T = {
+    value: i.value,
+    clearButtonProps: S,
+    isDisabled: s ?? !1,
+    tokens: o,
+    themeName: e ?? "search"
+  };
+  return /* @__PURE__ */ p(m, { themeName: `${e}.wrapper`, tokens: o, "aria-disabled": s ?? !1, children: [
+    a != null && /* @__PURE__ */ t(m, { ...C, as: "label", themeName: `${e}.label`, tokens: o, children: a }),
+    /* @__PURE__ */ p(m, { themeName: `${e}.container`, tokens: o, children: [
+      /* @__PURE__ */ t(
         "input",
         {
-          ref: p,
-          ...i,
-          onChange: y,
-          placeholder: k,
+          ref: d,
+          ...h,
+          onChange: $,
+          placeholder: g,
           className: D,
-          disabled: o
+          disabled: s
         }
       ),
-      /* @__PURE__ */ e(w, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ c(
-        R,
-        {
-          isDisabled: o,
-          handlePress: S.onPress,
-          tokens: { isIconOnly: !0, buttonStyle: "hollow", isDisabled: o ?? !1 },
-          themeName: `${s}.icon`,
-          "aria-label": "clear",
-          children: [
-            l == null && /* @__PURE__ */ e(E, { value: n.value }),
-            l != null && l
-          ]
-        }
-      ) })
+      /* @__PURE__ */ t(x, { ...T })
     ] }),
-    a != null && /* @__PURE__ */ e(U, { themeName: `${s}.errorMessage`, tokens: r, ...P, children: a })
+    c != null && /* @__PURE__ */ t(E, { themeName: `${e}.errorMessage`, tokens: o, ...P, children: c })
   ] });
 }
 export {
-  X as default
+  Y as default
 };

package/index46.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),H=require("radashi"),P=require("react"),y=require("react-aria"),A=require("react-hook-form"),q=require("./index88.js"),D=require("./index89.js"),I=require("./index74.js");function C(t){const{id:b,label:r,name:g,placeholder:p,required:f,disabled:o=!1,errorMessage:l,ariaLabel:T,value:u,onBlur:c,onChange:j,fieldRef:v,themeName:n="textarea",tokens:F,customTheme:i,children:E}=t,h=P.useRef(null),{errorMessageProps:d,inputProps:M,labelProps:k}=y.useTextField(t,h),e={...F,isDisabled:o,isError:l!=null},a=q(`${n}.wrapper`,e,i),m=q(`${n}.input`,e,i),N=q(`${n}.label`,e,i),O=q(`${n}.container`,e,i);return s.jsxs("div",{children:[s.jsxs("div",{className:a,"aria-disabled":o?"true":"false",children:[r!=null&&s.jsx("label",{className:N,...k,children:r}),s.jsx(y.FocusRing,{focusRingClass:"has-focus-ring",children:s.jsxs("div",{className:O,children:[E,s.jsx("textarea",{...M,ref:R=>{v?.(R),h.current=R},className:m,placeholder:p,disabled:o,required:f,id:b,name:g,"aria-label":T,"aria-labelledby":b,value:u,onBlur:c,onChange:j})]})})]}),l!=null&&s.jsx(I.Typography,{themeName:`${n}.errorMessage`,tokens:e,...d,children:l})]})}function B({name:t,label:b,rules:r,tokens:g,ariaLabel:p,defaultValue:f="",placeholder:o="",themeName:l="textarea",isReadOnly:T=!1,minLength:u,maxLength:c,required:j,isRequired:v,onChange:n,onBlur:F,children:i=null,...E}){const{control:h}=A.useFormContext(),{t:d}=D.useTranslation(),M=()=>{const e=Object.entries(E).filter(([a,m])=>a.startsWith("aria-"));return Object.fromEntries(e)},k={required:j??v?d("FORM.ERROR.REQUIRED")??"required":!1,...u!=null&&{minLength:{value:u,message:d("FORM.ERROR.MIN_LENGTH",{length:u})}},...c!=null&&{maxLength:{value:c,message:d("FORM.ERROR.MAX_LENGTH",{length:c})}},...r};return s.jsx(A.Controller,{name:t,control:h,rules:k,disabled:r?.disabled,defaultValue:f,render:({field:e,fieldState:a})=>{const{ref:m,...N}=e,O=!H.isEmpty(a.error),R={isDisabled:e.disabled??!1,isRequired:r?.required===!0||r?.required==="required",isInvalid:a.invalid,isError:O,isReadOnly:T},$={...g,...R};return s.jsx(C,{...N,...R,...M(),fieldRef:m,name:t,placeholder:o,themeName:l,label:b,tokens:$,ariaLabel:p,isDisabled:e.disabled,isRequired:r?.required===!0||r?.required==="required",isInvalid:a.invalid,errorMessage:a.error?.message,onChange:x=>{e.onChange(x),n?.(x)},onBlur:x=>{e.onBlur(),F?.(x)},children:i})}})}exports.ReactHookFormTextArea=B;exports.TextArea=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),P=require("@react-aria/utils"),$=require("radashi"),D=require("react"),O=require("react-aria"),y=require("react-hook-form"),h=require("./index88.js"),H=require("./index89.js"),I=require("./index74.js"),w=require("./index133.js");function C(t){const{id:b,label:r,name:p,placeholder:g,required:f,disabled:o=!1,errorMessage:l,ariaLabel:T,value:u,onBlur:c,onChange:v,fieldRef:M,themeName:a="textarea",tokens:j,customTheme:i,children:k}=t,R=D.useRef(null),{errorMessageProps:d,inputProps:E,labelProps:n}=O.useTextField(t,R),e={...j,isDisabled:o,isError:l!=null},F=h(`${a}.wrapper`,e,i),N=h(`${a}.input`,e,i),A=h(`${a}.label`,e,i),q=h(`${a}.container`,e,i);return s.jsxs("div",{children:[s.jsxs("div",{className:F,"aria-disabled":o?"true":"false",children:[r!=null&&s.jsx("label",{className:A,...n,children:r}),s.jsx(O.FocusRing,{focusRingClass:"has-focus-ring",children:s.jsxs("div",{className:q,children:[k,s.jsx("textarea",{...E,ref:x=>{M?.(x),R.current=x},className:N,placeholder:g,disabled:o,required:f,id:b,name:p,"aria-label":T,"aria-labelledby":b,value:u,onBlur:c,onChange:v})]})})]}),l!=null&&s.jsx(I.Typography,{themeName:`${a}.errorMessage`,tokens:e,...d,children:l})]})}function B({name:t,label:b,rules:r,tokens:p,ariaLabel:g,defaultValue:f="",placeholder:o="",themeName:l="textarea",isReadOnly:T=!1,minLength:u,maxLength:c,required:v,isRequired:M,onChange:a,onBlur:j,children:i=null,...k}){const{control:R}=y.useFormContext(),{t:d}=H.useTranslation(),E={required:v??M?d("FORM.ERROR.REQUIRED")??"required":!1,...u!=null&&{minLength:{value:u,message:d("FORM.ERROR.MIN_LENGTH",{length:u})}},...c!=null&&{maxLength:{value:c,message:d("FORM.ERROR.MAX_LENGTH",{length:c})}},...r};return s.jsx(y.Controller,{name:t,control:R,rules:E,disabled:r?.disabled,defaultValue:f,render:({field:n,fieldState:e})=>{const{ref:F,...N}=n,A=!$.isEmpty(e.error),q={isDisabled:n.disabled??!1,isRequired:r?.required===!0||r?.required==="required",isInvalid:e.invalid,isError:A,isReadOnly:T},x={...p,...q};return s.jsx(C,{...N,...q,...P.filterDOMProps(k,{events:!0,labelable:!0,isLink:!1,global:!0,propNames:new Set([...w.textAreaAttributes])}),fieldRef:F,name:t,placeholder:o,themeName:l,label:b,tokens:x,ariaLabel:g,isDisabled:n.disabled,isRequired:r?.required===!0||r?.required==="required",isInvalid:e.invalid,errorMessage:e.error?.message,onChange:m=>{n.onChange(m),a?.(m)},onBlur:m=>{n.onBlur(),j?.(m)},children:i})}})}exports.ReactHookFormTextArea=B;exports.TextArea=C;

package/index46.mjs

@@ -1,142 +1,141 @@
 "use client";
-import { jsx as n, jsxs as y } from "react/jsx-runtime";
-import { isEmpty as j } from "radashi";
-import { useRef as A } from "react";
-import { useTextField as D, FocusRing as I } from "react-aria";
-import { useFormContext as P, Controller as B } from "react-hook-form";
+import { jsx as i, jsxs as y } from "react/jsx-runtime";
+import { filterDOMProps as A } from "@react-aria/utils";
+import { isEmpty as D } from "radashi";
+import { useRef as P } from "react";
+import { useTextField as $, FocusRing as I } from "react-aria";
+import { useFormContext as w, Controller as B } from "react-hook-form";
 import h from "./index88.mjs";
 import { useTranslation as H } from "./index89.mjs";
-import { Typography as _ } from "./index74.mjs";
-function w(o) {
+import { Typography as j } from "./index74.mjs";
+import { textAreaAttributes as G } from "./index133.mjs";
+function L(l) {
   const {
-    id: p,
+    id: m,
     label: r,
     name: g,
     placeholder: v,
     required: T,
-    disabled: l = !1,
+    disabled: n = !1,
     errorMessage: t,
     ariaLabel: q,
-    value: d,
-    onBlur: u,
-    onChange: E,
-    fieldRef: x,
-    themeName: a = "textarea",
-    tokens: F,
-    customTheme: i,
-    children: M
-  } = o, R = A(null), { errorMessageProps: c, inputProps: N, labelProps: O } = D(o, R), e = { ...F, isDisabled: l, isError: t != null }, s = h(`${a}.wrapper`, e, i), f = h(`${a}.input`, e, i), C = h(`${a}.label`, e, i), k = h(`${a}.container`, e, i);
+    value: u,
+    onBlur: d,
+    onChange: x,
+    fieldRef: M,
+    themeName: s = "textarea",
+    tokens: E,
+    customTheme: a,
+    children: N
+  } = l, p = P(null), { errorMessageProps: c, inputProps: F, labelProps: o } = $(l, p), e = { ...E, isDisabled: n, isError: t != null }, k = h(`${s}.wrapper`, e, a), C = h(`${s}.input`, e, a), O = h(`${s}.label`, e, a), f = h(`${s}.container`, e, a);
   return /* @__PURE__ */ y("div", { children: [
-    /* @__PURE__ */ y("div", { className: s, "aria-disabled": l ? "true" : "false", children: [
-      r != null && /* @__PURE__ */ n("label", { className: C, ...O, children: r }),
-      /* @__PURE__ */ n(I, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ y("div", { className: k, children: [
-        M,
-        /* @__PURE__ */ n(
+    /* @__PURE__ */ y("div", { className: k, "aria-disabled": n ? "true" : "false", children: [
+      r != null && /* @__PURE__ */ i("label", { className: O, ...o, children: r }),
+      /* @__PURE__ */ i(I, { focusRingClass: "has-focus-ring", children: /* @__PURE__ */ y("div", { className: f, children: [
+        N,
+        /* @__PURE__ */ i(
           "textarea",
           {
-            ...N,
-            ref: (m) => {
-              x?.(m), R.current = m;
+            ...F,
+            ref: (b) => {
+              M?.(b), p.current = b;
             },
-            className: f,
+            className: C,
             placeholder: v,
-            disabled: l,
+            disabled: n,
             required: T,
-            id: p,
+            id: m,
             name: g,
             "aria-label": q,
-            "aria-labelledby": p,
-            value: d,
-            onBlur: u,
-            onChange: E
+            "aria-labelledby": m,
+            value: u,
+            onBlur: d,
+            onChange: x
           }
         )
       ] }) })
     ] }),
-    t != null && /* @__PURE__ */ n(_, { themeName: `${a}.errorMessage`, tokens: e, ...c, children: t })
+    t != null && /* @__PURE__ */ i(j, { themeName: `${s}.errorMessage`, tokens: e, ...c, children: t })
   ] });
 }
-function K({
-  name: o,
-  label: p,
+function Z({
+  name: l,
+  label: m,
   rules: r,
   tokens: g,
   ariaLabel: v,
   defaultValue: T = "",
-  placeholder: l = "",
+  placeholder: n = "",
   themeName: t = "textarea",
   isReadOnly: q = !1,
-  minLength: d,
-  maxLength: u,
-  required: E,
-  isRequired: x,
-  onChange: a,
-  onBlur: F,
-  children: i = null,
-  ...M
+  minLength: u,
+  maxLength: d,
+  required: x,
+  isRequired: M,
+  onChange: s,
+  onBlur: E,
+  children: a = null,
+  ...N
 }) {
-  const { control: R } = P(), { t: c } = H(), N = () => {
-    const e = Object.entries(M).filter(([s, f]) => s.startsWith("aria-"));
-    return Object.fromEntries(e);
-  }, O = {
-    required: E ?? x ? c("FORM.ERROR.REQUIRED") ?? "required" : !1,
-    ...d != null && {
+  const { control: p } = w(), { t: c } = H(), F = {
+    required: x ?? M ? c("FORM.ERROR.REQUIRED") ?? "required" : !1,
+    ...u != null && {
       minLength: {
-        value: d,
-        message: c("FORM.ERROR.MIN_LENGTH", { length: d })
+        value: u,
+        message: c("FORM.ERROR.MIN_LENGTH", { length: u })
       }
     },
-    ...u != null && {
+    ...d != null && {
       maxLength: {
-        value: u,
-        message: c("FORM.ERROR.MAX_LENGTH", { length: u })
+        value: d,
+        message: c("FORM.ERROR.MAX_LENGTH", { length: d })
       }
     },
     ...r
   };
-  return /* @__PURE__ */ n(
+  return /* @__PURE__ */ i(
     B,
     {
-      name: o,
-      control: R,
-      rules: O,
+      name: l,
+      control: p,
+      rules: F,
       disabled: r?.disabled,
       defaultValue: T,
-      render: ({ field: e, fieldState: s }) => {
-        const { ref: f, ...C } = e, k = !j(s.error), m = {
-          isDisabled: e.disabled ?? !1,
+      render: ({ field: o, fieldState: e }) => {
+        const { ref: k, ...C } = o, O = !D(e.error), f = {
+          isDisabled: o.disabled ?? !1,
           isRequired: r?.required === !0 || r?.required === "required",
-          isInvalid: s.invalid,
-          isError: k,
+          isInvalid: e.invalid,
+          isError: O,
           isReadOnly: q
-        }, $ = {
+        }, b = {
           ...g,
-          ...m
+          ...f
         };
-        return /* @__PURE__ */ n(
-          w,
+        return /* @__PURE__ */ i(
+          L,
           {
             ...C,
-            ...m,
-            ...N(),
-            fieldRef: f,
-            name: o,
-            placeholder: l,
+            ...f,
+            ...A(N, { events: !0, labelable: !0, isLink: !1, global: !0, propNames: /* @__PURE__ */ new Set([...G]) }),
+            fieldRef: k,
+            name: l,
+            placeholder: n,
             themeName: t,
-            label: p,
-            tokens: $,
+            label: m,
+            tokens: b,
             ariaLabel: v,
-            isDisabled: e.disabled,
+            isDisabled: o.disabled,
             isRequired: r?.required === !0 || r?.required === "required",
-            isInvalid: s.invalid,
-            errorMessage: s.error?.message,
-            onChange: (b) => {
-              e.onChange(b), a?.(b);
+            isInvalid: e.invalid,
+            errorMessage: e.error?.message,
+            onChange: (R) => {
+              o.onChange(R), s?.(R);
             },
-            onBlur: (b) => {
-              e.onBlur(), F?.(b);
+            onBlur: (R) => {
+              o.onBlur(), E?.(R);
             },
-            children: i
+            children: a
           }
         );
       }
@@ -144,6 +143,6 @@ function K({
   );
 }
 export {
-  K as ReactHookFormTextArea,
-  w as TextArea
+  Z as ReactHookFormTextArea,
+  L as TextArea
 };

package/index47.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),P=require("radashi"),A=require("react"),y=require("react-aria"),B=require("react-hook-form"),_=require("./index88.js"),w=require("./index89.js"),g=require("./index7.js"),D=require("./index48.js"),G=require("./index74.js");function C(R){const{icon:h,errorIcon:s,label:u,isRequired:m=!1,isDisabled:x=!1,isInvalid:f=!1,required:j,disabled:k,errorMessage:n,fieldRef:d,children:F,themeName:i="textInput",tokens:I,customTheme:o,ariaLabel:E,placeholder:M,isReadOnly:N=!1,...T}=R,p=A.useRef(null),c=j??m,v=k??x,{labelProps:O,inputProps:r,errorMessageProps:l}=y.useTextField({label:u,errorMessage:n,isRequired:c,isDisabled:v,isInvalid:f,isReadOnly:N,...T},p),q=a=>{a!=null&&(d?.(a),p.current=a)},t={...I,isDisabled:x,isRequired:m,isError:n!=null},$=_(`${i}.input`,t);return e.jsxs(g.Box,{children:[e.jsx(y.FocusRing,{focusRingClass:"has-focus-ring",within:!0,children:e.jsxs(g.Box,{"aria-disabled":r.disabled,themeName:`${i}.wrapper`,tokens:t,customTheme:o,children:[u!=null&&e.jsx(g.Box,{as:"label",tokens:t,themeName:`${i}.label`,customTheme:o,...O,children:u}),e.jsxs(g.Box,{themeName:`${i}.container`,tokens:t,customTheme:o,children:[F,e.jsx("input",{"aria-label":E,...r,placeholder:M,ref:q,className:$})]}),h!=null&&e.jsx(D,{themeName:`${i}.icon`,tokens:t,customTheme:o,icon:h,"aria-hidden":!0}),n!=null&&s!=null&&e.jsx(D,{themeName:`${i}.errorIcon`,tokens:t,customTheme:o,icon:s,"aria-hidden":!0})]})}),n!=null&&e.jsx(G.Typography,{themeName:`${i}.errorMessage`,tokens:t,customTheme:o,...l,children:n})]})}function L({name:R,label:h,rules:s,tokens:u,ariaLabel:m,defaultValue:x="",placeholder:f="",themeName:j="textInput",isReadOnly:k=!1,minLength:n,maxLength:d,required:F,isRequired:i,onChange:I,onBlur:o,children:E=null,errorIcon:M,icon:N,...T}){const{control:p}=B.useFormContext(),{t:c}=w.useTranslation(),v=()=>{const r=Object.entries(T).filter(([l,q])=>l.startsWith("aria-"));return Object.fromEntries(r)},O={required:F??i?c("FORM.ERROR.REQUIRED")??"required":!1,...n!=null&&{minLength:{value:n,message:c("FORM.ERROR.MIN_LENGTH",{length:n})}},...d!=null&&{maxLength:{value:d,message:c("FORM.ERROR.MAX_LENGTH",{length:d})}},...s};return e.jsx(B.Controller,{name:R,control:p,rules:O,disabled:s?.disabled,defaultValue:x,render:({field:r,fieldState:l})=>{const{ref:q,...t}=r,$=!P.isEmpty(l.error),a={isDisabled:r.disabled??!1,isRequired:s?.required===!0||s?.required==="required",isInvalid:l.invalid,isError:$,isReadOnly:k},H={...u,...a};return e.jsx(C,{...t,...a,...v(),fieldRef:q,name:R,placeholder:f,themeName:j,label:h,tokens:H,ariaLabel:m,isDisabled:r.disabled,isRequired:s?.required===!0||s?.required==="required",isInvalid:l.invalid,errorMessage:l.error?.message,onChange:b=>{r.onChange(b),I?.(b)},onBlur:b=>{r.onBlur(),o?.(b)},icon:N,errorIcon:M,children:E})}})}exports.ReactHookFormInput=L;exports.TextInputField=C;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),C=require("@react-aria/utils"),H=require("radashi"),w=require("react"),O=require("react-aria"),D=require("react-hook-form"),A=require("./index88.js"),G=require("./index89.js"),g=require("./index7.js"),B=require("./index48.js"),L=require("./index74.js"),_=require("./index134.js");function P(R){const{icon:p,errorIcon:r,label:a,isRequired:m=!1,isDisabled:q=!1,isInvalid:f=!1,required:k,disabled:I,errorMessage:s,fieldRef:u,children:j,themeName:n="textInput",tokens:F,customTheme:t,ariaLabel:M,placeholder:N,isReadOnly:T=!1,...v}=R,x=w.useRef(null),d=k??m,E=I??q,{labelProps:o,inputProps:l,errorMessageProps:$}=O.useTextField({label:a,errorMessage:s,isRequired:d,isDisabled:E,isInvalid:f,isReadOnly:T,...v},x),y=c=>{c!=null&&(u?.(c),x.current=c)},i={...F,isDisabled:q,isRequired:m,isError:s!=null},b=A(`${n}.input`,i);return e.jsxs(g.Box,{children:[e.jsx(O.FocusRing,{focusRingClass:"has-focus-ring",within:!0,children:e.jsxs(g.Box,{"aria-disabled":l.disabled,themeName:`${n}.wrapper`,tokens:i,customTheme:t,children:[a!=null&&e.jsx(g.Box,{as:"label",tokens:i,themeName:`${n}.label`,customTheme:t,...o,children:a}),e.jsxs(g.Box,{themeName:`${n}.container`,tokens:i,customTheme:t,children:[j,e.jsx("input",{"aria-label":M,...l,placeholder:N,ref:y,className:b})]}),p!=null&&e.jsx(B,{themeName:`${n}.icon`,tokens:i,customTheme:t,icon:p,"aria-hidden":!0}),s!=null&&r!=null&&e.jsx(B,{themeName:`${n}.errorIcon`,tokens:i,customTheme:t,icon:r,"aria-hidden":!0})]})}),s!=null&&e.jsx(L.Typography,{themeName:`${n}.errorMessage`,tokens:i,customTheme:t,...$,children:s})]})}function Q({name:R,label:p,rules:r,tokens:a,ariaLabel:m,defaultValue:q="",placeholder:f="",themeName:k="textInput",isReadOnly:I=!1,minLength:s,maxLength:u,required:j,isRequired:n,onChange:F,onBlur:t,children:M=null,errorIcon:N,icon:T,...v}){const{control:x}=D.useFormContext(),{t:d}=G.useTranslation(),E={required:j??n?d("FORM.ERROR.REQUIRED")??"required":!1,...s!=null&&{minLength:{value:s,message:d("FORM.ERROR.MIN_LENGTH",{length:s})}},...u!=null&&{maxLength:{value:u,message:d("FORM.ERROR.MAX_LENGTH",{length:u})}},...r};return e.jsx(D.Controller,{name:R,control:x,rules:E,disabled:r?.disabled,defaultValue:q,render:({field:o,fieldState:l})=>{const{ref:$,...y}=o,i=!H.isEmpty(l.error),b={isDisabled:o.disabled??!1,isRequired:r?.required===!0||r?.required==="required",isInvalid:l.invalid,isError:i,isReadOnly:I},c={...a,...b};return e.jsx(P,{...y,...b,...C.filterDOMProps(v,{events:!0,labelable:!0,isLink:!1,global:!0,propNames:new Set([..._.textInputAttributes])}),fieldRef:$,name:R,placeholder:f,themeName:k,label:p,tokens:c,ariaLabel:m,isDisabled:o.disabled,isRequired:r?.required===!0||r?.required==="required",isInvalid:l.invalid,errorMessage:l.error?.message,onChange:h=>{o.onChange(h),F?.(h)},onBlur:h=>{o.onBlur(),t?.(h)},icon:T,errorIcon:N,children:M})}})}exports.ReactHookFormInput=Q;exports.TextInputField=P;