@wordpress/components 30.9.1-next.8b30e05b0.0 → 31.0.1-next.738bb1424.0

package/build-module/custom-select-control-v2/item.js

@@ -1,8 +1,8 @@
 // packages/components/src/custom-select-control-v2/item.tsx
 import { useContext } from "@wordpress/element";
 import { Icon, check } from "@wordpress/icons";
-import * as Styled from "./styles";
-import { CustomSelectContext } from "./custom-select";
+import * as Styled from "./styles.js";
+import { CustomSelectContext } from "./custom-select.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function CustomSelectItem({
   children,

package/build-module/custom-select-control-v2/styles.js

@@ -2,10 +2,10 @@
 import _styled from "@emotion/styled/base";
 import * as Ariakit from "@ariakit/react";
 import { css, keyframes } from "@emotion/react";
-import { COLORS, CONFIG } from "../utils";
-import { space } from "../utils/space";
-import { chevronIconSize } from "../select-control/styles/select-control-styles";
-import { fontSizeStyles } from "../input-control/styles/input-control-styles";
+import { COLORS, CONFIG } from "../utils/index.js";
+import { space } from "../utils/space.js";
+import { chevronIconSize } from "../select-control/styles/select-control-styles.js";
+import { fontSizeStyles } from "../input-control/styles/input-control-styles.js";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }

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

@@ -1,5 +1,5 @@
 // packages/components/src/date-time/constants.ts
-var TIMEZONELESS_FORMAT = "yyyy-MM-dd'T'HH:mm:ss";
+var TIMEZONELESS_FORMAT = "Y-m-d\\TH:i:s";
 export {
   TIMEZONELESS_FORMAT
 };

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/date-time/constants.ts"],
-  "sourcesContent": ["export const TIMEZONELESS_FORMAT = \"yyyy-MM-dd'T'HH:mm:ss\";"],
+  "sourcesContent": ["export const TIMEZONELESS_FORMAT = 'Y-m-d\\\\TH:i:s';"],
   "mappings": ";AAAO,IAAM,sBAAsB;",
   "names": []
 }

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

@@ -1,13 +1,13 @@
 // packages/components/src/date-time/date/index.tsx
-import { format, isSameDay, subMonths, addMonths, startOfDay, isEqual, addDays, subWeeks, addWeeks, isSameMonth, startOfWeek, endOfWeek } from "date-fns";
+import { isSameDay, subMonths, addMonths, isEqual, addDays, subDays, subWeeks, addWeeks, isSameMonth } from "date-fns";
 import { __, _n, sprintf, isRTL } from "@wordpress/i18n";
 import { arrowLeft, arrowRight } from "@wordpress/icons";
-import { getSettings, gmdateI18n } from "@wordpress/date";
+import { dateI18n, date as formatDate, getSettings } from "@wordpress/date";
 import { useState, useRef, useEffect } from "@wordpress/element";
-import { useLilius } from "./use-lilius";
-import { Wrapper, Navigator, ViewPreviousMonthButton, ViewNextMonthButton, NavigatorHeading, Calendar, DayOfWeek, DayButton } from "./styles";
-import { inputToDate } from "../utils";
-import { TIMEZONELESS_FORMAT } from "../constants";
+import { useLilius } from "./use-lilius/index.js";
+import { Wrapper, Navigator, ViewPreviousMonthButton, ViewNextMonthButton, NavigatorHeading, Calendar, DayOfWeek, DayButton } from "./styles.js";
+import { inputToDate, setInConfiguredTimezone, startOfDayInConfiguredTimezone } from "../utils.js";
+import { TIMEZONELESS_FORMAT } from "../constants.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function DatePicker({
   currentDate,
