{"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"}