1 | /// <reference types="react" />
|
2 | import { AbstractPureComponent2, HTMLInputProps, Position } from "../../common";
|
3 | import type { InputSharedProps } from "./inputSharedProps";
|
4 | export declare type NumericInputProps = INumericInputProps;
|
5 | /** @deprecated use NumericInputProps */
|
6 | export interface INumericInputProps extends InputSharedProps {
|
7 | /**
|
8 | * Whether to allow only floating-point number characters in the field,
|
9 | * mimicking the native `input[type="number"]`.
|
10 | *
|
11 | * @default true
|
12 | */
|
13 | allowNumericCharactersOnly?: boolean;
|
14 | /**
|
15 | * Set this to `true` if you will be controlling the `value` of this input with asynchronous updates.
|
16 | * These may occur if you do not immediately call setState in a parent component with the value from
|
17 | * the `onChange` handler.
|
18 | */
|
19 | asyncControl?: boolean;
|
20 | /**
|
21 | * The position of the buttons with respect to the input field.
|
22 | *
|
23 | * @default Position.RIGHT
|
24 | */
|
25 | buttonPosition?: typeof Position.LEFT | typeof Position.RIGHT | "none";
|
26 | /**
|
27 | * Whether the value should be clamped to `[min, max]` on blur.
|
28 | * The value will be clamped to each bound only if the bound is defined.
|
29 | * Note that native `input[type="number"]` controls do *NOT* clamp on blur.
|
30 | *
|
31 | * @default false
|
32 | */
|
33 | clampValueOnBlur?: boolean;
|
34 | /**
|
35 | * In uncontrolled mode, this sets the default value of the input.
|
36 | * Note that this value is only used upon component instantiation and changes to this prop
|
37 | * during the component lifecycle will be ignored.
|
38 | *
|
39 | * @default ""
|
40 | */
|
41 | defaultValue?: number | string;
|
42 | /**
|
43 | * If set to `true`, the input will display with larger styling.
|
44 | * This is equivalent to setting `Classes.LARGE` via className on the
|
45 | * parent control group and on the child input group.
|
46 | *
|
47 | * @default false
|
48 | */
|
49 | large?: boolean;
|
50 | /**
|
51 | * The locale name, which is passed to the component to format the number and allowing to type the number in the specific locale.
|
52 | * [See MDN documentation for more info about browser locale identification](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation).
|
53 | *
|
54 | * @default ""
|
55 | */
|
56 | locale?: string;
|
57 | /**
|
58 | * The increment between successive values when <kbd>shift</kbd> is held.
|
59 | * Pass explicit `null` value to disable this interaction.
|
60 | *
|
61 | * @default 10
|
62 | */
|
63 | majorStepSize?: number | null;
|
64 | /** The maximum value of the input. */
|
65 | max?: number;
|
66 | /** The minimum value of the input. */
|
67 | min?: number;
|
68 | /**
|
69 | * The increment between successive values when <kbd>alt</kbd> is held.
|
70 | * Pass explicit `null` value to disable this interaction.
|
71 | *
|
72 | * @default 0.1
|
73 | */
|
74 | minorStepSize?: number | null;
|
75 | /**
|
76 | * Whether the entire text field should be selected on focus.
|
77 | *
|
78 | * @default false
|
79 | */
|
80 | selectAllOnFocus?: boolean;
|
81 | /**
|
82 | * Whether the entire text field should be selected on increment.
|
83 | *
|
84 | * @default false
|
85 | */
|
86 | selectAllOnIncrement?: boolean;
|
87 | /**
|
88 | * The increment between successive values when no modifier keys are held.
|
89 | *
|
90 | * @default 1
|
91 | */
|
92 | stepSize?: number;
|
93 | /**
|
94 | * The value to display in the input field.
|
95 | */
|
96 | value?: number | string;
|
97 | /** The callback invoked when the value changes due to a button click. */
|
98 | onButtonClick?(valueAsNumber: number, valueAsString: string): void;
|
99 | /** The callback invoked when the value changes due to typing, arrow keys, or button clicks. */
|
100 | onValueChange?(valueAsNumber: number, valueAsString: string, inputElement: HTMLInputElement | null): void;
|
101 | }
|
102 | export interface INumericInputState {
|
103 | currentImeInputInvalid: boolean;
|
104 | prevMinProp?: number;
|
105 | prevMaxProp?: number;
|
106 | shouldSelectAfterUpdate: boolean;
|
107 | stepMaxPrecision: number;
|
108 | value: string;
|
109 | }
|
110 | /**
|
111 | * Numeric input component.
|
112 | *
|
113 | * @see https://blueprintjs.com/docs/#core/components/numeric-input
|
114 | */
|
115 | export declare class NumericInput extends AbstractPureComponent2<HTMLInputProps & NumericInputProps, INumericInputState> {
|
116 | static displayName: string;
|
117 | static VALUE_EMPTY: string;
|
118 | static VALUE_ZERO: string;
|
119 | private numericInputId;
|
120 | static defaultProps: NumericInputProps;
|
121 | static getDerivedStateFromProps(props: NumericInputProps, state: INumericInputState): {
|
122 | stepMaxPrecision: number;
|
123 | value: string;
|
124 | prevMaxProp: number | undefined;
|
125 | prevMinProp: number | undefined;
|
126 | };
|
127 | private static CONTINUOUS_CHANGE_DELAY;
|
128 | private static CONTINUOUS_CHANGE_INTERVAL;
|
129 | private static getStepMaxPrecision;
|
130 | private static roundAndClampValue;
|
131 | state: INumericInputState;
|
132 | private didPasteEventJustOccur;
|
133 | private delta;
|
134 | inputElement: HTMLInputElement | null;
|
135 | private inputRef;
|
136 | private intervalId?;
|
137 | private incrementButtonHandlers;
|
138 | private decrementButtonHandlers;
|
139 | private getCurrentValueAsNumber;
|
140 | render(): JSX.Element;
|
141 | componentDidUpdate(prevProps: NumericInputProps, prevState: INumericInputState): void;
|
142 | protected validateProps(nextProps: HTMLInputProps & NumericInputProps): void;
|
143 | private renderButtons;
|
144 | private renderInput;
|
145 | private getButtonEventHandlers;
|
146 | private handleButtonClick;
|
147 | private startContinuousChange;
|
148 | private stopContinuousChange;
|
149 | private handleContinuousChange;
|
150 | private handleInputFocus;
|
151 | private handleInputBlur;
|
152 | private handleInputKeyDown;
|
153 | private handleCompositionEnd;
|
154 | private handleCompositionUpdate;
|
155 | private handleInputKeyPress;
|
156 | private handleInputPaste;
|
157 | private handleInputChange;
|
158 | private handleNextValue;
|
159 | private incrementValue;
|
160 | private getIncrementDelta;
|
161 | private roundAndClampValue;
|
162 | private updateDelta;
|
163 | }
|