@atlaskit/datetime-picker 17.7.0 → 17.8.1

package/dist/es2019/internal/fixed-layer-menu-top-layer.js

@@ -0,0 +1,103 @@
+/* fixed-layer-menu-top-layer.tsx generated by @compiled/babel-plugin v0.39.1 */
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { useRef } from 'react';
+import { components } from '@atlaskit/select';
+import { slideAndFade } from '@atlaskit/top-layer/animations';
+import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
+import { Popup } from '@atlaskit/top-layer/popup';
+const animation = slideAndFade();
+
+/**
+ * Bottom-start placement: time options menu appears below and aligned to the
+ * start edge of the trigger (the select input).
+ */
+const popupPlacement = fromLegacyPlacement({
+  legacy: 'bottom-start'
+});
+
+/**
+ * Top-layer version of the fixed layer menu used in the time picker.
+ *
+ * Uses `@atlaskit/top-layer/popup` (Popup.Content + Popup.Surface) so the
+ * time options list renders in the browser's top layer via the native Popover API
+ * and is positioned via CSS Anchor Positioning. This avoids overflow clipping,
+ * z-index wars, and portal-based layering.
+ *
+ * Gated behind the `platform-dst-top-layer` feature flag.
+ */
+export const FixedLayerMenuTopLayer = ({
+  className,
+  clearValue,
+  cx,
+  getStyles,
+  getValue,
+  hasValue,
+  innerProps,
+  innerRef,
+  isLoading,
+  isMulti,
+  isRtl,
+  maxMenuHeight,
+  menuPlacement,
+  menuPosition,
+  menuShouldScrollIntoView,
+  minMenuHeight,
+  options,
+  placement,
+  selectOption,
+  selectProps,
+  setValue,
+  children,
+  ...rest
+}) => {
+  var _selectProps$fixedLay, _selectProps$fixedLay2;
+  // The select's container element is the anchor for the popup.
+  // @ts-ignore -- fixedLayerRef is a custom prop passed through selectProps
+  const triggerRef = useRef((_selectProps$fixedLay = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay !== void 0 ? _selectProps$fixedLay : null);
+  // @ts-ignore -- fixedLayerRef is a custom prop passed through selectProps
+  triggerRef.current = (_selectProps$fixedLay2 = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay2 !== void 0 ? _selectProps$fixedLay2 : null;
+  return /*#__PURE__*/React.createElement(Popup.Content, {
+    role: "listbox",
+    isOpen: true
+    // `mode="manual"` opts out of the native popover light-dismiss
+    // (Esc / click-outside). react-select already owns those: opening
+    // the menu via a click on the input that lives outside the popover
+    // element triggers the browser's auto-dismiss as that very click
+    // bubbles, slamming the menu shut before the user sees it. With
+    // `manual`, react-select's existing onMenuClose / outside-click
+    // logic remains the single source of truth.
+    ,
+    mode: "manual",
+    placement: popupPlacement,
+    triggerRef: triggerRef,
+    animate: animation
+    // @ts-ignore -- testId is a custom prop passed through selectProps
+    ,
+    testId: selectProps.testId && `${selectProps.testId}--popup`
+  }, /*#__PURE__*/React.createElement(Popup.Surface, null, /*#__PURE__*/React.createElement(components.Menu, _extends({}, rest, {
+    // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides, @atlaskit/ui-styling-standard/no-classname-prop
+    className: className,
+    clearValue: clearValue,
+    cx: cx,
+    getStyles: getStyles,
+    getValue: getValue,
+    hasValue: hasValue,
+    innerProps: innerProps,
+    innerRef: innerRef,
+    isLoading: isLoading,
+    isMulti: isMulti,
+    isRtl: isRtl,
+    maxMenuHeight: maxMenuHeight,
+    menuPlacement: menuPlacement,
+    menuPosition: menuPosition,
+    menuShouldScrollIntoView: false || menuShouldScrollIntoView,
+    minMenuHeight: minMenuHeight,
+    options: options,
+    placement: placement,
+    selectOption: selectOption,
+    selectProps: selectProps,
+    setValue: setValue
+  }), children)));
+};

package/dist/es2019/internal/format-date-time-zone-into-iso.js

@@ -0,0 +1,9 @@
+/**
+ * Formats a date, time, and zone into a ISO string.
+ */
+export function formatDateTimeZoneIntoIso(date, time, zone) {
+  // 12:00 => 12:00, 1:00 => 01:00
+  const needsLeadingZero = /^\d:/;
+  const sanitizedTime = needsLeadingZero.test(time) ? `0${time}` : time;
+  return `${date}T${sanitizedTime}${zone}`;
+}

package/dist/es2019/internal/format-date.js

@@ -18,8 +18,8 @@
 
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 import { format, parseISO } from 'date-fns';
+import { defaultDateFormat } from './default-date-format';
 import { convertTokens } from './parse-tokens';
-import { defaultDateFormat } from './index';
 export const formatDate = (value, di) => {
   const {
     formatDisplayLabel,

package/dist/es2019/internal/get-parsed-iso.js

@@ -18,7 +18,7 @@
 
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 import { lastDayOfMonth } from 'date-fns';
-import { padToTwo } from './index';
+import { padToTwo } from './pad-two';
 export const getParsedISO = di => {
   const {
     iso

package/dist/es2019/internal/get-placeholder.js

@@ -18,7 +18,7 @@
 
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 
-import { placeholderDatetime } from './index';
+import { placeholderDatetime } from './placeholder-date-time';
 export const getPlaceholder = di => {
   const {
     placeholder,

package/dist/es2019/internal/menu-top-layer.js

@@ -0,0 +1,111 @@
+/* menu-top-layer.tsx generated by @compiled/babel-plugin v0.39.1 */
+import _extends from "@babel/runtime/helpers/extends";
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { Fragment, useRef } from 'react';
+import { isValid, parseISO } from 'date-fns';
+import Calendar from '@atlaskit/calendar';
+import { slideAndFade } from '@atlaskit/top-layer/animations';
+import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
+import { Popup } from '@atlaskit/top-layer/popup';
+const animation = slideAndFade();
+
+/**
+ * Bottom-start placement: calendar appears below and aligned to the
+ * start edge of the trigger (the select input).
+ */
+const popupPlacement = fromLegacyPlacement({
+  legacy: 'bottom-start'
+});
+
+/**
+ * @param isos A series of ISO dates.
+ * @returns The last valid date within the array of ISO strings.
+ */
+function getValidDate(isos) {
+  return isos.reduce((acc, iso) => {
+    const date = parseISO(iso);
+    return isValid(date) ? {
+      day: date.getDate(),
+      month: date.getMonth() + 1,
+      year: date.getFullYear()
+    } : acc;
+  }, {});
+}
+
+/**
+ * Top-layer version of the date picker menu.
+ *
+ * Uses `@atlaskit/top-layer/popup` (Popup.Content + Popup.Surface) so the
+ * calendar renders in the browser's top layer via the native Popover API
+ * and is positioned via CSS Anchor Positioning. This avoids overflow clipping,
+ * z-index wars, and portal-based layering.
+ *
+ * Gated behind the `platform-dst-top-layer` feature flag.
+ */
+export const MenuTopLayer = ({
+  selectProps,
+  innerProps
+}) => {
+  var _selectProps$calendar, _selectProps$calendar2;
+  const {
+    calendarValue,
+    calendarView,
+    menuInnerWrapper: MenuInnerWrapper
+  } = selectProps;
+  const {
+    day,
+    month,
+    year
+  } = getValidDate([calendarValue, calendarView]);
+
+  // The select's container element is the anchor for the popup.
+  const triggerRef = useRef((_selectProps$calendar = selectProps.calendarContainerRef) !== null && _selectProps$calendar !== void 0 ? _selectProps$calendar : null);
+  triggerRef.current = (_selectProps$calendar2 = selectProps.calendarContainerRef) !== null && _selectProps$calendar2 !== void 0 ? _selectProps$calendar2 : null;
+  const onMenuMouseDown = event => {
+    if (event.button !== 0) {
+      return;
+    }
+    event.stopPropagation();
+    event.preventDefault();
+  };
+  const Wrapper = typeof MenuInnerWrapper === 'function' ? MenuInnerWrapper : Fragment;
+  return /*#__PURE__*/React.createElement(Popup.Content, {
+    role: "dialog",
+    label: "calendar",
+    isOpen: true
+    // `mode="manual"` opts out of native popover light-dismiss.
+    // react-select / DateTimePicker already own outside-click and
+    // Esc handling. Without this, the same click that opens the
+    // menu (which targets the select input outside the popover)
+    // also bubbles to the browser's auto-dismiss handler and
+    // immediately closes the popover.
+    ,
+    mode: "manual",
+    placement: popupPlacement,
+    triggerRef: triggerRef,
+    animate: animation,
+    testId: selectProps.testId && `${selectProps.testId}--popup`
+  }, /*#__PURE__*/React.createElement(Popup.Surface, null, /*#__PURE__*/React.createElement("div", _extends({}, innerProps, {
+    role: "presentation",
+    onMouseDown: onMenuMouseDown
+  }), /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(Calendar, {
+    day: day,
+    month: month,
+    year: year,
+    disabled: selectProps.calendarDisabled,
+    disabledDateFilter: selectProps.calendarDisabledDateFilter,
+    minDate: selectProps.calendarMinDate,
+    maxDate: selectProps.calendarMaxDate,
+    nextMonthLabel: selectProps.nextMonthLabel,
+    onChange: selectProps.onCalendarChange,
+    onSelect: selectProps.onCalendarSelect,
+    previousMonthLabel: selectProps.previousMonthLabel,
+    ref: selectProps.calendarRef,
+    selected: [selectProps.calendarValue],
+    shouldSetFocusOnCurrentDay: selectProps.shouldSetFocusOnCurrentDay,
+    locale: selectProps.calendarLocale,
+    testId: selectProps.testId && `${selectProps.testId}--calendar`,
+    weekStartDay: selectProps.calendarWeekStartDay
+  })))));
+};

package/dist/es2019/internal/pad-two.js

@@ -0,0 +1,3 @@
+export function padToTwo(number) {
+  return number <= 99 ? `0${number}`.slice(-2) : `${number}`;
+}

package/dist/es2019/internal/parse-date.js

@@ -16,7 +16,7 @@
  * broken out to be it's own function.
  */
 
-import { defaultDateFormat } from './index';
+import { defaultDateFormat } from './default-date-format';
 
 /**
  * There are two props that can change how the date is parsed.

package/dist/es2019/internal/placeholder-date-time.js

@@ -0,0 +1,3 @@
+// This date was chosen to clearly show date and time formats (day > 12)
+// e.g. 18/02/1993 vs. 2/18/1993 and 1:00 PM vs 13:00
+export const placeholderDatetime = new Date(1993, 1, 18, 13);

package/dist/esm/components/date-picker.js

@@ -21,9 +21,10 @@ import { cx } from '@atlaskit/css';
 import { useId } from '@atlaskit/ds-lib/use-id';
 import CalendarIcon from '@atlaskit/icon/core/calendar';
 import { createLocalizationProvider } from '@atlaskit/locale';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { Box } from '@atlaskit/primitives/compiled';
 import Select, { mergeStyles } from '@atlaskit/select';
-import { EmptyComponent } from '../internal';
+import { EmptyComponent } from '../internal/empty-component';
 import { formatDate } from '../internal/format-date';
 import { getParsedISO } from '../internal/get-parsed-iso';
 import { getPlaceholder } from '../internal/get-placeholder';
@@ -32,10 +33,11 @@ import { getShortISOString } from '../internal/get-short-iso-string';
 import { IndicatorsContainer as _IndicatorsContainer } from '../internal/indicators-container';
 import { isDateDisabled } from '../internal/is-date-disabled';
 import { Menu } from '../internal/menu';
+import { MenuTopLayer } from '../internal/menu-top-layer';
 import { parseDate } from '../internal/parse-date';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "0.0.0-development";
+var packageVersion = "17.8.0";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",
@@ -192,10 +194,14 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
       return;
     }
     if (isOpen && wasOpenedFromCalendarButton) {
-      var _calendarRef$current;
       setIsKeyDown(false);
-      // Focus on the first button within the calendar
-      calendarRef === null || calendarRef === void 0 || (_calendarRef$current = calendarRef.current) === null || _calendarRef$current === void 0 || (_calendarRef$current = _calendarRef$current.querySelector('button')) === null || _calendarRef$current === void 0 || _calendarRef$current.focus();
+      // When using top-layer, Popup.Content with role='dialog' automatically
+      // focuses the first focusable element — no manual focus needed.
+      if (!fg('platform-dst-top-layer')) {
+        var _calendarRef$current;
+        // Focus on the first button within the calendar
+        calendarRef === null || calendarRef === void 0 || (_calendarRef$current = calendarRef.current) === null || _calendarRef$current === void 0 || (_calendarRef$current = _calendarRef$current.querySelector('button')) === null || _calendarRef$current === void 0 || _calendarRef$current.focus();
+      }
     }
   }, [isKeyDown, calendarRef, isOpen, wasOpenedFromCalendarButton]);
   var getValue = function getValue() {
@@ -219,19 +225,17 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
     setWasOpenedFromCalendarButton(false);
     onChangePropWithAnalytics(iso);
 
-    // Yes, this is not ideal. The alternative is to be able to place a ref
-    // on the inner input of Select itself, which would require a lot of
-    // extra stuff in the Select component for only this one thing. While
-    // this would be more "React-y", it doesn't seem to pose any other
-    // benefits. Performance-wise, we are only searching within the
-    // container, so it's quick.
-    if (wasOpenedFromCalendarButton) {
-      var _calendarButtonRef$cu;
-      (_calendarButtonRef$cu = calendarButtonRef.current) === null || _calendarButtonRef$cu === void 0 || _calendarButtonRef$cu.focus();
-    } else {
-      var _containerRef$current;
-      var innerCombobox = containerRef === null || containerRef === void 0 || (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelector('[role="combobox"]');
-      innerCombobox === null || innerCombobox === void 0 || innerCombobox.focus();
+    // When using top-layer, PopupContent handles focus restoration automatically
+    // on close based on the role. Only manually restore focus for the legacy path.
+    if (!fg('platform-dst-top-layer')) {
+      if (wasOpenedFromCalendarButton) {
+        var _calendarButtonRef$cu;
+        (_calendarButtonRef$cu = calendarButtonRef.current) === null || _calendarButtonRef$cu === void 0 || _calendarButtonRef$cu.focus();
+      } else {
+        var _containerRef$current;
+        var innerCombobox = containerRef === null || containerRef === void 0 || (_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : _containerRef$current.querySelector('[role="combobox"]');
+        innerCombobox === null || innerCombobox === void 0 || innerCombobox.focus();
+      }
     }
     setIsOpen(false);
   };
@@ -311,12 +315,12 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
     }
     switch (keyPressed) {
       case 'escape':
-        // Yes, this is not ideal. The alternative is to be able to place a ref
-        // on the inner input of Select itself, which would require a lot of
-        // extra stuff in the Select component for only this one thing. While
-        // this would be more "React-y", it doesn't seem to pose any other
-        // benefits. Performance-wise, we are only searching within the
-        // container, so it's quick.
+        // Restore focus on close. Both code paths handle this here:
+        // the legacy path because it has no built-in restoration, and
+        // the top-layer path because the menu uses `mode="manual"` to
+        // avoid the auto-popover light-dismiss closing the menu on the
+        // same click that opens it (see internal/menu-top-layer.tsx).
+        // `manual` mode disables the browser's native focus return.
         if (wasOpenedFromCalendarButton) {
           var _calendarButtonRef$cu2;
           (_calendarButtonRef$cu2 = calendarButtonRef.current) === null || _calendarButtonRef$cu2 === void 0 || _calendarButtonRef$cu2.focus();
@@ -466,7 +470,7 @@ var DatePicker = /*#__PURE__*/forwardRef(function (props, _forwardedRef) {
       }));
     }
   } : {}), {}, {
-    Menu: Menu,
+    Menu: fg('platform-dst-top-layer') ? MenuTopLayer : Menu,
     SingleValue: SingleValue
   }, !showClearIndicator && {
     ClearIndicator: EmptyComponent

package/dist/esm/components/date-time-picker-class.js

@@ -19,13 +19,13 @@ import { format, isValid, parseISO } from 'date-fns';
 import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@atlaskit/analytics-next';
 import SelectClearIcon from '@atlaskit/icon/core/cross-circle';
 import { mergeStyles } from '@atlaskit/select';
-import { formatDateTimeZoneIntoIso } from '../internal';
 import { DateTimePickerContainer } from '../internal/date-time-picker-container';
+import { formatDateTimeZoneIntoIso } from '../internal/format-date-time-zone-into-iso';
 import { convertTokens } from '../internal/parse-tokens';
 import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "0.0.0-development";
+var packageVersion = "17.8.0";
 var compiledStyles = {
   datePickerContainerStyles: "_i0dl1ssb _16jlkb7n _1o9zidpf",
   timePickerContainerStyles: "_i0dl1ssb _16jlkb7n",
@@ -58,8 +58,6 @@ var dateTimePickerDefaultProps = {
   // Not including a default prop for value as it will
   // Make the component a controlled component
 };
-export var datePickerDefaultAriaLabel = 'Date';
-export var timePickerDefaultAriaLabel = 'Time';
 
 // eslint-disable-next-line @repo/internal/react/no-class-components
 var DateTimePickerComponent = /*#__PURE__*/function (_React$Component) {
@@ -266,13 +264,13 @@ var DateTimePickerComponent = /*#__PURE__*/function (_React$Component) {
       var timeValue = parsedValues === null || parsedValues === void 0 ? void 0 : parsedValues.timeValue;
       var datePickerSelectProps = datePickerProps === null || datePickerProps === void 0 ? void 0 : datePickerProps.selectProps;
       var datePickerAriaDescribedBy = datePickerProps['aria-describedby'] || ariaDescribedBy;
-      var datePickerLabel = datePickerProps.label || datePickerDefaultAriaLabel;
+      var datePickerLabel = datePickerProps.label || 'Date';
       var mergedDatePickerSelectProps = _objectSpread(_objectSpread({}, datePickerSelectProps), {}, {
         styles: mergeStyles(styles, datePickerSelectProps === null || datePickerSelectProps === void 0 ? void 0 : datePickerSelectProps.styles)
       });
       var timePickerSelectProps = timePickerProps === null || timePickerProps === void 0 ? void 0 : timePickerProps.selectProps;
       var timePickerAriaDescribedBy = timePickerProps['aria-describedby'] || ariaDescribedBy;
-      var timePickerLabel = timePickerProps.label || timePickerDefaultAriaLabel;
+      var timePickerLabel = timePickerProps.label || 'Time';
       var mergedTimePickerSelectProps = _objectSpread(_objectSpread({}, timePickerSelectProps), {}, {
         styles: mergeStyles(styles, timePickerSelectProps === null || timePickerSelectProps === void 0 ? void 0 : timePickerSelectProps.styles)
       });
@@ -402,4 +400,6 @@ var DateTimePicker = withAnalyticsContext({
     }
   })
 })(DateTimePickerComponent));
+
+// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
 export default DateTimePicker;

package/dist/esm/components/date-time-picker-fc.js

@@ -21,13 +21,13 @@ import { IconButton } from '@atlaskit/button/new';
 import SelectClearIcon from '@atlaskit/icon/core/cross-circle';
 import { Box, Inline } from '@atlaskit/primitives/compiled';
 import { mergeStyles } from '@atlaskit/select';
-import { formatDateTimeZoneIntoIso } from '../internal';
 import { DateTimePickerContainer } from '../internal/date-time-picker-container';
+import { formatDateTimeZoneIntoIso } from '../internal/format-date-time-zone-into-iso';
 import { convertTokens } from '../internal/parse-tokens';
 import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "0.0.0-development";
+var packageVersion = "17.8.0";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,
@@ -67,9 +67,6 @@ var styles = {
  *   that the previous useState approach missed.
  */
 
-export var datePickerDefaultAriaLabel = 'Date';
-export var timePickerDefaultAriaLabel = 'Time';
-
 /**
  * __Date time picker__
  *

package/dist/esm/components/time-picker.js

@@ -12,14 +12,19 @@ import { format, isValid } from 'date-fns';
 import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next';
 import __noop from '@atlaskit/ds-lib/noop';
 import { createLocalizationProvider } from '@atlaskit/locale';
+import { fg } from '@atlaskit/platform-feature-flags';
 import Select, { CreatableSelect, mergeStyles } from '@atlaskit/select';
-import { defaultTimeFormat, defaultTimes, EmptyComponent, placeholderDatetime } from '../internal';
+import { defaultTimes } from '../internal/default-times';
+import { EmptyComponent } from '../internal/empty-component';
 import { FixedLayerMenu } from '../internal/fixed-layer-menu';
+import { FixedLayerMenuTopLayer } from '../internal/fixed-layer-menu-top-layer';
 import parseTime from '../internal/parse-time';
 import { convertTokens } from '../internal/parse-tokens';
+import { placeholderDatetime } from '../internal/placeholder-date-time';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "0.0.0-development";
+var packageVersion = "17.8.0";
+var defaultTimeFormat = 'h:mma';
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
   position: 'static',
@@ -271,7 +276,7 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref2, _ref) {
   });
   var selectComponents = _objectSpread({
     DropdownIndicator: EmptyComponent,
-    Menu: FixedLayerMenu,
+    Menu: fg('platform-dst-top-layer') ? FixedLayerMenuTopLayer : FixedLayerMenu,
     SingleValue: SingleValue
   }, hideIcon && {
     ClearIndicator: EmptyComponent

package/dist/esm/entry-points/date-picker.js

@@ -0,0 +1 @@
+export { default } from '../components/date-picker';

package/dist/esm/entry-points/date-time-picker.js

@@ -0,0 +1 @@
+export { default } from '../components/date-time-picker';

package/dist/esm/entry-points/time-picker.js

@@ -0,0 +1 @@
+export { default } from '../components/time-picker';

package/dist/esm/internal/default-date-format.js

@@ -0,0 +1 @@
+export var defaultDateFormat = 'YYYY/MM/DD';

package/dist/esm/internal/default-times.js

@@ -0,0 +1 @@
+export var defaultTimes = ['09:00', '09:30', '10:00', '10:30', '11:00', '11:30', '12:00', '12:30', '13:00', '13:30', '14:00', '14:30', '15:00', '15:30', '16:00', '16:30', '17:00', '17:30', '18:00'];

package/dist/esm/internal/empty-component.js

@@ -0,0 +1,6 @@
+/**
+ * This component is used to hide portions of Select component.
+ */
+export var EmptyComponent = function EmptyComponent() {
+  return null;
+};

package/dist/esm/internal/fixed-layer-menu-top-layer.js

@@ -0,0 +1,105 @@
+/* fixed-layer-menu-top-layer.tsx generated by @compiled/babel-plugin v0.39.1 */
+import _extends from "@babel/runtime/helpers/extends";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["className", "clearValue", "cx", "getStyles", "getValue", "hasValue", "innerProps", "innerRef", "isLoading", "isMulti", "isRtl", "maxMenuHeight", "menuPlacement", "menuPosition", "menuShouldScrollIntoView", "minMenuHeight", "options", "placement", "selectOption", "selectProps", "setValue", "children"];
+import * as React from 'react';
+import { ax, ix } from "@compiled/react/runtime";
+import { useRef } from 'react';
+import { components } from '@atlaskit/select';
+import { slideAndFade } from '@atlaskit/top-layer/animations';
+import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map';
+import { Popup } from '@atlaskit/top-layer/popup';
+var animation = slideAndFade();
+
+/**
+ * Bottom-start placement: time options menu appears below and aligned to the
+ * start edge of the trigger (the select input).
+ */
+var popupPlacement = fromLegacyPlacement({
+  legacy: 'bottom-start'
+});
+
+/**
+ * Top-layer version of the fixed layer menu used in the time picker.
+ *
+ * Uses `@atlaskit/top-layer/popup` (Popup.Content + Popup.Surface) so the
+ * time options list renders in the browser's top layer via the native Popover API
+ * and is positioned via CSS Anchor Positioning. This avoids overflow clipping,
+ * z-index wars, and portal-based layering.
+ *
+ * Gated behind the `platform-dst-top-layer` feature flag.
+ */
+var FixedLayerMenuTopLayer = function FixedLayerMenuTopLayer(_ref) {
+  var _selectProps$fixedLay, _selectProps$fixedLay2;
+  var className = _ref.className,
+    clearValue = _ref.clearValue,
+    cx = _ref.cx,
+    getStyles = _ref.getStyles,
+    getValue = _ref.getValue,
+    hasValue = _ref.hasValue,
+    innerProps = _ref.innerProps,
+    innerRef = _ref.innerRef,
+    isLoading = _ref.isLoading,
+    isMulti = _ref.isMulti,
+    isRtl = _ref.isRtl,
+    maxMenuHeight = _ref.maxMenuHeight,
+    menuPlacement = _ref.menuPlacement,
+    menuPosition = _ref.menuPosition,
+    menuShouldScrollIntoView = _ref.menuShouldScrollIntoView,
+    minMenuHeight = _ref.minMenuHeight,
+    options = _ref.options,
+    placement = _ref.placement,
+    selectOption = _ref.selectOption,
+    selectProps = _ref.selectProps,
+    setValue = _ref.setValue,
+    children = _ref.children,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  // The select's container element is the anchor for the popup.
+  // @ts-ignore -- fixedLayerRef is a custom prop passed through selectProps
+  var triggerRef = useRef((_selectProps$fixedLay = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay !== void 0 ? _selectProps$fixedLay : null);
+  // @ts-ignore -- fixedLayerRef is a custom prop passed through selectProps
+  triggerRef.current = (_selectProps$fixedLay2 = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay2 !== void 0 ? _selectProps$fixedLay2 : null;
+  return /*#__PURE__*/React.createElement(Popup.Content, {
+    role: "listbox",
+    isOpen: true
+    // `mode="manual"` opts out of the native popover light-dismiss
+    // (Esc / click-outside). react-select already owns those: opening
+    // the menu via a click on the input that lives outside the popover
+    // element triggers the browser's auto-dismiss as that very click
+    // bubbles, slamming the menu shut before the user sees it. With
+    // `manual`, react-select's existing onMenuClose / outside-click
+    // logic remains the single source of truth.
+    ,
+    mode: "manual",
+    placement: popupPlacement,
+    triggerRef: triggerRef,
+    animate: animation
+    // @ts-ignore -- testId is a custom prop passed through selectProps
+    ,
+    testId: selectProps.testId && "".concat(selectProps.testId, "--popup")
+  }, /*#__PURE__*/React.createElement(Popup.Surface, null, /*#__PURE__*/React.createElement(components.Menu, _extends({}, rest, {
+    // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides, @atlaskit/ui-styling-standard/no-classname-prop
+    className: className,
+    clearValue: clearValue,
+    cx: cx,
+    getStyles: getStyles,
+    getValue: getValue,
+    hasValue: hasValue,
+    innerProps: innerProps,
+    innerRef: innerRef,
+    isLoading: isLoading,
+    isMulti: isMulti,
+    isRtl: isRtl,
+    maxMenuHeight: maxMenuHeight,
+    menuPlacement: menuPlacement,
+    menuPosition: menuPosition,
+    menuShouldScrollIntoView: false || menuShouldScrollIntoView,
+    minMenuHeight: minMenuHeight,
+    options: options,
+    placement: placement,
+    selectOption: selectOption,
+    selectProps: selectProps,
+    setValue: setValue
+  }), children)));
+};
+export { FixedLayerMenuTopLayer };

package/dist/esm/internal/format-date-time-zone-into-iso.js

@@ -0,0 +1,9 @@
+/**
+ * Formats a date, time, and zone into a ISO string.
+ */
+export function formatDateTimeZoneIntoIso(date, time, zone) {
+  // 12:00 => 12:00, 1:00 => 01:00
+  var needsLeadingZero = /^\d:/;
+  var sanitizedTime = needsLeadingZero.test(time) ? "0".concat(time) : time;
+  return "".concat(date, "T").concat(sanitizedTime).concat(zone);
+}

package/dist/esm/internal/format-date.js

@@ -18,8 +18,8 @@
 
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 import { format, parseISO } from 'date-fns';
+import { defaultDateFormat } from './default-date-format';
 import { convertTokens } from './parse-tokens';
-import { defaultDateFormat } from './index';
 export var formatDate = function formatDate(value, di) {
   var formatDisplayLabel = di.formatDisplayLabel,
     dateFormat = di.dateFormat,

package/dist/esm/internal/get-parsed-iso.js

@@ -19,7 +19,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 import { lastDayOfMonth } from 'date-fns';
-import { padToTwo } from './index';
+import { padToTwo } from './pad-two';
 export var getParsedISO = function getParsedISO(di) {
   var iso = di.iso;
   var _iso$split = iso.split('-'),