@blueprintjs/core/lib/esm/components/forms/inputGroup.d.ts

Core styles & components

import * as React from "react";
import { AbstractPureComponent } from "../../common";
import { ControlledProps, HTMLInputProps } from "../../common/props";
import type { InputSharedProps } from "./inputSharedProps";
export interface InputGroupProps extends Omit<HTMLInputProps, keyof ControlledProps>, ControlledProps, InputSharedProps {
    /**
     * Set this to `true` if you will be controlling the `value` of this input with asynchronous updates.
     * These may occur if you do not immediately call setState in a parent component with the value from
     * the `onChange` handler, or if working with certain libraries like __redux-form__.
     *
     * @default false
     */
    asyncControl?: boolean;
    /** Whether this input should use large styles. */
    large?: boolean;
    /**
     * Callback invoked when the input value changes, typically via keyboard interactions.
     *
     * Using this prop instead of `onChange` can help avoid common bugs in React 16 related to Event Pooling
     * where developers forget to save the text value from a change event or call `event.persist()`.
     *
     * @see https://legacy.reactjs.org/docs/legacy-event-pooling.html
     */
    onValueChange?(value: string, targetElement: HTMLInputElement | null): void;
    /** Whether this input should use small styles. */
    small?: boolean;
    /** Whether the input (and any buttons) should appear with rounded caps. */
    round?: boolean;
    /**
     * Name of the HTML tag that contains the input group.
     *
     * @default "div"
     */
    tagName?: keyof JSX.IntrinsicElements;
    /**
     * HTML `input` type attribute.
     *
     * @default "text"
     */
    type?: string;
}
export interface InputGroupState {
    leftElementWidth?: number;
    rightElementWidth?: number;
}
/**
 * Input group component.
 *
 * @see https://blueprintjs.com/docs/#core/components/input-group
 */
export declare class InputGroup extends AbstractPureComponent<InputGroupProps, InputGroupState> {
    static displayName: string;
    state: InputGroupState;
    private leftElement;
    private rightElement;
    private refHandlers;
    render(): React.ReactElement<{
        className: string;
    }, string | React.JSXElementConstructor<any>>;
    componentDidMount(): void;
    componentDidUpdate(prevProps: InputGroupProps): void;
    protected validateProps(props: InputGroupProps): void;
    private handleInputChange;
    private maybeRenderLeftElement;
    private maybeRenderRightElement;
    private updateInputWidth;
}