@smitch/fluid/lib/textinput/TextInput.js

A Next/React ui-component libray.

'use client';
import { jsx as _jsx } from "react/jsx-runtime";
import { useRef } from 'react';
import { twMerge } from 'tailwind-merge';
import { Input, Label } from '..';
var TextInput = function (_a) {
    var _b = _a.type, type = _b === void 0 ? 'text' : _b, _c = _a.name, name = _c === void 0 ? 'name' : _c, _d = _a.id, id = _d === void 0 ? 'counter' : _d, _e = _a.className, className = _e === void 0 ? '' : _e, value = _a.value, onInputChange = _a.onInputChange, _f = _a.size, size = _f === void 0 ? 'md' : _f, label = _a.label, _g = _a.layout, layout = _g === void 0 ? 'col' : _g, title = _a.title, _h = _a.hint, hint = _h === void 0 ? false : _h, placeholder = _a.placeholder, _j = _a.inputStyles, inputStyles = _j === void 0 ? '' : _j, _k = _a.rounded, rounded = _k === void 0 ? 'md' : _k, required = _a.required, readonly = _a.readonly, _l = _a.autocomplete, autocomplete = _l === void 0 ? 'off' : _l, pattern = _a.pattern, disabled = _a.disabled;
    var input = useRef(null);
    var handleChange = function (e) {
        if (!onInputChange)
            return;
        var value = e.target.value;
        onInputChange(value);
    };
    return (_jsx(Label, { label: label, layout: layout, forId: id, size: size, type: type, required: required, className: twMerge("font-semibold", className), "data-testid": "label-".concat(name), children: _jsx(Input, { name: name, id: id, type: type, value: value, ref: input, onChange: handleChange, "data-testid": "input-".concat(name), className: twMerge("border-neutral", inputStyles), rounded: rounded, size: size, title: title, placeholder: placeholder, hint: hint, autocomplete: autocomplete, required: required, pattern: pattern, readonly: readonly, disabled: disabled }) }));
};
export default TextInput;