@douyinfe/semi-ui/lib/es/input/index.d.ts

A modern, comprehensive, flexible design system and UI library. Connect DesignOps & DevOps. Quickly build beautiful React apps. Maintained by Douyin-fe team.

import React from 'react';
import PropTypes from 'prop-types';
import InputFoundation from '@douyinfe/semi-foundation/lib/es/input/foundation';
import BaseComponent from '../_base/baseComponent';
import '@douyinfe/semi-foundation/lib/es/input/input.css';
export type { InputGroupProps } from './inputGroup';
export type { TextAreaProps } from './textarea';
export type InputSize = 'small' | 'large' | 'default';
export type InputMode = 'password';
export type ValidateStatus = "default" | "error" | "warning" | "success";
export interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'prefix' | 'size' | 'placeholder' | 'onFocus' | 'onBlur'> {
    'aria-label'?: React.AriaAttributes['aria-label'];
    'aria-describedby'?: React.AriaAttributes['aria-describedby'];
    'aria-errormessage'?: React.AriaAttributes['aria-errormessage'];
    'aria-invalid'?: React.AriaAttributes['aria-invalid'];
    'aria-labelledby'?: React.AriaAttributes['aria-labelledby'];
    'aria-required'?: React.AriaAttributes['aria-required'];
    addonBefore?: React.ReactNode;
    addonAfter?: React.ReactNode;
    borderless?: boolean;
    prefix?: React.ReactNode;
    suffix?: React.ReactNode;
    mode?: InputMode;
    value?: React.ReactText;
    defaultValue?: React.ReactText;
    disabled?: boolean;
    readonly?: boolean;
    type?: string;
    showClear?: boolean;
    hideSuffix?: boolean;
    placeholder?: React.ReactText;
    insetLabel?: React.ReactNode;
    insetLabelId?: string;
    size?: InputSize;
    className?: string;
    clearIcon?: React.ReactNode;
    style?: React.CSSProperties;
    validateStatus?: ValidateStatus;
    onClear?: (e: React.MouseEvent<HTMLDivElement>) => void;
    onChange?: (value: string, e: React.ChangeEvent<HTMLInputElement>) => void;
    onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
    onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
    onInput?: (e: React.MouseEvent<HTMLInputElement>) => void;
    onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    onKeyUp?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    onKeyPress?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    onEnterPress?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
    inputStyle?: React.CSSProperties;
    getValueLength?: (value: string) => number;
    forwardRef?: ((instance: any) => void) | React.MutableRefObject<any> | null;
    preventScroll?: boolean;
    /** internal prop, DatePicker use it */
    showClearIgnoreDisabled?: boolean;
    onlyBorder?: number;
}
export interface InputState {
    value: React.ReactText;
    cachedValue: React.ReactText;
    disabled: boolean;
    props: Record<string, any>;
    isFocus: boolean;
    isHovering: boolean;
    eyeClosed: boolean;
    minLength: number;
}
declare class Input extends BaseComponent<InputProps, InputState> {
    static propTypes: {
        'aria-label': PropTypes.Requireable<string>;
        'aria-labelledby': PropTypes.Requireable<string>;
        'aria-invalid': PropTypes.Requireable<boolean>;
        'aria-errormessage': PropTypes.Requireable<string>;
        'aria-describedby': PropTypes.Requireable<string>;
        'aria-required': PropTypes.Requireable<boolean>;
        addonBefore: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        addonAfter: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        clearIcon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        prefix: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        suffix: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        mode: PropTypes.Requireable<"password">;
        value: PropTypes.Requireable<any>;
        defaultValue: PropTypes.Requireable<any>;
        disabled: PropTypes.Requireable<boolean>;
        readonly: PropTypes.Requireable<boolean>;
        autoFocus: PropTypes.Requireable<boolean>;
        type: PropTypes.Requireable<string>;
        showClear: PropTypes.Requireable<boolean>;
        hideSuffix: PropTypes.Requireable<boolean>;
        placeholder: PropTypes.Requireable<any>;
        size: PropTypes.Requireable<"default" | "small" | "large">;
        className: PropTypes.Requireable<string>;
        style: PropTypes.Requireable<object>;
        validateStatus: PropTypes.Requireable<"default" | "error" | "warning" | "success">;
        onClear: PropTypes.Requireable<(...args: any[]) => any>;
        onChange: PropTypes.Requireable<(...args: any[]) => any>;
        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
        onFocus: PropTypes.Requireable<(...args: any[]) => any>;
        onInput: PropTypes.Requireable<(...args: any[]) => any>;
        onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
        onKeyUp: PropTypes.Requireable<(...args: any[]) => any>;
        onKeyPress: PropTypes.Requireable<(...args: any[]) => any>;
        onEnterPress: PropTypes.Requireable<(...args: any[]) => any>;
        insetLabel: PropTypes.Requireable<PropTypes.ReactNodeLike>;
        insetLabelId: PropTypes.Requireable<string>;
        inputStyle: PropTypes.Requireable<object>;
        getValueLength: PropTypes.Requireable<(...args: any[]) => any>;
        preventScroll: PropTypes.Requireable<boolean>;
        borderless: PropTypes.Requireable<boolean>;
    };
    static defaultProps: {
        addonBefore: string;
        addonAfter: string;
        prefix: string;
        suffix: string;
        readonly: boolean;
        type: string;
        showClear: boolean;
        hideSuffix: boolean;
        placeholder: string;
        size: string;
        className: string;
        onClear: (...args: any[]) => void;
        onChange: (...args: any[]) => void;
        onBlur: (...args: any[]) => void;
        onFocus: (...args: any[]) => void;
        onInput: (...args: any[]) => void;
        onKeyDown: (...args: any[]) => void;
        onKeyUp: (...args: any[]) => void;
        onKeyPress: (...args: any[]) => void;
        onEnterPress: (...args: any[]) => void;
        validateStatus: string;
        borderless: boolean;
    };
    inputRef: React.RefObject<HTMLInputElement>;
    prefixRef: React.RefObject<React.ReactNode>;
    suffixRef: React.RefObject<React.ReactNode>;
    foundation: InputFoundation;
    constructor(props: InputProps);
    get adapter(): {
        setValue: (value: string) => void;
        setEyeClosed: (value: boolean) => void;
        toggleFocusing: (isFocus: boolean) => void;
        focusInput: () => void;
        toggleHovering: (isHovering: boolean) => void;
        getIfFocusing: () => boolean;
        notifyChange: (cbValue: string, e: React.ChangeEvent<HTMLInputElement>) => void;
        notifyBlur: (val: string, e: React.FocusEvent<HTMLInputElement>) => void;
        notifyFocus: (val: string, e: React.FocusEvent<HTMLInputElement>) => void;
        notifyInput: (e: React.MouseEvent<HTMLInputElement>) => void;
        notifyKeyPress: (e: React.KeyboardEvent<HTMLInputElement>) => void;
        notifyKeyDown: (e: React.KeyboardEvent<HTMLInputElement>) => void;
        notifyKeyUp: (e: React.KeyboardEvent<HTMLInputElement>) => void;
        notifyEnterPress: (e: React.KeyboardEvent<HTMLInputElement>) => void;
        notifyClear: (e: React.MouseEvent<HTMLDivElement>) => void;
        setMinLength: (minLength: number) => void;
        isEventTarget: (e: React.MouseEvent) => boolean;
        getContext(key: string): any;
        getContexts(): any;
        getProp(key: string): any;
        getProps(): InputProps;
        getState(key: string): any;
        getStates(): InputState;
        setState<K extends keyof InputState>(s: Pick<InputState, K>, callback?: any): void;
        getCache(c: string): any;
        getCaches(): any;
        setCache(key: any, value: any): void;
        stopPropagation(e: any): void;
        persistEvent: (event: any) => void;
    };
    static getDerivedStateFromProps(props: InputProps, state: InputState): Partial<InputState>;
    componentDidUpdate(prevProps: InputProps): void;
    componentDidMount(): void;
    handleClear: (e: React.MouseEvent<HTMLInputElement>) => void;
    handleClick: (e: React.MouseEvent<HTMLDivElement>) => void;
    handleMouseOver: (e: React.MouseEvent<HTMLDivElement>) => void;
    handleMouseLeave: (e: React.MouseEvent<HTMLDivElement>) => void;
    handleModeChange: (mode: string) => void;
    handleClickEye: (e: React.MouseEvent<HTMLInputElement>) => void;
    handleMouseDown: (e: React.MouseEvent<HTMLInputElement>) => void;
    handleMouseUp: (e: React.MouseEvent<HTMLInputElement>) => void;
    handleModeEnterPress: (e: React.KeyboardEvent<HTMLDivElement>) => void;
    handleClickPrefixOrSuffix: (e: React.MouseEvent<HTMLInputElement>) => void;
    handlePreventMouseDown: (e: React.MouseEvent<HTMLInputElement>) => void;
    renderPrepend(): React.JSX.Element;
    renderAppend(): React.JSX.Element;
    renderClearBtn(): React.JSX.Element;
    renderModeBtn(): React.JSX.Element;
    renderPrefix(): React.JSX.Element;
    renderSuffix(suffixAllowClear: boolean): React.JSX.Element;
    getInputRef(): React.RefObject<HTMLInputElement> | React.MutableRefObject<any> | ((node: HTMLInputElement) => void);
    render(): React.JSX.Element;
}
declare const ForwardInput: React.ForwardRefExoticComponent<Omit<InputProps, "forwardRef"> & React.RefAttributes<HTMLInputElement>>;
export default ForwardInput;
export { Input };