@choco-vanille/ui 1.1.1 → 1.2.0

package/dist/components/forms/switch/Switch.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),u=require("@base-ui/react/switch"),d=require("react"),w=require("../../foundation/typography/Typography.cjs");require("../../foundation/typography/styles/Typography.css.cjs");const _=require("../_shared/components/helper-text/HelperText.cjs"),h=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const o=require("../../../utils/cn.cjs"),s=require("./styles/Switch.css.cjs"),m=d.memo(({label:i,helperText:c,error:r,id:p,className:T,disabled:n,size:l="md",onCheckedChange:I,...q})=>{const x=d.useId(),t=p??(i?x:void 0),a=!!r,S=c||r?`${t}-helper`:void 0;return e.jsxs(h,{as:"span",inline:!0,flexDirection:"column",gap:"xs",alignItems:"start",className:o.cn(s.SWITCH_STYLES.wrapper,n&&s.SWITCH_STYLES.wrapperDisabled),children:[e.jsxs(h,{as:"span",inline:!0,gap:"sm",alignItems:"center",children:[e.jsx(u.Switch.Root,{id:t,disabled:n,"aria-describedby":S,"aria-invalid":a||void 0,className:o.cn(s.SWITCH_STYLES.root({size:l,error:a}),T),onCheckedChange:I,...q,children:e.jsx(u.Switch.Thumb,{className:s.SWITCH_STYLES.thumb({size:l})})}),i&&e.jsx(w,{as:"label",variant:"label",color:"foreground",htmlFor:t,className:o.cn(s.SWITCH_STYLES.label,n&&s.SWITCH_STYLES.labelDisabled),children:i})]}),(r||c)&&e.jsx(_,{id:S,hasError:a,children:r??c})]})});m.displayName="Switch";module.exports=m;
+//# sourceMappingURL=Switch.cjs.map

package/dist/components/forms/switch/Switch.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.cjs","sources":["../../../../src/components/forms/switch/Switch.tsx"],"sourcesContent":["import { Switch as BaseSwitch } from '@base-ui/react/switch'\r\nimport { memo, useId, type FC } from 'react'\r\n\r\nimport { Typography } from '@components/foundation/typography'\r\nimport HelperText from '@components/forms/_shared/components/helper-text/HelperText.tsx'\r\nimport { Flex } from '@components/layout/flex'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { SWITCH_STYLES } from '@components/forms/switch/styles/Switch.css.ts'\r\nimport type { SwitchProps } from '@components/forms/switch/types/Switch.props.ts'\r\n\r\n/**\r\n * A styled switch control built on top of `@base-ui/react/switch`.\r\n *\r\n * Supports controlled (`checked` + `onCheckedChange`) and uncontrolled\r\n * (`defaultChecked`) modes, plus an optional inline `label`.\r\n *\r\n * @example\r\n * ```tsx\r\n * <Switch label=\"Airplane mode\" checked={enabled} onCheckedChange={setEnabled} />\r\n * ```\r\n */\r\nconst Switch: FC<SwitchProps> = memo(({ label, helperText, error, id, className, disabled, size = 'md', onCheckedChange, ...props }) => {\r\n    const generatedId = useId()\r\n    const switchId = id ?? (label ? generatedId : undefined)\r\n    const hasError = Boolean(error)\r\n    const helperId = (helperText || error) ? `${switchId}-helper` : undefined\r\n\r\n    return (\r\n        <Flex\r\n            as={'span'}\r\n            inline\r\n            flexDirection={'column'}\r\n            gap={'xs'}\r\n            alignItems={'start'}\r\n            className={cn(SWITCH_STYLES.wrapper, disabled && SWITCH_STYLES.wrapperDisabled)}\r\n        >\r\n            <Flex\r\n                as={'span'}\r\n                inline\r\n                gap={'sm'}\r\n                alignItems={'center'}\r\n            >\r\n                <BaseSwitch.Root\r\n                    id={switchId}\r\n                    disabled={disabled}\r\n                    aria-describedby={helperId}\r\n                    aria-invalid={hasError || undefined}\r\n                    className={cn(SWITCH_STYLES.root({ size, error: hasError }), className)}\r\n                    onCheckedChange={onCheckedChange}\r\n                    {...props}\r\n                >\r\n                    <BaseSwitch.Thumb className={SWITCH_STYLES.thumb({ size })} />\r\n                </BaseSwitch.Root>\r\n\r\n                {label && (\r\n                    <Typography\r\n                        as={'label'}\r\n                        variant={'label'}\r\n                        color={'foreground'}\r\n                        htmlFor={switchId}\r\n                        className={cn(SWITCH_STYLES.label, disabled && SWITCH_STYLES.labelDisabled)}\r\n                    >\r\n                        {label}\r\n                    </Typography>\r\n                )}\r\n            </Flex>\r\n\r\n            {(error || helperText) && (\r\n                <HelperText\r\n                    id={helperId}\r\n                    hasError={hasError}\r\n                >\r\n                    {error ?? helperText}\r\n                </HelperText>\r\n            )}\r\n        </Flex>\r\n    )\r\n})\r\n\r\nSwitch.displayName = 'Switch'\r\n\r\nexport default Switch\r\n"],"names":["Switch","memo","label","helperText","error","id","className","disabled","size","onCheckedChange","props","generatedId","useId","switchId","hasError","helperId","jsxs","Flex","cn","SWITCH_STYLES","jsx","BaseSwitch","Typography","HelperText"],"mappings":"4cAqBMA,EAA0BC,EAAAA,KAAK,CAAC,CAAE,MAAAC,EAAO,WAAAC,EAAY,MAAAC,EAAO,GAAAC,EAAI,UAAAC,EAAW,SAAAC,EAAU,KAAAC,EAAO,KAAM,gBAAAC,EAAiB,GAAGC,KAAY,CACpI,MAAMC,EAAcC,EAAAA,MAAA,EACdC,EAAWR,IAAOH,EAAQS,EAAc,QACxCG,EAAW,EAAQV,EACnBW,EAAYZ,GAAcC,EAAS,GAAGS,CAAQ,UAAY,OAEhE,OACIG,EAAAA,KAACC,EAAA,CACG,GAAI,OACJ,OAAM,GACN,cAAe,SACf,IAAK,KACL,WAAY,QACZ,UAAWC,EAAAA,GAAGC,EAAAA,cAAc,QAASZ,GAAYY,EAAAA,cAAc,eAAe,EAE9E,SAAA,CAAAH,EAAAA,KAACC,EAAA,CACG,GAAI,OACJ,OAAM,GACN,IAAK,KACL,WAAY,SAEZ,SAAA,CAAAG,EAAAA,IAACC,EAAAA,OAAW,KAAX,CACG,GAAIR,EACJ,SAAAN,EACA,mBAAkBQ,EAClB,eAAcD,GAAY,OAC1B,UAAWI,EAAAA,GAAGC,EAAAA,cAAc,KAAK,CAAE,KAAAX,EAAM,MAAOM,EAAU,EAAGR,CAAS,EACtE,gBAAAG,EACC,GAAGC,EAEJ,SAAAU,EAAAA,IAACC,EAAAA,OAAW,MAAX,CAAiB,UAAWF,EAAAA,cAAc,MAAM,CAAE,KAAAX,CAAA,CAAM,CAAA,CAAG,CAAA,CAAA,EAG/DN,GACGkB,EAAAA,IAACE,EAAA,CACG,GAAI,QACJ,QAAS,QACT,MAAO,aACP,QAAST,EACT,UAAWK,EAAAA,GAAGC,EAAAA,cAAc,MAAOZ,GAAYY,EAAAA,cAAc,aAAa,EAEzE,SAAAjB,CAAA,CAAA,CACL,CAAA,CAAA,GAINE,GAASD,IACPiB,EAAAA,IAACG,EAAA,CACG,GAAIR,EACJ,SAAAD,EAEC,SAAAV,GAASD,CAAA,CAAA,CACd,CAAA,CAAA,CAIhB,CAAC,EAEDH,EAAO,YAAc"}

