UNPKG

2.53 kBTypeScriptView Raw
1import * as React from "react";
2import { AbstractPureComponent } from "../../common";
3import { ControlledProps, HTMLInputProps } from "../../common/props";
4import type { InputSharedProps } from "./inputSharedProps";
5export interface InputGroupProps extends Omit<HTMLInputProps, keyof ControlledProps>, ControlledProps, InputSharedProps {
6 /**
7 * Set this to `true` if you will be controlling the `value` of this input with asynchronous updates.
8 * These may occur if you do not immediately call setState in a parent component with the value from
9 * the `onChange` handler, or if working with certain libraries like __redux-form__.
10 *
11 * @default false
12 */
13 asyncControl?: boolean;
14 /** Whether this input should use large styles. */
15 large?: boolean;
16 /**
17 * Callback invoked when the input value changes, typically via keyboard interactions.
18 *
19 * Using this prop instead of `onChange` can help avoid common bugs in React 16 related to Event Pooling
20 * where developers forget to save the text value from a change event or call `event.persist()`.
21 *
22 * @see https://legacy.reactjs.org/docs/legacy-event-pooling.html
23 */
24 onValueChange?(value: string, targetElement: HTMLInputElement | null): void;
25 /** Whether this input should use small styles. */
26 small?: boolean;
27 /** Whether the input (and any buttons) should appear with rounded caps. */
28 round?: boolean;
29 /**
30 * Name of the HTML tag that contains the input group.
31 *
32 * @default "div"
33 */
34 tagName?: keyof JSX.IntrinsicElements;
35 /**
36 * HTML `input` type attribute.
37 *
38 * @default "text"
39 */
40 type?: string;
41}
42export interface InputGroupState {
43 leftElementWidth?: number;
44 rightElementWidth?: number;
45}
46/**
47 * Input group component.
48 *
49 * @see https://blueprintjs.com/docs/#core/components/input-group
50 */
51export declare class InputGroup extends AbstractPureComponent<InputGroupProps, InputGroupState> {
52 static displayName: string;
53 state: InputGroupState;
54 private leftElement;
55 private rightElement;
56 private refHandlers;
57 render(): React.ReactElement<{
58 className: string;
59 }, string | React.JSXElementConstructor<any>>;
60 componentDidMount(): void;
61 componentDidUpdate(prevProps: InputGroupProps): void;
62 protected validateProps(props: InputGroupProps): void;
63 private handleInputChange;
64 private maybeRenderLeftElement;
65 private maybeRenderRightElement;
66 private updateInputWidth;
67}