@codeworker.br/govbr-tw-react/dist/components/Input/index.js

Biblioteca de componentes React usando Tailwind CSS que implementa o Padrão Digital de Governo.

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { forwardRef } from "react";
import inputVariants from "./variants";
import inputHintVariants from "./hint-variants";
import inputIconVariants from "./icon-variants";
import React from "react";
import BASE_CLASSNAMES from "../../config/baseClassNames";
import { cn } from "../../libs/utils";
const Input = forwardRef((_a, ref) => {
    var { children, className, density = "default", variant = "default", iconPosition = "none", hint = "" } = _a, props = __rest(_a, ["children", "className", "density", "variant", "iconPosition", "hint"]);
    const [firstIcon, lastIcon] = React.Children.toArray(children);
    return (_jsxs("div", { children: [_jsxs("div", { className: "relative w-full flex items-center", children: [firstIcon && (_jsx("span", { className: cn(inputIconVariants({ variant }), iconPosition !== "right" ? "left-3" : "right-3"), children: firstIcon })), lastIcon && (_jsx("span", { className: cn(inputIconVariants({ variant }), "right-3"), children: lastIcon })), _jsx("input", Object.assign({ className: cn(inputVariants({ variant, density, iconPosition }), className, BASE_CLASSNAMES.input.root) }, props, { ref: ref }))] }), hint && (_jsx("span", { className: cn(inputHintVariants({ variant, density })), children: hint }))] }));
});
export default Input;