package/dist/components/forms/switch/Switch.d.ts

@@ -0,0 +1,15 @@
+import { FC } from 'react';
+import { SwitchProps } from './types/Switch.props.ts';
+/**
+ * A styled switch control built on top of `@base-ui/react/switch`.
+ *
+ * Supports controlled (`checked` + `onCheckedChange`) and uncontrolled
+ * (`defaultChecked`) modes, plus an optional inline `label`.
+ *
+ * @example
+ * ```tsx
+ * <Switch label="Airplane mode" checked={enabled} onCheckedChange={setEnabled} />
+ * ```
+ */
+declare const Switch: FC<SwitchProps>;
+export default Switch;

package/dist/components/forms/switch/Switch.js

@@ -0,0 +1,74 @@
+import { jsxs as p, jsx as i } from "react/jsx-runtime";
+import { Switch as d } from "@base-ui/react/switch";
+import { memo as S, useId as b } from "react";
+import v from "../../foundation/typography/Typography.js";
+import "../../foundation/typography/styles/Typography.css.js";
+import x from "../_shared/components/helper-text/HelperText.js";
+import h from "../../layout/flex/Flex.js";
+import "../../layout/flex/styles/Flex.css.js";
+import { cn as n } from "../../../utils/cn.js";
+import { SWITCH_STYLES as r } from "./styles/Switch.css.js";
+const N = S(({ label: a, helperText: t, error: o, id: f, className: u, disabled: e, size: l = "md", onCheckedChange: g, ...w }) => {
+  const I = b(), m = f ?? (a ? I : void 0), s = !!o, c = t || o ? `${m}-helper` : void 0;
+  return /* @__PURE__ */ p(
+    h,
+    {
+      as: "span",
+      inline: !0,
+      flexDirection: "column",
+      gap: "xs",
+      alignItems: "start",
+      className: n(r.wrapper, e && r.wrapperDisabled),
+      children: [
+        /* @__PURE__ */ p(
+          h,
+          {
+            as: "span",
+            inline: !0,
+            gap: "sm",
+            alignItems: "center",
+            children: [
+              /* @__PURE__ */ i(
+                d.Root,
+                {
+                  id: m,
+                  disabled: e,
+                  "aria-describedby": c,
+                  "aria-invalid": s || void 0,
+                  className: n(r.root({ size: l, error: s }), u),
+                  onCheckedChange: g,
+                  ...w,
+                  children: /* @__PURE__ */ i(d.Thumb, { className: r.thumb({ size: l }) })
+                }
+              ),
+              a && /* @__PURE__ */ i(
+                v,
+                {
+                  as: "label",
+                  variant: "label",
+                  color: "foreground",
+                  htmlFor: m,
+                  className: n(r.label, e && r.labelDisabled),
+                  children: a
+                }
+              )
+            ]
+          }
+        ),
+        (o || t) && /* @__PURE__ */ i(
+          x,
+          {
+            id: c,
+            hasError: s,
+            children: o ?? t
+          }
+        )
+      ]
+    }
+  );
+});
+N.displayName = "Switch";
+export {
+  N as default
+};
+//# sourceMappingURL=Switch.js.map

package/dist/components/forms/switch/Switch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.js","sources":["../../../../src/components/forms/switch/Switch.tsx"],"sourcesContent":["import { Switch as BaseSwitch } from '@base-ui/react/switch'\r\nimport { memo, useId, type FC } from 'react'\r\n\r\nimport { Typography } from '@components/foundation/typography'\r\nimport HelperText from '@components/forms/_shared/components/helper-text/HelperText.tsx'\r\nimport { Flex } from '@components/layout/flex'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { SWITCH_STYLES } from '@components/forms/switch/styles/Switch.css.ts'\r\nimport type { SwitchProps } from '@components/forms/switch/types/Switch.props.ts'\r\n\r\n/**\r\n * A styled switch control built on top of `@base-ui/react/switch`.\r\n *\r\n * Supports controlled (`checked` + `onCheckedChange`) and uncontrolled\r\n * (`defaultChecked`) modes, plus an optional inline `label`.\r\n *\r\n * @example\r\n * ```tsx\r\n * <Switch label=\"Airplane mode\" checked={enabled} onCheckedChange={setEnabled} />\r\n * ```\r\n */\r\nconst Switch: FC<SwitchProps> = memo(({ label, helperText, error, id, className, disabled, size = 'md', onCheckedChange, ...props }) => {\r\n    const generatedId = useId()\r\n    const switchId = id ?? (label ? generatedId : undefined)\r\n    const hasError = Boolean(error)\r\n    const helperId = (helperText || error) ? `${switchId}-helper` : undefined\r\n\r\n    return (\r\n        <Flex\r\n            as={'span'}\r\n            inline\r\n            flexDirection={'column'}\r\n            gap={'xs'}\r\n            alignItems={'start'}\r\n            className={cn(SWITCH_STYLES.wrapper, disabled && SWITCH_STYLES.wrapperDisabled)}\r\n        >\r\n            <Flex\r\n                as={'span'}\r\n                inline\r\n                gap={'sm'}\r\n                alignItems={'center'}\r\n            >\r\n                <BaseSwitch.Root\r\n                    id={switchId}\r\n                    disabled={disabled}\r\n                    aria-describedby={helperId}\r\n                    aria-invalid={hasError || undefined}\r\n                    className={cn(SWITCH_STYLES.root({ size, error: hasError }), className)}\r\n                    onCheckedChange={onCheckedChange}\r\n                    {...props}\r\n                >\r\n                    <BaseSwitch.Thumb className={SWITCH_STYLES.thumb({ size })} />\r\n                </BaseSwitch.Root>\r\n\r\n                {label && (\r\n                    <Typography\r\n                        as={'label'}\r\n                        variant={'label'}\r\n                        color={'foreground'}\r\n                        htmlFor={switchId}\r\n                        className={cn(SWITCH_STYLES.label, disabled && SWITCH_STYLES.labelDisabled)}\r\n                    >\r\n                        {label}\r\n                    </Typography>\r\n                )}\r\n            </Flex>\r\n\r\n            {(error || helperText) && (\r\n                <HelperText\r\n                    id={helperId}\r\n                    hasError={hasError}\r\n                >\r\n                    {error ?? helperText}\r\n                </HelperText>\r\n            )}\r\n        </Flex>\r\n    )\r\n})\r\n\r\nSwitch.displayName = 'Switch'\r\n\r\nexport default Switch\r\n"],"names":["Switch","memo","label","helperText","error","id","className","disabled","size","onCheckedChange","props","generatedId","useId","switchId","hasError","helperId","jsxs","Flex","cn","SWITCH_STYLES","jsx","BaseSwitch","Typography","HelperText"],"mappings":";;;;;;;;;;AAqBA,MAAMA,IAA0BC,EAAK,CAAC,EAAE,OAAAC,GAAO,YAAAC,GAAY,OAAAC,GAAO,IAAAC,GAAI,WAAAC,GAAW,UAAAC,GAAU,MAAAC,IAAO,MAAM,iBAAAC,GAAiB,GAAGC,QAAY;AACpI,QAAMC,IAAcC,EAAA,GACdC,IAAWR,MAAOH,IAAQS,IAAc,SACxCG,IAAW,EAAQV,GACnBW,IAAYZ,KAAcC,IAAS,GAAGS,CAAQ,YAAY;AAEhE,SACI,gBAAAG;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,IAAI;AAAA,MACJ,QAAM;AAAA,MACN,eAAe;AAAA,MACf,KAAK;AAAA,MACL,YAAY;AAAA,MACZ,WAAWC,EAAGC,EAAc,SAASZ,KAAYY,EAAc,eAAe;AAAA,MAE9E,UAAA;AAAA,QAAA,gBAAAH;AAAA,UAACC;AAAA,UAAA;AAAA,YACG,IAAI;AAAA,YACJ,QAAM;AAAA,YACN,KAAK;AAAA,YACL,YAAY;AAAA,YAEZ,UAAA;AAAA,cAAA,gBAAAG;AAAA,gBAACC,EAAW;AAAA,gBAAX;AAAA,kBACG,IAAIR;AAAA,kBACJ,UAAAN;AAAA,kBACA,oBAAkBQ;AAAA,kBAClB,gBAAcD,KAAY;AAAA,kBAC1B,WAAWI,EAAGC,EAAc,KAAK,EAAE,MAAAX,GAAM,OAAOM,GAAU,GAAGR,CAAS;AAAA,kBACtE,iBAAAG;AAAA,kBACC,GAAGC;AAAA,kBAEJ,UAAA,gBAAAU,EAACC,EAAW,OAAX,EAAiB,WAAWF,EAAc,MAAM,EAAE,MAAAX,EAAA,CAAM,EAAA,CAAG;AAAA,gBAAA;AAAA,cAAA;AAAA,cAG/DN,KACG,gBAAAkB;AAAA,gBAACE;AAAA,gBAAA;AAAA,kBACG,IAAI;AAAA,kBACJ,SAAS;AAAA,kBACT,OAAO;AAAA,kBACP,SAAST;AAAA,kBACT,WAAWK,EAAGC,EAAc,OAAOZ,KAAYY,EAAc,aAAa;AAAA,kBAEzE,UAAAjB;AAAA,gBAAA;AAAA,cAAA;AAAA,YACL;AAAA,UAAA;AAAA,QAAA;AAAA,SAINE,KAASD,MACP,gBAAAiB;AAAA,UAACG;AAAA,UAAA;AAAA,YACG,IAAIR;AAAA,YACJ,UAAAD;AAAA,YAEC,UAAAV,KAASD;AAAA,UAAA;AAAA,QAAA;AAAA,MACd;AAAA,IAAA;AAAA,EAAA;AAIhB,CAAC;AAEDH,EAAO,cAAc;"}

