@choco-vanille/ui 1.14.2 → 1.14.4

package/dist/components/forms/slider/components/slider-header/SliderHeader.d.ts

@@ -1,3 +1,3 @@
 import { SliderHeaderProps } from './types/SliderHeader.props.ts';
-declare const SliderHeader: ({ label, showValue }: SliderHeaderProps) => import("react").JSX.Element;
+declare const SliderHeader: ({ label, labelId, showValue }: SliderHeaderProps) => import("react").JSX.Element;
 export default SliderHeader;

package/dist/components/forms/slider/components/slider-header/SliderHeader.js

@@ -1,11 +1,22 @@
-import { jsxs as i, jsx as a } from "react/jsx-runtime";
-import { Slider as l } from "@base-ui/react/slider";
-import { SLIDER_HEADER_STYLES as e } from "./styles/SliderHeader.css.js";
-const t = ({ label: r, showValue: o }) => /* @__PURE__ */ i("div", { className: e.root, children: [
-  r && /* @__PURE__ */ a(l.Label, { className: e.label, children: r }),
-  o && /* @__PURE__ */ a(l.Value, { className: e.value, children: (s) => s.join(" – ") })
+import { jsxs as s, jsx as e } from "react/jsx-runtime";
+import { Slider as m } from "@base-ui/react/slider";
+import t from "../../../../foundation/typography/Typography.js";
+import "../../../../foundation/typography/styles/Typography.css.js";
+import { SLIDER_HEADER_STYLES as r } from "./styles/SliderHeader.css.js";
+const S = ({ label: a, labelId: o, showValue: i }) => /* @__PURE__ */ s("div", { className: r.root, children: [
+  a && /* @__PURE__ */ e(
+    t,
+    {
+      as: "span",
+      variant: "label",
+      id: o,
+      className: r.label,
+      children: a
+    }
+  ),
+  i && /* @__PURE__ */ e(m.Value, { className: r.value, children: (l) => l.join(" – ") })
 ] });
 export {
-  t as default
+  S as default
 };
 //# sourceMappingURL=SliderHeader.js.map

package/dist/components/forms/slider/components/slider-header/SliderHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderHeader.js","sources":["../../../../../../src/components/forms/slider/components/slider-header/SliderHeader.tsx"],"sourcesContent":["import { Slider as BaseSlider } from '@base-ui/react/slider'\r\n\r\nimport { SLIDER_HEADER_STYLES } from '@components/forms/slider/components/slider-header/styles/SliderHeader.css.ts'\r\nimport type { SliderHeaderProps } from '@components/forms/slider/components/slider-header/types/SliderHeader.props.ts'\r\n\r\nconst SliderHeader = ({ label, showValue }: SliderHeaderProps) => (\r\n    <div className={SLIDER_HEADER_STYLES.root}>\r\n        {label && <BaseSlider.Label className={SLIDER_HEADER_STYLES.label}>{label}</BaseSlider.Label>}\r\n        {showValue && (\r\n            <BaseSlider.Value className={SLIDER_HEADER_STYLES.value}>\r\n                {(formattedValues) => formattedValues.join(' – ')}\r\n            </BaseSlider.Value>\r\n        )}\r\n    </div>\r\n)\r\n\r\nexport default SliderHeader\r\n"],"names":["SliderHeader","label","showValue","jsxs","SLIDER_HEADER_STYLES","BaseSlider","jsx","formattedValues"],"mappings":";;;AAKA,MAAMA,IAAe,CAAC,EAAE,OAAAC,GAAO,WAAAC,QAC3B,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAqB,MAChC,UAAA;AAAA,EAAAH,uBAAUI,EAAW,OAAX,EAAiB,WAAWD,EAAqB,OAAQ,UAAAH,GAAM;AAAA,EACzEC,KACG,gBAAAI,EAACD,EAAW,OAAX,EAAiB,WAAWD,EAAqB,OAC7C,UAAA,CAACG,MAAoBA,EAAgB,KAAK,KAAK,EAAA,CACpD;AAAA,EAAA,CAER;"}
+{"version":3,"file":"SliderHeader.js","sources":["../../../../../../src/components/forms/slider/components/slider-header/SliderHeader.tsx"],"sourcesContent":["import { Slider as BaseSlider } from '@base-ui/react/slider'\r\nimport { Typography } from '@components/foundation/typography'\r\n\r\nimport { SLIDER_HEADER_STYLES } from '@components/forms/slider/components/slider-header/styles/SliderHeader.css.ts'\r\nimport type { SliderHeaderProps } from '@components/forms/slider/components/slider-header/types/SliderHeader.props.ts'\r\n\r\nconst SliderHeader = ({ label, labelId, showValue }: SliderHeaderProps) => (\r\n    <div className={SLIDER_HEADER_STYLES.root}>\r\n        {label && (\r\n            <Typography\r\n                as={'span'}\r\n                variant={'label'}\r\n                id={labelId}\r\n                className={SLIDER_HEADER_STYLES.label}\r\n            >\r\n                {label}\r\n            </Typography>\r\n        )}\r\n        {showValue && (\r\n            <BaseSlider.Value className={SLIDER_HEADER_STYLES.value}>\r\n                {(formattedValues) => formattedValues.join(' – ')}\r\n            </BaseSlider.Value>\r\n        )}\r\n    </div>\r\n)\r\n\r\nexport default SliderHeader\r\n"],"names":["SliderHeader","label","labelId","showValue","jsxs","SLIDER_HEADER_STYLES","jsx","Typography","BaseSlider","formattedValues"],"mappings":";;;;;AAMA,MAAMA,IAAe,CAAC,EAAE,OAAAC,GAAO,SAAAC,GAAS,WAAAC,EAAA,MACpC,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAqB,MAChC,UAAA;AAAA,EAAAJ,KACG,gBAAAK;AAAA,IAACC;AAAA,IAAA;AAAA,MACG,IAAI;AAAA,MACJ,SAAS;AAAA,MACT,IAAIL;AAAA,MACJ,WAAWG,EAAqB;AAAA,MAE/B,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAAA,EAGRE,KACG,gBAAAG,EAACE,EAAW,OAAX,EAAiB,WAAWH,EAAqB,OAC7C,UAAA,CAACI,MAAoBA,EAAgB,KAAK,KAAK,EAAA,CACpD;AAAA,EAAA,CAER;"}

package/dist/components/forms/slider/components/slider-header/styles/SliderHeader.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit144.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                  */var e={root:"tjesq90",label:"tjesq91",value:"tjesq92"};exports.SLIDER_HEADER_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit142.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                  */var e={root:"tjesq90",label:"tjesq91",value:"tjesq92"};exports.SLIDER_HEADER_STYLES=e;
 //# sourceMappingURL=SliderHeader.css.cjs.map

package/dist/components/forms/slider/components/slider-header/styles/SliderHeader.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit144.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit142.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                                */
 var o = { root: "tjesq90", label: "tjesq91", value: "tjesq92" };
 export {

package/dist/components/forms/slider/components/slider-header/types/SliderHeader.props.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
 export type SliderHeaderProps = {
     label?: string;
+    labelId?: string;
     showValue: boolean;
     children?: ReactNode;
 };

package/dist/components/forms/slider/components/slider-track/styles/SliderTrack.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit141.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                 */const a=require("@vanilla-extract/recipes/createRuntimeFn");var e={control:"ky6kla0",track:a.createRuntimeFn({defaultClassName:"ky6kla1",variantClassNames:{size:{sm:"ky6kla2",md:"ky6kla3",lg:"ky6kla4"}},defaultVariants:{size:"md"},compoundVariants:[]}),indicator:a.createRuntimeFn({defaultClassName:"ky6kla5",variantClassNames:{color:{primary:"ky6kla6",secondary:"ky6kla7",destructive:"ky6kla8"}},defaultVariants:{color:"primary"},compoundVariants:[]}),thumb:a.createRuntimeFn({defaultClassName:"ky6kla9",variantClassNames:{size:{sm:"ky6klaa",md:"ky6klab",lg:"ky6klac"},color:{primary:"ky6klad",secondary:"ky6klae",destructive:"ky6klaf"}},defaultVariants:{size:"md",color:"primary"},compoundVariants:[]})};exports.SLIDER_TRACK_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../../../ui-kit144.css');require('../../../../../../ui-kit.css');;/* empty css                                                    */;/* empty css                                 */const a=require("@vanilla-extract/recipes/createRuntimeFn");var e={control:"ky6kla0",track:a.createRuntimeFn({defaultClassName:"ky6kla1",variantClassNames:{size:{sm:"ky6kla2",md:"ky6kla3",lg:"ky6kla4"}},defaultVariants:{size:"md"},compoundVariants:[]}),indicator:a.createRuntimeFn({defaultClassName:"ky6kla5",variantClassNames:{color:{primary:"ky6kla6",secondary:"ky6kla7",destructive:"ky6kla8"}},defaultVariants:{color:"primary"},compoundVariants:[]}),thumb:a.createRuntimeFn({defaultClassName:"ky6kla9",variantClassNames:{size:{sm:"ky6klaa",md:"ky6klab",lg:"ky6klac"},color:{primary:"ky6klad",secondary:"ky6klae",destructive:"ky6klaf"}},defaultVariants:{size:"md",color:"primary"},compoundVariants:[]})};exports.SLIDER_TRACK_STYLES=e;
 //# sourceMappingURL=SliderTrack.css.cjs.map

package/dist/components/forms/slider/components/slider-track/styles/SliderTrack.css.js

@@ -1,4 +1,4 @@
-import '../../../../../../ui-kit141.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
+import '../../../../../../ui-kit144.css';import '../../../../../../ui-kit.css';/* empty css                                                  */
 /* empty css                               */
 import { createRuntimeFn as a } from "@vanilla-extract/recipes/createRuntimeFn";
 var s = { control: "ky6kla0", track: a({ defaultClassName: "ky6kla1", variantClassNames: { size: { sm: "ky6kla2", md: "ky6kla3", lg: "ky6kla4" } }, defaultVariants: { size: "md" }, compoundVariants: [] }), indicator: a({ defaultClassName: "ky6kla5", variantClassNames: { color: { primary: "ky6kla6", secondary: "ky6kla7", destructive: "ky6kla8" } }, defaultVariants: { color: "primary" }, compoundVariants: [] }), thumb: a({ defaultClassName: "ky6kla9", variantClassNames: { size: { sm: "ky6klaa", md: "ky6klab", lg: "ky6klac" }, color: { primary: "ky6klad", secondary: "ky6klae", destructive: "ky6klaf" } }, defaultVariants: { size: "md", color: "primary" }, compoundVariants: [] }) };

package/dist/components/forms/slider/styles/Slider.css.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit56.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */var e={root:"_1exybeb0",helper:"_1exybeb1",error:"_1exybeb2"};exports.SLIDER_STYLES=e;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit64.css');require('../../../../ui-kit.css');;/* empty css                                              */;/* empty css                            */var e={root:"_1exybeb0",helper:"_1exybeb1",error:"_1exybeb2"};exports.SLIDER_STYLES=e;
 //# sourceMappingURL=Slider.css.cjs.map

package/dist/components/forms/slider/styles/Slider.css.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit56.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit64.css';import '../../../../ui-kit.css';/* empty css                                            */
 /* empty css                          */
 var b = { root: "_1exybeb0", helper: "_1exybeb1", error: "_1exybeb2" };
 export {

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

@@ -1,2 +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;
+"use strict";const e=require("react/jsx-runtime"),m=require("@base-ui/react/switch"),a=require("react"),_=require("../_shared/components/form-label/FormLabel.cjs"),b=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"),I=a.memo(({label:i,helperText:r,error:c,id:T,className:p,disabled:n,size:l="md",onCheckedChange:x,...q})=>{const w=a.useId(),d=a.useId(),S=T??(i?w:void 0),t=!!c,u=r||c?`${S}-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(m.Switch.Root,{id:S,disabled:n,"aria-labelledby":i?d:void 0,"aria-describedby":u,"aria-invalid":t||void 0,className:o.cn(s.SWITCH_STYLES.root({size:l,error:t}),p),onCheckedChange:x,...q,children:e.jsx(m.Switch.Thumb,{className:s.SWITCH_STYLES.thumb({size:l})})}),i&&e.jsx(_,{id:d,className:o.cn(s.SWITCH_STYLES.label,n&&s.SWITCH_STYLES.labelDisabled),children:i})]}),(c||r)&&e.jsx(b,{id:u,hasError:t,children:c??r})]})});I.displayName="Switch";module.exports=I;
 //# sourceMappingURL=Switch.cjs.map

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

@@ -1 +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"}
+{"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 FormLabel from '@components/forms/_shared/components/form-label/FormLabel.tsx'\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 labelId = 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-labelledby={label ? labelId : undefined}\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                    <FormLabel\r\n                        id={labelId}\r\n                        className={cn(SWITCH_STYLES.label, disabled && SWITCH_STYLES.labelDisabled)}\r\n                    >\r\n                        {label}\r\n                    </FormLabel>\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","labelId","switchId","hasError","helperId","jsxs","Flex","cn","SWITCH_STYLES","jsx","BaseSwitch","FormLabel","HelperText"],"mappings":"yYAqBMA,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,EAAUD,EAAAA,MAAA,EACVE,EAAWT,IAAOH,EAAQS,EAAc,QACxCI,EAAW,EAAQX,EACnBY,EAAYb,GAAcC,EAAS,GAAGU,CAAQ,UAAY,OAEhE,OACIG,EAAAA,KAACC,EAAA,CACG,GAAI,OACJ,OAAM,GACN,cAAe,SACf,IAAK,KACL,WAAY,QACZ,UAAWC,EAAAA,GAAGC,EAAAA,cAAc,QAASb,GAAYa,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,SAAAP,EACA,kBAAiBL,EAAQW,EAAU,OACnC,mBAAkBG,EAClB,eAAcD,GAAY,OAC1B,UAAWI,EAAAA,GAAGC,EAAAA,cAAc,KAAK,CAAE,KAAAZ,EAAM,MAAOO,EAAU,EAAGT,CAAS,EACtE,gBAAAG,EACC,GAAGC,EAEJ,SAAAW,EAAAA,IAACC,EAAAA,OAAW,MAAX,CAAiB,UAAWF,EAAAA,cAAc,MAAM,CAAE,KAAAZ,CAAA,CAAM,CAAA,CAAG,CAAA,CAAA,EAG/DN,GACGmB,EAAAA,IAACE,EAAA,CACG,GAAIV,EACJ,UAAWM,EAAAA,GAAGC,EAAAA,cAAc,MAAOb,GAAYa,EAAAA,cAAc,aAAa,EAEzE,SAAAlB,CAAA,CAAA,CACL,CAAA,CAAA,GAINE,GAASD,IACPkB,EAAAA,IAACG,EAAA,CACG,GAAIR,EACJ,SAAAD,EAEC,SAAAX,GAASD,CAAA,CAAA,CACd,CAAA,CAAA,CAIhB,CAAC,EAEDH,EAAO,YAAc"}

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

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

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

@@ -1 +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;"}
+{"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 FormLabel from '@components/forms/_shared/components/form-label/FormLabel.tsx'\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 labelId = 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-labelledby={label ? labelId : undefined}\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                    <FormLabel\r\n                        id={labelId}\r\n                        className={cn(SWITCH_STYLES.label, disabled && SWITCH_STYLES.labelDisabled)}\r\n                    >\r\n                        {label}\r\n                    </FormLabel>\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","labelId","switchId","hasError","helperId","jsxs","Flex","cn","SWITCH_STYLES","jsx","BaseSwitch","FormLabel","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,IAAUD,EAAA,GACVE,IAAWT,MAAOH,IAAQS,IAAc,SACxCI,IAAW,EAAQX,GACnBY,IAAYb,KAAcC,IAAS,GAAGU,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,SAASb,KAAYa,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,UAAAP;AAAA,kBACA,mBAAiBL,IAAQW,IAAU;AAAA,kBACnC,oBAAkBG;AAAA,kBAClB,gBAAcD,KAAY;AAAA,kBAC1B,WAAWI,EAAGC,EAAc,KAAK,EAAE,MAAAZ,GAAM,OAAOO,GAAU,GAAGT,CAAS;AAAA,kBACtE,iBAAAG;AAAA,kBACC,GAAGC;AAAA,kBAEJ,UAAA,gBAAAW,EAACC,EAAW,OAAX,EAAiB,WAAWF,EAAc,MAAM,EAAE,MAAAZ,EAAA,CAAM,EAAA,CAAG;AAAA,gBAAA;AAAA,cAAA;AAAA,cAG/DN,KACG,gBAAAmB;AAAA,gBAACE;AAAA,gBAAA;AAAA,kBACG,IAAIV;AAAA,kBACJ,WAAWM,EAAGC,EAAc,OAAOb,KAAYa,EAAc,aAAa;AAAA,kBAEzE,UAAAlB;AAAA,gBAAA;AAAA,cAAA;AAAA,YACL;AAAA,UAAA;AAAA,QAAA;AAAA,SAINE,KAASD,MACP,gBAAAkB;AAAA,UAACG;AAAA,UAAA;AAAA,YACG,IAAIR;AAAA,YACJ,UAAAD;AAAA,YAEC,UAAAX,KAASD;AAAA,UAAA;AAAA,QAAA;AAAA,MACd;AAAA,IAAA;AAAA,EAAA;AAIhB,CAAC;AAEDH,EAAO,cAAc;"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit24.css');require('../../../../ui-kit.css');;/* 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;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../../../ui-kit56.css');require('../../../../ui-kit.css');;/* 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.js

@@ -1,4 +1,4 @@
-import '../../../../ui-kit24.css';import '../../../../ui-kit.css';/* empty css                                            */
+import '../../../../ui-kit56.css';import '../../../../ui-kit.css';/* 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" };

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/forms/text-area/TextArea.tsx"],"sourcesContent":["import {\r\n    TextAreaStartIcon,\r\n    TextAreaEndAction,\r\n} from '@components/forms/text-area/components/index.ts'\r\nimport FormLabel from '@components/forms/_shared/components/form-label/FormLabel.tsx'\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 { vars } from '@theme/contract.css.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        fontSize: fontSizeProp = 'md',\r\n        placeholder,\r\n        value,\r\n        onChange,\r\n        onKeyDown,\r\n        onKeyUp,\r\n        ref: forwardedRef,\r\n        style: textareaStyle,\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                <FormLabel\r\n                    htmlFor={inputId}\r\n                    disabled={disabled}\r\n                    fontSize={fontSizeProp}\r\n                >\r\n                    {label}\r\n                </FormLabel>\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                    style={{ fontSize: vars.fontSize[fontSizeProp], ...textareaStyle }}\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 = FormLabel\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","fontSizeProp","placeholder","value","onChange","onKeyDown","onKeyUp","forwardedRef","textareaStyle","rows","minRows","maxRows","textareaProps","size","innerRef","useRef","setRef","useCallback","node","autoResizeEnabled","resize","useAutoResizeTextArea","handleChange","e","jsxs","Flex","jsx","FormLabel","TextAreaStartIcon","cn","TEXT_AREA_STYLES","vars","TextAreaEndAction","HelperText"],"mappings":"27BAuCMA,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,SAAUC,EAAe,KACzB,YAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,QAAAC,EACA,IAAKC,EACL,MAAOC,EACP,KAAAC,EACA,QAAAC,EACA,QAAAC,EACA,GAAGC,CAAA,EACH9B,EACE+B,EAAOb,GAAY,KAEnBc,EAAWC,EAAAA,OAA4B,IAAI,EAC3CC,EAASC,EAAAA,YACVC,GAAqC,CAClCJ,EAAS,QAAUI,EACf,OAAOX,GAAiB,WACxBA,EAAaW,CAAI,EACVX,IACPA,EAAa,QAAUW,EAE/B,EACA,CAACX,CAAY,CAAA,EAGX,CAAE,UAAWY,EAAmB,OAAAC,CAAA,EAAWC,EAAAA,sBAC7CP,EACA,CACI,QAASJ,GAAWD,EACpB,QAAAE,EACA,MAAAR,CAAA,CACJ,EAGEmB,EAAeL,EAAAA,YAChBM,GAA8C,CAC3CnB,IAAWmB,CAAC,EACZH,EAAA,CACJ,EACA,CAAChB,EAAUgB,CAAM,CAAA,EAGrB,OACII,EAAAA,KAACC,EAAA,CACG,cAAe,SACf,IAAK,KACL,MAAO,OACP,WAAY,QACZ,MAAO9B,IAAU,OAAY,CAAE,MAAAA,GAAU,OAExC,SAAA,CAAAG,GACG4B,EAAAA,IAACC,EAAA,CACG,QAAS5C,EACT,SAAAS,EACA,SAAUS,EAET,SAAAH,CAAA,CAAA,EAIT0B,EAAAA,KAACC,EAAA,CACG,SAAU,WACV,MAAO,OACP,IAAK,OAEJ,SAAA,CAAAhC,GACGiC,EAAAA,IAACE,EAAA,CACG,KAAMnC,EACN,KAAAoB,CAAA,CAAA,EAIRa,EAAAA,IAAC,WAAA,CACG,IAAKV,EACL,GAAIjC,EACJ,SAAAS,EACA,eAAcP,GAAY,OAC1B,mBAAkBW,GAASC,EAAab,EAAW,OACnD,YAAaI,EACb,QAASC,EACT,OAAQC,EACR,UAAWuC,EAAAA,GACPC,EAAAA,iBAAiB,OAAO,CACpB,KAAAjB,EACA,SAAA5B,EACA,aAAAC,EACA,aAAAC,CAAA,CACH,EACDO,CAAA,EAEJ,YAAAQ,EACA,MAAAC,EACA,SAAUmB,EACV,UAAAjB,EACA,QAAAC,EACA,KAAMa,EAAqBT,GAAWD,EAAQA,EAC7C,GAAGG,EACJ,MAAO,CAAE,SAAUmB,EAAAA,KAAK,SAAS9B,CAAY,EAAG,GAAGO,CAAA,CAAc,CAAA,EAGpErB,GAAgBuC,EAAAA,IAACM,EAAA,CAAmB,SAAAjC,CAAA,CAAU,CAAA,CAAA,CAAA,GAGjDH,GAASC,IACP6B,EAAAA,IAACO,EAAA,CACG,GAAIjD,EACJ,SAAAC,EAEC,SAAAW,GAASC,CAAA,CAAA,CACd,CAAA,CAAA,CAIhB,CAAC,EAEDjB,EAAS,YAAc,WACvBA,EAAS,MAAQ+C,EACjB/C,EAAS,UAAYgD,EACrBhD,EAAS,UAAYoD"}
+{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/forms/text-area/TextArea.tsx"],"sourcesContent":["import {\r\n    TextAreaStartIcon,\r\n    TextAreaEndAction,\r\n} from '@components/forms/text-area/components/index.ts'\r\nimport FormLabel from '@components/forms/_shared/components/form-label/FormLabel.tsx'\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 { vars } from '@theme/contract.css.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 selectable label text.\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        fontSize: fontSizeProp = 'md',\r\n        placeholder,\r\n        value,\r\n        onChange,\r\n        onKeyDown,\r\n        onKeyUp,\r\n        ref: forwardedRef,\r\n        style: textareaStyle,\r\n        rows,\r\n        minRows,\r\n        maxRows,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        ...textareaProps\r\n    } = props\r\n    const size = sizeProp ?? 'md'\r\n    const labelId = label && inputId ? `${inputId}-label` : undefined\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                <FormLabel\r\n                    id={labelId}\r\n                    disabled={disabled}\r\n                    fontSize={fontSizeProp}\r\n                >\r\n                    {label}\r\n                </FormLabel>\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-labelledby={ariaLabelledBy ?? labelId}\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                    style={{ fontSize: vars.fontSize[fontSizeProp], ...textareaStyle }}\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 = FormLabel\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","fontSizeProp","placeholder","value","onChange","onKeyDown","onKeyUp","forwardedRef","textareaStyle","rows","minRows","maxRows","ariaLabelledBy","textareaProps","size","labelId","innerRef","useRef","setRef","useCallback","node","autoResizeEnabled","resize","useAutoResizeTextArea","handleChange","e","jsxs","Flex","jsx","FormLabel","TextAreaStartIcon","cn","TEXT_AREA_STYLES","vars","TextAreaEndAction","HelperText"],"mappings":"27BAuCMA,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,SAAUC,EAAe,KACzB,YAAAC,EACA,MAAAC,EACA,SAAAC,EACA,UAAAC,EACA,QAAAC,EACA,IAAKC,EACL,MAAOC,EACP,KAAAC,EACA,QAAAC,EACA,QAAAC,EACA,kBAAmBC,EACnB,GAAGC,CAAA,EACH/B,EACEgC,EAAOd,GAAY,KACnBe,EAAUjB,GAASf,EAAU,GAAGA,CAAO,SAAW,OAElDiC,EAAWC,EAAAA,OAA4B,IAAI,EAC3CC,EAASC,EAAAA,YACVC,GAAqC,CAClCJ,EAAS,QAAUI,EACf,OAAOb,GAAiB,WACxBA,EAAaa,CAAI,EACVb,IACPA,EAAa,QAAUa,EAE/B,EACA,CAACb,CAAY,CAAA,EAGX,CAAE,UAAWc,EAAmB,OAAAC,CAAA,EAAWC,EAAAA,sBAC7CP,EACA,CACI,QAASN,GAAWD,EACpB,QAAAE,EACA,MAAAR,CAAA,CACJ,EAGEqB,EAAeL,EAAAA,YAChBM,GAA8C,CAC3CrB,IAAWqB,CAAC,EACZH,EAAA,CACJ,EACA,CAAClB,EAAUkB,CAAM,CAAA,EAGrB,OACII,EAAAA,KAACC,EAAA,CACG,cAAe,SACf,IAAK,KACL,MAAO,OACP,WAAY,QACZ,MAAOhC,IAAU,OAAY,CAAE,MAAAA,GAAU,OAExC,SAAA,CAAAG,GACG8B,EAAAA,IAACC,EAAA,CACG,GAAId,EACJ,SAAAvB,EACA,SAAUS,EAET,SAAAH,CAAA,CAAA,EAIT4B,EAAAA,KAACC,EAAA,CACG,SAAU,WACV,MAAO,OACP,IAAK,OAEJ,SAAA,CAAAlC,GACGmC,EAAAA,IAACE,EAAA,CACG,KAAMrC,EACN,KAAAqB,CAAA,CAAA,EAIRc,EAAAA,IAAC,WAAA,CACG,IAAKV,EACL,GAAInC,EACJ,SAAAS,EACA,kBAAiBoB,GAAkBG,EACnC,eAAc9B,GAAY,OAC1B,mBAAkBW,GAASC,EAAab,EAAW,OACnD,YAAaI,EACb,QAASC,EACT,OAAQC,EACR,UAAWyC,EAAAA,GACPC,EAAAA,iBAAiB,OAAO,CACpB,KAAAlB,EACA,SAAA7B,EACA,aAAAC,EACA,aAAAC,CAAA,CACH,EACDO,CAAA,EAEJ,YAAAQ,EACA,MAAAC,EACA,SAAUqB,EACV,UAAAnB,EACA,QAAAC,EACA,KAAMe,EAAqBX,GAAWD,EAAQA,EAC7C,GAAGI,EACJ,MAAO,CAAE,SAAUoB,EAAAA,KAAK,SAAShC,CAAY,EAAG,GAAGO,CAAA,CAAc,CAAA,EAGpErB,GAAgByC,EAAAA,IAACM,EAAA,CAAmB,SAAAnC,CAAA,CAAU,CAAA,CAAA,CAAA,GAGjDH,GAASC,IACP+B,EAAAA,IAACO,EAAA,CACG,GAAInD,EACJ,SAAAC,EAEC,SAAAW,GAASC,CAAA,CAAA,CACd,CAAA,CAAA,CAIhB,CAAC,EAEDjB,EAAS,YAAc,WACvBA,EAAS,MAAQiD,EACjBjD,EAAS,UAAYkD,EACrBlD,EAAS,UAAYsD"}

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

@@ -1,6 +1,6 @@
 import { TextAreaCompound } from './types';
 /**
-  * A styled textarea built with a native `<textarea>` and `<label>`.
+  * A styled textarea built with a native `<textarea>` and selectable label text.
   *
   * - `startIcon` - Iconify icon name rendered on the left.
   * - `endAction` - any ReactNode (e.g. `<IconButton>`) rendered on the right.