1 | import * as React from "react";
|
2 | import { Props } from "@blueprintjs/core";
|
3 | import { TimeUnit } from "./common/timeUnit";
|
4 | export declare const TimePrecision: {
|
5 | MILLISECOND: "millisecond";
|
6 | MINUTE: "minute";
|
7 | SECOND: "second";
|
8 | };
|
9 | export declare type TimePrecision = (typeof TimePrecision)[keyof typeof TimePrecision];
|
10 | export declare type TimePickerProps = ITimePickerProps;
|
11 | /** @deprecated use TimePickerProps */
|
12 | export interface ITimePickerProps extends Props {
|
13 | /**
|
14 | * Whether to focus the first input when it opens initially.
|
15 | *
|
16 | * @default false
|
17 | */
|
18 | autoFocus?: boolean;
|
19 | /**
|
20 | * Initial time the `TimePicker` will display.
|
21 | * This should not be set if `value` is set.
|
22 | */
|
23 | defaultValue?: Date;
|
24 | /**
|
25 | * Whether the time picker is non-interactive.
|
26 | *
|
27 | * @default false
|
28 | */
|
29 | disabled?: boolean;
|
30 | /**
|
31 | * Callback invoked on blur event emitted by specific time unit input
|
32 | */
|
33 | onBlur?: (event: React.FocusEvent<HTMLInputElement>, unit: TimeUnit) => void;
|
34 | /**
|
35 | * Callback invoked when the user changes the time.
|
36 | */
|
37 | onChange?: (newTime: Date) => void;
|
38 | /**
|
39 | * Callback invoked on focus event emitted by specific time unit input
|
40 | */
|
41 | onFocus?: (event: React.FocusEvent<HTMLInputElement>, unit: TimeUnit) => void;
|
42 | /**
|
43 | * Callback invoked on keydown event emitted by specific time unit input
|
44 | */
|
45 | onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>, unit: TimeUnit) => void;
|
46 | /**
|
47 | * Callback invoked on keyup event emitted by specific time unit input
|
48 | */
|
49 | onKeyUp?: (event: React.KeyboardEvent<HTMLInputElement>, unit: TimeUnit) => void;
|
50 | /**
|
51 | * The precision of time the user can set.
|
52 | *
|
53 | * @default TimePrecision.MINUTE
|
54 | */
|
55 | precision?: TimePrecision;
|
56 | /**
|
57 | * Whether all the text in each input should be selected on focus.
|
58 | *
|
59 | * @default false
|
60 | */
|
61 | selectAllOnFocus?: boolean;
|
62 | /**
|
63 | * Whether to show arrows buttons for changing the time.
|
64 | *
|
65 | * @default false
|
66 | */
|
67 | showArrowButtons?: boolean;
|
68 | /**
|
69 | * Whether to use a 12 hour format with an AM/PM dropdown.
|
70 | *
|
71 | * @default false
|
72 | */
|
73 | useAmPm?: boolean;
|
74 | /**
|
75 | * The latest time the user can select. The year, month, and day parts of the `Date` object are ignored.
|
76 | * While the `maxTime` will be later than the `minTime` in the basic case,
|
77 | * it is also allowed to be earlier than the `minTime`.
|
78 | * This is useful, for example, to express a time range that extends before and after midnight.
|
79 | * If the `maxTime` and `minTime` are equal, then the valid time range is constrained to only that one value.
|
80 | */
|
81 | maxTime?: Date;
|
82 | /**
|
83 | * The earliest time the user can select. The year, month, and day parts of the `Date` object are ignored.
|
84 | * While the `minTime` will be earlier than the `maxTime` in the basic case,
|
85 | * it is also allowed to be later than the `maxTime`.
|
86 | * This is useful, for example, to express a time range that extends before and after midnight.
|
87 | * If the `maxTime` and `minTime` are equal, then the valid time range is constrained to only that one value.
|
88 | */
|
89 | minTime?: Date;
|
90 | /**
|
91 | * The currently set time.
|
92 | * If this prop is provided, the component acts in a controlled manner.
|
93 | */
|
94 | value?: Date | null;
|
95 | }
|
96 | export interface ITimePickerState {
|
97 | hourText?: string;
|
98 | minuteText?: string;
|
99 | secondText?: string;
|
100 | millisecondText?: string;
|
101 | value?: Date;
|
102 | isPm?: boolean;
|
103 | }
|
104 | /**
|
105 | * Time picker component.
|
106 | *
|
107 | * @see https://blueprintjs.com/docs/#datetime/timepicker
|
108 | */
|
109 | export declare class TimePicker extends React.Component<TimePickerProps, ITimePickerState> {
|
110 | static defaultProps: TimePickerProps;
|
111 | static displayName: string;
|
112 | constructor(props?: TimePickerProps, context?: any);
|
113 | private timeInputIds;
|
114 | render(): JSX.Element;
|
115 | componentDidUpdate(prevProps: TimePickerProps): void;
|
116 | private maybeRenderArrowButton;
|
117 | private renderDivider;
|
118 | private renderInput;
|
119 | private maybeRenderAmPm;
|
120 | private getInputChangeHandler;
|
121 | private getInputBlurHandler;
|
122 | private getInputFocusHandler;
|
123 | private getInputKeyDownHandler;
|
124 | private getInputKeyUpHandler;
|
125 | private handleAmPmChange;
|
126 | /**
|
127 | * Generates a full ITimePickerState object with all text fields set to formatted strings based on value
|
128 | */
|
129 | private getFullStateFromValue;
|
130 | private incrementTime;
|
131 | private decrementTime;
|
132 | private shiftTime;
|
133 | private updateTime;
|
134 | private updateState;
|
135 | private getInitialValue;
|
136 | }
|