package/dist/components/forms/switch/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Switch } from './Switch.tsx';
+export { SWITCH_STYLES } from './styles/Switch.css.ts';
+export type { SwitchProps } from './types/Switch.props.ts';
+export type { SwitchSize } from './types/Switch.types.ts';

package/dist/components/forms/switch/styles/Switch.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                              */;/* empty css                            */const e=require("@vanilla-extract/recipes/createRuntimeFn");var a={wrapper:"ih5w140",wrapperDisabled:"ih5w141",root:e.createRuntimeFn({defaultClassName:"ih5w142",variantClassNames:{size:{sm:"ih5w143",md:"ih5w144",lg:"ih5w145"},error:{true:"ih5w146",false:"ih5w147"}},defaultVariants:{size:"md",error:!1},compoundVariants:[]}),thumb:e.createRuntimeFn({defaultClassName:"ih5w148",variantClassNames:{size:{sm:"ih5w149",md:"ih5w14a",lg:"ih5w14b"}},defaultVariants:{size:"sm"},compoundVariants:[]}),label:"ih5w14c",labelDisabled:"ih5w14d"};exports.SWITCH_STYLES=a;
+//# sourceMappingURL=Switch.css.cjs.map

package/dist/components/forms/switch/styles/Switch.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/switch/styles/Switch.css.d.ts

@@ -0,0 +1,81 @@
+import { RuntimeFn } from '@vanilla-extract/recipes';
+export declare const SWITCH_STYLES: {
+    wrapper: string;
+    wrapperDisabled: string;
+    root: RuntimeFn<{
+        size: {
+            sm: {
+                width: "2.25rem";
+                height: "1.25rem";
+            };
+            md: {
+                width: "2.75rem";
+                height: "1.5rem";
+            };
+            lg: {
+                width: "3.25rem";
+                height: "1.75rem";
+            };
+        };
+        error: {
+            true: {
+                backgroundColor: `var(--${string})`;
+                selectors: {
+                    '&:not([data-disabled]):hover': {
+                        backgroundColor: `var(--${string})`;
+                    };
+                    '&:not([data-disabled]):active': {
+                        backgroundColor: `var(--${string})`;
+                    };
+                    '&:focus-visible': {
+                        outline: "none";
+                        boxShadow: `0 0 0 2px var(--${string}), 0 0 0 4px var(--${string})`;
+                    };
+                    '&[data-checked]': {
+                        backgroundColor: `var(--${string})`;
+                    };
+                    '&[data-checked]:not([data-disabled]):hover': {
+                        backgroundColor: `var(--${string})`;
+                    };
+                    '&[data-checked]:not([data-disabled]):active': {
+                        backgroundColor: `var(--${string})`;
+                    };
+                };
+            };
+            false: {};
+        };
+    }>;
+    thumb: RuntimeFn<{
+        size: {
+            sm: {
+                width: "1rem";
+                height: "1rem";
+                selectors: {
+                    '&[data-checked]': {
+                        transform: "translateX(1rem)";
+                    };
+                };
+            };
+            md: {
+                width: "1.25rem";
+                height: "1.25rem";
+                selectors: {
+                    '&[data-checked]': {
+                        transform: "translateX(1.25rem)";
+                    };
+                };
+            };
+            lg: {
+                width: "1.5rem";
+                height: "1.5rem";
+                selectors: {
+                    '&[data-checked]': {
+                        transform: "translateX(1.5rem)";
+                    };
+                };
+            };
+        };
+    }>;
+    label: string;
+    labelDisabled: string;
+};

package/dist/components/forms/switch/styles/Switch.css.js

@@ -0,0 +1,8 @@
+/* empty css                                            */
+/* empty css                          */
+import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
+var s = { wrapper: "ih5w140", wrapperDisabled: "ih5w141", root: a({ defaultClassName: "ih5w142", variantClassNames: { size: { sm: "ih5w143", md: "ih5w144", lg: "ih5w145" }, error: { true: "ih5w146", false: "ih5w147" } }, defaultVariants: { size: "md", error: !1 }, compoundVariants: [] }), thumb: a({ defaultClassName: "ih5w148", variantClassNames: { size: { sm: "ih5w149", md: "ih5w14a", lg: "ih5w14b" } }, defaultVariants: { size: "sm" }, compoundVariants: [] }), label: "ih5w14c", labelDisabled: "ih5w14d" };
+export {
+  s as SWITCH_STYLES
+};
+//# sourceMappingURL=Switch.css.js.map

package/dist/components/forms/switch/styles/Switch.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Switch.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/components/forms/switch/types/Switch.props.d.ts

@@ -0,0 +1,12 @@
+import { Switch } from '@base-ui/react/switch';
+import { SwitchSize } from './Switch.types.ts';
+export type SwitchProps = Switch.Root.Props & {
+    /** Optional text label rendered beside the switch. When provided, `id` is used to associate the label. */
+    label?: string;
+    /** Optional helper text rendered below the switch. Hidden when `error` is provided. */
+    helperText?: string;
+    /** Error message rendered below the switch. When set, the switch is styled in its error state. */
+    error?: string;
+    /** Visual size of the switch. Defaults to `md`. */
+    size?: SwitchSize;
+};

package/dist/components/forms/switch/types/Switch.types.d.ts

@@ -0,0 +1 @@
+export type SwitchSize = 'sm' | 'md' | 'lg';

