@wordpress/components 28.2.0 → 28.3.0

package/build-module/custom-select-control-v2/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/components/src/custom-select-control-v2/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type * as Ariakit from '@ariakit/react';\nimport type { FocusEventHandler, MouseEventHandler } from 'react';\n\nexport type CustomSelectStore = {\n\t/**\n\t * The store object returned by Ariakit's `useSelectStore` hook.\n\t */\n\tstore: Ariakit.SelectStore;\n};\n\nexport type CustomSelectContext = CustomSelectStore | undefined;\n\ntype CustomSelectSize< Size = 'compact' | 'default' > = {\n\t/**\n\t * The size of the control.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: Size;\n};\n\nexport type CustomSelectButtonSize = CustomSelectSize<\n\t'compact' | 'default' | 'small'\n>;\n\nexport type CustomSelectButtonProps = {\n\t/**\n\t * An optional default value for the control when used in uncontrolled mode.\n\t * If left `undefined`, the first non-disabled item will be used.\n\t */\n\tdefaultValue?: string | string[];\n\t/**\n\t * A function that receives the new value of the input.\n\t */\n\tonChange?: ( newValue: string | string[] ) => void;\n\t/**\n\t * Can be used to render select UI with custom styled values.\n\t */\n\trenderSelectedValue?: (\n\t\tselectedValue: string | string[]\n\t) => React.ReactNode;\n\t/**\n\t * The value of the control when used in uncontrolled mode.\n\t */\n\tvalue?: string | string[];\n};\n\nexport type _CustomSelectProps = CustomSelectButtonProps & {\n\t/**\n\t * The child elements. This should be composed of `CustomSelectItem` components.\n\t */\n\tchildren: React.ReactNode;\n\t/**\n\t * Used to visually hide the label. It will always be visible to screen readers.\n\t *\n\t * @default false\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * Accessible label for the control.\n\t */\n\tlabel: string;\n};\n\nexport type CustomSelectProps = _CustomSelectProps &\n\tCustomSelectButtonProps &\n\tCustomSelectSize;\n\n/**\n * The legacy object structure for the options array.\n */\ntype LegacyOption = {\n\tkey: string;\n\tname: string;\n\tstyle?: React.CSSProperties;\n\tclassName?: string;\n\t__experimentalHint?: string;\n\t[ key: string ]: any;\n};\n\n/**\n * The legacy object returned from the onChange event.\n */\ntype LegacyOnChangeObject = {\n\thighlightedIndex?: number;\n\tinputValue?: string;\n\tisOpen?: boolean;\n\ttype?: string;\n\tselectedItem: LegacyOption;\n};\n\nexport type LegacyCustomSelectProps = {\n\t/**\n\t * Optional classname for the component.\n\t */\n\tclassName?: string;\n\t/**\n\t * Used to visually hide the label. It will always be visible to screen readers.\n\t *\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * Pass in a description that will be shown to screen readers associated with the\n\t * select trigger button. If no value is passed, the text \"Currently selected:\n\t * selectedItem.name\" will be used fully translated.\n\t */\n\tdescribedBy?: string;\n\t/**\n\t * Label for the control.\n\t */\n\tlabel: string;\n\t/**\n\t * Function called with the control's internal state changes. The `selectedItem`\n\t * property contains the next selected item.\n\t */\n\tonChange?: ( newValue: LegacyOnChangeObject ) => void;\n\t/**\n\t * A handler for `onBlur` events.\n\t *\n\t * @ignore\n\t */\n\tonBlur?: FocusEventHandler< HTMLButtonElement >;\n\t/**\n\t * A handler for `onFocus` events.\n\t *\n\t * @ignore\n\t */\n\tonFocus?: FocusEventHandler< HTMLButtonElement >;\n\t/**\n\t * A handler for `onMouseOver` events.\n\t *\n\t * @ignore\n\t */\n\tonMouseOut?: MouseEventHandler< HTMLButtonElement >;\n\t/**\n\t * A handler for `onMouseOut` events.\n\t *\n\t * @ignore\n\t */\n\tonMouseOver?: MouseEventHandler< HTMLButtonElement >;\n\t/**\n\t * The options that can be chosen from.\n\t */\n\toptions: Array< LegacyOption >;\n\t/**\n\t * The size of the control.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'small' | '__unstable-large';\n\t/**\n\t * Can be used to externally control the value of the control.\n\t */\n\tvalue?: LegacyOption;\n\t/**\n\t * Legacy way to add additional text to the right of each option.\n\t *\n\t * @default false\n\t */\n\t__experimentalShowSelectedHint?: boolean;\n\t/**\n\t * Opt-in prop for an unconstrained width style which became the default in\n\t * WordPress 6.5. The prop is no longer needed and can be safely removed.\n\t *\n\t * @deprecated\n\t * @ignore\n\t */\n\t__nextUnconstrainedWidth?: boolean;\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n};\n\nexport type CustomSelectItemProps = {\n\t/**\n\t * The value of the select item. This will be used as the children if\n\t * children are left `undefined`.\n\t */\n\tvalue: string;\n\t/**\n\t * The children to display for each select item. The `value` will be\n\t * used if left `undefined`.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * If true, the item will be disabled.\n\t *\n\t * You will need to add your own styles (e.g. reduced opacity) to visually show that they are disabled.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/components/src/custom-select-control-v2/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type * as Ariakit from '@ariakit/react';\nimport type { FocusEventHandler, MouseEventHandler } from 'react';\n\nexport type CustomSelectStore = {\n\t/**\n\t * The store object returned by Ariakit's `useSelectStore` hook.\n\t */\n\tstore: Ariakit.SelectStore;\n};\n\ntype CustomSelectSize< Size = 'compact' | 'default' > = {\n\t/**\n\t * The size of the control.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: Size;\n};\n\nexport type CustomSelectButtonSize = CustomSelectSize<\n\t'compact' | 'default' | 'small'\n>;\n\nexport type CustomSelectContext =\n\t| ( CustomSelectStore & CustomSelectButtonSize )\n\t| undefined;\n\nexport type CustomSelectButtonProps = {\n\t/**\n\t * An optional default value for the control when used in uncontrolled mode.\n\t * If left `undefined`, the first non-disabled item will be used.\n\t */\n\tdefaultValue?: string | string[];\n\t/**\n\t * A function that receives the new value of the input.\n\t */\n\tonChange?: ( newValue: string | string[] ) => void;\n\t/**\n\t * Can be used to render select UI with custom styled values.\n\t */\n\trenderSelectedValue?: (\n\t\tselectedValue: string | string[]\n\t) => React.ReactNode;\n\t/**\n\t * The value of the control when used in uncontrolled mode.\n\t */\n\tvalue?: string | string[];\n};\n\n// Props only exposed on the internal implementation\nexport type _CustomSelectInternalProps = {\n\t/**\n\t * True if the consumer is emulating the legacy component behavior and look\n\t */\n\tisLegacy?: boolean;\n};\n\n// Props that are exposed in exported components\nexport type _CustomSelectProps = CustomSelectButtonProps & {\n\t/**\n\t * Additional className added to the root wrapper element.\n\t */\n\tclassName?: string;\n\t/**\n\t * The child elements. This should be composed of `CustomSelectItem` components.\n\t */\n\tchildren: React.ReactNode;\n\t/**\n\t * Used to visually hide the label. It will always be visible to screen readers.\n\t *\n\t * @default false\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * Accessible label for the control.\n\t */\n\tlabel: string;\n};\n\nexport type CustomSelectProps = _CustomSelectProps & CustomSelectSize;\n\n/**\n * The legacy object structure for the options array.\n */\ntype LegacyOption = {\n\tkey: string;\n\tname: string;\n\tstyle?: React.CSSProperties;\n\tclassName?: string;\n\t__experimentalHint?: string;\n\t[ key: string ]: any;\n};\n\n/**\n * The legacy object returned from the onChange event.\n */\ntype LegacyOnChangeObject = {\n\thighlightedIndex?: number;\n\tinputValue?: string;\n\tisOpen?: boolean;\n\ttype?: string;\n\tselectedItem: LegacyOption;\n};\n\nexport type LegacyCustomSelectProps = {\n\t/**\n\t * Optional classname for the component.\n\t */\n\tclassName?: string;\n\t/**\n\t * Used to visually hide the label. It will always be visible to screen readers.\n\t *\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * Pass in a description that will be shown to screen readers associated with the\n\t * select trigger button. If no value is passed, the text \"Currently selected:\n\t * selectedItem.name\" will be used fully translated.\n\t */\n\tdescribedBy?: string;\n\t/**\n\t * Label for the control.\n\t */\n\tlabel: string;\n\t/**\n\t * Function called with the control's internal state changes. The `selectedItem`\n\t * property contains the next selected item.\n\t */\n\tonChange?: ( newValue: LegacyOnChangeObject ) => void;\n\t/**\n\t * A handler for `onBlur` events.\n\t *\n\t * @ignore\n\t */\n\tonBlur?: FocusEventHandler< HTMLButtonElement >;\n\t/**\n\t * A handler for `onFocus` events.\n\t *\n\t * @ignore\n\t */\n\tonFocus?: FocusEventHandler< HTMLButtonElement >;\n\t/**\n\t * A handler for `onMouseOver` events.\n\t *\n\t * @ignore\n\t */\n\tonMouseOut?: MouseEventHandler< HTMLButtonElement >;\n\t/**\n\t * A handler for `onMouseOut` events.\n\t *\n\t * @ignore\n\t */\n\tonMouseOver?: MouseEventHandler< HTMLButtonElement >;\n\t/**\n\t * The options that can be chosen from.\n\t */\n\toptions: Array< LegacyOption >;\n\t/**\n\t * The size of the control.\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'small' | '__unstable-large';\n\t/**\n\t * Can be used to externally control the value of the control.\n\t */\n\tvalue?: LegacyOption;\n\t/**\n\t * Legacy way to add additional text to the right of each option.\n\t *\n\t * @default false\n\t */\n\t__experimentalShowSelectedHint?: boolean;\n\t/**\n\t * Opt-in prop for an unconstrained width style which became the default in\n\t * WordPress 6.5. The prop is no longer needed and can be safely removed.\n\t *\n\t * @deprecated\n\t * @ignore\n\t */\n\t__nextUnconstrainedWidth?: boolean;\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n};\n\nexport type CustomSelectItemProps = {\n\t/**\n\t * The value of the select item. This will be used as the children if\n\t * children are left `undefined`.\n\t */\n\tvalue: string;\n\t/**\n\t * The children to display for each select item. The `value` will be\n\t * used if left `undefined`.\n\t */\n\tchildren?: React.ReactNode;\n\t/**\n\t * If true, the item will be disabled.\n\t *\n\t * You will need to add your own styles (e.g. reduced opacity) to visually show that they are disabled.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n"],"mappings":"","ignoreList":[]}