@@ -17,7 +17,7 @@ function DatePicker({
   onMonthPreviewed,
   startOfWeek: weekStartsOn = 0
 }) {
-  const date = currentDate ? inputToDate(currentDate) : /* @__PURE__ */ new Date();
+  const date = inputToDate(currentDate !== null && currentDate !== void 0 ? currentDate : /* @__PURE__ */ new Date());
   const {
     calendar,
     viewing,
@@ -27,18 +27,18 @@ function DatePicker({
     viewPreviousMonth,
     viewNextMonth
   } = useLilius({
-    selected: [startOfDay(date)],
-    viewing: startOfDay(date),
+    selected: [startOfDayInConfiguredTimezone(date)],
+    viewing: startOfDayInConfiguredTimezone(date),
     weekStartsOn
   });
-  const [focusable, setFocusable] = useState(startOfDay(date));
+  const [focusable, setFocusable] = useState(startOfDayInConfiguredTimezone(date));
   const [isFocusWithinCalendar, setIsFocusWithinCalendar] = useState(false);
   const [prevCurrentDate, setPrevCurrentDate] = useState(currentDate);
   if (currentDate !== prevCurrentDate) {
     setPrevCurrentDate(currentDate);
-    setSelected([startOfDay(date)]);
-    setViewing(startOfDay(date));
-    setFocusable(startOfDay(date));
+    setSelected([startOfDayInConfiguredTimezone(date)]);
+    setViewing(startOfDayInConfiguredTimezone(date));
+    setFocusable(startOfDayInConfiguredTimezone(date));
   }
   return /* @__PURE__ */ _jsxs(Wrapper, {
     className: "components-datetime__date",
@@ -52,14 +52,15 @@ function DatePicker({
         onClick: () => {
           viewPreviousMonth();
           setFocusable(subMonths(focusable, 1));
-          onMonthPreviewed?.(format(subMonths(viewing, 1), TIMEZONELESS_FORMAT));
+          const prevMonth = subMonths(viewing, 1);
+          onMonthPreviewed?.(dateI18n(TIMEZONELESS_FORMAT, prevMonth, -prevMonth.getTimezoneOffset()));
         },
         size: "compact"
       }), /* @__PURE__ */ _jsxs(NavigatorHeading, {
         level: 3,
         children: [/* @__PURE__ */ _jsx("strong", {
-          children: gmdateI18n("F", viewing)
-        }), " ", gmdateI18n("Y", viewing)]
+          children: dateI18n("F", viewing, -viewing.getTimezoneOffset())
+        }), " ", dateI18n("Y", viewing, -viewing.getTimezoneOffset())]
       }), /* @__PURE__ */ _jsx(ViewNextMonthButton, {
         icon: isRTL() ? arrowLeft : arrowRight,
         variant: "tertiary",
@@ -67,7 +68,8 @@ function DatePicker({
         onClick: () => {
           viewNextMonth();
           setFocusable(addMonths(focusable, 1));
-          onMonthPreviewed?.(format(addMonths(viewing, 1), TIMEZONELESS_FORMAT));
+          const nextMonth = addMonths(viewing, 1);
+          onMonthPreviewed?.(dateI18n(TIMEZONELESS_FORMAT, nextMonth, -nextMonth.getTimezoneOffset()));
         },
         size: "compact"
       })]
@@ -75,7 +77,7 @@ function DatePicker({
       onFocus: () => setIsFocusWithinCalendar(true),
       onBlur: () => setIsFocusWithinCalendar(false),
       children: [calendar[0][0].map((day) => /* @__PURE__ */ _jsx(DayOfWeek, {
-        children: gmdateI18n("D", day)
+        children: dateI18n("D", day, -day.getTimezoneOffset())
       }, day.toString())), calendar[0].map((week) => week.map((day, index) => {
         if (!isSameMonth(day, viewing)) {
           return null;
@@ -86,17 +88,18 @@ function DatePicker({
           isSelected: isSelected(day),
           isFocusable: isEqual(day, focusable),
           isFocusAllowed: isFocusWithinCalendar,
-          isToday: isSameDay(day, /* @__PURE__ */ new Date()),
+          isToday: isSameDay(day, startOfDayInConfiguredTimezone(/* @__PURE__ */ new Date())),
           isInvalid: isInvalidDate ? isInvalidDate(day) : false,
           numEvents: events.filter((event) => isSameDay(event.date, day)).length,
           onClick: () => {
             setSelected([day]);
             setFocusable(day);
-            onChange?.(format(
-              // Don't change the selected date's time fields.
-              new Date(day.getFullYear(), day.getMonth(), day.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()),
-              TIMEZONELESS_FORMAT
-            ));
+            const newDate = setInConfiguredTimezone(date, {
+              year: day.getFullYear(),
+              month: day.getMonth(),
+              date: day.getDate()
+            });
+            onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));
           },
           onKeyDown: (event) => {
             let nextFocusable;
@@ -119,17 +122,21 @@ function DatePicker({
               nextFocusable = addMonths(day, 1);
             }
             if (event.key === "Home") {
-              nextFocusable = startOfWeek(day);
+              const dayOfWeek = day.getDay();
+              const daysToSubtract = (dayOfWeek - weekStartsOn + 7) % 7;
+              nextFocusable = subDays(day, daysToSubtract);
             }
             if (event.key === "End") {
-              nextFocusable = startOfDay(endOfWeek(day));
+              const dayOfWeek = day.getDay();
+              const daysToAdd = (weekStartsOn + 6 - dayOfWeek) % 7;
+              nextFocusable = addDays(day, daysToAdd);
             }
             if (nextFocusable) {
               event.preventDefault();
               setFocusable(nextFocusable);
               if (!isSameMonth(nextFocusable, viewing)) {
                 setViewing(nextFocusable);
-                onMonthPreviewed?.(format(nextFocusable, TIMEZONELESS_FORMAT));
+                onMonthPreviewed?.(dateI18n(TIMEZONELESS_FORMAT, nextFocusable, -nextFocusable.getTimezoneOffset()));
               }
             }
           }
@@ -162,43 +169,36 @@ function Day({
     className: "components-datetime__date__day",
     disabled: isInvalid,
     tabIndex: isFocusable ? 0 : -1,
-    "aria-label": getDayLabel(day, isSelected, numEvents),
+    "aria-label": getDayLabel(day, isSelected, isToday, numEvents),
     column,
     isSelected,
     isToday,
     hasEvents: numEvents > 0,
     onClick,
     onKeyDown,
-    children: gmdateI18n("j", day)
+    children: dateI18n("j", day, -day.getTimezoneOffset())
   });
 }
-function getDayLabel(date, isSelected, numEvents) {
+function getDayLabel(date, isSelected, isToday, numEvents) {
   const {
     formats
   } = getSettings();
-  const localizedDate = gmdateI18n(formats.date, date);
-  if (isSelected && numEvents > 0) {
-    return sprintf(
-      // translators: 1: The calendar date. 2: Number of events on the calendar date.
-      _n("%1$s. Selected. There is %2$d event", "%1$s. Selected. There are %2$d events", numEvents),
-      localizedDate,
-      numEvents
-    );
-  } else if (isSelected) {
-    return sprintf(
-      // translators: 1: The calendar date.
-      __("%1$s. Selected"),
-      localizedDate
-    );
-  } else if (numEvents > 0) {
-    return sprintf(
-      // translators: 1: The calendar date. 2: Number of events on the calendar date.
-      _n("%1$s. There is %2$d event", "%1$s. There are %2$d events", numEvents),
-      localizedDate,
+  const localizedDate = dateI18n(formats.date, date, -date.getTimezoneOffset());
+  const parts = [localizedDate];
+  if (isSelected) {
+    parts.push(__("Selected"));
+  }
+  if (isToday) {
+    parts.push(__("Today"));
+  }
+  if (numEvents > 0) {
+    parts.push(sprintf(
+      // translators: %d: Number of events on the calendar date.
+      _n("There is %d event", "There are %d events", numEvents),
       numEvents
-    );
+    ));
   }
-  return localizedDate;
+  return parts.join(". ");
 }
 var date_default = DatePicker;
 export {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/date-time/date/index.tsx"],
-  "sourcesContent": ["/**\n * External dependencies\n */\nimport { format, isSameDay, subMonths, addMonths, startOfDay, isEqual, addDays, subWeeks, addWeeks, isSameMonth, startOfWeek, endOfWeek } from 'date-fns';\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf, isRTL } from '@wordpress/i18n';\nimport { arrowLeft, arrowRight } from '@wordpress/icons';\nimport { getSettings, gmdateI18n } from '@wordpress/date';\nimport { useState, useRef, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useLilius } from './use-lilius';\nimport { Wrapper, Navigator, ViewPreviousMonthButton, ViewNextMonthButton, NavigatorHeading, Calendar, DayOfWeek, DayButton } from './styles';\nimport { inputToDate } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\n/**\n * DatePicker is a React component that renders a calendar for date selection.\n *\n * ```jsx\n * import { DatePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDatePicker = () => {\n *   const [ date, setDate ] = useState( new Date() );\n *\n *   return (\n *     <DatePicker\n *       currentDate={ date }\n *       onChange={ ( newDate ) => setDate( newDate ) }\n *     />\n *   );\n * };\n * ```\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nexport function DatePicker({\n  currentDate,\n  onChange,\n  events = [],\n  isInvalidDate,\n  onMonthPreviewed,\n  startOfWeek: weekStartsOn = 0\n}) {\n  const date = currentDate ? inputToDate(currentDate) : new Date();\n  const {\n    calendar,\n    viewing,\n    setSelected,\n    setViewing,\n    isSelected,\n    viewPreviousMonth,\n    viewNextMonth\n  } = useLilius({\n    selected: [startOfDay(date)],\n    viewing: startOfDay(date),\n    weekStartsOn\n  });\n\n  // Used to implement a roving tab index. Tracks the day that receives focus\n  // when the user tabs into the calendar.\n  const [focusable, setFocusable] = useState(startOfDay(date));\n\n  // Allows us to only programmatically focus() a day when focus was already\n  // within the calendar. This stops us stealing focus from e.g. a TimePicker\n  // input.\n  const [isFocusWithinCalendar, setIsFocusWithinCalendar] = useState(false);\n\n  // Update internal state when currentDate prop changes.\n  const [prevCurrentDate, setPrevCurrentDate] = useState(currentDate);\n  if (currentDate !== prevCurrentDate) {\n    setPrevCurrentDate(currentDate);\n    setSelected([startOfDay(date)]);\n    setViewing(startOfDay(date));\n    setFocusable(startOfDay(date));\n  }\n  return /*#__PURE__*/_jsxs(Wrapper, {\n    className: \"components-datetime__date\",\n    role: \"application\",\n    \"aria-label\": __('Calendar'),\n    children: [/*#__PURE__*/_jsxs(Navigator, {\n      children: [/*#__PURE__*/_jsx(ViewPreviousMonthButton, {\n        icon: isRTL() ? arrowRight : arrowLeft,\n        variant: \"tertiary\",\n        \"aria-label\": __('View previous month'),\n        onClick: () => {\n          viewPreviousMonth();\n          setFocusable(subMonths(focusable, 1));\n          onMonthPreviewed?.(format(subMonths(viewing, 1), TIMEZONELESS_FORMAT));\n        },\n        size: \"compact\"\n      }), /*#__PURE__*/_jsxs(NavigatorHeading, {\n        level: 3,\n        children: [/*#__PURE__*/_jsx(\"strong\", {\n          children: gmdateI18n('F', viewing)\n        }), ' ', gmdateI18n('Y', viewing)]\n      }), /*#__PURE__*/_jsx(ViewNextMonthButton, {\n        icon: isRTL() ? arrowLeft : arrowRight,\n        variant: \"tertiary\",\n        \"aria-label\": __('View next month'),\n        onClick: () => {\n          viewNextMonth();\n          setFocusable(addMonths(focusable, 1));\n          onMonthPreviewed?.(format(addMonths(viewing, 1), TIMEZONELESS_FORMAT));\n        },\n        size: \"compact\"\n      })]\n    }), /*#__PURE__*/_jsxs(Calendar, {\n      onFocus: () => setIsFocusWithinCalendar(true),\n      onBlur: () => setIsFocusWithinCalendar(false),\n      children: [calendar[0][0].map(day => /*#__PURE__*/_jsx(DayOfWeek, {\n        children: gmdateI18n('D', day)\n      }, day.toString())), calendar[0].map(week => week.map((day, index) => {\n        if (!isSameMonth(day, viewing)) {\n          return null;\n        }\n        return /*#__PURE__*/_jsx(Day, {\n          day: day,\n          column: index + 1,\n          isSelected: isSelected(day),\n          isFocusable: isEqual(day, focusable),\n          isFocusAllowed: isFocusWithinCalendar,\n          isToday: isSameDay(day, new Date()),\n          isInvalid: isInvalidDate ? isInvalidDate(day) : false,\n          numEvents: events.filter(event => isSameDay(event.date, day)).length,\n          onClick: () => {\n            setSelected([day]);\n            setFocusable(day);\n            onChange?.(format(\n            // Don't change the selected date's time fields.\n            new Date(day.getFullYear(), day.getMonth(), day.getDate(), date.getHours(), date.getMinutes(), date.getSeconds(), date.getMilliseconds()), TIMEZONELESS_FORMAT));\n          },\n          onKeyDown: event => {\n            let nextFocusable;\n            if (event.key === 'ArrowLeft') {\n              nextFocusable = addDays(day, isRTL() ? 1 : -1);\n            }\n            if (event.key === 'ArrowRight') {\n              nextFocusable = addDays(day, isRTL() ? -1 : 1);\n            }\n            if (event.key === 'ArrowUp') {\n              nextFocusable = subWeeks(day, 1);\n            }\n            if (event.key === 'ArrowDown') {\n              nextFocusable = addWeeks(day, 1);\n            }\n            if (event.key === 'PageUp') {\n              nextFocusable = subMonths(day, 1);\n            }\n            if (event.key === 'PageDown') {\n              nextFocusable = addMonths(day, 1);\n            }\n            if (event.key === 'Home') {\n              nextFocusable = startOfWeek(day);\n            }\n            if (event.key === 'End') {\n              nextFocusable = startOfDay(endOfWeek(day));\n            }\n            if (nextFocusable) {\n              event.preventDefault();\n              setFocusable(nextFocusable);\n              if (!isSameMonth(nextFocusable, viewing)) {\n                setViewing(nextFocusable);\n                onMonthPreviewed?.(format(nextFocusable, TIMEZONELESS_FORMAT));\n              }\n            }\n          }\n        }, day.toString());\n      }))]\n    })]\n  });\n}\nfunction Day({\n  day,\n  column,\n  isSelected,\n  isFocusable,\n  isFocusAllowed,\n  isToday,\n  isInvalid,\n  numEvents,\n  onClick,\n  onKeyDown\n}) {\n  const ref = useRef();\n\n  // Focus the day when it becomes focusable, e.g. because an arrow key is\n  // pressed. Only do this if focus is allowed - this stops us stealing focus\n  // from e.g. a TimePicker input.\n  useEffect(() => {\n    if (ref.current && isFocusable && isFocusAllowed) {\n      ref.current.focus();\n    }\n    // isFocusAllowed is not a dep as there is no point calling focus() on\n    // an already focused element.\n  }, [isFocusable]);\n  return /*#__PURE__*/_jsx(DayButton, {\n    __next40pxDefaultSize: true,\n    ref: ref,\n    className: \"components-datetime__date__day\" // Unused, for backwards compatibility.\n    ,\n    disabled: isInvalid,\n    tabIndex: isFocusable ? 0 : -1,\n    \"aria-label\": getDayLabel(day, isSelected, numEvents),\n    column: column,\n    isSelected: isSelected,\n    isToday: isToday,\n    hasEvents: numEvents > 0,\n    onClick: onClick,\n    onKeyDown: onKeyDown,\n    children: gmdateI18n('j', day)\n  });\n}\nfunction getDayLabel(date, isSelected, numEvents) {\n  const {\n    formats\n  } = getSettings();\n  const localizedDate = gmdateI18n(formats.date, date);\n  if (isSelected && numEvents > 0) {\n    return sprintf(\n    // translators: 1: The calendar date. 2: Number of events on the calendar date.\n    _n('%1$s. Selected. There is %2$d event', '%1$s. Selected. There are %2$d events', numEvents), localizedDate, numEvents);\n  } else if (isSelected) {\n    return sprintf(\n    // translators: 1: The calendar date.\n    __('%1$s. Selected'), localizedDate);\n  } else if (numEvents > 0) {\n    return sprintf(\n    // translators: 1: The calendar date. 2: Number of events on the calendar date.\n    _n('%1$s. There is %2$d event', '%1$s. There are %2$d events', numEvents), localizedDate, numEvents);\n  }\n  return localizedDate;\n}\nexport default DatePicker;"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport { isSameDay, subMonths, addMonths, isEqual, addDays, subDays, subWeeks, addWeeks, isSameMonth } from 'date-fns';\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf, isRTL } from '@wordpress/i18n';\nimport { arrowLeft, arrowRight } from '@wordpress/icons';\nimport { dateI18n, date as formatDate, getSettings } from '@wordpress/date';\nimport { useState, useRef, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { useLilius } from './use-lilius';\nimport { Wrapper, Navigator, ViewPreviousMonthButton, ViewNextMonthButton, NavigatorHeading, Calendar, DayOfWeek, DayButton } from './styles';\nimport { inputToDate, setInConfiguredTimezone, startOfDayInConfiguredTimezone } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\n/**\n * DatePicker is a React component that renders a calendar for date selection.\n *\n * ```jsx\n * import { DatePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDatePicker = () => {\n *   const [ date, setDate ] = useState( new Date() );\n *\n *   return (\n *     <DatePicker\n *       currentDate={ date }\n *       onChange={ ( newDate ) => setDate( newDate ) }\n *     />\n *   );\n * };\n * ```\n */\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nexport function DatePicker({\n  currentDate,\n  onChange,\n  events = [],\n  isInvalidDate,\n  onMonthPreviewed,\n  startOfWeek: weekStartsOn = 0\n}) {\n  const date = inputToDate(currentDate !== null && currentDate !== void 0 ? currentDate : new Date());\n  const {\n    calendar,\n    viewing,\n    setSelected,\n    setViewing,\n    isSelected,\n    viewPreviousMonth,\n    viewNextMonth\n  } = useLilius({\n    selected: [startOfDayInConfiguredTimezone(date)],\n    viewing: startOfDayInConfiguredTimezone(date),\n    weekStartsOn\n  });\n\n  // Used to implement a roving tab index. Tracks the day that receives focus\n  // when the user tabs into the calendar.\n  const [focusable, setFocusable] = useState(startOfDayInConfiguredTimezone(date));\n\n  // Allows us to only programmatically focus() a day when focus was already\n  // within the calendar. This stops us stealing focus from e.g. a TimePicker\n  // input.\n  const [isFocusWithinCalendar, setIsFocusWithinCalendar] = useState(false);\n\n  // Update internal state when currentDate prop changes.\n  const [prevCurrentDate, setPrevCurrentDate] = useState(currentDate);\n  if (currentDate !== prevCurrentDate) {\n    setPrevCurrentDate(currentDate);\n    setSelected([startOfDayInConfiguredTimezone(date)]);\n    setViewing(startOfDayInConfiguredTimezone(date));\n    setFocusable(startOfDayInConfiguredTimezone(date));\n  }\n  return /*#__PURE__*/_jsxs(Wrapper, {\n    className: \"components-datetime__date\",\n    role: \"application\",\n    \"aria-label\": __('Calendar'),\n    children: [/*#__PURE__*/_jsxs(Navigator, {\n      children: [/*#__PURE__*/_jsx(ViewPreviousMonthButton, {\n        icon: isRTL() ? arrowRight : arrowLeft,\n        variant: \"tertiary\",\n        \"aria-label\": __('View previous month'),\n        onClick: () => {\n          viewPreviousMonth();\n          setFocusable(subMonths(focusable, 1));\n          const prevMonth = subMonths(viewing, 1);\n          onMonthPreviewed?.(dateI18n(TIMEZONELESS_FORMAT, prevMonth, -prevMonth.getTimezoneOffset()));\n        },\n        size: \"compact\"\n      }), /*#__PURE__*/_jsxs(NavigatorHeading, {\n        level: 3,\n        children: [/*#__PURE__*/_jsx(\"strong\", {\n          children: dateI18n('F', viewing, -viewing.getTimezoneOffset())\n        }), ' ', dateI18n('Y', viewing, -viewing.getTimezoneOffset())]\n      }), /*#__PURE__*/_jsx(ViewNextMonthButton, {\n        icon: isRTL() ? arrowLeft : arrowRight,\n        variant: \"tertiary\",\n        \"aria-label\": __('View next month'),\n        onClick: () => {\n          viewNextMonth();\n          setFocusable(addMonths(focusable, 1));\n          const nextMonth = addMonths(viewing, 1);\n          onMonthPreviewed?.(dateI18n(TIMEZONELESS_FORMAT, nextMonth, -nextMonth.getTimezoneOffset()));\n        },\n        size: \"compact\"\n      })]\n    }), /*#__PURE__*/_jsxs(Calendar, {\n      onFocus: () => setIsFocusWithinCalendar(true),\n      onBlur: () => setIsFocusWithinCalendar(false),\n      children: [calendar[0][0].map(day => /*#__PURE__*/_jsx(DayOfWeek, {\n        children: dateI18n('D', day, -day.getTimezoneOffset())\n      }, day.toString())), calendar[0].map(week => week.map((day, index) => {\n        if (!isSameMonth(day, viewing)) {\n          return null;\n        }\n        return /*#__PURE__*/_jsx(Day, {\n          day: day,\n          column: index + 1,\n          isSelected: isSelected(day),\n          isFocusable: isEqual(day, focusable),\n          isFocusAllowed: isFocusWithinCalendar,\n          isToday: isSameDay(day, startOfDayInConfiguredTimezone(new Date())),\n          isInvalid: isInvalidDate ? isInvalidDate(day) : false,\n          numEvents: events.filter(event => isSameDay(event.date, day)).length,\n          onClick: () => {\n            setSelected([day]);\n            setFocusable(day);\n            const newDate = setInConfiguredTimezone(date, {\n              year: day.getFullYear(),\n              month: day.getMonth(),\n              date: day.getDate()\n            });\n            onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));\n          },\n          onKeyDown: event => {\n            let nextFocusable;\n            if (event.key === 'ArrowLeft') {\n              nextFocusable = addDays(day, isRTL() ? 1 : -1);\n            }\n            if (event.key === 'ArrowRight') {\n              nextFocusable = addDays(day, isRTL() ? -1 : 1);\n            }\n            if (event.key === 'ArrowUp') {\n              nextFocusable = subWeeks(day, 1);\n            }\n            if (event.key === 'ArrowDown') {\n              nextFocusable = addWeeks(day, 1);\n            }\n            if (event.key === 'PageUp') {\n              nextFocusable = subMonths(day, 1);\n            }\n            if (event.key === 'PageDown') {\n              nextFocusable = addMonths(day, 1);\n            }\n            if (event.key === 'Home') {\n              const dayOfWeek = day.getDay();\n              const daysToSubtract = (dayOfWeek - weekStartsOn + 7) % 7;\n              nextFocusable = subDays(day, daysToSubtract);\n            }\n            if (event.key === 'End') {\n              const dayOfWeek = day.getDay();\n              const daysToAdd = (weekStartsOn + 6 - dayOfWeek) % 7;\n              nextFocusable = addDays(day, daysToAdd);\n            }\n            if (nextFocusable) {\n              event.preventDefault();\n              setFocusable(nextFocusable);\n              if (!isSameMonth(nextFocusable, viewing)) {\n                setViewing(nextFocusable);\n                onMonthPreviewed?.(dateI18n(TIMEZONELESS_FORMAT, nextFocusable, -nextFocusable.getTimezoneOffset()));\n              }\n            }\n          }\n        }, day.toString());\n      }))]\n    })]\n  });\n}\nfunction Day({\n  day,\n  column,\n  isSelected,\n  isFocusable,\n  isFocusAllowed,\n  isToday,\n  isInvalid,\n  numEvents,\n  onClick,\n  onKeyDown\n}) {\n  const ref = useRef();\n\n  // Focus the day when it becomes focusable, e.g. because an arrow key is\n  // pressed. Only do this if focus is allowed - this stops us stealing focus\n  // from e.g. a TimePicker input.\n  useEffect(() => {\n    if (ref.current && isFocusable && isFocusAllowed) {\n      ref.current.focus();\n    }\n    // isFocusAllowed is not a dep as there is no point calling focus() on\n    // an already focused element.\n  }, [isFocusable]);\n  return /*#__PURE__*/_jsx(DayButton, {\n    __next40pxDefaultSize: true,\n    ref: ref,\n    className: \"components-datetime__date__day\" // Unused, for backwards compatibility.\n    ,\n    disabled: isInvalid,\n    tabIndex: isFocusable ? 0 : -1,\n    \"aria-label\": getDayLabel(day, isSelected, isToday, numEvents),\n    column: column,\n    isSelected: isSelected,\n    isToday: isToday,\n    hasEvents: numEvents > 0,\n    onClick: onClick,\n    onKeyDown: onKeyDown,\n    children: dateI18n('j', day, -day.getTimezoneOffset())\n  });\n}\nfunction getDayLabel(date, isSelected, isToday, numEvents) {\n  const {\n    formats\n  } = getSettings();\n  const localizedDate = dateI18n(formats.date, date, -date.getTimezoneOffset());\n  const parts = [localizedDate];\n  if (isSelected) {\n    parts.push(__('Selected'));\n  }\n  if (isToday) {\n    parts.push(__('Today'));\n  }\n  if (numEvents > 0) {\n    parts.push(sprintf(\n    // translators: %d: Number of events on the calendar date.\n    _n('There is %d event', 'There are %d events', numEvents), numEvents));\n  }\n  return parts.join('. ');\n}\nexport default DatePicker;"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,10 +1,10 @@
 // packages/components/src/date-time/date/styles.ts
 import _styled from "@emotion/styled/base";
-import Button from "../../button";
-import { boxSizingReset, COLORS, CONFIG } from "../../utils";
-import { HStack } from "../../h-stack";
-import { Heading } from "../../heading";
-import { space } from "../../utils/space";
+import Button from "../../button/index.js";
+import { boxSizingReset, COLORS, CONFIG } from "../../utils/index.js";
+import { HStack } from "../../h-stack/index.js";
+import { Heading } from "../../heading/index.js";
+import { space } from "../../utils/space.js";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }

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

@@ -1,8 +1,8 @@
 // packages/components/src/date-time/date-time/index.tsx
 import { forwardRef } from "@wordpress/element";
-import { default as DatePicker } from "../date";
-import { default as TimePicker } from "../time";
-import { Wrapper } from "./styles";
+import { default as DatePicker } from "../date/index.js";
+import { default as TimePicker } from "../time/index.js";
+import { Wrapper } from "./styles.js";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 var noop = () => {
 };

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

@@ -1,6 +1,6 @@
 // packages/components/src/date-time/date-time/styles.ts
 import _styled from "@emotion/styled/base";
-import { VStack } from "../../v-stack";
+import { VStack } from "../../v-stack/index.js";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }

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

@@ -1,7 +1,7 @@
 // packages/components/src/date-time/index.ts
-import { default as DatePicker } from "./date";
-import { default as TimePicker } from "./time";
-import { default as DateTimePicker } from "./date-time";
+import { default as DatePicker } from "./date/index.js";
+import { default as TimePicker } from "./time/index.js";
+import { default as DateTimePicker } from "./date-time/index.js";
 var date_time_default = DateTimePicker;
 export {
   DatePicker,

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

@@ -1,17 +1,18 @@
 // packages/components/src/date-time/time/index.tsx
-import { startOfMinute, format, set, setMonth } from "date-fns";
+import { startOfMinute } from "date-fns";
 import { useState, useMemo, useEffect } from "@wordpress/element";
 import { __ } from "@wordpress/i18n";
-import BaseControl from "../../base-control";
-import { VisuallyHidden } from "../../visually-hidden";
-import SelectControl from "../../select-control";
-import TimeZone from "./timezone";
-import { Wrapper, Fieldset, MonthSelectWrapper, DayInput, YearInput } from "./styles";
-import { HStack } from "../../h-stack";
-import { Spacer } from "../../spacer";
-import { inputToDate, buildPadInputStateReducer, validateInputElementTarget } from "../utils";
-import { TIMEZONELESS_FORMAT } from "../constants";
-import { TimeInput } from "./time-input";
+import { date as formatDate } from "@wordpress/date";
+import BaseControl from "../../base-control/index.js";
+import { VisuallyHidden } from "../../visually-hidden/index.js";
+import SelectControl from "../../select-control/index.js";
+import TimeZone from "./timezone.js";
+import { Wrapper, Fieldset, MonthSelectWrapper, DayInput, YearInput } from "./styles.js";
+import { HStack } from "../../h-stack/index.js";
+import { Spacer } from "../../spacer/index.js";
+import { inputToDate, buildPadInputStateReducer, validateInputElementTarget, setInConfiguredTimezone } from "../utils.js";
+import { TIMEZONELESS_FORMAT } from "../constants.js";
+import { TimeInput } from "./time-input/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 var VALID_DATE_ORDERS = ["dmy", "mdy", "ymd"];
 function TimePicker({
@@ -23,10 +24,10 @@ function TimePicker({
 }) {
   const [date, setDate] = useState(() => (
     // Truncate the date at the minutes, see: #15495.
-    currentTime ? startOfMinute(inputToDate(currentTime)) : /* @__PURE__ */ new Date()
+    startOfMinute(inputToDate(currentTime !== null && currentTime !== void 0 ? currentTime : /* @__PURE__ */ new Date()))
   ));
   useEffect(() => {
-    setDate(currentTime ? startOfMinute(inputToDate(currentTime)) : /* @__PURE__ */ new Date());
+    setDate(startOfMinute(inputToDate(currentTime !== null && currentTime !== void 0 ? currentTime : /* @__PURE__ */ new Date())));
   }, [currentTime]);
   const monthOptions = [{
     value: "01",
@@ -72,12 +73,11 @@ function TimePicker({
     minutes,
     hours
   } = useMemo(() => ({
-    day: format(date, "dd"),
-    month: format(date, "MM"),
-    year: format(date, "yyyy"),
-    minutes: format(date, "mm"),
-    hours: format(date, "HH"),
-    am: format(date, "a")
+    day: formatDate("d", date),
+    month: formatDate("m", date),
+    year: formatDate("Y", date),
+    minutes: formatDate("i", date),
+    hours: formatDate("H", date)
   }), [date]);
   const buildNumberControlChangeCallback = (method) => {
     const callback = (value, {
@@ -87,11 +87,11 @@ function TimePicker({
         return;
       }
       const numberValue = Number(value);
-      const newDate = set(date, {
+      const newDate = setInConfiguredTimezone(date, {
         [method]: numberValue
       });
       setDate(newDate);
-      onChange?.(format(newDate, TIMEZONELESS_FORMAT));
+      onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));
     };
     return callback;
   };
@@ -99,12 +99,12 @@ function TimePicker({
     hours: newHours,
     minutes: newMinutes
   }) => {
-    const newDate = set(date, {
+    const newDate = setInConfiguredTimezone(date, {
       hours: newHours,
       minutes: newMinutes
     });
     setDate(newDate);
-    onChange?.(format(newDate, TIMEZONELESS_FORMAT));
+    onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));
   };
   const dayField = /* @__PURE__ */ _jsx(DayInput, {
     className: "components-datetime__time-field components-datetime__time-field-day",
@@ -128,13 +128,14 @@ function TimePicker({
       label: __("Month"),
       hideLabelFromVision: true,
       __next40pxDefaultSize: true,
-      __nextHasNoMarginBottom: true,
       value: month,
       options: monthOptions,
       onChange: (value) => {
-        const newDate = setMonth(date, Number(value) - 1);
+        const newDate = setInConfiguredTimezone(date, {
+          month: Number(value) - 1
+        });
         setDate(newDate);
-        onChange?.(format(newDate, TIMEZONELESS_FORMAT));
+        onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));
       }
     })
   }, "month");

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../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 { VisuallyHidden } from '../../visually-hidden';\nimport SelectControl from '../../select-control';\nimport TimeZone from './timezone';\nimport { Wrapper, Fieldset, MonthSelectWrapper, DayInput, YearInput } from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport { inputToDate, buildPadInputStateReducer, validateInputElementTarget } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\nimport { TimeInput } from './time-input';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\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  is12Hour,\n  currentTime,\n  onChange,\n  dateOrder: dateOrderProp,\n  hideLabelFromVision = false\n}) {\n  const [date, setDate] = useState(() =>\n  // Truncate the date at the minutes, see: #15495.\n  currentTime ? startOfMinute(inputToDate(currentTime)) : new Date());\n\n  // Reset the state when currentTime changed.\n  // TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n  useEffect(() => {\n    setDate(currentTime ? startOfMinute(inputToDate(currentTime)) : new Date());\n  }, [currentTime]);\n  const monthOptions = [{\n    value: '01',\n    label: __('January')\n  }, {\n    value: '02',\n    label: __('February')\n  }, {\n    value: '03',\n    label: __('March')\n  }, {\n    value: '04',\n    label: __('April')\n  }, {\n    value: '05',\n    label: __('May')\n  }, {\n    value: '06',\n    label: __('June')\n  }, {\n    value: '07',\n    label: __('July')\n  }, {\n    value: '08',\n    label: __('August')\n  }, {\n    value: '09',\n    label: __('September')\n  }, {\n    value: '10',\n    label: __('October')\n  }, {\n    value: '11',\n    label: __('November')\n  }, {\n    value: '12',\n    label: __('December')\n  }];\n  const {\n    day,\n    month,\n    year,\n    minutes,\n    hours\n  } = useMemo(() => ({\n    day: format(date, 'dd'),\n    month: format(date, 'MM'),\n    year: format(date, 'yyyy'),\n    minutes: format(date, 'mm'),\n    hours: format(date, 'HH'),\n    am: format(date, 'a')\n  }), [date]);\n  const buildNumberControlChangeCallback = method => {\n    const callback = (value, {\n      event\n    }) => {\n      if (!validateInputElementTarget(event)) {\n        return;\n      }\n\n      // We can safely assume value is a number if target is valid.\n      const numberValue = Number(value);\n      const newDate = set(date, {\n        [method]: numberValue\n      });\n      setDate(newDate);\n      onChange?.(format(newDate, TIMEZONELESS_FORMAT));\n    };\n    return callback;\n  };\n  const onTimeInputChangeCallback = ({\n    hours: newHours,\n    minutes: newMinutes\n  }) => {\n    const newDate = set(date, {\n      hours: newHours,\n      minutes: newMinutes\n    });\n    setDate(newDate);\n    onChange?.(format(newDate, TIMEZONELESS_FORMAT));\n  };\n  const dayField = /*#__PURE__*/_jsx(DayInput, {\n    className: \"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n    ,\n    label: __('Day'),\n    hideLabelFromVision: true,\n    __next40pxDefaultSize: true,\n    value: day,\n    step: 1,\n    min: 1,\n    max: 31,\n    required: true,\n    spinControls: \"none\",\n    isPressEnterToChange: true,\n    isDragEnabled: false,\n    isShiftStepEnabled: false,\n    onChange: buildNumberControlChangeCallback('date')\n  }, \"day\");\n  const monthField = /*#__PURE__*/_jsx(MonthSelectWrapper, {\n    children: /*#__PURE__*/_jsx(SelectControl, {\n      className: \"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n      ,\n      label: __('Month'),\n      hideLabelFromVision: true,\n      __next40pxDefaultSize: true,\n      __nextHasNoMarginBottom: true,\n      value: month,\n      options: monthOptions,\n      onChange: value => {\n        const newDate = setMonth(date, Number(value) - 1);\n        setDate(newDate);\n        onChange?.(format(newDate, TIMEZONELESS_FORMAT));\n      }\n    })\n  }, \"month\");\n  const yearField = /*#__PURE__*/_jsx(YearInput, {\n    className: \"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n    ,\n    label: __('Year'),\n    hideLabelFromVision: true,\n    __next40pxDefaultSize: true,\n    value: year,\n    step: 1,\n    min: 1,\n    max: 9999,\n    required: true,\n    spinControls: \"none\",\n    isPressEnterToChange: true,\n    isDragEnabled: false,\n    isShiftStepEnabled: false,\n    onChange: buildNumberControlChangeCallback('year'),\n    __unstableStateReducer: buildPadInputStateReducer(4)\n  }, \"year\");\n  const defaultDateOrder = is12Hour ? 'mdy' : 'dmy';\n  const dateOrder = dateOrderProp && VALID_DATE_ORDERS.includes(dateOrderProp) ? dateOrderProp : defaultDateOrder;\n  const fields = dateOrder.split('').map(field => {\n    switch (field) {\n      case 'd':\n        return dayField;\n      case 'm':\n        return monthField;\n      case 'y':\n        return yearField;\n      default:\n        return null;\n    }\n  });\n  return /*#__PURE__*/_jsxs(Wrapper, {\n    className: \"components-datetime__time\" // Unused, for backwards compatibility.\n    ,\n    children: [/*#__PURE__*/_jsxs(Fieldset, {\n      children: [hideLabelFromVision ? /*#__PURE__*/_jsx(VisuallyHidden, {\n        as: \"legend\",\n        children: __('Time')\n      }) : /*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n        as: \"legend\",\n        className: \"components-datetime__time-legend\" // Unused, for backwards compatibility.\n        ,\n        children: __('Time')\n      }), /*#__PURE__*/_jsxs(HStack, {\n        className: \"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n        ,\n        children: [/*#__PURE__*/_jsx(TimeInput, {\n          value: {\n            hours: Number(hours),\n            minutes: Number(minutes)\n          },\n          is12Hour: is12Hour,\n          onChange: onTimeInputChangeCallback\n        }), /*#__PURE__*/_jsx(Spacer, {}), /*#__PURE__*/_jsx(TimeZone, {})]\n      })]\n    }), /*#__PURE__*/_jsxs(Fieldset, {\n      children: [hideLabelFromVision ? /*#__PURE__*/_jsx(VisuallyHidden, {\n        as: \"legend\",\n        children: __('Date')\n      }) : /*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n        as: \"legend\",\n        className: \"components-datetime__time-legend\" // Unused, for backwards compatibility.\n        ,\n        children: __('Date')\n      }), /*#__PURE__*/_jsx(HStack, {\n        className: \"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n        ,\n        children: fields\n      })]\n    })]\n  });\n}\n\n/**\n * A component to input a time.\n *\n * Values are passed as an object in 24-hour format (`{ hours: number, minutes: number }`).\n *\n * ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTimeInput = () => {\n * \tconst [ time, setTime ] = useState( { hours: 13, minutes: 30 } );\n *\n * \treturn (\n * \t\t<TimePicker.TimeInput\n * \t\t\tvalue={ time }\n * \t\t\tonChange={ setTime }\n * \t\t\tlabel=\"Time\"\n * \t\t/>\n * \t);\n * };\n * ```\n */\nTimePicker.TimeInput = TimeInput;\nObject.assign(TimePicker.TimeInput, {\n  displayName: 'TimePicker.TimeInput'\n});\nexport default TimePicker;"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport { startOfMinute } from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useMemo, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport { date as formatDate } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../../base-control';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport SelectControl from '../../select-control';\nimport TimeZone from './timezone';\nimport { Wrapper, Fieldset, MonthSelectWrapper, DayInput, YearInput } from './styles';\nimport { HStack } from '../../h-stack';\nimport { Spacer } from '../../spacer';\nimport { inputToDate, buildPadInputStateReducer, validateInputElementTarget, setInConfiguredTimezone } from '../utils';\nimport { TIMEZONELESS_FORMAT } from '../constants';\nimport { TimeInput } from './time-input';\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\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  is12Hour,\n  currentTime,\n  onChange,\n  dateOrder: dateOrderProp,\n  hideLabelFromVision = false\n}) {\n  const [date, setDate] = useState(() =>\n  // Truncate the date at the minutes, see: #15495.\n  startOfMinute(inputToDate(currentTime !== null && currentTime !== void 0 ? currentTime : new Date())));\n\n  // Reset the state when currentTime changed.\n  // TODO: useEffect() shouldn't be used like this, causes an unnecessary render\n  useEffect(() => {\n    setDate(startOfMinute(inputToDate(currentTime !== null && currentTime !== void 0 ? currentTime : new Date())));\n  }, [currentTime]);\n  const monthOptions = [{\n    value: '01',\n    label: __('January')\n  }, {\n    value: '02',\n    label: __('February')\n  }, {\n    value: '03',\n    label: __('March')\n  }, {\n    value: '04',\n    label: __('April')\n  }, {\n    value: '05',\n    label: __('May')\n  }, {\n    value: '06',\n    label: __('June')\n  }, {\n    value: '07',\n    label: __('July')\n  }, {\n    value: '08',\n    label: __('August')\n  }, {\n    value: '09',\n    label: __('September')\n  }, {\n    value: '10',\n    label: __('October')\n  }, {\n    value: '11',\n    label: __('November')\n  }, {\n    value: '12',\n    label: __('December')\n  }];\n  const {\n    day,\n    month,\n    year,\n    minutes,\n    hours\n  } = useMemo(() => ({\n    day: formatDate('d', date),\n    month: formatDate('m', date),\n    year: formatDate('Y', date),\n    minutes: formatDate('i', date),\n    hours: formatDate('H', date)\n  }), [date]);\n  const buildNumberControlChangeCallback = method => {\n    const callback = (value, {\n      event\n    }) => {\n      if (!validateInputElementTarget(event)) {\n        return;\n      }\n\n      // We can safely assume value is a number if target is valid.\n      const numberValue = Number(value);\n\n      // Internal date is UTC-normalized, but the field should be updated\n      // as if in the configured timezone.\n      const newDate = setInConfiguredTimezone(date, {\n        [method]: numberValue\n      });\n      setDate(newDate);\n      onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));\n    };\n    return callback;\n  };\n  const onTimeInputChangeCallback = ({\n    hours: newHours,\n    minutes: newMinutes\n  }) => {\n    // Internal date is UTC-normalized, but the field should be updated\n    // as if in the configured timezone.\n    const newDate = setInConfiguredTimezone(date, {\n      hours: newHours,\n      minutes: newMinutes\n    });\n    setDate(newDate);\n    onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));\n  };\n  const dayField = /*#__PURE__*/_jsx(DayInput, {\n    className: \"components-datetime__time-field components-datetime__time-field-day\" // Unused, for backwards compatibility.\n    ,\n    label: __('Day'),\n    hideLabelFromVision: true,\n    __next40pxDefaultSize: true,\n    value: day,\n    step: 1,\n    min: 1,\n    max: 31,\n    required: true,\n    spinControls: \"none\",\n    isPressEnterToChange: true,\n    isDragEnabled: false,\n    isShiftStepEnabled: false,\n    onChange: buildNumberControlChangeCallback('date')\n  }, \"day\");\n  const monthField = /*#__PURE__*/_jsx(MonthSelectWrapper, {\n    children: /*#__PURE__*/_jsx(SelectControl, {\n      className: \"components-datetime__time-field components-datetime__time-field-month\" // Unused, for backwards compatibility.\n      ,\n      label: __('Month'),\n      hideLabelFromVision: true,\n      __next40pxDefaultSize: true,\n      value: month,\n      options: monthOptions,\n      onChange: value => {\n        // Internal date is UTC-normalized, but the field should be updated\n        // as if in the configured timezone.\n        const newDate = setInConfiguredTimezone(date, {\n          month: Number(value) - 1\n        });\n        setDate(newDate);\n        onChange?.(formatDate(TIMEZONELESS_FORMAT, newDate));\n      }\n    })\n  }, \"month\");\n  const yearField = /*#__PURE__*/_jsx(YearInput, {\n    className: \"components-datetime__time-field components-datetime__time-field-year\" // Unused, for backwards compatibility.\n    ,\n    label: __('Year'),\n    hideLabelFromVision: true,\n    __next40pxDefaultSize: true,\n    value: year,\n    step: 1,\n    min: 1,\n    max: 9999,\n    required: true,\n    spinControls: \"none\",\n    isPressEnterToChange: true,\n    isDragEnabled: false,\n    isShiftStepEnabled: false,\n    onChange: buildNumberControlChangeCallback('year'),\n    __unstableStateReducer: buildPadInputStateReducer(4)\n  }, \"year\");\n  const defaultDateOrder = is12Hour ? 'mdy' : 'dmy';\n  const dateOrder = dateOrderProp && VALID_DATE_ORDERS.includes(dateOrderProp) ? dateOrderProp : defaultDateOrder;\n  const fields = dateOrder.split('').map(field => {\n    switch (field) {\n      case 'd':\n        return dayField;\n      case 'm':\n        return monthField;\n      case 'y':\n        return yearField;\n      default:\n        return null;\n    }\n  });\n  return /*#__PURE__*/_jsxs(Wrapper, {\n    className: \"components-datetime__time\" // Unused, for backwards compatibility.\n    ,\n    children: [/*#__PURE__*/_jsxs(Fieldset, {\n      children: [hideLabelFromVision ? /*#__PURE__*/_jsx(VisuallyHidden, {\n        as: \"legend\",\n        children: __('Time')\n      }) : /*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n        as: \"legend\",\n        className: \"components-datetime__time-legend\" // Unused, for backwards compatibility.\n        ,\n        children: __('Time')\n      }), /*#__PURE__*/_jsxs(HStack, {\n        className: \"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n        ,\n        children: [/*#__PURE__*/_jsx(TimeInput, {\n          value: {\n            hours: Number(hours),\n            minutes: Number(minutes)\n          },\n          is12Hour: is12Hour,\n          onChange: onTimeInputChangeCallback\n        }), /*#__PURE__*/_jsx(Spacer, {}), /*#__PURE__*/_jsx(TimeZone, {})]\n      })]\n    }), /*#__PURE__*/_jsxs(Fieldset, {\n      children: [hideLabelFromVision ? /*#__PURE__*/_jsx(VisuallyHidden, {\n        as: \"legend\",\n        children: __('Date')\n      }) : /*#__PURE__*/_jsx(BaseControl.VisualLabel, {\n        as: \"legend\",\n        className: \"components-datetime__time-legend\" // Unused, for backwards compatibility.\n        ,\n        children: __('Date')\n      }), /*#__PURE__*/_jsx(HStack, {\n        className: \"components-datetime__time-wrapper\" // Unused, for backwards compatibility.\n        ,\n        children: fields\n      })]\n    })]\n  });\n}\n\n/**\n * A component to input a time.\n *\n * Values are passed as an object in 24-hour format (`{ hours: number, minutes: number }`).\n *\n * ```jsx\n * import { TimePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTimeInput = () => {\n * \tconst [ time, setTime ] = useState( { hours: 13, minutes: 30 } );\n *\n * \treturn (\n * \t\t<TimePicker.TimeInput\n * \t\t\tvalue={ time }\n * \t\t\tonChange={ setTime }\n * \t\t\tlabel=\"Time\"\n * \t\t/>\n * \t);\n * };\n * ```\n */\nTimePicker.TimeInput = TimeInput;\nObject.assign(TimePicker.TimeInput, {\n  displayName: 'TimePicker.TimeInput'\n});\nexport default TimePicker;"],
+  "mappings": "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",
   "names": []
 }

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

@@ -1,10 +1,10 @@
 // packages/components/src/date-time/time/styles.ts
 import _styled from "@emotion/styled/base";
 import { css } from "@emotion/react";
-import { COLORS, CONFIG } from "../../utils";
-import { space } from "../../utils/space";
-import { Input, BackdropUI } from "../../input-control/styles/input-control-styles";
-import NumberControl from "../../number-control";
+import { COLORS, CONFIG } from "../../utils/index.js";
+import { space } from "../../utils/space.js";
+import { Input, BackdropUI } from "../../input-control/styles/input-control-styles.js";
+import NumberControl from "../../number-control/index.js";
 function _EMOTION_STRINGIFIED_CSS_ERROR__() {
   return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";
 }

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

@@ -2,12 +2,12 @@
 import clsx from "clsx";
 import { __ } from "@wordpress/i18n";
 import { Fragment } from "@wordpress/element";
-import { TimeWrapper, TimeSeparator, HoursInput, MinutesInput, Fieldset } from "../styles";
-import { HStack } from "../../../h-stack";
-import { from12hTo24h, from24hTo12h, buildPadInputStateReducer, validateInputElementTarget } from "../../utils";
-import { useControlledValue } from "../../../utils";
-import BaseControl from "../../../base-control";
-import { ToggleGroupControl, ToggleGroupControlOption } from "../../../toggle-group-control";
+import { TimeWrapper, TimeSeparator, HoursInput, MinutesInput, Fieldset } from "../styles.js";
+import { HStack } from "../../../h-stack/index.js";
+import { from12hTo24h, from24hTo12h, buildPadInputStateReducer, validateInputElementTarget } from "../../utils.js";
+import { useControlledValue } from "../../../utils/index.js";
+import BaseControl from "../../../base-control/index.js";
+import { ToggleGroupControl, ToggleGroupControlOption } from "../../../toggle-group-control/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 function TimeInput({
   value: valueProp,
@@ -112,7 +112,6 @@ function TimeInput({
         })]
       }), is12Hour && /* @__PURE__ */ _jsxs(ToggleGroupControl, {
         __next40pxDefaultSize: true,
-        __nextHasNoMarginBottom: true,
         isBlock: true,
         label: __("Select AM or PM"),
         hideLabelFromVision: true,