package/dist/components/forms/text-area/TextArea.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("react/jsx-runtime"),j=require("./components/text-area-label/TextAreaLabel.cjs");;/* empty css                                           */;/* empty css                                               */;/* empty css                                                                     */const v=require("./components/text-area-start-icon/TextAreaStartIcon.cjs");;/* empty css                                                                              */const z=require("./components/text-area-end-action/TextAreaEndAction.cjs");;/* empty css                                                                              */const H=require("./styles/TextArea.css.cjs"),U=require("../_shared/components/helper-text/HelperText.cjs"),X=require("./hooks/useAutoResizeTextArea.hook.cjs"),Y=require("./hooks/useTextArea.hook.cjs"),E=require("../../layout/flex/Flex.cjs");require("../../layout/flex/styles/Flex.css.cjs");const G=require("../../../utils/cn.cjs"),t=require("react"),n=t.memo(u=>{const{inputId:l,helperId:d,hasError:o,hasStartIcon:I,hasEndAction:x,handleMouseDown:g,handleFocus:y,handleBlur:C}=Y.useTextArea(u),{disabled:h,startIcon:A,className:S,width:q,error:i,helperText:a,label:T,endAction:_,size:k,placeholder:D,value:m,onChange:p,onKeyDown:F,onKeyUp:L,ref:r,rows:c,minRows:f,maxRows:N,...B}=u,w=k??"md",R=t.useRef(null),K=t.useCallback(s=>{R.current=s,typeof r=="function"?r(s):r&&(r.current=s)},[r]),{isEnabled:M,resize:b}=X.useAutoResizeTextArea(R,{minRows:f??c,maxRows:N,value:m}),P=t.useCallback(s=>{p?.(s),b()},[p,b]);return e.jsxs(E,{flexDirection:"column",gap:"xs",width:"100%",alignItems:"start",style:q!==void 0?{width:q}:void 0,children:[T&&e.jsx(j,{htmlFor:l,disabled:h,children:T}),e.jsxs(E,{position:"relative",width:"100%",gap:"none",children:[A&&e.jsx(v,{icon:A,size:w}),e.jsx("textarea",{ref:K,id:l,disabled:h,"aria-invalid":o||void 0,"aria-describedby":i||a?d:void 0,onMouseDown:g,onFocus:y,onBlur:C,className:G.cn(H.TEXT_AREA_STYLES.recipe({size:w,hasError:o,hasStartIcon:I,hasEndAction:x}),S),placeholder:D,value:m,onChange:P,onKeyDown:F,onKeyUp:L,rows:M?f??c:c,...B}),x&&e.jsx(z,{children:_})]}),(i||a)&&e.jsx(U,{id:d,hasError:o,children:i??a})]})});n.displayName="TextArea";n.Label=j;n.StartIcon=v;n.EndAction=z;module.exports=n;
+//# sourceMappingURL=TextArea.cjs.map

