@vkzstudio/muza-ui 1.0.21 → 1.0.23

package/dist/components/FileUpload/FileUpload.js

@@ -1,15 +1,15 @@
-import { jsxs as f, jsx as a, Fragment as re } from "react/jsx-runtime";
-import * as y from "react";
-import { cva as G } from "class-variance-authority";
-import { useDropzone as le } from "react-dropzone";
-import { FileItem as K } from "./FileItem.js";
-import { useMuzaTranslations as se } from "../../translations/TranslationContext.js";
-import { Flex as _ } from "../Flex/Flex.js";
-import { FormField as ie } from "../FormField/FormField.js";
-import { cn as B } from "../../utils/cn.js";
-import { CloudUploadOutline as ae } from "@solar-icons/react-perf";
-import { Typography as k } from "../Typography/Typography.js";
-const de = G(
+import { jsxs as n, jsx as a, Fragment as pe } from "react/jsx-runtime";
+import * as v from "react";
+import { cva as Y } from "class-variance-authority";
+import { useDropzone as ue } from "react-dropzone";
+import { FileItem as Q } from "./FileItem.js";
+import { useMuzaTranslations as fe } from "../../translations/TranslationContext.js";
+import { Flex as W } from "../Flex/Flex.js";
+import { FormField as ne } from "../FormField/FormField.js";
+import { cn as X } from "../../utils/cn.js";
+import { CloudUploadOutline as me } from "@solar-icons/react-perf";
+import { Typography as M } from "../Typography/Typography.js";
+const ge = Y(
   [
     "group relative cursor-pointer rounded-xl border-1 border-dashed transition-colors",
     "p-4xl pt-3xl pr-4xl pb-3xl",
@@ -45,7 +45,7 @@ const de = G(
       }
     }
   }
-), pe = G(
+), xe = Y(
   [
     "text-center transition-colors",
     "text-comp-file-upload-text-dark-secondary"
@@ -57,119 +57,139 @@ const de = G(
       }
     }
   }
