@atlaskit/datetime-picker 12.0.0 → 12.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/datetime-picker",
-  "version": "12.0.0",
+  "version": "12.1.2",
   "description": "A date time picker allows the user to select an associated date and time.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -13,7 +13,7 @@
   "module:es2019": "dist/es2019/index.js",
   "types": "dist/types/index.d.ts",
   "sideEffects": false,
-  "atlaskit:src": "src/index.ts",
+  "atlaskit:src": "src/index.tsx",
   "atlassian": {
     "team": "Design System Team",
     "deprecatedAutoEntryPoints": true,
@@ -25,11 +25,12 @@
   },
   "dependencies": {
     "@atlaskit/analytics-next": "^8.2.0",
-    "@atlaskit/calendar": "^12.2.0",
+    "@atlaskit/calendar": "^12.3.0",
+    "@atlaskit/ds-lib": "^2.1.0",
     "@atlaskit/icon": "^21.10.0",
     "@atlaskit/locale": "^2.1.0",
     "@atlaskit/popper": "^5.2.0",
-    "@atlaskit/select": "^15.3.0",
+    "@atlaskit/select": "^15.5.0",
     "@atlaskit/theme": "^12.1.0",
     "@atlaskit/tokens": "^0.10.0",
     "@babel/runtime": "^7.0.0",
@@ -47,6 +48,7 @@
     "@atlaskit/field-base": "^15.0.5",
     "@atlaskit/form": "^8.5.0",
     "@atlaskit/modal-dialog": "^12.2.0",
+    "@atlaskit/popup": "^1.4.0",
     "@atlaskit/range": "^6.0.0",
     "@atlaskit/section-message": "^6.0.0",
     "@atlaskit/ssr": "*",
@@ -71,6 +73,7 @@
     },
     "@repo/internal": {
       "dom-events": "use-bind-event-listener",
+      "design-system": "v1",
       "styling": [
         "static",
         "emotion"

package/report.api.md

@@ -0,0 +1,636 @@
+## API Report File for "@atlaskit/datetime-picker"
+
+> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+
+```ts
+import { ComponentType } from 'react';
+import { FocusEvent as FocusEvent_2 } from 'react';
+import { ForwardRefExoticComponent } from 'react';
+import { IndicatorComponentType } from '@atlaskit/select';
+import { IndicatorProps } from '@atlaskit/select';
+import { OptionType } from '@atlaskit/select';
+import { default as React_2 } from 'react';
+import { RefAttributes } from 'react';
+import { SelectProps as SelectProps_2 } from '@atlaskit/select';
+import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+import { WithContextProps } from '@atlaskit/analytics-next';
+
+export declare type Appearance = 'default' | 'subtle';
+
+export declare const DatePicker: ForwardRefExoticComponent<
+  Pick<
+    Pick<
+      Omit<DatePickerProps_2, keyof WithAnalyticsEventsProps>,
+      | 'testId'
+      | 'maxDate'
+      | 'minDate'
+      | 'isOpen'
+      | 'nextMonthLabel'
+      | 'parseInputValue'
+      | 'formatDisplayLabel'
+      | 'previousMonthLabel'
+      | 'value'
+      | 'dateFormat'
+      | 'placeholder'
+      | 'weekStartDay'
+    > &
+      Partial<
+        Pick<
+          Omit<DatePickerProps_2, keyof WithAnalyticsEventsProps>,
+          | 'icon'
+          | 'disabled'
+          | 'appearance'
+          | 'selectProps'
+          | 'innerProps'
+          | 'autoFocus'
+          | 'defaultIsOpen'
+          | 'defaultValue'
+          | 'disabledDateFilter'
+          | 'hideIcon'
+          | 'id'
+          | 'isDisabled'
+          | 'isInvalid'
+          | 'name'
+          | 'onBlur'
+          | 'onChange'
+          | 'onFocus'
+          | 'spacing'
+          | 'locale'
+        >
+      > &
+      Partial<
+        Pick<
+          {
+            appearance: Appearance;
+            autoFocus: boolean;
+            defaultIsOpen: boolean;
+            defaultValue: string;
+            disabled: string[];
+            disabledDateFilter: (_: string) => boolean;
+            hideIcon: boolean;
+            icon: ComponentType<IndicatorProps<OptionType, false>>;
+            id: string;
+            innerProps: {};
+            isDisabled: boolean;
+            isInvalid: boolean;
+            name: string;
+            onBlur: (event: FocusEvent_2<HTMLInputElement>) => void;
+            onChange: (value: string) => void;
+            onFocus: (event: FocusEvent_2<HTMLInputElement>) => void;
+            selectProps: {};
+            spacing: Spacing;
+            locale: string;
+          },
+          never
+        >
+      > &
+      RefAttributes<any> &
+      WithContextProps,
+    | 'testId'
+    | 'icon'
+    | 'disabled'
+    | 'appearance'
+    | 'selectProps'
+    | 'innerProps'
+    | 'autoFocus'
+    | 'defaultIsOpen'
+    | 'defaultValue'
+    | 'disabledDateFilter'
+    | 'hideIcon'
+    | 'id'
+    | 'isDisabled'
+    | 'isInvalid'
+    | 'name'
+    | 'onBlur'
+    | 'onChange'
+    | 'onFocus'
+    | 'spacing'
+    | 'locale'
+    | 'maxDate'
+    | 'minDate'
+    | 'isOpen'
+    | 'nextMonthLabel'
+    | 'parseInputValue'
+    | 'formatDisplayLabel'
+    | 'previousMonthLabel'
+    | 'value'
+    | 'dateFormat'
+    | 'placeholder'
+    | 'weekStartDay'
+    | 'key'
+    | 'analyticsContext'
+  > &
+    RefAttributes<any>
+>;
+
+declare const datePickerDefaultProps: {
+  appearance: Appearance;
+  autoFocus: boolean;
+  defaultIsOpen: boolean;
+  defaultValue: string;
+  disabled: string[];
+  disabledDateFilter: (_: string) => boolean;
+  hideIcon: boolean;
+  icon: ComponentType<IndicatorProps<OptionType, false>>;
+  id: string;
+  innerProps: {};
+  isDisabled: boolean;
+  isInvalid: boolean;
+  name: string;
+  onBlur: (event: React.FocusEvent<HTMLInputElement>) => void;
+  onChange: (value: string) => void;
+  onFocus: (event: React.FocusEvent<HTMLInputElement>) => void;
+  selectProps: {};
+  spacing: Spacing;
+  locale: string;
+};
+
+export declare interface DatePickerProps extends WithAnalyticsEventsProps {
+  /**
+     Set the appearance of the picker.
+
+     `subtle` will remove the borders, background, and icon.
+
+     **NOTE:** Appearance values will be ignored if styles are parsed through `selectProps`.
+     */
+  appearance?: Appearance;
+  /** Set the picker to autofocus on mount. */
+  autoFocus?: boolean;
+  /** The default for `isOpen`. Will be `false` if not provided. */
+  defaultIsOpen?: boolean;
+  /** The default for `value`. */
+  defaultValue?: string;
+  /** An array of ISO dates that should be disabled on the calendar. This does not affect what users can type into the picker. */
+  disabled?: string[];
+  /**
+     A filter function for disabling dates on the calendar. This does not affect what users can type into the picker.
+
+     The function is called with a date string in the format `YYYY-MM-DD` and should return `true` if the date should be disabled.
+     */
+  disabledDateFilter?: (date: string) => boolean;
+  /** The latest enabled date. Dates after this are disabled on the calendar. This does not affect what users can type into the picker. */
+  maxDate?: string;
+  /** The earliest enabled date. Dates before this are disabled on the calendar. This does not affect what users can type into the picker. */
+  minDate?: string;
+  /** The icon shown in the picker. */
+  icon?: IndicatorComponentType<OptionType>;
+  /**
+     The id of the field. Currently, react-select transforms this to have a `react-select-` prefix, and an `--input` suffix when applied to the input. For example, the id `my-input` would be transformed to `react-select-my-input--input`.
+
+     Keep this in mind when needing to refer to the ID. This will be fixed in an upcoming release.
+     */
+  id?: string;
+  /** Props to apply to the container. **/
+  innerProps?: React.AllHTMLAttributes<HTMLElement>;
+  /** Set if the picker is disabled. */
+  isDisabled?: boolean;
+  /** Set if the picker is open. */
+  isOpen?: boolean;
+  /** The name of the field. */
+  name?: string;
+  /** The aria-label attribute associated with the next-month arrow. */
+  nextMonthLabel?: string;
+  /** Called when the field is blurred. */
+  onBlur?: React.FocusEventHandler<HTMLInputElement>;
+  /** Called when the value changes. The only argument is an ISO time or empty string. */
+  onChange?: (value: string) => void;
+  /** Called when the field is focused. */
+  onFocus?: React.FocusEventHandler<HTMLInputElement>;
+  /** A function for parsing input characters and transforming them into a Date object. By default parses the date string based off the locale. */
+  parseInputValue?: (date: string, dateFormat: string) => Date;
+  /** A function for formatting the date displayed in the input. By default composes together [date-fn's parse method](https://date-fns.org/v1.29.0/docs/parse) and [date-fn's format method](https://date-fns.org/v1.29.0/docs/format) to return a correctly formatted date string. */
+  formatDisplayLabel?: (value: string, dateFormat: string) => string;
+  /** The aria-label attribute associated with the previous-month arrow. */
+  previousMonthLabel?: string;
+  /** Props to apply to the select. This can be used to set options such as placeholder text.
+   *  See [the `Select` documentation for further information](/components/select). */
+  selectProps?: SelectProps;
+  /**
+     The spacing for the select control.
+
+     Compact is `gridSize() * 4`, default is `gridSize * 5`.
+     */
+  spacing?: Spacing;
+  /** The ISO time used as the input value. */
+  value?: string;
+  /** Set if the picker has an invalid value. */
+  isInvalid?: boolean;
+  /** Hides icon for dropdown indicator. */
+  hideIcon?: boolean;
+  /** Format the date with a string that is accepted by [date-fn's format function](https://date-fns.org/v1.29.0/docs/format). */
+  dateFormat?: string;
+  /** Placeholder text displayed in input */
+  placeholder?: string;
+  /** Locale used to format the date and calendar. See [DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat). */
+  locale?: string;
+  /**
+   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests
+   *  - `{testId}--container` wrapping element of date-picker
+   *  - `{testId}--calendar--container` nested calendar component
+   **/
+  testId?: string;
+  /**
+   * Start day of the week for the calendar.
+   * - `0` sunday (default value)
+   * - `1` monday
+   * - `2` tuesday
+   * - `3` wednesday
+   * - `4` thursday
+   * - `5` friday
+   * - `6` saturday
+   */
+  weekStartDay?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+}
+
+declare type DatePickerProps_2 = typeof datePickerDefaultProps &
+  DatePickerProps;
+
+export declare const DateTimePicker: React_2.ForwardRefExoticComponent<
+  Pick<
+    Pick<
+      Omit<DateTimePickerProps_2, keyof WithAnalyticsEventsProps>,
+      | 'testId'
+      | 'hideIcon'
+      | 'value'
+      | 'dateFormat'
+      | 'timeFormat'
+      | 'parseValue'
+    > &
+      Partial<
+        Pick<
+          Omit<DateTimePickerProps_2, keyof WithAnalyticsEventsProps>,
+          | 'appearance'
+          | 'innerProps'
+          | 'autoFocus'
+          | 'defaultValue'
+          | 'id'
+          | 'isDisabled'
+          | 'isInvalid'
+          | 'name'
+          | 'onBlur'
+          | 'onChange'
+          | 'onFocus'
+          | 'spacing'
+          | 'locale'
+          | 'times'
+          | 'timeIsEditable'
+          | 'datePickerProps'
+          | 'timePickerProps'
+          | 'datePickerSelectProps'
+          | 'timePickerSelectProps'
+        >
+      > &
+      Partial<
+        Pick<
+          {
+            appearance: string;
+            autoFocus: boolean;
+            isDisabled: boolean;
+            name: string;
+            onBlur: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+            onChange: (value: string) => void;
+            onFocus: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+            innerProps: {};
+            id: string;
+            defaultValue: string;
+            timeIsEditable: boolean;
+            isInvalid: boolean;
+            datePickerProps: {};
+            timePickerProps: {};
+            datePickerSelectProps: {};
+            timePickerSelectProps: {};
+            times: string[];
+            spacing: string;
+            locale: string;
+          },
+          never
+        >
+      > &
+      React_2.RefAttributes<any> &
+      WithContextProps,
+    | 'testId'
+    | 'appearance'
+    | 'innerProps'
+    | 'autoFocus'
+    | 'defaultValue'
+    | 'hideIcon'
+    | 'id'
+    | 'isDisabled'
+    | 'isInvalid'
+    | 'name'
+    | 'onBlur'
+    | 'onChange'
+    | 'onFocus'
+    | 'spacing'
+    | 'locale'
+    | 'value'
+    | 'dateFormat'
+    | 'key'
+    | 'analyticsContext'
+    | 'times'
+    | 'timeIsEditable'
+    | 'timeFormat'
+    | 'datePickerProps'
+    | 'timePickerProps'
+    | 'datePickerSelectProps'
+    | 'timePickerSelectProps'
+    | 'parseValue'
+  > &
+    React_2.RefAttributes<any>
+>;
+
+declare const dateTimePickerDefaultProps: {
+  appearance: string;
+  autoFocus: boolean;
+  isDisabled: boolean;
+  name: string;
+  onBlur: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+  onChange: (value: string) => void;
+  onFocus: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+  innerProps: {};
+  id: string;
+  defaultValue: string;
+  timeIsEditable: boolean;
+  isInvalid: boolean;
+  datePickerProps: {};
+  timePickerProps: {};
+  datePickerSelectProps: {};
+  timePickerSelectProps: {};
+  times: string[];
+  spacing: string;
+  locale: string;
+};
+
+export declare interface DateTimePickerProps extends WithAnalyticsEventsProps {
+  /**
+   * Set the appearance of the picker.
+   *
+   * `subtle` will remove the borders and background.
+   */
+  appearance?: Appearance;
+  /** Set the picker to autofocus on mount. */
+  autoFocus?: boolean;
+  /** The default for `value`. */
+  defaultValue?: string;
+  /**
+   * The id of the field. Currently, react-select transforms this to have a `react-select-` prefix, and an `--input` suffix when applied to the input. For example, the id `my-input` would be transformed to `react-select-my-input--input`.
+   * Keep this in mind when needing to refer to the ID. This will be fixed in an upcoming release.
+   */
+  id?: string;
+  /** Props to apply to the container. **/
+  innerProps?: React_2.AllHTMLAttributes<HTMLElement>;
+  /** Set if the field is disabled. */
+  isDisabled?: boolean;
+  /** The name of the field. */
+  name?: string;
+  /** Called when the field is blurred. */
+  onBlur?: React_2.FocusEventHandler<HTMLInputElement>;
+  /** Called when the value changes and the date / time is a complete value, or empty. The only value is an ISO string or empty string. */
+  onChange?: (value: string) => void;
+  /** Called when the field is focused. */
+  onFocus?: React_2.FocusEventHandler<HTMLInputElement>;
+  /** The ISO time that should be used as the input value. */
+  value?: string;
+  /** Set if users can edit the input, allowing them to add custom times. */
+  timeIsEditable?: boolean;
+  /** Set if the picker has an invalid value. */
+  isInvalid?: boolean;
+  /** DEPRECATED - This is here only for backwards compatibility and doesn't do anything. It will be removed in the next MAJOR. */
+  hideIcon?: boolean;
+  /** Format the date with a string that is accepted by [date-fns's format function](https://date-fns.org/v1.29.0/docs/format). */
+  dateFormat?: string;
+  /** Props applied to the `DatePicker`. */
+  datePickerProps?: DatePickerProps;
+  /** Props applied to the `TimePicker`. */
+  timePickerProps?: TimePickerProps;
+  /** Function used to parse datetime values into their date, time and timezone sub-values. **/
+  parseValue?: (
+    dateTimeValue: string,
+    date: string,
+    time: string,
+    timezone: string,
+  ) => {
+    dateValue: string;
+    timeValue: string;
+    zoneValue: string;
+  };
+  /** [Select props](/components/select) to pass onto the `DatePicker` component's `Select`. This can be used to set options such as placeholder text. */
+  datePickerSelectProps?: SelectProps_2<any>;
+  /** [Select props](/components/select) to pass onto the `TimePicker` component's `Select`. This can be used to set options such as placeholder text. */
+  timePickerSelectProps?: SelectProps_2<any>;
+  /** The times shown by the `TimePicker`. */
+  times?: Array<string>;
+  /** The format that times are displayed in. Values should be those accepted by [date-fns's format function](https://date-fns.org/v1.29.0/docs/format). */
+  timeFormat?: string;
+  /**
+   * The spacing for the select control.
+   *
+   * Compact is `gridSize() * 4`, default is `gridSize() * 5`.
+   */
+  spacing?: Spacing;
+  /** Locale used for formatting dates and times. See [DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat). */
+  locale?: string;
+  /**
+   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests
+   *  - `{testId}--datepicker--container` wrapping element of date-picker
+   *  - `{testId}--timepicker--container` wrapping element of time-picker
+   **/
+  testId?: string;
+}
+
+declare type DateTimePickerProps_2 = typeof dateTimePickerDefaultProps &
+  DateTimePickerProps;
+
+declare type SelectProps = any;
+
+export declare type Spacing = 'compact' | 'default';
+
+export declare const TimePicker: React_2.ForwardRefExoticComponent<
+  Pick<
+    Pick<
+      Omit<TimePickerProps_2, keyof WithAnalyticsEventsProps>,
+      | 'testId'
+      | 'isOpen'
+      | 'formatDisplayLabel'
+      | 'value'
+      | 'placeholder'
+      | 'timeFormat'
+    > &
+      Partial<
+        Pick<
+          Omit<TimePickerProps_2, keyof WithAnalyticsEventsProps>,
+          | 'appearance'
+          | 'selectProps'
+          | 'innerProps'
+          | 'autoFocus'
+          | 'defaultIsOpen'
+          | 'defaultValue'
+          | 'hideIcon'
+          | 'id'
+          | 'isDisabled'
+          | 'isInvalid'
+          | 'name'
+          | 'onBlur'
+          | 'onChange'
+          | 'onFocus'
+          | 'spacing'
+          | 'locale'
+          | 'parseInputValue'
+          | 'times'
+          | 'timeIsEditable'
+        >
+      > &
+      Partial<
+        Pick<
+          {
+            appearance: Appearance;
+            autoFocus: boolean;
+            defaultIsOpen: boolean;
+            defaultValue: string;
+            hideIcon: boolean;
+            id: string;
+            innerProps: {};
+            isDisabled: boolean;
+            isInvalid: boolean;
+            name: string;
+            onBlur: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+            onChange: (value: string) => void;
+            onFocus: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+            parseInputValue: (
+              time: string,
+              timeFormat: string,
+            ) => string | Date;
+            selectProps: {};
+            spacing: Spacing;
+            times: string[];
+            timeIsEditable: boolean;
+            locale: string;
+          },
+          never
+        >
+      > &
+      React_2.RefAttributes<any> &
+      WithContextProps,
+    | 'testId'
+    | 'appearance'
+    | 'selectProps'
+    | 'innerProps'
+    | 'autoFocus'
+    | 'defaultIsOpen'
+    | 'defaultValue'
+    | 'hideIcon'
+    | 'id'
+    | 'isDisabled'
+    | 'isInvalid'
+    | 'name'
+    | 'onBlur'
+    | 'onChange'
+    | 'onFocus'
+    | 'spacing'
+    | 'locale'
+    | 'isOpen'
+    | 'parseInputValue'
+    | 'formatDisplayLabel'
+    | 'value'
+    | 'placeholder'
+    | 'key'
+    | 'analyticsContext'
+    | 'times'
+    | 'timeIsEditable'
+    | 'timeFormat'
+  > &
+    React_2.RefAttributes<any>
+>;
+
+declare const timePickerDefaultProps: {
+  appearance: Appearance;
+  autoFocus: boolean;
+  defaultIsOpen: boolean;
+  defaultValue: string;
+  hideIcon: boolean;
+  id: string;
+  innerProps: {};
+  isDisabled: boolean;
+  isInvalid: boolean;
+  name: string;
+  onBlur: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+  onChange: (value: string) => void;
+  onFocus: (event: React_2.FocusEvent<HTMLInputElement>) => void;
+  parseInputValue: (time: string, timeFormat: string) => string | Date;
+  selectProps: {};
+  spacing: Spacing;
+  times: string[];
+  timeIsEditable: boolean;
+  locale: string;
+};
+
+export declare interface TimePickerProps extends WithAnalyticsEventsProps {
+  /**
+     Set the appearance of the picker.
+
+     `subtle` will remove the borders, background, and icon.
+
+     **NOTE:** Appearance values will be ignored if styles are parsed through `selectProps`.
+     */
+  appearance?: Appearance;
+  /** Set the picker to autofocus on mount. */
+  autoFocus?: boolean;
+  /** The default for `isOpen`. */
+  defaultIsOpen?: boolean;
+  /** The default for `value`. */
+  defaultValue?: string;
+  /** DEPRECATED - Use locale instead. Function for formatting the displayed time value in the input. By default parses with an internal time parser, and formats using the [date-fns format function]((https://date-fns.org/v1.29.0/docs/format)). */
+  formatDisplayLabel?: (time: string, timeFormat: string) => string;
+  /** The id of the field. Currently, react-select transforms this to have a `react-select-` prefix, and an `--input` suffix when applied to the input. For example, the id `my-input` would be transformed to `react-select-my-input--input`. Keep this in mind when needing to refer to the ID. This will be fixed in an upcoming release. */
+  id?: string;
+  /** Props to apply to the container. **/
+  innerProps?: React_2.AllHTMLAttributes<HTMLElement>;
+  /** Set if the field is disabled. */
+  isDisabled?: boolean;
+  /** Set if the dropdown is open. Will be `false` if not provided. */
+  isOpen?: boolean;
+  /** The name of the field. */
+  name?: string;
+  /** Called when the field is blurred. */
+  onBlur?: React_2.FocusEventHandler<HTMLElement>;
+  /** Called when the value changes. The only argument is an ISO time or empty string. */
+  onChange?: (value: string) => void;
+  /** Called when the field is focused. */
+  onFocus?: React_2.FocusEventHandler<HTMLElement>;
+  parseInputValue?: (time: string, timeFormat: string) => string | Date;
+  /** Props to apply to the select. */
+  selectProps?: SelectProps_2<any>;
+  /**
+     The spacing for the select control.
+
+     Compact is `gridSize() * 4`, default is `gridSize * 5`.
+     */
+  spacing?: Spacing;
+  /** The times shown in the dropdown. */
+  times?: string[];
+  /** Set if users can edit the input, allowing them to add custom times. */
+  timeIsEditable?: boolean;
+  /** The ISO time that should be used as the input value. */
+  value?: string;
+  /** Set if the picker has an invalid value. */
+  isInvalid?: boolean;
+  /** Hides icon for dropdown indicator. */
+  hideIcon?: boolean;
+  /** Time format that is accepted by [date-fns's format function](https://date-fns.org/v1.29.0/docs/format). */
+  timeFormat?: string;
+  /** Placeholder text displayed in input. */
+  placeholder?: string;
+  /** Locale used to format the time. See [DateTimeFormat](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DateTimeFormat). */
+  locale?: string;
+  /**
+   * A `testId` prop is provided for specified elements, which is a unique string that appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests:
+   *  - `{testId}--container` wrapping element of time-picker
+   **/
+  testId?: string;
+}
+
+declare type TimePickerProps_2 = typeof timePickerDefaultProps &
+  TimePickerProps;
+
+export {};
+```