package/dist/components/forms/text-area/TextArea.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/forms/text-area/TextArea.tsx"],"sourcesContent":["import {\r\n    TextAreaLabel,\r\n    TextAreaStartIcon,\r\n    TextAreaEndAction,\r\n} from '@components/forms/text-area/components/index.ts'\r\nimport { TEXT_AREA_STYLES } from '@components/forms/text-area/styles/TextArea.css.ts'\r\nimport HelperText from '@components/forms/_shared/components/helper-text/HelperText.tsx'\r\nimport { useAutoResizeTextArea } from '@components/forms/text-area/hooks/useAutoResizeTextArea.hook.tsx'\r\nimport { useTextArea } from '@components/forms/text-area/hooks/useTextArea.hook.tsx'\r\nimport type { TextAreaCompound } from '@components/forms/text-area/types'\r\nimport { Flex } from '@components/layout/flex'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, useCallback, useRef } from 'react'\r\nimport type { TextAreaProps } from '@/components'\r\n\r\n/**\r\n  * A styled textarea built with a native `<textarea>` and `<label>`.\r\n  *\r\n  * - `startIcon` - Iconify icon name rendered on the left.\r\n  * - `endAction` - any ReactNode (e.g. `<IconButton>`) rendered on the right.\r\n  * - `width` - overrides the default `100%` wrapper width.\r\n  * - `rows` - sets the native number of visible text lines.\r\n  * - `minRows` / `maxRows` - enables auto-resize; the textarea grows with content\r\n  *   until it reaches `maxRows`, then stops expanding and shows a scrollbar.\r\n  *   Manual resizing is always disabled.\r\n  *\r\n  * Focus ring behavior: visible only on keyboard navigation (Tab). A click on the\r\n  * textarea shows the primary border without the ring halo, detected via `onMouseDown`\r\n  * and a `data-mouse-focus` attribute.\r\n  *\r\n  * @example\r\n  * ```tsx\r\n  * <TextArea label=\"Description\" placeholder=\"Tell us more…\" rows={4} />\r\n  * <TextArea label=\"Comment\" startIcon=\"lucide:message-square\" minRows={2} maxRows={6} />\r\n  * <TextArea label=\"Bio\" endAction={<IconButton icon=\"lucide:x\" aria-label=\"Clear\" variant=\"ghost\" color=\"primary\" />} />\r\n  * <TextArea label=\"Notes\" width=\"24rem\" />\r\n  * ```\r\n  */\r\nconst TextArea = memo<TextAreaProps>((props) => {\r\n    const {\r\n        inputId,\r\n        helperId,\r\n        hasError,\r\n        hasStartIcon,\r\n        hasEndAction,\r\n        handleMouseDown,\r\n        handleFocus,\r\n        handleBlur,\r\n    } = useTextArea(props)\r\n\r\n    const {\r\n        disabled,\r\n        startIcon,\r\n        className,\r\n        width,\r\n        error,\r\n        helperText,\r\n        label,\r\n        endAction,\r\n        size: sizeProp,\r\n        placeholder,\r\n        value,\r\n        onChange,\r\n        onKeyDown,\r\n        onKeyUp,\r\n        ref: forwardedRef,\r\n        rows,\r\n        minRows,\r\n        maxRows,\r\n        ...textareaProps\r\n    } = props\r\n    const size = sizeProp ?? 'md'\r\n\r\n    const innerRef = useRef<HTMLTextAreaElement>(null)\r\n    const setRef = useCallback(\r\n        (node: HTMLTextAreaElement | null) => {\r\n            innerRef.current = node\r\n            if (typeof forwardedRef === 'function') {\r\n                forwardedRef(node)\r\n            } else if (forwardedRef) {\r\n                forwardedRef.current = node\r\n            }\r\n        },\r\n        [forwardedRef],\r\n    )\r\n\r\n    const { isEnabled: autoResizeEnabled, resize } = useAutoResizeTextArea(\r\n        innerRef,\r\n        {\r\n            minRows: minRows ?? rows,\r\n            maxRows,\r\n            value,\r\n        },\r\n    )\r\n\r\n    const handleChange = useCallback(\r\n        (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n            onChange?.(e)\r\n            resize()\r\n        },\r\n        [onChange, resize],\r\n    )\r\n\r\n    return (\r\n        <Flex\r\n            flexDirection={'column'}\r\n            gap={'xs'}\r\n            width={'100%'}\r\n            alignItems={'start'}\r\n            style={width !== undefined ? { width } : undefined}\r\n        >\r\n            {label && (\r\n                <TextAreaLabel\r\n                    htmlFor={inputId}\r\n                    disabled={disabled}\r\n                >\r\n                    {label}\r\n                </TextAreaLabel>\r\n            )}\r\n\r\n            <Flex\r\n                position={'relative'}\r\n                width={'100%'}\r\n                gap={'none'}\r\n            >\r\n                {startIcon && (\r\n                    <TextAreaStartIcon\r\n                        icon={startIcon}\r\n                        size={size}\r\n                    />\r\n                )}\r\n\r\n                <textarea\r\n                    ref={setRef}\r\n                    id={inputId}\r\n                    disabled={disabled}\r\n                    aria-invalid={hasError || undefined}\r\n                    aria-describedby={error || helperText ? helperId : undefined}\r\n                    onMouseDown={handleMouseDown}\r\n                    onFocus={handleFocus}\r\n                    onBlur={handleBlur}\r\n                    className={cn(\r\n                        TEXT_AREA_STYLES.recipe({\r\n                            size,\r\n                            hasError,\r\n                            hasStartIcon,\r\n                            hasEndAction,\r\n                        }),\r\n                        className,\r\n                    )}\r\n                    placeholder={placeholder}\r\n                    value={value}\r\n                    onChange={handleChange}\r\n                    onKeyDown={onKeyDown}\r\n                    onKeyUp={onKeyUp}\r\n                    rows={autoResizeEnabled ? (minRows ?? rows) : rows}\r\n                    {...textareaProps}\r\n                />\r\n\r\n                {hasEndAction && <TextAreaEndAction>{endAction}</TextAreaEndAction>}\r\n            </Flex>\r\n\r\n            {(error || helperText) && (\r\n                <HelperText\r\n                    id={helperId}\r\n                    hasError={hasError}\r\n                >\r\n                    {error ?? helperText}\r\n                </HelperText>\r\n            )}\r\n        </Flex>\r\n    )\r\n}) as unknown as TextAreaCompound\r\n\r\nTextArea.displayName = 'TextArea'\r\nTextArea.Label = TextAreaLabel\r\nTextArea.StartIcon = TextAreaStartIcon\r\nTextArea.EndAction = TextAreaEndAction\r\n\r\nexport default TextArea\r\n"],"names":["TextArea","memo","props","inputId","helperId","hasError","hasStartIcon","hasEndAction","handleMouseDown","handleFocus","handleBlur","useTextArea","disabled","startIcon","className","width","error","helperText","label","endAction","sizeProp","placeholder","value","onChange","onKeyDown","onKeyUp","forwardedRef","rows","minRows","maxRows","textareaProps","size","innerRef","useRef","setRef","useCallback","node","autoResizeEnabled","resize","useAutoResizeTextArea","handleChange","e","jsxs","Flex","jsx","TextAreaLabel","TextAreaStartIcon","cn","TEXT_AREA_STYLES","TextAreaEndAction","HelperText"],"mappings":"w+BAsCMA,EAAWC,EAAAA,KAAqBC,GAAU,CAC5C,KAAM,CACF,QAAAC,EACA,SAAAC,EACA,SAAAC,EACA,aAAAC,EACA,aAAAC,EACA,gBAAAC,EACA,YAAAC,EACA,WAAAC,CAAA,EACAC,EAAAA,YAAYT,CAAK,EAEf,CACF,SAAAU,EACA,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,MAAAC,EACA,WAAAC,EACA,MAAAC,EACA,UAAAC,EACA,KAAMC,EACN,YAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,QAAAC,EACA,IAAKC,EACL,KAAAC,EACA,QAAAC,EACA,QAAAC,EACA,GAAGC,CAAA,EACH5B,EACE6B,EAAOX,GAAY,KAEnBY,EAAWC,EAAAA,OAA4B,IAAI,EAC3CC,EAASC,EAAAA,YACVC,GAAqC,CAClCJ,EAAS,QAAUI,EACf,OAAOV,GAAiB,WACxBA,EAAaU,CAAI,EACVV,IACPA,EAAa,QAAUU,EAE/B,EACA,CAACV,CAAY,CAAA,EAGX,CAAE,UAAWW,EAAmB,OAAAC,CAAA,EAAWC,EAAAA,sBAC7CP,EACA,CACI,QAASJ,GAAWD,EACpB,QAAAE,EACA,MAAAP,CAAA,CACJ,EAGEkB,EAAeL,EAAAA,YAChBM,GAA8C,CAC3ClB,IAAWkB,CAAC,EACZH,EAAA,CACJ,EACA,CAACf,EAAUe,CAAM,CAAA,EAGrB,OACII,EAAAA,KAACC,EAAA,CACG,cAAe,SACf,IAAK,KACL,MAAO,OACP,WAAY,QACZ,MAAO5B,IAAU,OAAY,CAAE,MAAAA,GAAU,OAExC,SAAA,CAAAG,GACG0B,EAAAA,IAACC,EAAA,CACG,QAAS1C,EACT,SAAAS,EAEC,SAAAM,CAAA,CAAA,EAITwB,EAAAA,KAACC,EAAA,CACG,SAAU,WACV,MAAO,OACP,IAAK,OAEJ,SAAA,CAAA9B,GACG+B,EAAAA,IAACE,EAAA,CACG,KAAMjC,EACN,KAAAkB,CAAA,CAAA,EAIRa,EAAAA,IAAC,WAAA,CACG,IAAKV,EACL,GAAI/B,EACJ,SAAAS,EACA,eAAcP,GAAY,OAC1B,mBAAkBW,GAASC,EAAab,EAAW,OACnD,YAAaI,EACb,QAASC,EACT,OAAQC,EACR,UAAWqC,EAAAA,GACPC,EAAAA,iBAAiB,OAAO,CACpB,KAAAjB,EACA,SAAA1B,EACA,aAAAC,EACA,aAAAC,CAAA,CACH,EACDO,CAAA,EAEJ,YAAAO,EACA,MAAAC,EACA,SAAUkB,EACV,UAAAhB,EACA,QAAAC,EACA,KAAMY,EAAqBT,GAAWD,EAAQA,EAC7C,GAAGG,CAAA,CAAA,EAGPvB,GAAgBqC,EAAAA,IAACK,EAAA,CAAmB,SAAA9B,CAAA,CAAU,CAAA,CAAA,CAAA,GAGjDH,GAASC,IACP2B,EAAAA,IAACM,EAAA,CACG,GAAI9C,EACJ,SAAAC,EAEC,SAAAW,GAASC,CAAA,CAAA,CACd,CAAA,CAAA,CAIhB,CAAC,EAEDjB,EAAS,YAAc,WACvBA,EAAS,MAAQ6C,EACjB7C,EAAS,UAAY8C,EACrB9C,EAAS,UAAYiD"}

package/dist/components/forms/text-area/TextArea.d.ts

@@ -0,0 +1,26 @@
+import { TextAreaCompound } from './types';
+/**
+  * A styled textarea built with a native `<textarea>` and `<label>`.
+  *
+  * - `startIcon` - Iconify icon name rendered on the left.
+  * - `endAction` - any ReactNode (e.g. `<IconButton>`) rendered on the right.
+  * - `width` - overrides the default `100%` wrapper width.
+  * - `rows` - sets the native number of visible text lines.
+  * - `minRows` / `maxRows` - enables auto-resize; the textarea grows with content
+  *   until it reaches `maxRows`, then stops expanding and shows a scrollbar.
+  *   Manual resizing is always disabled.
+  *
+  * Focus ring behavior: visible only on keyboard navigation (Tab). A click on the
+  * textarea shows the primary border without the ring halo, detected via `onMouseDown`
+  * and a `data-mouse-focus` attribute.
+  *
+  * @example
+  * ```tsx
+  * <TextArea label="Description" placeholder="Tell us more…" rows={4} />
+  * <TextArea label="Comment" startIcon="lucide:message-square" minRows={2} maxRows={6} />
+  * <TextArea label="Bio" endAction={<IconButton icon="lucide:x" aria-label="Clear" variant="ghost" color="primary" />} />
+  * <TextArea label="Notes" width="24rem" />
+  * ```
+  */
+declare const TextArea: TextAreaCompound;
+export default TextArea;

package/dist/components/forms/text-area/TextArea.js