package/build-module/date-time/date-time/index.js

@@ -6,6 +6,7 @@
  * WordPress dependencies
  */
 import { forwardRef } from '@wordpress/element';
+
 /**
  * Internal dependencies
  */
@@ -20,6 +21,7 @@ const noop = () => {};
 function UnforwardedDateTimePicker({
   currentDate,
   is12Hour,
+  dateOrder,
   isInvalidDate,
   onMonthPreviewed = noop,
   onChange,
@@ -34,7 +36,8 @@ function UnforwardedDateTimePicker({
       children: [/*#__PURE__*/_jsx(TimePicker, {
         currentTime: currentDate,
         onChange: onChange,
-        is12Hour: is12Hour
+        is12Hour: is12Hour,
+        dateOrder: dateOrder
       }), /*#__PURE__*/_jsx(DatePicker, {
         currentDate: currentDate,
         onChange: onChange,

package/build-module/date-time/date-time/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["forwardRef","default","DatePicker","TimePicker","Wrapper","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","noop","UnforwardedDateTimePicker","currentDate","is12Hour","isInvalidDate","onMonthPreviewed","onChange","events","startOfWeek","ref","className","spacing","children","currentTime","DateTimePicker"],"sources":["@wordpress/components/src/date-time/date-time/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { __, _x } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { default as DatePicker } from '../date';\nimport { default as TimePicker } from '../time';\nimport type { DateTimePickerProps } from '../types';\nimport { Wrapper } from './styles';\n\nexport { DatePicker, TimePicker };\n\nconst noop = () => {};\n\nfunction UnforwardedDateTimePicker(\n\t{\n\t\tcurrentDate,\n\t\tis12Hour,\n\t\tisInvalidDate,\n\t\tonMonthPreviewed = noop,\n\t\tonChange,\n\t\tevents,\n\t\tstartOfWeek,\n\t}: DateTimePickerProps,\n\tref: ForwardedRef< any >\n) {\n\treturn (\n\t\t<Wrapper ref={ ref } className=\"components-datetime\" spacing={ 4 }>\n\t\t\t<>\n\t\t\t\t<TimePicker\n\t\t\t\t\tcurrentTime={ currentDate }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tis12Hour={ is12Hour }\n\t\t\t\t/>\n\t\t\t\t<DatePicker\n\t\t\t\t\tcurrentDate={ currentDate }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tisInvalidDate={ isInvalidDate }\n\t\t\t\t\tevents={ events }\n\t\t\t\t\tonMonthPreviewed={ onMonthPreviewed }\n\t\t\t\t\tstartOfWeek={ startOfWeek }\n\t\t\t\t/>\n\t\t\t</>\n\t\t</Wrapper>\n\t);\n}\n\n/**\n * DateTimePicker is a React component that renders a calendar and clock for\n * date and time selection. The calendar and clock components can be accessed\n * individually using the `DatePicker` and `TimePicker` components respectively.\n *\n * ```jsx\n * import { DateTimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDateTimePicker = () => {\n *   const [ date, setDate ] = useState( new Date() );\n *\n *   return (\n *     <DateTimePicker\n *       currentDate={ date }\n *       onChange={ ( newDate ) => setDate( newDate ) }\n *       is12Hour\n *     />\n *   );\n * };\n * ```\n */\nexport const DateTimePicker = forwardRef( UnforwardedDateTimePicker );\n\nexport default DateTimePicker;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;AAG/C;AACA;AACA;AACA,SAASC,OAAO,IAAIC,UAAU,QAAQ,SAAS;AAC/C,SAASD,OAAO,IAAIE,UAAU,QAAQ,SAAS;AAE/C,SAASC,OAAO,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEnC,SAASR,UAAU,EAAEC,UAAU;AAE/B,MAAMQ,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,yBAAyBA,CACjC;EACCC,WAAW;EACXC,QAAQ;EACRC,aAAa;EACbC,gBAAgB,GAAGL,IAAI;EACvBM,QAAQ;EACRC,MAAM;EACNC;AACoB,CAAC,EACtBC,GAAwB,EACvB;EACD,oBACCd,IAAA,CAACF,OAAO;IAACgB,GAAG,EAAGA,GAAK;IAACC,SAAS,EAAC,qBAAqB;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,eACjEb,KAAA,CAAAF,SAAA;MAAAe,QAAA,gBACCjB,IAAA,CAACH,UAAU;QACVqB,WAAW,EAAGX,WAAa;QAC3BI,QAAQ,EAAGA,QAAU;QACrBH,QAAQ,EAAGA;MAAU,CACrB,CAAC,eACFR,IAAA,CAACJ,UAAU;QACVW,WAAW,EAAGA,WAAa;QAC3BI,QAAQ,EAAGA,QAAU;QACrBF,aAAa,EAAGA,aAAe;QAC/BG,MAAM,EAAGA,MAAQ;QACjBF,gBAAgB,EAAGA,gBAAkB;QACrCG,WAAW,EAAGA;MAAa,CAC3B,CAAC;IAAA,CACD;EAAC,CACK,CAAC;AAEZ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,cAAc,GAAGzB,UAAU,CAAEY,yBAA0B,CAAC;AAErE,eAAea,cAAc","ignoreList":[]}
+{"version":3,"names":["forwardRef","default","DatePicker","TimePicker","Wrapper","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","noop","UnforwardedDateTimePicker","currentDate","is12Hour","dateOrder","isInvalidDate","onMonthPreviewed","onChange","events","startOfWeek","ref","className","spacing","children","currentTime","DateTimePicker"],"sources":["@wordpress/components/src/date-time/date-time/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { default as DatePicker } from '../date';\nimport { default as TimePicker } from '../time';\nimport type { DateTimePickerProps } from '../types';\nimport { Wrapper } from './styles';\n\nexport { DatePicker, TimePicker };\n\nconst noop = () => {};\n\nfunction UnforwardedDateTimePicker(\n\t{\n\t\tcurrentDate,\n\t\tis12Hour,\n\t\tdateOrder,\n\t\tisInvalidDate,\n\t\tonMonthPreviewed = noop,\n\t\tonChange,\n\t\tevents,\n\t\tstartOfWeek,\n\t}: DateTimePickerProps,\n\tref: ForwardedRef< any >\n) {\n\treturn (\n\t\t<Wrapper ref={ ref } className=\"components-datetime\" spacing={ 4 }>\n\t\t\t<>\n\t\t\t\t<TimePicker\n\t\t\t\t\tcurrentTime={ currentDate }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tis12Hour={ is12Hour }\n\t\t\t\t\tdateOrder={ dateOrder }\n\t\t\t\t/>\n\t\t\t\t<DatePicker\n\t\t\t\t\tcurrentDate={ currentDate }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\tisInvalidDate={ isInvalidDate }\n\t\t\t\t\tevents={ events }\n\t\t\t\t\tonMonthPreviewed={ onMonthPreviewed }\n\t\t\t\t\tstartOfWeek={ startOfWeek }\n\t\t\t\t/>\n\t\t\t</>\n\t\t</Wrapper>\n\t);\n}\n\n/**\n * DateTimePicker is a React component that renders a calendar and clock for\n * date and time selection. The calendar and clock components can be accessed\n * individually using the `DatePicker` and `TimePicker` components respectively.\n *\n * ```jsx\n * import { DateTimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDateTimePicker = () => {\n *   const [ date, setDate ] = useState( new Date() );\n *\n *   return (\n *     <DateTimePicker\n *       currentDate={ date }\n *       onChange={ ( newDate ) => setDate( newDate ) }\n *       is12Hour\n *     />\n *   );\n * };\n * ```\n */\nexport const DateTimePicker = forwardRef( UnforwardedDateTimePicker );\n\nexport default DateTimePicker;\n"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;AACA,SAASC,OAAO,IAAIC,UAAU,QAAQ,SAAS;AAC/C,SAASD,OAAO,IAAIE,UAAU,QAAQ,SAAS;AAE/C,SAASC,OAAO,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAEnC,SAASR,UAAU,EAAEC,UAAU;AAE/B,MAAMQ,IAAI,GAAGA,CAAA,KAAM,CAAC,CAAC;AAErB,SAASC,yBAAyBA,CACjC;EACCC,WAAW;EACXC,QAAQ;EACRC,SAAS;EACTC,aAAa;EACbC,gBAAgB,GAAGN,IAAI;EACvBO,QAAQ;EACRC,MAAM;EACNC;AACoB,CAAC,EACtBC,GAAwB,EACvB;EACD,oBACCf,IAAA,CAACF,OAAO;IAACiB,GAAG,EAAGA,GAAK;IAACC,SAAS,EAAC,qBAAqB;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,eACjEd,KAAA,CAAAF,SAAA;MAAAgB,QAAA,gBACClB,IAAA,CAACH,UAAU;QACVsB,WAAW,EAAGZ,WAAa;QAC3BK,QAAQ,EAAGA,QAAU;QACrBJ,QAAQ,EAAGA,QAAU;QACrBC,SAAS,EAAGA;MAAW,CACvB,CAAC,eACFT,IAAA,CAACJ,UAAU;QACVW,WAAW,EAAGA,WAAa;QAC3BK,QAAQ,EAAGA,QAAU;QACrBF,aAAa,EAAGA,aAAe;QAC/BG,MAAM,EAAGA,MAAQ;QACjBF,gBAAgB,EAAGA,gBAAkB;QACrCG,WAAW,EAAGA;MAAa,CAC3B,CAAC;IAAA,CACD;EAAC,CACK,CAAC;AAEZ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,cAAc,GAAG1B,UAAU,CAAEY,yBAA0B,CAAC;AAErE,eAAec,cAAc","ignoreList":[]}

package/build-module/date-time/index.js

@@ -3,7 +3,8 @@
  */
 import { default as DatePicker } from './date';
 import { default as TimePicker } from './time';
+import { default as TimeInput } from './time-input';
 import { default as DateTimePicker } from './date-time';
-export { DatePicker, TimePicker };
+export { DatePicker, TimePicker, TimeInput };
 export default DateTimePicker;
 //# sourceMappingURL=index.js.map

package/build-module/date-time/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["default","DatePicker","TimePicker","DateTimePicker"],"sources":["@wordpress/components/src/date-time/index.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { default as DatePicker } from './date';\nimport { default as TimePicker } from './time';\nimport { default as DateTimePicker } from './date-time';\n\nexport { DatePicker, TimePicker };\nexport default DateTimePicker;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,IAAIC,UAAU,QAAQ,QAAQ;AAC9C,SAASD,OAAO,IAAIE,UAAU,QAAQ,QAAQ;AAC9C,SAASF,OAAO,IAAIG,cAAc,QAAQ,aAAa;AAEvD,SAASF,UAAU,EAAEC,UAAU;AAC/B,eAAeC,cAAc","ignoreList":[]}
+{"version":3,"names":["default","DatePicker","TimePicker","TimeInput","DateTimePicker"],"sources":["@wordpress/components/src/date-time/index.ts"],"sourcesContent":["/**\n * Internal dependencies\n */\nimport { default as DatePicker } from './date';\nimport { default as TimePicker } from './time';\nimport { default as TimeInput } from './time-input';\nimport { default as DateTimePicker } from './date-time';\n\nexport { DatePicker, TimePicker, TimeInput };\nexport default DateTimePicker;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,OAAO,IAAIC,UAAU,QAAQ,QAAQ;AAC9C,SAASD,OAAO,IAAIE,UAAU,QAAQ,QAAQ;AAC9C,SAASF,OAAO,IAAIG,SAAS,QAAQ,cAAc;AACnD,SAASH,OAAO,IAAII,cAAc,QAAQ,aAAa;AAEvD,SAASH,UAAU,EAAEC,UAAU,EAAEC,SAAS;AAC1C,eAAeC,cAAc","ignoreList":[]}

package/build-module/date-time/time/index.js

@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { startOfMinute, format, set, setHours, setMonth } from 'date-fns';
+import { startOfMinute, format, set, setMonth } from 'date-fns';
 
 /**
  * WordPress dependencies
@@ -13,43 +13,17 @@ import { __ } from '@wordpress/i18n';
  * Internal dependencies
  */
 import BaseControl from '../../base-control';
-import Button from '../../button';
-import ButtonGroup from '../../button-group';
 import SelectControl from '../../select-control';
 import TimeZone from './timezone';
-import { Wrapper, Fieldset, HoursInput, TimeSeparator, MinutesInput, MonthSelectWrapper, DayInput, YearInput, TimeWrapper } from './styles';
+import { Wrapper, Fieldset, MonthSelectWrapper, DayInput, YearInput } from './styles';
 import { HStack } from '../../h-stack';
 import { Spacer } from '../../spacer';
-import { COMMIT, PRESS_DOWN, PRESS_UP } from '../../input-control/reducer/actions';
-import { inputToDate } from '../utils';
+import { inputToDate, buildPadInputStateReducer, validateInputElementTarget } from '../utils';
 import { TIMEZONELESS_FORMAT } from '../constants';
+import { TimeInput } from '../time-input';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-function from12hTo24h(hours, isPm) {
-  return isPm ? (hours % 12 + 12) % 24 : hours % 12;
-}
-
-/**
- * Creates an InputControl reducer used to pad an input so that it is always a
- * given width. For example, the hours and minutes inputs are padded to 2 so
- * that '4' appears as '04'.
- *
- * @param pad How many digits the value should be.
- */
-function buildPadInputStateReducer(pad) {
-  return (state, action) => {
-    const nextState = {
-      ...state
-    };
-    if (action.type === COMMIT || action.type === PRESS_UP || action.type === PRESS_DOWN) {
-      if (nextState.value !== undefined) {
-        nextState.value = nextState.value.toString().padStart(pad, '0');
-      }
-    }
-    return nextState;
-  };
-}
+const VALID_DATE_ORDERS = ['dmy', 'mdy', 'ymd'];
 
 /**
  * TimePicker is a React component that renders a clock for time selection.
@@ -74,7 +48,8 @@ function buildPadInputStateReducer(pad) {
 export function TimePicker({
   is12Hour,
   currentTime,
-  onChange
+  onChange,
+  dateOrder: dateOrderProp
 }) {
   const [date, setDate] = useState(() =>
   // Truncate the date at the minutes, see: #15495.
@@ -90,41 +65,25 @@ export function TimePicker({
     month,
     year,
     minutes,
-    hours,
-    am
+    hours
   } = useMemo(() => ({
     day: format(date, 'dd'),
     month: format(date, 'MM'),
     year: format(date, 'yyyy'),
     minutes: format(date, 'mm'),
-    hours: format(date, is12Hour ? 'hh' : 'HH'),
+    hours: format(date, 'HH'),
     am: format(date, 'a')
-  }), [date, is12Hour]);
+  }), [date]);
   const buildNumberControlChangeCallback = method => {
     const callback = (value, {
       event
     }) => {
-      var _ownerDocument$defaul;
-      // `instanceof` checks need to get the instance definition from the
-      // corresponding window object — therefore, the following logic makes
-      // the component work correctly even when rendered inside an iframe.
-      const HTMLInputElementInstance = (_ownerDocument$defaul = event.target?.ownerDocument.defaultView?.HTMLInputElement) !== null && _ownerDocument$defaul !== void 0 ? _ownerDocument$defaul : HTMLInputElement;
-      if (!(event.target instanceof HTMLInputElementInstance)) {
-        return;
-      }
-      if (!event.target.validity.valid) {
+      if (!validateInputElementTarget(event)) {
         return;
       }
 
       // We can safely assume value is a number if target is valid.
-      let numberValue = Number(value);
-
-      // If the 12-hour format is being used and the 'PM' period is
-      // selected, then the incoming value (which ranges 1-12) should be
-      // increased by 12 to match the expected 24-hour format.
-      if (method === 'hours' && is12Hour) {
-        numberValue = from12hTo24h(numberValue, am === 'PM');
-      }
+      const numberValue = Number(value);
       const newDate = set(date, {
         [method]: numberValue
       });
@@ -133,17 +92,17 @@ export function TimePicker({
     };
     return callback;
   };
-  function buildAmPmChangeCallback(value) {
-    return () => {
-      if (am === value) {
-        return;
-      }
-      const parsedHours = parseInt(hours, 10);
-      const newDate = setHours(date, from12hTo24h(parsedHours, value === 'PM'));
-      setDate(newDate);
-      onChange?.(format(newDate, TIMEZONELESS_FORMAT));
-    };
-  }
+  const onTimeInputChangeCallback = ({
+    hours: newHours,
+    minutes: newMinutes
+  }) => {
+    const newDate = set(date, {
+      hours: newHours,
+      minutes: newMinutes
+    });
+    setDate(newDate);
+    onChange?.(format(newDate, TIMEZONELESS_FORMAT));
+  };
   const dayField = /*#__PURE__*/_jsx(DayInput, {
     className: "components-datetime__time-field components-datetime__time-field-day" // Unused, for backwards compatibility.
     ,
@@ -160,7 +119,7 @@ export function TimePicker({
     isDragEnabled: false,
     isShiftStepEnabled: false,
     onChange: buildNumberControlChangeCallback('date')
-  });
+  }, "day");
   const monthField = /*#__PURE__*/_jsx(MonthSelectWrapper, {
     children: /*#__PURE__*/_jsx(SelectControl, {
       className: "components-datetime__time-field components-datetime__time-field-month" // Unused, for backwards compatibility.
@@ -213,6 +172,38 @@ export function TimePicker({
         onChange?.(format(newDate, TIMEZONELESS_FORMAT));
       }
     })
+  }, "month");
+  const yearField = /*#__PURE__*/_jsx(YearInput, {
+    className: "components-datetime__time-field components-datetime__time-field-year" // Unused, for backwards compatibility.
+    ,
+    label: __('Year'),
+    hideLabelFromVision: true,
+    __next40pxDefaultSize: true,
+    value: year,
+    step: 1,
+    min: 1,
+    max: 9999,
+    required: true,
+    spinControls: "none",
+    isPressEnterToChange: true,
+    isDragEnabled: false,
+    isShiftStepEnabled: false,
+    onChange: buildNumberControlChangeCallback('year'),
+    __unstableStateReducer: buildPadInputStateReducer(4)
+  }, "year");
+  const defaultDateOrder = is12Hour ? 'mdy' : 'dmy';
+  const dateOrder = dateOrderProp && VALID_DATE_ORDERS.includes(dateOrderProp) ? dateOrderProp : defaultDateOrder;
+  const fields = dateOrder.split('').map(field => {
+    switch (field) {
+      case 'd':
+        return dayField;
+      case 'm':
+        return monthField;
+      case 'y':
+        return yearField;
+      default:
+        return null;
+    }
   });
   return /*#__PURE__*/_jsxs(Wrapper, {
     className: "components-datetime__time" // Unused, for backwards compatibility.
@@ -226,67 +217,13 @@ export function TimePicker({
       }), /*#__PURE__*/_jsxs(HStack, {
         className: "components-datetime__time-wrapper" // Unused, for backwards compatibility.
         ,
-        children: [/*#__PURE__*/_jsxs(TimeWrapper, {
-          className: "components-datetime__time-field components-datetime__time-field-time" // Unused, for backwards compatibility.
-          ,
-          children: [/*#__PURE__*/_jsx(HoursInput, {
-            className: "components-datetime__time-field-hours-input" // Unused, for backwards compatibility.
-            ,
-            label: __('Hours'),
-            hideLabelFromVision: true,
-            __next40pxDefaultSize: true,
-            value: hours,
-            step: 1,
-            min: is12Hour ? 1 : 0,
-            max: is12Hour ? 12 : 23,
-            required: true,
-            spinControls: "none",
-            isPressEnterToChange: true,
-            isDragEnabled: false,
-            isShiftStepEnabled: false,
-            onChange: buildNumberControlChangeCallback('hours'),
-            __unstableStateReducer: buildPadInputStateReducer(2)
-          }), /*#__PURE__*/_jsx(TimeSeparator, {
-            className: "components-datetime__time-separator" // Unused, for backwards compatibility.
-            ,
-            "aria-hidden": "true",
-            children: ":"
-          }), /*#__PURE__*/_jsx(MinutesInput, {
-            className: "components-datetime__time-field-minutes-input" // Unused, for backwards compatibility.
-            ,
-            label: __('Minutes'),
-            hideLabelFromVision: true,
-            __next40pxDefaultSize: true,
-            value: minutes,
-            step: 1,
-            min: 0,
-            max: 59,
-            required: true,
-            spinControls: "none",
-            isPressEnterToChange: true,
-            isDragEnabled: false,
-            isShiftStepEnabled: false,
-            onChange: buildNumberControlChangeCallback('minutes'),
-            __unstableStateReducer: buildPadInputStateReducer(2)
-          })]
-        }), is12Hour && /*#__PURE__*/_jsxs(ButtonGroup, {
-          className: "components-datetime__time-field components-datetime__time-field-am-pm" // Unused, for backwards compatibility.
-          ,
-          children: [/*#__PURE__*/_jsx(Button, {
-            className: "components-datetime__time-am-button" // Unused, for backwards compatibility.
-            ,
-            variant: am === 'AM' ? 'primary' : 'secondary',
-            __next40pxDefaultSize: true,
-            onClick: buildAmPmChangeCallback('AM'),
-            children: __('AM')
-          }), /*#__PURE__*/_jsx(Button, {
-            className: "components-datetime__time-pm-button" // Unused, for backwards compatibility.
-            ,
-            variant: am === 'PM' ? 'primary' : 'secondary',
-            __next40pxDefaultSize: true,
-            onClick: buildAmPmChangeCallback('PM'),
-            children: __('PM')
-          })]
+        children: [/*#__PURE__*/_jsx(TimeInput, {
+          value: {
+            hours: Number(hours),
+            minutes: Number(minutes)
+          },
+          is12Hour: is12Hour,
+          onChange: onTimeInputChangeCallback
         }), /*#__PURE__*/_jsx(Spacer, {}), /*#__PURE__*/_jsx(TimeZone, {})]
       })]
     }), /*#__PURE__*/_jsxs(Fieldset, {
@@ -295,31 +232,10 @@ export function TimePicker({
         className: "components-datetime__time-legend" // Unused, for backwards compatibility.
         ,
         children: __('Date')
-      }), /*#__PURE__*/_jsxs(HStack, {
+      }), /*#__PURE__*/_jsx(HStack, {
         className: "components-datetime__time-wrapper" // Unused, for backwards compatibility.
         ,
-        children: [is12Hour ? /*#__PURE__*/_jsxs(_Fragment, {
-          children: [monthField, dayField]
-        }) : /*#__PURE__*/_jsxs(_Fragment, {
-          children: [dayField, monthField]
-        }), /*#__PURE__*/_jsx(YearInput, {
-          className: "components-datetime__time-field components-datetime__time-field-year" // Unused, for backwards compatibility.
-          ,
-          label: __('Year'),
-          hideLabelFromVision: true,
-          __next40pxDefaultSize: true,
-          value: year,
-          step: 1,
-          min: 1,
-          max: 9999,
-          required: true,
-          spinControls: "none",
-          isPressEnterToChange: true,
-          isDragEnabled: false,
-          isShiftStepEnabled: false,
-          onChange: buildNumberControlChangeCallback('year'),
-          __unstableStateReducer: buildPadInputStateReducer(4)
-        })]
+        children: fields
       })]
     })]
   });

package/build-module/date-time/time/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["startOfMinute","format","set","setHours","setMonth","useState","useMemo","useEffect","__","BaseControl","Button","ButtonGroup","SelectControl","TimeZone","Wrapper","Fieldset","HoursInput","TimeSeparator","MinutesInput","MonthSelectWrapper","DayInput","YearInput","TimeWrapper","HStack","Spacer","COMMIT","PRESS_DOWN","PRESS_UP","inputToDate","TIMEZONELESS_FORMAT","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","from12hTo24h","hours","isPm","buildPadInputStateReducer","pad","state","action","nextState","type","value","undefined","toString","padStart","TimePicker","is12Hour","currentTime","onChange","date","setDate","Date","day","month","year","minutes","am","buildNumberControlChangeCallback","method","callback","event","_ownerDocument$defaul","HTMLInputElementInstance","target","ownerDocument","defaultView","HTMLInputElement","validity","valid","numberValue","Number","newDate","buildAmPmChangeCallback","parsedHours","parseInt","dayField","className","label","hideLabelFromVision","__next40pxDefaultSize","step","min","max","required","spinControls","isPressEnterToChange","isDragEnabled","isShiftStepEnabled","monthField","children","__nextHasNoMarginBottom","options","VisualLabel","as","__unstableStateReducer","variant","onClick"],"sources":["@wordpress/components/src/date-time/time/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { startOfMinute, format, set, setHours, setMonth } from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../../base-control';\nimport Button from '../../button';\nimport ButtonGroup from '../../button-group';\nimport SelectControl from '../../select-control';\nimport TimeZone from './timezone';\nimport type { TimePickerProps } from '../types';\nimport {\n\tWrapper,\n\tFieldset,\n\tHoursInput,\n\tTimeSeparator,\n\tMinutesInput,\n\tMonthSelectWrapper,\n\tDayInput,\n\tYearInput,\n\tTimeWrapper,\n} from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport type { InputChangeCallback } from '../../input-control/types';\nimport type { InputState } from '../../input-control/reducer/state';\nimport type { InputAction } from '../../input-control/reducer/actions';\nimport {\n\tCOMMIT,\n\tPRESS_DOWN,\n\tPRESS_UP,\n} from '../../input-control/reducer/actions';\nimport { inputToDate } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\nfunction from12hTo24h( hours: number, isPm: boolean ) {\n\treturn isPm ? ( ( hours % 12 ) + 12 ) % 24 : hours % 12;\n}\n\n/**\n * Creates an InputControl reducer used to pad an input so that it is always a\n * given width. For example, the hours and minutes inputs are padded to 2 so\n * that '4' appears as '04'.\n *\n * @param pad How many digits the value should be.\n */\nfunction buildPadInputStateReducer( pad: number ) {\n\treturn ( state: InputState, action: InputAction ) => {\n\t\tconst nextState = { ...state };\n\t\tif (\n\t\t\taction.type === COMMIT ||\n\t\t\taction.type === PRESS_UP ||\n\t\t\taction.type === PRESS_DOWN\n\t\t) {\n\t\t\tif ( nextState.value !== undefined ) {\n\t\t\t\tnextState.value = nextState.value\n\t\t\t\t\t.toString()\n\t\t\t\t\t.padStart( pad, '0' );\n\t\t\t}\n\t\t}\n\t\treturn nextState;\n\t};\n}\n\n/**\n * TimePicker is a React component that renders a clock for time selection.\n *\n * ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTimePicker = () => {\n *   const [ time, setTime ] = useState( new Date() );\n *\n *   return (\n *     <TimePicker\n *       currentTime={ date }\n *       onChange={ ( newTime ) => setTime( newTime ) }\n *       is12Hour\n *     />\n *   );\n * };\n * ```\n */\nexport function TimePicker( {\n\tis12Hour,\n\tcurrentTime,\n\tonChange,\n}: TimePickerProps ) {\n\tconst [ date, setDate ] = useState( () =>\n\t\t// Truncate the date at the minutes, see: #15495.\n\t\tcurrentTime ? startOfMinute( inputToDate( currentTime ) ) : new Date()\n\t);\n\n\t// Reset the state when currentTime changed.\n\t// TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n\tuseEffect( () => {\n\t\tsetDate(\n\t\t\tcurrentTime\n\t\t\t\t? startOfMinute( inputToDate( currentTime ) )\n\t\t\t\t: new Date()\n\t\t);\n\t}, [ currentTime ] );\n\n\tconst { day, month, year, minutes, hours, am } = useMemo(\n\t\t() => ( {\n\t\t\tday: format( date, 'dd' ),\n\t\t\tmonth: format( date, 'MM' ),\n\t\t\tyear: format( date, 'yyyy' ),\n\t\t\tminutes: format( date, 'mm' ),\n\t\t\thours: format( date, is12Hour ? 'hh' : 'HH' ),\n\t\t\tam: format( date, 'a' ),\n\t\t} ),\n\t\t[ date, is12Hour ]\n\t);\n\n\tconst buildNumberControlChangeCallback = (\n\t\tmethod: 'hours' | 'minutes' | 'date' | 'year'\n\t) => {\n\t\tconst callback: InputChangeCallback = ( value, { event } ) => {\n\t\t\t// `instanceof` checks need to get the instance definition from the\n\t\t\t// corresponding window object — therefore, the following logic makes\n\t\t\t// the component work correctly even when rendered inside an iframe.\n\t\t\tconst HTMLInputElementInstance =\n\t\t\t\t( event.target as HTMLInputElement )?.ownerDocument.defaultView\n\t\t\t\t\t?.HTMLInputElement ?? HTMLInputElement;\n\n\t\t\tif ( ! ( event.target instanceof HTMLInputElementInstance ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( ! event.target.validity.valid ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// We can safely assume value is a number if target is valid.\n\t\t\tlet numberValue = Number( value );\n\n\t\t\t// If the 12-hour format is being used and the 'PM' period is\n\t\t\t// selected, then the incoming value (which ranges 1-12) should be\n\t\t\t// increased by 12 to match the expected 24-hour format.\n\t\t\tif ( method === 'hours' && is12Hour ) {\n\t\t\t\tnumberValue = from12hTo24h( numberValue, am === 'PM' );\n\t\t\t}\n\n\t\t\tconst newDate = set( date, { [ method ]: numberValue } );\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t\treturn callback;\n\t};\n\n\tfunction buildAmPmChangeCallback( value: 'AM' | 'PM' ) {\n\t\treturn () => {\n\t\t\tif ( am === value ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst parsedHours = parseInt( hours, 10 );\n\n\t\t\tconst newDate = setHours(\n\t\t\t\tdate,\n\t\t\t\tfrom12hTo24h( parsedHours, value === 'PM' )\n\t\t\t);\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t}\n\n\tconst dayField = (\n\t\t<DayInput\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Day' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next40pxDefaultSize\n\t\t\tvalue={ day }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 31 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'date' ) }\n\t\t/>\n\t);\n\n\tconst monthField = (\n\t\t<MonthSelectWrapper>\n\t\t\t<SelectControl\n\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n\t\t\t\tlabel={ __( 'Month' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ month }\n\t\t\t\toptions={ [\n\t\t\t\t\t{ value: '01', label: __( 'January' ) },\n\t\t\t\t\t{ value: '02', label: __( 'February' ) },\n\t\t\t\t\t{ value: '03', label: __( 'March' ) },\n\t\t\t\t\t{ value: '04', label: __( 'April' ) },\n\t\t\t\t\t{ value: '05', label: __( 'May' ) },\n\t\t\t\t\t{ value: '06', label: __( 'June' ) },\n\t\t\t\t\t{ value: '07', label: __( 'July' ) },\n\t\t\t\t\t{ value: '08', label: __( 'August' ) },\n\t\t\t\t\t{ value: '09', label: __( 'September' ) },\n\t\t\t\t\t{ value: '10', label: __( 'October' ) },\n\t\t\t\t\t{ value: '11', label: __( 'November' ) },\n\t\t\t\t\t{ value: '12', label: __( 'December' ) },\n\t\t\t\t] }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tconst newDate = setMonth( date, Number( value ) - 1 );\n\t\t\t\t\tsetDate( newDate );\n\t\t\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MonthSelectWrapper>\n\t);\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__time\" // Unused, for backwards compatibility.\n\t\t>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Time' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t<TimeWrapper\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-time\" // Unused, for backwards compatibility.\n\t\t\t\t\t>\n\t\t\t\t\t\t<HoursInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-hours-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Hours' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tvalue={ hours }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ is12Hour ? 1 : 0 }\n\t\t\t\t\t\t\tmax={ is12Hour ? 12 : 23 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'hours'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<TimeSeparator\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-separator\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t:\n\t\t\t\t\t\t</TimeSeparator>\n\t\t\t\t\t\t<MinutesInput\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field-minutes-input\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\tlabel={ __( 'Minutes' ) }\n\t\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tvalue={ minutes }\n\t\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\t\tmin={ 0 }\n\t\t\t\t\t\t\tmax={ 59 }\n\t\t\t\t\t\t\trequired\n\t\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback(\n\t\t\t\t\t\t\t\t'minutes'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t\t2\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</TimeWrapper>\n\t\t\t\t\t{ is12Hour && (\n\t\t\t\t\t\t<ButtonGroup\n\t\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-am-pm\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-am-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'AM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'AM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'AM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\tclassName=\"components-datetime__time-pm-button\" // Unused, for backwards compatibility.\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tam === 'PM' ? 'primary' : 'secondary'\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\tonClick={ buildAmPmChangeCallback( 'PM' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ __( 'PM' ) }\n\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t</ButtonGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<Spacer />\n\t\t\t\t\t<TimeZone />\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Date' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ is12Hour ? (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ dayField }\n\t\t\t\t\t\t\t{ monthField }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<YearInput\n\t\t\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n\t\t\t\t\t\tlabel={ __( 'Year' ) }\n\t\t\t\t\t\thideLabelFromVision\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvalue={ year }\n\t\t\t\t\t\tstep={ 1 }\n\t\t\t\t\t\tmin={ 1 }\n\t\t\t\t\t\tmax={ 9999 }\n\t\t\t\t\t\trequired\n\t\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\t\tisPressEnterToChange\n\t\t\t\t\t\tisDragEnabled={ false }\n\t\t\t\t\t\tisShiftStepEnabled={ false }\n\t\t\t\t\t\tonChange={ buildNumberControlChangeCallback( 'year' ) }\n\t\t\t\t\t\t__unstableStateReducer={ buildPadInputStateReducer(\n\t\t\t\t\t\t\t4\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t</Wrapper>\n\t);\n}\n\nexport default TimePicker;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["startOfMinute","format","set","setMonth","useState","useMemo","useEffect","__","BaseControl","SelectControl","TimeZone","Wrapper","Fieldset","MonthSelectWrapper","DayInput","YearInput","HStack","Spacer","inputToDate","buildPadInputStateReducer","validateInputElementTarget","TIMEZONELESS_FORMAT","TimeInput","jsx","_jsx","jsxs","_jsxs","VALID_DATE_ORDERS","TimePicker","is12Hour","currentTime","onChange","dateOrder","dateOrderProp","date","setDate","Date","day","month","year","minutes","hours","am","buildNumberControlChangeCallback","method","callback","value","event","numberValue","Number","newDate","onTimeInputChangeCallback","newHours","newMinutes","dayField","className","label","hideLabelFromVision","__next40pxDefaultSize","step","min","max","required","spinControls","isPressEnterToChange","isDragEnabled","isShiftStepEnabled","monthField","children","__nextHasNoMarginBottom","options","yearField","__unstableStateReducer","defaultDateOrder","includes","fields","split","map","field","VisualLabel","as"],"sources":["@wordpress/components/src/date-time/time/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport { startOfMinute, format, set, setMonth } from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../../base-control';\nimport SelectControl from '../../select-control';\nimport TimeZone from './timezone';\nimport type { TimeInputValue, TimePickerProps } from '../types';\nimport {\n\tWrapper,\n\tFieldset,\n\tMonthSelectWrapper,\n\tDayInput,\n\tYearInput,\n} from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport type { InputChangeCallback } from '../../input-control/types';\nimport {\n\tinputToDate,\n\tbuildPadInputStateReducer,\n\tvalidateInputElementTarget,\n} from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\nimport { TimeInput } from '../time-input';\n\nconst VALID_DATE_ORDERS = [ 'dmy', 'mdy', 'ymd' ];\n\n/**\n * TimePicker is a React component that renders a clock for time selection.\n *\n * ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTimePicker = () => {\n *   const [ time, setTime ] = useState( new Date() );\n *\n *   return (\n *     <TimePicker\n *       currentTime={ date }\n *       onChange={ ( newTime ) => setTime( newTime ) }\n *       is12Hour\n *     />\n *   );\n * };\n * ```\n */\nexport function TimePicker( {\n\tis12Hour,\n\tcurrentTime,\n\tonChange,\n\tdateOrder: dateOrderProp,\n}: TimePickerProps ) {\n\tconst [ date, setDate ] = useState( () =>\n\t\t// Truncate the date at the minutes, see: #15495.\n\t\tcurrentTime ? startOfMinute( inputToDate( currentTime ) ) : new Date()\n\t);\n\n\t// Reset the state when currentTime changed.\n\t// TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n\tuseEffect( () => {\n\t\tsetDate(\n\t\t\tcurrentTime\n\t\t\t\t? startOfMinute( inputToDate( currentTime ) )\n\t\t\t\t: new Date()\n\t\t);\n\t}, [ currentTime ] );\n\n\tconst { day, month, year, minutes, hours } = useMemo(\n\t\t() => ( {\n\t\t\tday: format( date, 'dd' ),\n\t\t\tmonth: format( date, 'MM' ),\n\t\t\tyear: format( date, 'yyyy' ),\n\t\t\tminutes: format( date, 'mm' ),\n\t\t\thours: format( date, 'HH' ),\n\t\t\tam: format( date, 'a' ),\n\t\t} ),\n\t\t[ date ]\n\t);\n\n\tconst buildNumberControlChangeCallback = ( method: 'date' | 'year' ) => {\n\t\tconst callback: InputChangeCallback = ( value, { event } ) => {\n\t\t\tif ( ! validateInputElementTarget( event ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// We can safely assume value is a number if target is valid.\n\t\t\tconst numberValue = Number( value );\n\n\t\t\tconst newDate = set( date, { [ method ]: numberValue } );\n\t\t\tsetDate( newDate );\n\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t};\n\t\treturn callback;\n\t};\n\n\tconst onTimeInputChangeCallback = ( {\n\t\thours: newHours,\n\t\tminutes: newMinutes,\n\t}: TimeInputValue ) => {\n\t\tconst newDate = set( date, {\n\t\t\thours: newHours,\n\t\t\tminutes: newMinutes,\n\t\t} );\n\t\tsetDate( newDate );\n\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t};\n\n\tconst dayField = (\n\t\t<DayInput\n\t\t\tkey=\"day\"\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Day' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next40pxDefaultSize\n\t\t\tvalue={ day }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 31 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'date' ) }\n\t\t/>\n\t);\n\n\tconst monthField = (\n\t\t<MonthSelectWrapper key=\"month\">\n\t\t\t<SelectControl\n\t\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n\t\t\t\tlabel={ __( 'Month' ) }\n\t\t\t\thideLabelFromVision\n\t\t\t\t__next40pxDefaultSize\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tvalue={ month }\n\t\t\t\toptions={ [\n\t\t\t\t\t{ value: '01', label: __( 'January' ) },\n\t\t\t\t\t{ value: '02', label: __( 'February' ) },\n\t\t\t\t\t{ value: '03', label: __( 'March' ) },\n\t\t\t\t\t{ value: '04', label: __( 'April' ) },\n\t\t\t\t\t{ value: '05', label: __( 'May' ) },\n\t\t\t\t\t{ value: '06', label: __( 'June' ) },\n\t\t\t\t\t{ value: '07', label: __( 'July' ) },\n\t\t\t\t\t{ value: '08', label: __( 'August' ) },\n\t\t\t\t\t{ value: '09', label: __( 'September' ) },\n\t\t\t\t\t{ value: '10', label: __( 'October' ) },\n\t\t\t\t\t{ value: '11', label: __( 'November' ) },\n\t\t\t\t\t{ value: '12', label: __( 'December' ) },\n\t\t\t\t] }\n\t\t\t\tonChange={ ( value ) => {\n\t\t\t\t\tconst newDate = setMonth( date, Number( value ) - 1 );\n\t\t\t\t\tsetDate( newDate );\n\t\t\t\t\tonChange?.( format( newDate, TIMEZONELESS_FORMAT ) );\n\t\t\t\t} }\n\t\t\t/>\n\t\t</MonthSelectWrapper>\n\t);\n\n\tconst yearField = (\n\t\t<YearInput\n\t\t\tkey=\"year\"\n\t\t\tclassName=\"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n\t\t\tlabel={ __( 'Year' ) }\n\t\t\thideLabelFromVision\n\t\t\t__next40pxDefaultSize\n\t\t\tvalue={ year }\n\t\t\tstep={ 1 }\n\t\t\tmin={ 1 }\n\t\t\tmax={ 9999 }\n\t\t\trequired\n\t\t\tspinControls=\"none\"\n\t\t\tisPressEnterToChange\n\t\t\tisDragEnabled={ false }\n\t\t\tisShiftStepEnabled={ false }\n\t\t\tonChange={ buildNumberControlChangeCallback( 'year' ) }\n\t\t\t__unstableStateReducer={ buildPadInputStateReducer( 4 ) }\n\t\t/>\n\t);\n\n\tconst defaultDateOrder = is12Hour ? 'mdy' : 'dmy';\n\tconst dateOrder =\n\t\tdateOrderProp && VALID_DATE_ORDERS.includes( dateOrderProp )\n\t\t\t? dateOrderProp\n\t\t\t: defaultDateOrder;\n\n\tconst fields = dateOrder.split( '' ).map( ( field ) => {\n\t\tswitch ( field ) {\n\t\t\tcase 'd':\n\t\t\t\treturn dayField;\n\t\t\tcase 'm':\n\t\t\t\treturn monthField;\n\t\t\tcase 'y':\n\t\t\t\treturn yearField;\n\t\t\tdefault:\n\t\t\t\treturn null;\n\t\t}\n\t} );\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__time\" // Unused, for backwards compatibility.\n\t\t>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Time' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t<TimeInput\n\t\t\t\t\t\tvalue={ {\n\t\t\t\t\t\t\thours: Number( hours ),\n\t\t\t\t\t\t\tminutes: Number( minutes ),\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tis12Hour={ is12Hour }\n\t\t\t\t\t\tonChange={ onTimeInputChangeCallback }\n\t\t\t\t\t/>\n\t\t\t\t\t<Spacer />\n\t\t\t\t\t<TimeZone />\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t\t<Fieldset>\n\t\t\t\t<BaseControl.VisualLabel\n\t\t\t\t\tas=\"legend\"\n\t\t\t\t\tclassName=\"components-datetime__time-legend\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Date' ) }\n\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t<HStack\n\t\t\t\t\tclassName=\"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n\t\t\t\t>\n\t\t\t\t\t{ fields }\n\t\t\t\t</HStack>\n\t\t\t</Fieldset>\n\t\t</Wrapper>\n\t);\n}\n\nexport default TimePicker;\n"],"mappings":"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","ignoreList":[]}

package/build-module/date-time/time-input/index.js

@@ -0,0 +1,151 @@
+/**
+ * External dependencies
+ */
+import clsx from 'clsx';
+
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { Fragment } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import { TimeWrapper, TimeSeparator, HoursInput, MinutesInput, Fieldset } from '../time/styles';
+import { HStack } from '../../h-stack';
+import Button from '../../button';
+import ButtonGroup from '../../button-group';
+import { from12hTo24h, from24hTo12h, buildPadInputStateReducer, validateInputElementTarget } from '../utils';
+import { useControlledValue } from '../../utils';
+import BaseControl from '../../base-control';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+export function TimeInput({
+  value: valueProp,
+  defaultValue,
+  is12Hour,
+  label,
+  minutesProps,
+  onChange
+}) {
+  const [value = {
+    hours: new Date().getHours(),
+    minutes: new Date().getMinutes()
+  }, setValue] = useControlledValue({
+    value: valueProp,
+    onChange,
+    defaultValue
+  });
+  const dayPeriod = parseDayPeriod(value.hours);
+  const hours12Format = from24hTo12h(value.hours);
+  const buildNumberControlChangeCallback = method => {
+    return (_value, {
+      event
+    }) => {
+      if (!validateInputElementTarget(event)) {
+        return;
+      }
+
+      // We can safely assume value is a number if target is valid.
+      const numberValue = Number(_value);
+      setValue({
+        ...value,
+        [method]: method === 'hours' && is12Hour ? from12hTo24h(numberValue, dayPeriod === 'PM') : numberValue
+      });
+    };
+  };
+  const buildAmPmChangeCallback = _value => {
+    return () => {
+      if (dayPeriod === _value) {
+        return;
+      }
+      setValue({
+        ...value,
+        hours: from12hTo24h(hours12Format, _value === 'PM')
+      });
+    };
+  };
+  function parseDayPeriod(_hours) {
+    return _hours < 12 ? 'AM' : 'PM';
+  }
+  const Wrapper = label ? Fieldset : Fragment;
+  return /*#__PURE__*/_jsxs(Wrapper, {
+    children: [label && /*#__PURE__*/_jsx(BaseControl.VisualLabel, {
+      as: "legend",
+      children: label
+    }), /*#__PURE__*/_jsxs(HStack, {
+      alignment: "left",
+      expanded: false,
+      children: [/*#__PURE__*/_jsxs(TimeWrapper, {
+        className: "components-datetime__time-field components-datetime__time-field-time" // Unused, for backwards compatibility.
+        ,
+        children: [/*#__PURE__*/_jsx(HoursInput, {
+          className: "components-datetime__time-field-hours-input" // Unused, for backwards compatibility.
+          ,
+          label: __('Hours'),
+          hideLabelFromVision: true,
+          __next40pxDefaultSize: true,
+          value: String(is12Hour ? hours12Format : value.hours).padStart(2, '0'),
+          step: 1,
+          min: is12Hour ? 1 : 0,
+          max: is12Hour ? 12 : 23,
+          required: true,
+          spinControls: "none",
+          isPressEnterToChange: true,
+          isDragEnabled: false,
+          isShiftStepEnabled: false,
+          onChange: buildNumberControlChangeCallback('hours'),
+          __unstableStateReducer: buildPadInputStateReducer(2)
+        }), /*#__PURE__*/_jsx(TimeSeparator, {
+          className: "components-datetime__time-separator" // Unused, for backwards compatibility.
+          ,
+          "aria-hidden": "true",
+          children: ":"
+        }), /*#__PURE__*/_jsx(MinutesInput, {
+          className: clsx('components-datetime__time-field-minutes-input',
+          // Unused, for backwards compatibility.
+          minutesProps?.className),
+          label: __('Minutes'),
+          hideLabelFromVision: true,
+          __next40pxDefaultSize: true,
+          value: String(value.minutes).padStart(2, '0'),
+          step: 1,
+          min: 0,
+          max: 59,
+          required: true,
+          spinControls: "none",
+          isPressEnterToChange: true,
+          isDragEnabled: false,
+          isShiftStepEnabled: false,
+          onChange: (...args) => {
+            buildNumberControlChangeCallback('minutes')(...args);
+            minutesProps?.onChange?.(...args);
+          },
+          __unstableStateReducer: buildPadInputStateReducer(2),
+          ...minutesProps
+        })]
+      }), is12Hour && /*#__PURE__*/_jsxs(ButtonGroup, {
+        className: "components-datetime__time-field components-datetime__time-field-am-pm" // Unused, for backwards compatibility.
+        ,
+        children: [/*#__PURE__*/_jsx(Button, {
+          className: "components-datetime__time-am-button" // Unused, for backwards compatibility.
+          ,
+          variant: dayPeriod === 'AM' ? 'primary' : 'secondary',
+          __next40pxDefaultSize: true,
+          onClick: buildAmPmChangeCallback('AM'),
+          children: __('AM')
+        }), /*#__PURE__*/_jsx(Button, {
+          className: "components-datetime__time-pm-button" // Unused, for backwards compatibility.
+          ,
+          variant: dayPeriod === 'PM' ? 'primary' : 'secondary',
+          __next40pxDefaultSize: true,
+          onClick: buildAmPmChangeCallback('PM'),
+          children: __('PM')
+        })]
+      })]
+    })]
+  });
+}
+export default TimeInput;
+//# sourceMappingURL=index.js.map