lucid-ui/dist/esm/components/TextField/TextField.d.ts

A UI component library from Xandr.

import React from 'react';
import PropTypes from 'prop-types';
import { StandardProps, Overwrite } from '../../util/component-types';
export interface ITextFieldProps extends StandardProps {
    /** Set the TextField to multi line mode. Under the hood this will use a `textarea` instead of an `input` if set to `true`. */
    isMultiLine?: boolean;
    /** Disables the TextField by greying it out. */
    isDisabled?: boolean;
    /** Initial number of rows a multi line TextField should have. Ignored when
        not in multi-line mode. */
    rows?: number;
    /** Fires an event every time the user types text into the TextField. */
    onChange?: (value: string, { event, props, }: {
        event: React.FormEvent;
        props: ITextFieldProps;
    }) => void;
    /** Fires an on the `input`'s onBlur. */
    onBlur?: (currentValue: string, { event, props, }: {
        event: React.FocusEvent;
        props: ITextFieldProps;
    }) => void;
    /** Fires an event, debounced by `debounceLevel` when the user types text
        into the TextField. */
    onChangeDebounced?: (value: string, { event, props, }: {
        event: React.FormEvent;
        props: ITextFieldProps;
    }) => void;
    /** Fires an event on every keydown */
    onKeyDown?: ({ event, props, }: {
        event: React.KeyboardEvent;
        props: ITextFieldProps;
    }) => void;
    /** Fires an event when the user hits "enter" from the TextField. You shouldn't use it if you're using `isMultiLine`. */
    onSubmit?: (value: string, { event, props, }: {
        event: React.FormEvent;
        props: ITextFieldProps;
    }) => void;
    /** Set the value of the input. */
    value: string | number;
    /** Number of milliseconds to debounce the `onChangeDebounced` callback. Only useful if you provide an `onChangeDebounced` handler. */
    debounceLevel?: number;
    /** Set the holding time, in milliseconds, that the component will wait if
        the user is typing and the component gets a new `value` prop.  Any time
        the user hits a key, it starts a timer that prevents state changes from
        flowing in to the component until the timer has elapsed.  This was
        heavily inspired by the [lazy-input](https:/docs.npmjs.com/package/lazy-input) component. */
    lazyLevel?: number;
}
export declare type ITextFieldPropsWithPassThroughs = Overwrite<React.InputHTMLAttributes<HTMLInputElement>, ITextFieldProps>;
export interface ITextFieldState {
    value: number | string;
    isHolding: boolean;
    isMounted: boolean;
}
declare class TextField extends React.Component<ITextFieldPropsWithPassThroughs, ITextFieldState, {}> {
    static displayName: string;
    static peek: {
        description: string;
        categories: string[];
    };
    static propTypes: {
        /**
            Styles that are passed through to native control.
        */
        style: PropTypes.Requireable<object>;
        /**
            Set the TextField to multi line mode. Under the hood this will use a
            \`textarea\` instead of an \`input\` if set to \`true\`.
        */
        isMultiLine: PropTypes.Requireable<boolean>;
        /**
            Disables the TextField by greying it out.
        */
        isDisabled: PropTypes.Requireable<boolean>;
        /**
            Initial number of rows a multi line TextField should have. Ignored when
            not in multi-line mode.
        */
        rows: PropTypes.Requireable<number>;
        /**
            Class names that are appended to the defaults.
        */
        className: PropTypes.Requireable<string>;
        /**
            Fires an event every time the user types text into the TextField.
            Signature: \`(value, { event, props }) => {}\`
        */
        onChange: PropTypes.Requireable<(...args: any[]) => any>;
        /**
            Fires an on the \`input\`'s onBlur.  Signature:
            \`(currentValue, { event, props }) => {}\`
        */
        onBlur: PropTypes.Requireable<(...args: any[]) => any>;
        /**
            Fires an event, debounced by \`debounceLevel\`, when the user types text
            into the TextField.  Signature: \`(value, { event, props }) => {}\`
        */
        onChangeDebounced: PropTypes.Requireable<(...args: any[]) => any>;
        /**
            Fires an event on every keydown Signature: \`({ event, props }) => {}\`
        */
        onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
        /**
            Fires an event when the user hits "enter" from the TextField. You
            shouldn't use it if you're using \`isMultiLine\`.  Signature:
            \`(value, { event, props }) => {}\`
        */
        onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
        /**
            Set the value of the input.
        */
        value: PropTypes.Requireable<string | number>;
        /**
            Number of milliseconds to debounce the \`onChangeDebounced\` callback.
            Only useful if you provide an \`onChangeDebounced\` handler.
        */
        debounceLevel: PropTypes.Requireable<number>;
        /**
            Set the holding time, in milliseconds, that the component will wait if
            the user is typing and the component gets a new \`value\` prop.  Any time
            the user hits a key, it starts a timer that prevents state changes from
            flowing in to the component until the timer has elapsed.  This was
            heavily inspired by the
            [lazy-input](https:/docs.npmjs.com/package/lazy-input) component.
        */
        lazyLevel: PropTypes.Requireable<number>;
    };
    state: {
        value: string | number;
        isHolding: boolean;
        isMounted: boolean;
    };
    static defaultProps: {
        style: undefined;
        isDisabled: boolean;
        isMultiLine: boolean;
        onBlur: (...args: any[]) => void;
        onChange: (...args: any[]) => void;
        onChangeDebounced: (...args: any[]) => void;
        onSubmit: (...args: any[]) => void;
        onKeyDown: (...args: any[]) => void;
        rows: number;
        debounceLevel: number;
        lazyLevel: number;
        value: string;
    };
    static reducers: {
        onChange: typeof import("./TextField.reducers").onChange;
    };
    private textareaElement;
    private inputElement;
    private nativeElement;
    private handleChangeDebounced;
    private releaseHold;
    private updateWhenReady;
    handleChange: (event: React.FormEvent) => void;
    handleBlur: (event: React.FocusEvent) => void;
    handleKeyDown: (event: React.KeyboardEvent) => void;
    focus: (options?: FocusOptions | undefined) => void;
    UNSAFE_componentWillMount(): void;
    componentWillUnmount(): void;
    UNSAFE_componentWillReceiveProps(nextProps: ITextFieldProps): void;
    render(): React.ReactNode;
}
export default TextField;
//# sourceMappingURL=TextField.d.ts.map