@@ -0,0 +1,149 @@
+import { jsxs as E, jsx as r } from "react/jsx-runtime";
+import g from "./components/text-area-label/TextAreaLabel.js";
+/* empty css                                         */
+/* empty css                                             */
+/* empty css                                                                   */
+import y from "./components/text-area-start-icon/TextAreaStartIcon.js";
+/* empty css                                                                            */
+import z from "./components/text-area-end-action/TextAreaEndAction.js";
+/* empty css                                                                            */
+import { TEXT_AREA_STYLES as X } from "./styles/TextArea.css.js";
+import Y from "../_shared/components/helper-text/HelperText.js";
+import { useAutoResizeTextArea as q } from "./hooks/useAutoResizeTextArea.hook.js";
+import { useTextArea as G } from "./hooks/useTextArea.hook.js";
+import v from "../../layout/flex/Flex.js";
+import "../../layout/flex/styles/Flex.css.js";
+import { cn as J } from "../../../utils/cn.js";
+import { memo as O, useRef as Q, useCallback as I } from "react";
+const t = O((l) => {
+  const {
+    inputId: m,
+    helperId: c,
+    hasError: i,
+    hasStartIcon: S,
+    hasEndAction: d,
+    handleMouseDown: C,
+    handleFocus: D,
+    handleBlur: F
+  } = G(l), {
+    disabled: p,
+    startIcon: f,
+    className: L,
+    width: h,
+    error: n,
+    helperText: a,
+    label: u,
+    endAction: N,
+    size: j,
+    placeholder: B,
+    value: x,
+    onChange: A,
+    onKeyDown: K,
+    onKeyUp: M,
+    ref: e,
+    rows: s,
+    minRows: w,
+    maxRows: P,
+    ..._
+  } = l, T = j ?? "md", R = Q(null), k = I(
+    (o) => {
+      R.current = o, typeof e == "function" ? e(o) : e && (e.current = o);
+    },
+    [e]
+  ), { isEnabled: H, resize: b } = q(
+    R,
+    {
+      minRows: w ?? s,
+      maxRows: P,
+      value: x
+    }
+  ), U = I(
+    (o) => {
+      A?.(o), b();
+    },
+    [A, b]
+  );
+  return /* @__PURE__ */ E(
+    v,
+    {
+      flexDirection: "column",
+      gap: "xs",
+      width: "100%",
+      alignItems: "start",
+      style: h !== void 0 ? { width: h } : void 0,
+      children: [
+        u && /* @__PURE__ */ r(
+          g,
+          {
+            htmlFor: m,
+            disabled: p,
+            children: u
+          }
+        ),
+        /* @__PURE__ */ E(
+          v,
+          {
+            position: "relative",
+            width: "100%",
+            gap: "none",
+            children: [
+              f && /* @__PURE__ */ r(
+                y,
+                {
+                  icon: f,
+                  size: T
+                }
+              ),
+              /* @__PURE__ */ r(
+                "textarea",
+                {
+                  ref: k,
+                  id: m,
+                  disabled: p,
+                  "aria-invalid": i || void 0,
+                  "aria-describedby": n || a ? c : void 0,
+                  onMouseDown: C,
+                  onFocus: D,
+                  onBlur: F,
+                  className: J(
+                    X.recipe({
+                      size: T,
+                      hasError: i,
+                      hasStartIcon: S,
+                      hasEndAction: d
+                    }),
+                    L
+                  ),
+                  placeholder: B,
+                  value: x,
+                  onChange: U,
+                  onKeyDown: K,
+                  onKeyUp: M,
+                  rows: H ? w ?? s : s,
+                  ..._
+                }
+              ),
+              d && /* @__PURE__ */ r(z, { children: N })
+            ]
+          }
+        ),
+        (n || a) && /* @__PURE__ */ r(
+          Y,
+          {
+            id: c,
+            hasError: i,
+            children: n ?? a
+          }
+        )
+      ]
+    }
+  );
+});
+t.displayName = "TextArea";
+t.Label = g;
+t.StartIcon = y;
+t.EndAction = z;
+export {
+  t as default
+};
+//# sourceMappingURL=TextArea.js.map

