import React, { ChangeEvent, FocusEvent, MouseEvent, ReactElement, Ref, InputHTMLAttributes } from 'react'; import { IconName } from '../Icon'; import { CommonProps } from '../common'; export interface InputProps extends Omit, Omit, 'size' | 'prefix'> { /** * Specify the [automated assistance](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete) in filling out form field values by the browser. */ autoComplete?: string; /** * Specify the input element should automatically get focus when it is mounted. */ autoFocus?: boolean; /** * Whether the input is disabled. */ disabled?: boolean; /** * Id of element. */ id?: string; /** * Whether the input is invalid */ invalid?: boolean; /** * Name of element, is used to refer to the form data for submission. */ name?: string; /** * Blur event handler. */ onBlur?: (e: FocusEvent) => void; /** * Change event handler. Use `event.target.value` for new value. */ onChange?: (e: ChangeEvent) => void; /** * Click event handler. */ onClick?: (e: MouseEvent) => void; /** * Focus event handler. */ onFocus?: (e: FocusEvent) => void; /** * Placeholder text in the absence of any value. */ placeholder?: string; /** * Name of Icon or an Icon element to render on the left side of the input, before the user's cursor. */ prefix?: IconName | ReactElement; /** * Whether or not Input's value is read only. */ readonly?: boolean; /** * Input ref passing to input element */ ref?: Ref; /** * The size of the input box. */ size?: 'small' | 'medium' | 'large'; /** * Name of Icon or an Icon element to render on the right side of the input. */ suffix?: IconName | ReactElement; /** * [Type](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types) of input. */ type?: string; /** * The input's content value. */ value?: string; } export declare const INPUT_DISPLAY_NAME = "Input"; declare const Input: React.ForwardRefExoticComponent & React.RefAttributes>; export default Input;