@payfit/unity-components/dist/esm/components/input/Input.d.ts

import { ReactElement } from 'react';
import { InputProps as AriaInputProps } from 'react-aria-components/Input';
export interface InputProps extends Omit<AriaInputProps, 'prefix' | 'style' | 'className'> {
    /**
     * The type of the input field
     * @default 'text'
     */
    type?: 'text' | 'password' | 'email' | 'tel' | 'url' | 'search';
    /** Element to display before the input field */
    prefix?: ReactElement;
    /** Element to display after the input field */
    suffix?: ReactElement;
    /** Whether the field is required */
    isRequired?: boolean;
    /** Whether the field is in an invalid state */
    isInvalid?: boolean;
    /** Whether the field is in a loading state */
    isLoading?: boolean;
    /** Whether the field is disabled */
    isDisabled?: boolean;
    /** Whether the field is read-only */
    isReadOnly?: boolean;
    /**
     * Clear button click handler
     */
    onClearButtonPress?: () => void;
}
/**
 * The `Input` components displays a styled, single HTML `<input>` field whose type is text-compatible (`text`, `password`, `email`, `tel`, `url`, `search`), and follows the Unity design system language. It supports multiple states out of the box and can be used as a controlled or uncontrolled component. It is also compatible with the `Form` and `FormField` component as a form control.
 * @param {InputProps} props - Regular props from the `<input>` HTML element, plus state-related props
 * @see {@link InputProps} for all available props
 * @example
 * ```tsx
 * import { Input } from '@payfit/unity-components'
 *
 * function Example() {
 *   const [value, setValue] = useState()
 *
 *   const handleInputChange = (e) => {
 *     setValue(e.target.value)
 *   }
 *
 *   return <Input type="text" placeholder="write something..." value={value} onChange={handleInputChange} />
 * }
 * ```
 */
declare const Input: import('react').ForwardRefExoticComponent<InputProps & import('react').RefAttributes<HTMLInputElement>>;
export { Input };