package/dist/components/forms/text-area/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","sources":["../../../../src/components/forms/text-area/TextArea.tsx"],"sourcesContent":["import {\r\n    TextAreaLabel,\r\n    TextAreaStartIcon,\r\n    TextAreaEndAction,\r\n} from '@components/forms/text-area/components/index.ts'\r\nimport { TEXT_AREA_STYLES } from '@components/forms/text-area/styles/TextArea.css.ts'\r\nimport HelperText from '@components/forms/_shared/components/helper-text/HelperText.tsx'\r\nimport { useAutoResizeTextArea } from '@components/forms/text-area/hooks/useAutoResizeTextArea.hook.tsx'\r\nimport { useTextArea } from '@components/forms/text-area/hooks/useTextArea.hook.tsx'\r\nimport type { TextAreaCompound } from '@components/forms/text-area/types'\r\nimport { Flex } from '@components/layout/flex'\r\nimport { cn } from '@utils/cn.ts'\r\nimport { memo, useCallback, useRef } from 'react'\r\nimport type { TextAreaProps } from '@/components'\r\n\r\n/**\r\n  * A styled textarea built with a native `<textarea>` and `<label>`.\r\n  *\r\n  * - `startIcon` - Iconify icon name rendered on the left.\r\n  * - `endAction` - any ReactNode (e.g. `<IconButton>`) rendered on the right.\r\n  * - `width` - overrides the default `100%` wrapper width.\r\n  * - `rows` - sets the native number of visible text lines.\r\n  * - `minRows` / `maxRows` - enables auto-resize; the textarea grows with content\r\n  *   until it reaches `maxRows`, then stops expanding and shows a scrollbar.\r\n  *   Manual resizing is always disabled.\r\n  *\r\n  * Focus ring behavior: visible only on keyboard navigation (Tab). A click on the\r\n  * textarea shows the primary border without the ring halo, detected via `onMouseDown`\r\n  * and a `data-mouse-focus` attribute.\r\n  *\r\n  * @example\r\n  * ```tsx\r\n  * <TextArea label=\"Description\" placeholder=\"Tell us more…\" rows={4} />\r\n  * <TextArea label=\"Comment\" startIcon=\"lucide:message-square\" minRows={2} maxRows={6} />\r\n  * <TextArea label=\"Bio\" endAction={<IconButton icon=\"lucide:x\" aria-label=\"Clear\" variant=\"ghost\" color=\"primary\" />} />\r\n  * <TextArea label=\"Notes\" width=\"24rem\" />\r\n  * ```\r\n  */\r\nconst TextArea = memo<TextAreaProps>((props) => {\r\n    const {\r\n        inputId,\r\n        helperId,\r\n        hasError,\r\n        hasStartIcon,\r\n        hasEndAction,\r\n        handleMouseDown,\r\n        handleFocus,\r\n        handleBlur,\r\n    } = useTextArea(props)\r\n\r\n    const {\r\n        disabled,\r\n        startIcon,\r\n        className,\r\n        width,\r\n        error,\r\n        helperText,\r\n        label,\r\n        endAction,\r\n        size: sizeProp,\r\n        placeholder,\r\n        value,\r\n        onChange,\r\n        onKeyDown,\r\n        onKeyUp,\r\n        ref: forwardedRef,\r\n        rows,\r\n        minRows,\r\n        maxRows,\r\n        ...textareaProps\r\n    } = props\r\n    const size = sizeProp ?? 'md'\r\n\r\n    const innerRef = useRef<HTMLTextAreaElement>(null)\r\n    const setRef = useCallback(\r\n        (node: HTMLTextAreaElement | null) => {\r\n            innerRef.current = node\r\n            if (typeof forwardedRef === 'function') {\r\n                forwardedRef(node)\r\n            } else if (forwardedRef) {\r\n                forwardedRef.current = node\r\n            }\r\n        },\r\n        [forwardedRef],\r\n    )\r\n\r\n    const { isEnabled: autoResizeEnabled, resize } = useAutoResizeTextArea(\r\n        innerRef,\r\n        {\r\n            minRows: minRows ?? rows,\r\n            maxRows,\r\n            value,\r\n        },\r\n    )\r\n\r\n    const handleChange = useCallback(\r\n        (e: React.ChangeEvent<HTMLTextAreaElement>) => {\r\n            onChange?.(e)\r\n            resize()\r\n        },\r\n        [onChange, resize],\r\n    )\r\n\r\n    return (\r\n        <Flex\r\n            flexDirection={'column'}\r\n            gap={'xs'}\r\n            width={'100%'}\r\n            alignItems={'start'}\r\n            style={width !== undefined ? { width } : undefined}\r\n        >\r\n            {label && (\r\n                <TextAreaLabel\r\n                    htmlFor={inputId}\r\n                    disabled={disabled}\r\n                >\r\n                    {label}\r\n                </TextAreaLabel>\r\n            )}\r\n\r\n            <Flex\r\n                position={'relative'}\r\n                width={'100%'}\r\n                gap={'none'}\r\n            >\r\n                {startIcon && (\r\n                    <TextAreaStartIcon\r\n                        icon={startIcon}\r\n                        size={size}\r\n                    />\r\n                )}\r\n\r\n                <textarea\r\n                    ref={setRef}\r\n                    id={inputId}\r\n                    disabled={disabled}\r\n                    aria-invalid={hasError || undefined}\r\n                    aria-describedby={error || helperText ? helperId : undefined}\r\n                    onMouseDown={handleMouseDown}\r\n                    onFocus={handleFocus}\r\n                    onBlur={handleBlur}\r\n                    className={cn(\r\n                        TEXT_AREA_STYLES.recipe({\r\n                            size,\r\n                            hasError,\r\n                            hasStartIcon,\r\n                            hasEndAction,\r\n                        }),\r\n                        className,\r\n                    )}\r\n                    placeholder={placeholder}\r\n                    value={value}\r\n                    onChange={handleChange}\r\n                    onKeyDown={onKeyDown}\r\n                    onKeyUp={onKeyUp}\r\n                    rows={autoResizeEnabled ? (minRows ?? rows) : rows}\r\n                    {...textareaProps}\r\n                />\r\n\r\n                {hasEndAction && <TextAreaEndAction>{endAction}</TextAreaEndAction>}\r\n            </Flex>\r\n\r\n            {(error || helperText) && (\r\n                <HelperText\r\n                    id={helperId}\r\n                    hasError={hasError}\r\n                >\r\n                    {error ?? helperText}\r\n                </HelperText>\r\n            )}\r\n        </Flex>\r\n    )\r\n}) as unknown as TextAreaCompound\r\n\r\nTextArea.displayName = 'TextArea'\r\nTextArea.Label = TextAreaLabel\r\nTextArea.StartIcon = TextAreaStartIcon\r\nTextArea.EndAction = TextAreaEndAction\r\n\r\nexport default TextArea\r\n"],"names":["TextArea","memo","props","inputId","helperId","hasError","hasStartIcon","hasEndAction","handleMouseDown","handleFocus","handleBlur","useTextArea","disabled","startIcon","className","width","error","helperText","label","endAction","sizeProp","placeholder","value","onChange","onKeyDown","onKeyUp","forwardedRef","rows","minRows","maxRows","textareaProps","size","innerRef","useRef","setRef","useCallback","node","autoResizeEnabled","resize","useAutoResizeTextArea","handleChange","e","jsxs","Flex","jsx","TextAreaLabel","TextAreaStartIcon","cn","TEXT_AREA_STYLES","TextAreaEndAction","HelperText"],"mappings":"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"}

package/dist/components/forms/text-area/components/index.d.ts

@@ -0,0 +1,6 @@
+export { default as TextAreaLabel } from './text-area-label/TextAreaLabel.tsx';
+export { TEXT_AREA_LABEL_STYLES } from './text-area-label/styles/TextAreaLabel.css.ts';
+export { default as TextAreaStartIcon } from './text-area-start-icon/TextAreaStartIcon.tsx';
+export { TEXT_AREA_START_ICON_STYLES } from './text-area-start-icon/styles/TextAreaStartIcon.css.ts';
+export { default as TextAreaEndAction } from './text-area-end-action/TextAreaEndAction.tsx';
+export { TEXT_AREA_END_ACTION_STYLES } from './text-area-end-action/styles/TextAreaEndAction.css.ts';

package/dist/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.cjs

@@ -0,0 +1,2 @@
+"use strict";const t=require("react/jsx-runtime"),s=require("react"),o=require("./styles/TextAreaEndAction.css.cjs"),c=require("../../../../layout/box/Box.cjs");require("../../../../layout/box/styles/Box.css.cjs");const e=s.memo(({children:r})=>t.jsx(c,{className:o.TEXT_AREA_END_ACTION_STYLES.root,children:r}));e.displayName="TextArea.EndAction";module.exports=e;
+//# sourceMappingURL=TextAreaEndAction.cjs.map

package/dist/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaEndAction.cjs","sources":["../../../../../../src/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\nimport { TEXT_AREA_END_ACTION_STYLES } from '@components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.ts'\r\nimport { Box } from '@components/layout/box'\r\nimport type {\r\n    TextAreaEndActionProps\r\n} from '@components/forms/text-area/components/text-area-end-action/types/TextAreaEndAction.props.ts'\r\n\r\nconst TextAreaEndAction: FC<TextAreaEndActionProps> = memo(({ children }) => (\r\n    <Box className={TEXT_AREA_END_ACTION_STYLES.root}>\r\n        {children}\r\n    </Box>\r\n))\r\n\r\nTextAreaEndAction.displayName = 'TextArea.EndAction'\r\n\r\nexport default TextAreaEndAction\r\n"],"names":["TextAreaEndAction","memo","children","jsx","Box","TEXT_AREA_END_ACTION_STYLES"],"mappings":"sNAOA,MAAMA,EAAgDC,EAAAA,KAAK,CAAC,CAAE,SAAAC,CAAA,IAC1DC,EAAAA,IAACC,EAAA,CAAI,UAAWC,EAAAA,4BAA4B,KACvC,SAAAH,CAAA,CACL,CACH,EAEDF,EAAkB,YAAc"}

package/dist/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { TextAreaEndActionProps } from './types/TextAreaEndAction.props.ts';
+declare const TextAreaEndAction: FC<TextAreaEndActionProps>;
+export default TextAreaEndAction;

package/dist/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.js

@@ -0,0 +1,11 @@
+import { jsx as m } from "react/jsx-runtime";
+import { memo as r } from "react";
+import { TEXT_AREA_END_ACTION_STYLES as t } from "./styles/TextAreaEndAction.css.js";
+import e from "../../../../layout/box/Box.js";
+import "../../../../layout/box/styles/Box.css.js";
+const a = r(({ children: o }) => /* @__PURE__ */ m(e, { className: t.root, children: o }));
+a.displayName = "TextArea.EndAction";
+export {
+  a as default
+};
+//# sourceMappingURL=TextAreaEndAction.js.map

