@vela-ui/react/dist/components/input.d.mts

Vela UI React components

import * as react_jsx_runtime from 'react/jsx-runtime';
import * as tailwind_variants from 'tailwind-variants';
import { VariantProps } from 'tailwind-variants';
import { Input as Input$1, Group } from 'react-aria-components';

declare const inputVariants: tailwind_variants.TVReturnType<{
    size: {
        xs: string;
        sm: string;
        md: string;
        lg: string;
        xl: string;
    };
    isFocused: {
        true: string;
    };
    hasStartElement: {
        true: string;
    };
    hasEndElement: {
        true: string;
    };
}, undefined, "file:text-foreground placeholder:text-muted-foreground dark:bg-input/30 border-input relative flex w-full min-w-0 rounded-md border bg-transparent py-1 shadow-xs transition-[color,box-shadow] file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", {
    isFocusVisible: {
        true: string;
    };
    isInvalid: {
        true: string;
    };
}, undefined, tailwind_variants.TVReturnType<{
    isFocusVisible: {
        true: string;
    };
    isInvalid: {
        true: string;
    };
}, undefined, "outline-hidden", {
    isFocusVisible: {
        true: string;
    };
    isInvalid: {
        true: string;
    };
}, undefined, tailwind_variants.TVReturnType<{
    isFocusVisible: {
        true: string;
    };
    isInvalid: {
        true: string;
    };
}, undefined, "outline-hidden", unknown, unknown, undefined>>>;
interface InputProps extends Omit<React.ComponentProps<typeof Input$1>, "color" | "size">, VariantProps<typeof inputVariants> {
}
declare function Input({ className, size, hasStartElement, hasEndElement, ...props }: InputProps): react_jsx_runtime.JSX.Element;
declare const inputGroupVariants: tailwind_variants.TVReturnType<{
    size: {
        xs: {
            root: string;
            addon: string;
            element: string;
        };
        sm: {
            root: string;
            addon: string;
            element: string;
        };
        md: {
            root: string;
            addon: string;
            element: string;
        };
        lg: {
            root: string;
            addon: string;
            element: string;
        };
        xl: {
            root: string;
            addon: string;
            element: string;
        };
    };
}, {
    root: string[];
    addon: string;
    element: string;
}, undefined, {
    size: {
        xs: {
            root: string;
            addon: string;
            element: string;
        };
        sm: {
            root: string;
            addon: string;
            element: string;
        };
        md: {
            root: string;
            addon: string;
            element: string;
        };
        lg: {
            root: string;
            addon: string;
            element: string;
        };
        xl: {
            root: string;
            addon: string;
            element: string;
        };
    };
}, {
    root: string[];
    addon: string;
    element: string;
}, tailwind_variants.TVReturnType<{
    size: {
        xs: {
            root: string;
            addon: string;
            element: string;
        };
        sm: {
            root: string;
            addon: string;
            element: string;
        };
        md: {
            root: string;
            addon: string;
            element: string;
        };
        lg: {
            root: string;
            addon: string;
            element: string;
        };
        xl: {
            root: string;
            addon: string;
            element: string;
        };
    };
}, {
    root: string[];
    addon: string;
    element: string;
}, undefined, unknown, unknown, undefined>>;
interface InputGroupProps extends React.ComponentProps<typeof Group>, VariantProps<typeof inputGroupVariants> {
    /**
     * The start element to render the inner left of the group
     */
    startElement?: React.ReactNode;
    /**
     * The end element to render the inner right of the group
     */
    endElement?: React.ReactNode;
    /**
     * The start addon to render the left of the group
     */
    startAddon?: React.ReactNode;
    /**
     * The end addon to render the right of the group
     */
    endAddon?: React.ReactNode;
}
declare const InputGroup: ({ children, startElement, endElement, startAddon, endAddon, size, className, ...props }: InputGroupProps) => react_jsx_runtime.JSX.Element;

export { Input, InputGroup, type InputGroupProps, type InputProps };