-), ce = y.forwardRef(
+), he = v.forwardRef(
   ({
-    className: $,
-    onDrop: x,
-    accept: u,
-    multiple: w = !0,
-    maxSize: g,
-    maxSizeErrorMessage: J,
-    size: N = "base",
+    className: U,
+    onDrop: z,
+    accept: m,
+    multiple: A = !0,
+    maxSize: y,
+    maxSizeErrorMessage: Z,
+    maxFiles: i,
+    maxFilesErrorMessage: q,
+    size: P = "base",
     disabled: p = !1,
-    readOnly: m = !1,
-    dropzoneOptions: L,
-    label: I,
-    title: Q,
-    subtitle: R,
-    preselectedFiles: W = [],
-    fileStatus: X = [],
-    itemErrors: b,
-    itemHints: h,
-    error: Y,
-    required: v,
-    disableRequiredAsterisk: Z,
+    readOnly: g = !1,
+    dropzoneOptions: O,
+    label: V,
+    title: H,
+    subtitle: K,
+    preselectedFiles: D = [],
+    fileStatus: C = [],
+    itemErrors: S,
+    itemHints: F,
+    error: E,
+    required: k,
+    disableRequiredAsterisk: ee,
     onError: t,
-    onDelete: z,
-    onChange: c,
-    preselectedUrls: M = [],
-    onDeleteUrl: F,
-    labelExtra: q,
-    infoTooltip: O,
-    ...H
-  }, D) => {
-    const n = se(), [S, U] = y.useState(W), [j, A] = y.useState(!1), E = Q ?? n.fileUpload.title, P = g ? n.fileUpload.maxSizeError.replace(
+    onDelete: w,
+    onChange: u,
+    preselectedUrls: x = [],
+    onDeleteUrl: $,
+    labelExtra: te,
+    infoTooltip: oe,
+    ...le
+  }, se) => {
+    const f = fe(), [h, _] = v.useState(D), [j, N] = v.useState(!1), [B, b] = v.useState(!1), T = h.length + x.length, re = H ?? f.fileUpload.title, I = i != null ? f.fileUpload.maxFilesError.replace("{count}", String(i)) : "", R = q ?? I, G = y ? f.fileUpload.maxSizeError.replace(
       "{size}",
-      (g / (1024 * 1024)).toFixed(0)
-    ) : "", T = J ?? P, { getRootProps: C, getInputProps: ee, isDragActive: oe } = le({
-      onDrop: (e, l) => {
+      (y / (1024 * 1024)).toFixed(0)
+    ) : "", J = Z ?? G, { getRootProps: ae, getInputProps: ie, isDragActive: de } = ue({
+      onDrop: (e, s) => {
         try {
-          if (A(!1), l.length > 0 && l.some(
-            (r) => r.errors.some((s) => s.code === "file-too-large")
-          )) {
-            A(!0);
-            const r = T || P;
-            t == null || t(r, l[0].file);
+          if (N(!1), b(!1), s.length > 0) {
+            const o = s.some(
+              (l) => l.errors.some((r) => r.code === "file-too-large")
+            );
+            if (s.some(
+              (l) => l.errors.some((r) => r.code === "too-many-files")
+            )) {
+              b(!0);
+              const l = R || I;
+              t == null || t(l, s[0].file);
+              return;
+            }
+            if (o) {
+              N(!0);
+              const l = J || G;
+              t == null || t(l, s[0].file);
+              return;
+            }
+          }
+          if (i != null && T + e.length > i) {
+            b(!0);
+            const o = R || I;
+            t == null || t(o);
             return;
           }
-          U((o) => {
-            const r = new Set(
-              o.map((i) => `${i.name}-${i.size}-${i.lastModified}`)
-            ), s = e.filter(
-              (i) => !r.has(`${i.name}-${i.size}-${i.lastModified}`)
-            ), d = [...o, ...s];
-            return c == null || c(d), d;
-          }), x == null || x(e);
+          _((o) => {
+            const c = new Set(
+              o.map((d) => `${d.name}-${d.size}-${d.lastModified}`)
+            ), l = e.filter(
+              (d) => !c.has(`${d.name}-${d.size}-${d.lastModified}`)
+            ), r = [...o, ...l];
+            return u == null || u(r), r;
+          }), z == null || z(e);
         } catch (o) {
-          const r = o instanceof Error ? o.message : n.fileUpload.processingError;
-          t == null || t(r);
+          const c = o instanceof Error ? o.message : f.fileUpload.processingError;
+          t == null || t(c);
         }
       },
-      accept: typeof u == "string" ? { [u]: [] } : u ? Object.fromEntries(u.map((e) => [e, []])) : void 0,
-      multiple: w,
-      maxSize: g,
+      accept: typeof m == "string" ? { [m]: [] } : m ? Object.fromEntries(m.map((e) => [e, []])) : void 0,
+      multiple: A,
+      maxSize: y,
+      maxFiles: i != null ? i - T : void 0,
       disabled: p,
-      ...L
-    }), V = m || !w && (S.length > 0 || M.length > 0);
-    return /* @__PURE__ */ f(_, { direction: "column", gap: "lg", children: [
-      (!V || I) && /* @__PURE__ */ a(
-        ie,
+      ...O
+    }), L = g || !A && (h.length > 0 || x.length > 0) || i != null && T >= i;
+    return /* @__PURE__ */ n(W, { direction: "column", gap: "lg", children: [
+      (!L || V) && /* @__PURE__ */ a(
+        ne,
         {
-          label: I,
-          required: v,
-          disableRequiredAsterisk: Z,
-          labelExtra: q,
-          infoTooltip: O,
-          children: !V && /* @__PURE__ */ f(re, { children: [
-            /* @__PURE__ */ f(
+          label: V,
+          required: k,
+          disableRequiredAsterisk: ee,
+          labelExtra: te,
+          infoTooltip: oe,
+          children: !L && /* @__PURE__ */ n(pe, { children: [
+            /* @__PURE__ */ n(
               "div",
               {
-                ref: D,
+                ref: se,
                 tabIndex: p ? void 0 : 0,
-                className: B(
-                  de({
-                    error: Y || j,
+                className: X(
+                  ge({
+                    error: E || j || B,
                     disabled: p,
-                    className: $,
-                    isDragActive: oe
+                    className: U,
+                    isDragActive: de
                   })
                 ),
-                ...C(),
-                ...H,
+                ...ae(),
+                ...le,
                 children: [
                   /* @__PURE__ */ a(
                     "input",
                     {
-                      ...ee({ required: v }),
-                      "aria-required": v
+                      ...ie({ required: k }),
+                      "aria-required": k
                     }
                   ),
-                  /* @__PURE__ */ a(ae, { className: "inline size-comp-file-upload-ico-size" }),
-                  /* @__PURE__ */ f("div", { children: [
-                    /* @__PURE__ */ a(k, { size: "base", component: "p", weight: "medium", children: E }),
-                    R && /* @__PURE__ */ a(
-                      k,
+                  /* @__PURE__ */ a(me, { className: "inline size-comp-file-upload-ico-size" }),
+                  /* @__PURE__ */ n("div", { children: [
+                    /* @__PURE__ */ a(M, { size: "base", component: "p", weight: "medium", children: re }),
+                    K && /* @__PURE__ */ a(
+                      M,
                       {
                         size: "sm",
                         component: "p",
                         weight: "regular",
-                        className: B(
-                          pe({
+                        className: X(
+                          xe({
                             disabled: p,
-                            className: $
+                            className: U
                           })
                         ),
-                        children: R
+                        children: K
                       }
                     )
                   ] })
@@ -177,22 +197,33 @@ const de = G(
               }
             ),
             j && /* @__PURE__ */ a(
-              k,
+              M,
+              {
+                size: "sm",
+                variant: "body",
+                component: "p",
+                weight: "regular",
+                className: "text-comp-file-upload-text-error-def",
+                children: J
+              }
+            ),
+            B && /* @__PURE__ */ a(
+              M,
               {
                 size: "sm",
                 variant: "body",
                 component: "p",
                 weight: "regular",
                 className: "text-comp-file-upload-text-error-def",
-                children: T
+                children: R
               }
             )
           ] })
         }
       ),
-      (M.length > 0 || S.length > 0) && /* @__PURE__ */ f(_, { component: "ul", direction: "column", gap: "md", children: [
-        M.map((e, l) => /* @__PURE__ */ a(
-          K,
+      (x.length > 0 || h.length > 0) && /* @__PURE__ */ n(W, { component: "ul", direction: "column", gap: "md", children: [
+        x.map((e, s) => /* @__PURE__ */ a(
+          Q,
           {
             source: "url",
             url: e.url,
@@ -200,36 +231,36 @@ const de = G(
             type: e.type,
             uploaded: !0,
             disabled: p,
-            readOnly: m,
-            size: N,
-            onDelete: () => F == null ? void 0 : F(e, l)
+            readOnly: g,
+            size: P,
+            onDelete: () => $ == null ? void 0 : $(e, s)
           },
           `url-${e.url}`
         )),
-        S.map((e, l) => {
-          const o = X[l], r = o == null ? void 0 : o.uploaded;
-          return m && !r ? null : /* @__PURE__ */ a(
-            K,
+        h.map((e, s) => {
+          const o = C[s], c = o == null ? void 0 : o.uploaded;
+          return g && !c ? null : /* @__PURE__ */ a(
+            Q,
             {
               source: "file",
               file: e,
-              uploaded: r,
+              uploaded: c,
               progress: o == null ? void 0 : o.progress,
               disabled: p,
-              readOnly: m,
-              error: b == null ? void 0 : b.get(e),
-              note: h == null ? void 0 : h.get(e),
+              readOnly: g,
+              error: S == null ? void 0 : S.get(e),
+              note: F == null ? void 0 : F.get(e),
               onError: t,
-              size: N,
+              size: P,
               onDelete: () => {
                 try {
-                  U((s) => {
-                    const d = s.filter((i, te) => te !== l);
-                    return c == null || c(d), d;
-                  }), z == null || z(e, l);
-                } catch (s) {
-                  const d = s instanceof Error ? s.message : n.fileUpload.deleteError;
-                  t == null || t(d, e);
+                  b(!1), N(!1), _((l) => {
+                    const r = l.filter((d, ce) => ce !== s);
+                    return u == null || u(r), r;
+                  }), w == null || w(e, s);
+                } catch (l) {
+                  const r = l instanceof Error ? l.message : f.fileUpload.deleteError;
+                  t == null || t(r, e);
                 }
               }
             },
@@ -240,7 +271,7 @@ const de = G(
     ] });
   }
 );
-ce.displayName = "FileUpload";
+he.displayName = "FileUpload";
 export {
-  ce as FileUpload
+  he as FileUpload
 };

package/dist/components/FileUpload/FileUpload.stories.d.ts

@@ -17,6 +17,8 @@ export declare const Disabled: Story;
 export declare const WithErrorsAndHints: Story;
 export declare const ReadOnly: Story;
 export declare const UploadSimulation: Story;
+export declare const WithMaxFiles: Story;
+export declare const WithMaxFilesAndPreselected: Story;
 export declare const PreselectedUrls: Story;
 export declare const MixedFilesAndUrls: Story;
 export declare const SingleFileWithUrl: Story;

package/dist/components/FileUpload/FileUpload.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FileUpload.stories.d.ts","sourceRoot":"","sources":["../../../src/components/FileUpload/FileUpload.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,OAAO,EAAE,UAAU,EAAuB,MAAM,cAAc,CAAA;AAE9D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAoLjC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAiBrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAgBtB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAmBnB,CAAA;AAED,eAAO,MAAM,sBAAsB,EAAE,KAoBpC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAsB9B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAkB3B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAiBxB,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAqBjC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAexB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAiB3B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAmBtB,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KA0ChC,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAoBtB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KA0F9B,CAAA;AAmBD,eAAO,MAAM,eAAe,EAAE,KA0B7B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAoC/B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAsB/B,CAAA"}
+{"version":3,"file":"FileUpload.stories.d.ts","sourceRoot":"","sources":["../../../src/components/FileUpload/FileUpload.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAE3D,OAAO,EAAE,UAAU,EAAuB,MAAM,cAAc,CAAA;AAE9D,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,UAAU,CAgMjC,CAAA;AAED,eAAe,IAAI,CAAA;AACnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAiBrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAgBtB,CAAA;AAED,eAAO,MAAM,KAAK,EAAE,KAmBnB,CAAA;AAED,eAAO,MAAM,sBAAsB,EAAE,KAoBpC,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAsB9B,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAkB3B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAiBxB,CAAA;AAED,eAAO,MAAM,mBAAmB,EAAE,KAqBjC,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAexB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAiB3B,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAmBtB,CAAA;AAED,eAAO,MAAM,kBAAkB,EAAE,KA0ChC,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAoBtB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KA0F9B,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAiB1B,CAAA;AAED,eAAO,MAAM,0BAA0B,EAAE,KAuBxC,CAAA;AAmBD,eAAO,MAAM,eAAe,EAAE,KA0B7B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAoC/B,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,KAsB/B,CAAA"}

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":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AA0Cd,wCAAwC;AACxC,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,UAAU,CAAC;IAC/D,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAA;IACpD,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6FAA6F;IAC7F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,sFAAsF;IACtF,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gGAAgG;IAChG,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,6HAA6H;IAC7H,kBAAkB,CAAC,EAAE,OAAO,CAAA;CAC7B;AAED,eAAO,MAAM,QAAQ,4HAqGpB,CAAA"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../../src/components/Textarea/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAA;AA+Dd,wCAAwC;AACxC,MAAM,WAAW,aAAc,SAAQ,cAAc,CAAC,UAAU,CAAC;IAC/D,uEAAuE;IACvE,MAAM,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,YAAY,GAAG,MAAM,CAAA;IACpD,+CAA+C;IAC/C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,6FAA6F;IAC7F,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,sFAAsF;IACtF,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,gGAAgG;IAChG,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+EAA+E;IAC/E,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,SAAS,CAAA;IACtB,gHAAgH;IAChH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,6HAA6H;IAC7H,kBAAkB,CAAC,EAAE,OAAO,CAAA;CAC7B;AAED,eAAO,MAAM,QAAQ,4HA0GpB,CAAA"}

package/dist/components/Textarea/Textarea.js

@@ -1,22 +1,20 @@
-import { jsxs as A, jsx as m } from "react/jsx-runtime";
-import { forwardRef as C, useId as G, useRef as H, useState as U } from "react";
-import { cva as B } from "class-variance-authority";
+import { jsxs as G, jsx as l } from "react/jsx-runtime";
+import { forwardRef as H, useId as U, useRef as W, useState as B } from "react";
+import { cva as h } from "class-variance-authority";
 import { FormField as D } from "../FormField/FormField.js";
-import { cn as f } from "../../utils/cn.js";
-import { typographyVariants as h } from "../Typography/Typography.js";
-const E = B(
+import { cn as x } from "../../utils/cn.js";
+import { typographyVariants as b } from "../Typography/Typography.js";
+const E = h(
   [
-    h({
+    b({
       variant: "body",
       weight: "medium",
       size: "base"
     }),
-    "w-full bg-comp-input-fill-def px-comp-input-p-hor py-xl font-text text-comp-input-text-primary transition-colors",
+    "w-full font-text text-comp-input-text-primary transition-colors outline-none",
     "placeholder:font-regular placeholder:text-comp-input-text-placeholder",
-    "rounded-xl border border-comp-input-stroke-def",
-    "hover:border-comp-input-stroke-hover",
-    "disabled:cursor-not-allowed disabled:border-comp-input-stroke-disabled disabled:bg-comp-input-fill-disabled",
-    "outline-none focus:border-comp-input-stroke-focused"
+    "mr-[calc(var(--spacing-xl)/2)] pt-xl pr-[calc(var(--spacing-comp-input-p-hor)-var(--spacing-xl)/2)] pb-[calc(var(--spacing-xl)/2)] pl-comp-input-p-hor",
+    "disabled:cursor-not-allowed"
   ],
   {
     variants: {
@@ -38,36 +36,57 @@ const E = B(
       resize: "none"
     }
   }
-), J = C(
+), J = h(
+  [
+    "overflow-hidden rounded-xl border border-comp-input-stroke-def bg-comp-input-fill-def transition-colors",
+    "focus-within:border-comp-texteditor-stroke-focused",
+    "pb-[calc(var(--spacing-xl)/2)]",
+    // Offset scrollbar to make resize handle visible
+    "flex"
+  ],
+  {
+    variants: {
+      state: {
+        default: "border-comp-texteditor-stroke-def hover:border-comp-texteditor-stroke-hover",
+        disabled: "cursor-not-allowed border-comp-input-stroke-disabled bg-comp-input-fill-disabled",
+        error: "border-comp-texteditor-stroke-error"
+      }
+    },
+    defaultVariants: {
+      state: "default"
+    }
+  }
+), K = H(
   ({
-    className: x,
-    label: b,
-    hint: g,
-    id: y,
-    error: o,
-    resize: v,
-    autoResize: l,
-    errorMessage: s,
-    required: r,
-    disableRequiredAsterisk: z,
-    labelExtra: w,
-    infoTooltip: I,
-    showCharacterCount: k,
-    value: n,
+    className: g,
+    label: v,
+    hint: y,
+    id: w,
+    error: e,
+    resize: z,
+    autoResize: s,
+    errorMessage: c,
+    required: o,
+    disableRequiredAsterisk: k,
+    labelExtra: I,
+    infoTooltip: N,
+    showCharacterCount: R,
+    value: a,
     defaultValue: d,
-    onChange: i,
-    ...a
-  }, c) => {
-    const R = G(), e = y ?? R, N = `${e}-hint`, F = `${e}-label`, S = H(null), p = (typeof c == "function" ? null : c) ?? S, u = n !== void 0, [$, j] = U(
+    onChange: n,
+    disabled: p,
+    ...i
+  }, u) => {
+    const V = U(), r = w ?? V, F = `${r}-hint`, S = `${r}-label`, $ = W(null), m = (typeof u == "function" ? null : u) ?? $, f = a !== void 0, [j, A] = B(
       () => String(d ?? "").length
-    ), L = u ? String(n).length : $, T = () => {
-      const t = p.current;
-      t && (t.style.height = "auto", t.style.height = `${t.scrollHeight + 2}px`);
-    }, V = k && a.maxLength != null ? /* @__PURE__ */ A(
+    ), L = f ? String(a).length : j, T = () => {
+      const t = m.current;
+      t && (t.style.height = "auto", t.style.height = `${t.scrollHeight}px`);
+    }, C = R && i.maxLength != null ? /* @__PURE__ */ G(
       "span",
       {
-        className: f(
-          h({
+        className: x(
+          b({
             variant: "body",
             weight: "regular",
             size: "sm"
@@ -77,50 +96,51 @@ const E = B(
         children: [
           L,
           "/",
-          a.maxLength
+          i.maxLength
         ]
       }
     ) : void 0;
-    return /* @__PURE__ */ m(
+    return /* @__PURE__ */ l(
       D,
       {
-        label: b,
-        hint: o && s ? s : g,
-        error: o,
-        required: r,
-        disableRequiredAsterisk: z,
-        htmlFor: e,
-        labelId: F,
-        hintId: N,
-        labelExtra: w,
-        infoTooltip: I,
-        labelRight: V,
-        children: /* @__PURE__ */ m(
+        label: v,
+        hint: e && c ? c : y,
+        error: e,
+        required: o,
+        disableRequiredAsterisk: k,
+        htmlFor: r,
+        labelId: S,
+        hintId: F,
+        labelExtra: I,
+        infoTooltip: N,
+        labelRight: C,
+        children: /* @__PURE__ */ l("div", { className: J({ state: p ? "disabled" : e ? "error" : "default" }), children: /* @__PURE__ */ l(
           "textarea",
           {
             "data-slot": "textarea",
-            ref: p,
-            id: e,
-            required: r,
-            "aria-required": r,
-            className: f(
-              E({ error: o, resize: v, autoResize: l }),
-              x
+            ref: m,
+            id: r,
+            required: o,
+            "aria-required": o,
+            className: x(
+              E({ error: e, resize: z, autoResize: s }),
+              g
             ),
-            value: n,
+            value: a,
             defaultValue: d,
             onChange: (t) => {
-              u || j(t.target.value.length), i == null || i(t);
+              f || A(t.target.value.length), n == null || n(t);
             },
-            ...a,
-            onInput: l ? T : void 0
+            disabled: p,
+            ...i,
+            onInput: s ? T : void 0
           }
-        )
+        ) })
       }
     );
   }
 );
-J.displayName = "Textarea";
+K.displayName = "Textarea";
 export {
-  J as Textarea
+  K as Textarea
 };