package/dist/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaEndAction.js","sources":["../../../../../../src/components/forms/text-area/components/text-area-end-action/TextAreaEndAction.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\nimport { TEXT_AREA_END_ACTION_STYLES } from '@components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.ts'\r\nimport { Box } from '@components/layout/box'\r\nimport type {\r\n    TextAreaEndActionProps\r\n} from '@components/forms/text-area/components/text-area-end-action/types/TextAreaEndAction.props.ts'\r\n\r\nconst TextAreaEndAction: FC<TextAreaEndActionProps> = memo(({ children }) => (\r\n    <Box className={TEXT_AREA_END_ACTION_STYLES.root}>\r\n        {children}\r\n    </Box>\r\n))\r\n\r\nTextAreaEndAction.displayName = 'TextArea.EndAction'\r\n\r\nexport default TextAreaEndAction\r\n"],"names":["TextAreaEndAction","memo","children","jsx","Box","TEXT_AREA_END_ACTION_STYLES"],"mappings":";;;;;AAOA,MAAMA,IAAgDC,EAAK,CAAC,EAAE,UAAAC,EAAA,MAC1D,gBAAAC,EAACC,GAAA,EAAI,WAAWC,EAA4B,MACvC,UAAAH,EAAA,CACL,CACH;AAEDF,EAAkB,cAAc;"}

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                       */var e={root:"lf8geo0"};exports.TEXT_AREA_END_ACTION_STYLES=e;
+//# sourceMappingURL=TextAreaEndAction.css.cjs.map

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaEndAction.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.d.ts

@@ -0,0 +1,3 @@
+export declare const TEXT_AREA_END_ACTION_STYLES: {
+    root: string;
+};

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.js

@@ -0,0 +1,6 @@
+/* empty css                                     */
+var r = { root: "lf8geo0" };
+export {
+  r as TEXT_AREA_END_ACTION_STYLES
+};
+//# sourceMappingURL=TextAreaEndAction.css.js.map

package/dist/components/forms/text-area/components/text-area-end-action/styles/TextAreaEndAction.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaEndAction.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/forms/text-area/components/text-area-end-action/types/TextAreaEndAction.props.d.ts

@@ -0,0 +1,4 @@
+import { ReactNode } from 'react';
+export type TextAreaEndActionProps = {
+    children: ReactNode;
+};

package/dist/components/forms/text-area/components/text-area-label/TextAreaLabel.cjs

@@ -0,0 +1,2 @@
+"use strict";const r=require("react/jsx-runtime"),o=require("react"),c=require("./styles/TextAreaLabel.css.cjs"),e=o.memo(({htmlFor:a,disabled:s,children:t})=>r.jsx("label",{htmlFor:a,className:c.TEXT_AREA_LABEL_STYLES.root,"data-disabled":s?"":void 0,children:t}));e.displayName="TextArea.Label";module.exports=e;
+//# sourceMappingURL=TextAreaLabel.cjs.map

package/dist/components/forms/text-area/components/text-area-label/TextAreaLabel.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaLabel.cjs","sources":["../../../../../../src/components/forms/text-area/components/text-area-label/TextAreaLabel.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\nimport { TEXT_AREA_LABEL_STYLES } from '@components/forms/text-area/components/text-area-label/styles/TextAreaLabel.css.ts'\r\nimport type { TextAreaLabelProps } from '@components/forms/text-area/components/text-area-label/types/TextAreaLabel.props.ts'\r\n\r\nconst TextAreaLabel: FC<TextAreaLabelProps> = memo(({ htmlFor, disabled, children }) => (\r\n    <label\r\n        htmlFor={htmlFor}\r\n        className={TEXT_AREA_LABEL_STYLES.root}\r\n        data-disabled={disabled ? '' : undefined}\r\n    >\r\n        {children}\r\n    </label>\r\n))\r\n\r\nTextAreaLabel.displayName = 'TextArea.Label'\r\n\r\nexport default TextAreaLabel\r\n"],"names":["TextAreaLabel","memo","htmlFor","disabled","children","jsx","TEXT_AREA_LABEL_STYLES"],"mappings":"iHAIMA,EAAwCC,EAAAA,KAAK,CAAC,CAAE,QAAAC,EAAS,SAAAC,EAAU,SAAAC,KACrEC,EAAAA,IAAC,QAAA,CACG,QAAAH,EACA,UAAWI,EAAAA,uBAAuB,KAClC,gBAAeH,EAAW,GAAK,OAE9B,SAAAC,CAAA,CACL,CACH,EAEDJ,EAAc,YAAc"}

package/dist/components/forms/text-area/components/text-area-label/TextAreaLabel.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { TextAreaLabelProps } from './types/TextAreaLabel.props.ts';
+declare const TextAreaLabel: FC<TextAreaLabelProps>;
+export default TextAreaLabel;

package/dist/components/forms/text-area/components/text-area-label/TextAreaLabel.js

@@ -0,0 +1,17 @@
+import { jsx as m } from "react/jsx-runtime";
+import { memo as r } from "react";
+import { TEXT_AREA_LABEL_STYLES as t } from "./styles/TextAreaLabel.css.js";
+const l = r(({ htmlFor: a, disabled: e, children: o }) => /* @__PURE__ */ m(
+  "label",
+  {
+    htmlFor: a,
+    className: t.root,
+    "data-disabled": e ? "" : void 0,
+    children: o
+  }
+));
+l.displayName = "TextArea.Label";
+export {
+  l as default
+};
+//# sourceMappingURL=TextAreaLabel.js.map

package/dist/components/forms/text-area/components/text-area-label/TextAreaLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaLabel.js","sources":["../../../../../../src/components/forms/text-area/components/text-area-label/TextAreaLabel.tsx"],"sourcesContent":["import { memo, type FC } from 'react'\r\nimport { TEXT_AREA_LABEL_STYLES } from '@components/forms/text-area/components/text-area-label/styles/TextAreaLabel.css.ts'\r\nimport type { TextAreaLabelProps } from '@components/forms/text-area/components/text-area-label/types/TextAreaLabel.props.ts'\r\n\r\nconst TextAreaLabel: FC<TextAreaLabelProps> = memo(({ htmlFor, disabled, children }) => (\r\n    <label\r\n        htmlFor={htmlFor}\r\n        className={TEXT_AREA_LABEL_STYLES.root}\r\n        data-disabled={disabled ? '' : undefined}\r\n    >\r\n        {children}\r\n    </label>\r\n))\r\n\r\nTextAreaLabel.displayName = 'TextArea.Label'\r\n\r\nexport default TextAreaLabel\r\n"],"names":["TextAreaLabel","memo","htmlFor","disabled","children","jsx","TEXT_AREA_LABEL_STYLES"],"mappings":";;;AAIA,MAAMA,IAAwCC,EAAK,CAAC,EAAE,SAAAC,GAAS,UAAAC,GAAU,UAAAC,QACrE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,SAAAH;AAAA,IACA,WAAWI,EAAuB;AAAA,IAClC,iBAAeH,IAAW,KAAK;AAAA,IAE9B,UAAAC;AAAA,EAAA;AACL,CACH;AAEDJ,EAAc,cAAc;"}

package/dist/components/forms/text-area/components/text-area-label/styles/TextAreaLabel.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css                                                    */;/* empty css                                                        */;/* empty css                                   */var e={root:"_1sjl5hx0"};exports.TEXT_AREA_LABEL_STYLES=e;
+//# sourceMappingURL=TextAreaLabel.css.cjs.map

package/dist/components/forms/text-area/components/text-area-label/styles/TextAreaLabel.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextAreaLabel.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/forms/text-area/components/text-area-label/styles/TextAreaLabel.css.d.ts

@@ -0,0 +1,3 @@
+export declare const TEXT_AREA_LABEL_STYLES: {
+    root: string;
+};

package/dist/components/forms/text-area/components/text-area-label/styles/TextAreaLabel.css.js

@@ -0,0 +1,8 @@
+/* empty css                                                  */
+/* empty css                                                      */
+/* empty css                                 */
+var p = { root: "_1sjl5hx0" };
+export {
+  p as TEXT_AREA_LABEL_STYLES
+};
+//# sourceMappingURL=TextAreaLabel.css.js.map