@smitch/fluid/lib/textarea/TextArea.js

A lightweight, Tailwind-powered React/Next.js UI component library.

import { jsx as _jsx } from "react/jsx-runtime";
import { useMemo } from 'react';
import { twMerge } from 'tailwind-merge';
import { Label } from '..';
var sizes = {
    sm: 'text-sm',
    md: 'text-base',
    lg: 'text-lg',
    xl: 'text-xl',
};
var TextArea = function (_a) {
    var _b = _a.className, className = _b === void 0 ? '' : _b, _c = _a.textAreaStyles, textAreaStyles = _c === void 0 ? '' : _c, label = _a.label, layout = _a.layout, required = _a.required, _d = _a.name, name = _d === void 0 ? 'textarea' : _d, value = _a.value, placeholder = _a.placeholder, _e = _a.size, size = _e === void 0 ? 'md' : _e, onChange = _a.onChange, _f = _a.rows, rows = _f === void 0 ? 2 : _f, _g = _a.resize, resize = _g === void 0 ? true : _g, maxLength = _a.maxLength, _h = _a.disabled, disabled = _h === void 0 ? false : _h;
    var sizeClasses = useMemo(function () { return sizes[size]; }, [size]);
    return (_jsx(Label, { label: label, layout: layout, size: size, required: required, className: twMerge("font-semibold", className), "data-testid": "label-".concat(name), children: _jsx("textarea", { className: twMerge("form-textarea font-normal w-full invalid:!border-accent dark:bg-dark dark:text-light color-scheme:light dark:[color-scheme:dark] border-neutral disabled:bg-neutral disabled:cursor-default disabled:text-dark ".concat(className, " ").concat(sizeClasses, " ").concat(resize ? 'resize' : 'resize-none'), textAreaStyles), name: name, id: name, value: value, placeholder: placeholder, onChange: onChange, rows: rows, maxLength: maxLength, disabled: disabled, required: required }) }));
};
export default TextArea;
//# sourceMappingURL=TextArea.js.map