import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
import { cx, cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
import { forwardRef } from 'react';
import { Flex } from '../flex/flex.js';
import styles from './textfield.module.css.js';

const textfield = cva(styles.textfield, {
    variants: {
        size: {
            small: styles["textfield-sm"],
            medium: styles["textfield-md"],
        },
        state: {
            invalid: styles["textfield-invalid"],
            valid: styles["textfield-valid"],
        },
        hasLeadingElement: {
            true: styles["textfield-leading"],
        },
        hasTrailingElement: {
            true: styles["textfield-trailing"],
        },
    },
    defaultVariants: {
        size: "small",
    },
});
const TextField = forwardRef(({ leading, trailing, className, src, size, state, style, iconClass, ...props }, ref) => {
    const hasLeadingElement = Boolean(leading);
    const hasTrailingElement = Boolean(trailing);
    return (jsxRuntimeExports.jsxs(Flex, { align: "center", style: { position: "relative", width: "100%" }, children: [hasLeadingElement ? (jsxRuntimeExports.jsx(Flex, { style: { left: "8px" }, className: cx(styles.leadingIcon, iconClass?.leadingIcon), children: leading })) : null, jsxRuntimeExports.jsx("input", { className: cx(textfield({
                    size,
                    state,
                    className,
                    hasLeadingElement,
                    hasTrailingElement,
                })), ...props, ref: ref }), hasTrailingElement ? (jsxRuntimeExports.jsx(Flex, { style: { right: "8px" }, className: cx(styles.trailingIcon, iconClass?.trailingIcon), children: trailing })) : null] }));
});
TextField.displayName = "TextField";

export { TextField };
//# sourceMappingURL=textfield.js.map
