@atlaskit/datetime-picker 19.3.0 → 19.3.2

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/datetime-picker
 
+## 19.3.2
+
+### Patch Changes
+
+- [`45ba618a887fd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/45ba618a887fd) -
+  When `platform-dst-top-layer` is enabled, keep select menus within the viewport by sizing the
+  anchored host to the menu and constraining the scrolling list to available space.
+
+  When `platform-dst-top-layer` is enabled, use Select's top-layer menu positioning for TimePicker
+  instead of nesting a second popover.
+
+- Updated dependencies
+
+## 19.3.1
+
+### Patch Changes
+
+- [`43a440595095c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/43a440595095c) -
+  Remove the current-reference-date feature gate. Current-date parsing is now permanent.
+
 ## 19.3.0
 
 ### Minor Changes

package/codemods/utils/create-remove-func-for.tsx

@@ -1,7 +1,7 @@
 import { type JSCodeshift } from 'jscodeshift';
 import { type Collection } from 'jscodeshift/src/Collection';
 
-import { addCommentToStartOfFile, getNamedSpecifier } from '@atlaskit/codemod-utils';
+import { addCommentToStartOfFile, getNamedSpecifier } from '@atlaskit/codemod-utils/support';
 
 import { getJSXAttributesByName } from './get-jsx-attributes-by-name';
 

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

@@ -22,7 +22,7 @@ var _useId = require("@atlaskit/ds-lib/use-id");
 var _calendar = _interopRequireDefault(require("@atlaskit/icon/core/calendar"));
 var _localizationProvider = require("@atlaskit/locale/localization-provider");
 var _fg = require("@atlaskit/platform-feature-flags/fg");
-var _compiled = require("@atlaskit/primitives/compiled");
+var _box = require("@atlaskit/primitives/compiled/box");
 var _styles = require("@atlaskit/react-select/styles");
 var _default2 = _interopRequireDefault(require("@atlaskit/select/default"));
 var _emptyComponent = require("../internal/empty-component");
@@ -47,7 +47,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.2.0";
+var packageVersion = "19.3.1";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",
@@ -498,7 +498,7 @@ var DatePicker = /*#__PURE__*/(0, _react.forwardRef)(function (props, _forwarded
   var menuIsOpen = getIsOpen() && !isDisabled;
   var showClearIndicator = Boolean((getterValue || selectInputValue) && !hideIcon);
   var clearIndicator = function clearIndicator(props) {
-    return /*#__PURE__*/React.createElement(_compiled.Box, {
+    return /*#__PURE__*/React.createElement(_box.Box, {
       xcss: styles.dropdownIndicatorStyles
     }, /*#__PURE__*/React.createElement(Icon, props));
   };

package/dist/cjs/components/date-time-picker.js

@@ -19,7 +19,8 @@ var _usePlatformLeafEventHandler = require("@atlaskit/analytics-next/usePlatform
 var _button = _interopRequireDefault(require("@atlaskit/button/icon/button"));
 var _crossCircle = _interopRequireDefault(require("@atlaskit/icon/core/cross-circle"));
 var _fg = require("@atlaskit/platform-feature-flags/fg");
-var _compiled = require("@atlaskit/primitives/compiled");
+var _box = require("@atlaskit/primitives/compiled/box");
+var _inline = require("@atlaskit/primitives/compiled/inline");
 var _styles = require("@atlaskit/react-select/styles");
 var _dateTimePickerContainer = require("../internal/date-time-picker-container");
 var _formatDateTimeZoneIntoIso = require("../internal/format-date-time-zone-into-iso");
@@ -34,7 +35,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 // for typing `process`
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.2.0";
+var packageVersion = "19.3.1";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,
@@ -448,7 +449,7 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     type: "hidden",
     value: dtState.value,
     "data-testid": testId && "".concat(testId, "--input")
-  }), /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+  }), /*#__PURE__*/_react.default.createElement(_box.Box, {
     xcss: compiledStyles.datePickerContainerStyles
   }, /*#__PURE__*/_react.default.createElement(_datePicker.default, {
     appearance: appearance,
@@ -490,7 +491,7 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     testId: testId && "".concat(testId, "--datepicker") || datePickerProps.testId,
     value: dtState.dateValue,
     weekStartDay: datePickerProps.weekStartDay
-  })), /*#__PURE__*/_react.default.createElement(_compiled.Box, {
+  })), /*#__PURE__*/_react.default.createElement(_box.Box, {
     xcss: compiledStyles.timePickerContainerStyles
   }, /*#__PURE__*/_react.default.createElement(_timePicker.default, {
     appearance: timePickerProps.appearance || appearance,
@@ -523,7 +524,7 @@ var DateTimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
     timeIsEditable: timePickerProps.timeIsEditable,
     times: timePickerProps.times,
     value: dtState.timeValue
-  })), hasClearButton ? /*#__PURE__*/_react.default.createElement(_compiled.Inline, {
+  })), hasClearButton ? /*#__PURE__*/_react.default.createElement(_inline.Inline, {
     xcss: compiledStyles.iconContainerStyles
   }, /*#__PURE__*/_react.default.createElement(_button.default, {
     appearance: "subtle",

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

@@ -27,7 +27,6 @@ var _default2 = _interopRequireDefault(require("@atlaskit/select/default"));
 var _defaultTimes = require("../internal/default-times");
 var _emptyComponent = require("../internal/empty-component");
 var _fixedLayerMenu = require("../internal/fixed-layer-menu");
-var _fixedLayerMenuTopLayer = require("../internal/fixed-layer-menu-top-layer");
 var _parseTime = _interopRequireDefault(require("../internal/parse-time"));
 var _parseTokens = require("../internal/parse-tokens");
 var _pickerButtonContainer = require("../internal/picker-button-container");
@@ -38,7 +37,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; } // oxlint-disable-next-line @atlassian/no-restricted-imports
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.2.0";
+var packageVersion = "19.3.1";
 var defaultTimeFormat = 'h:mma';
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
@@ -338,9 +337,11 @@ var TimePicker = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, _ref) {
     id: valueId,
     lang: locale
   });
-  var selectComponents = _objectSpread({
-    DropdownIndicator: _emptyComponent.EmptyComponent,
-    Menu: (0, _fg.fg)('platform-dst-top-layer') ? _fixedLayerMenuTopLayer.FixedLayerMenuTopLayer : _fixedLayerMenu.FixedLayerMenu,
+  var selectComponents = _objectSpread(_objectSpread({
+    DropdownIndicator: _emptyComponent.EmptyComponent
+  }, !(0, _fg.fg)('platform-dst-top-layer') && {
+    Menu: _fixedLayerMenu.FixedLayerMenu
+  }), {}, {
     SingleValue: SingleValue
   }, hideIcon && {
     ClearIndicator: _emptyComponent.EmptyComponent

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

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.parseDate = void 0;
 var _dateFns = require("date-fns");
-var _fg = require("@atlaskit/platform-feature-flags/fg");
 var _defaultDateFormat = require("./default-date-format");
 var _parseTokens = require("./parse-tokens");
 /**
@@ -47,7 +46,7 @@ var parseDate = exports.parseDate = function parseDate(date, di) {
   if (dateFormat) {
     // date-fns uses the reference year to resolve two-digit years and fill
     // omitted years. Use the current local date rather than the Unix epoch.
-    var referenceDate = (0, _fg.fg)('platform-dst-dp-current-reference-date') ? new Date() : new Date(0);
+    var referenceDate = new Date();
     var parsed = (0, _dateFns.parse)(date, (0, _parseTokens.convertTokens)(dateFormat), referenceDate);
     // `dateFormat` is a display format, so typed input does not always match
     // it. Locale parsing stays as the fallback so those entries still work.

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

@@ -15,7 +15,7 @@ import { useId } from '@atlaskit/ds-lib/use-id';
 import CalendarIcon from '@atlaskit/icon/core/calendar';
 import { createLocalizationProvider } from '@atlaskit/locale/localization-provider';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
-import { Box } from '@atlaskit/primitives/compiled';
+import { Box } from '@atlaskit/primitives/compiled/box';
 import { mergeStyles } from '@atlaskit/react-select/styles';
 import Select from '@atlaskit/select/default';
 import { EmptyComponent } from '../internal/empty-component';
@@ -32,7 +32,7 @@ import { parseDate } from '../internal/parse-date';
 import { PickerButtonContainer } from '../internal/picker-button-container';
 import { makeSingleValue } from '../internal/single-value';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.2.0";
+const packageVersion = "19.3.1";
 const styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",

package/dist/es2019/components/date-time-picker.js

@@ -13,7 +13,8 @@ import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatfor
 import IconButton from '@atlaskit/button/icon/button';
 import SelectClearIcon from '@atlaskit/icon/core/cross-circle';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
-import { Box, Inline } from '@atlaskit/primitives/compiled';
+import { Box } from '@atlaskit/primitives/compiled/box';
+import { Inline } from '@atlaskit/primitives/compiled/inline';
 import { mergeStyles } from '@atlaskit/react-select/styles';
 import { DateTimePickerContainer } from '../internal/date-time-picker-container';
 import { formatDateTimeZoneIntoIso } from '../internal/format-date-time-zone-into-iso';
@@ -21,7 +22,7 @@ import { convertTokens } from '../internal/parse-tokens';
 import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.2.0";
+const packageVersion = "19.3.1";
 const analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName,

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

@@ -18,14 +18,13 @@ import Select from '@atlaskit/select/default';
 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 { PickerButtonContainer } from '../internal/picker-button-container';
 import { placeholderDatetime } from '../internal/placeholder-date-time';
 import { makeSingleValue } from '../internal/single-value';
 const packageName = "@atlaskit/datetime-picker";
-const packageVersion = "19.2.0";
+const packageVersion = "19.3.1";
 const defaultTimeFormat = 'h:mma';
 const menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
@@ -284,7 +283,10 @@ const TimePicker = /*#__PURE__*/forwardRef(({
   });
   const selectComponents = {
     DropdownIndicator: EmptyComponent,
-    Menu: fg('platform-dst-top-layer') ? FixedLayerMenuTopLayer : FixedLayerMenu,
+    // Select owns top-layer positioning; only the legacy path needs a separate wrapper.
+    ...(!fg('platform-dst-top-layer') && {
+      Menu: FixedLayerMenu
+    }),
     SingleValue,
     ...(hideIcon && {
       ClearIndicator: EmptyComponent

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

@@ -17,7 +17,6 @@
  */
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 import { isValid, parse } from 'date-fns';
-import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { defaultDateFormat } from './default-date-format';
 import { convertTokens } from './parse-tokens';
 
@@ -43,7 +42,7 @@ export const parseDate = (date, di) => {
   if (dateFormat) {
     // date-fns uses the reference year to resolve two-digit years and fill
     // omitted years. Use the current local date rather than the Unix epoch.
-    const referenceDate = fg('platform-dst-dp-current-reference-date') ? new Date() : new Date(0);
+    const referenceDate = new Date();
     const parsed = parse(date, convertTokens(dateFormat), referenceDate);
     // `dateFormat` is a display format, so typed input does not always match
     // it. Locale parsing stays as the fallback so those entries still work.

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

@@ -23,7 +23,7 @@ import { useId } from '@atlaskit/ds-lib/use-id';
 import CalendarIcon from '@atlaskit/icon/core/calendar';
 import { createLocalizationProvider } from '@atlaskit/locale/localization-provider';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
-import { Box } from '@atlaskit/primitives/compiled';
+import { Box } from '@atlaskit/primitives/compiled/box';
 import { mergeStyles } from '@atlaskit/react-select/styles';
 import Select from '@atlaskit/select/default';
 import { EmptyComponent } from '../internal/empty-component';
@@ -40,7 +40,7 @@ import { parseDate } from '../internal/parse-date';
 import { PickerButtonContainer } from '../internal/picker-button-container';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.2.0";
+var packageVersion = "19.3.1";
 var styles = {
   pickerContainerStyle: "_kqswh2mm",
   dropdownIndicatorStyles: "_1ul91k8s _1tke1k8s _1e0c1txw _4cvr1h6o _1bah1h6o",

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

@@ -20,7 +20,8 @@ import { usePlatformLeafEventHandler } from '@atlaskit/analytics-next/usePlatfor
 import IconButton from '@atlaskit/button/icon/button';
 import SelectClearIcon from '@atlaskit/icon/core/cross-circle';
 import { fg } from '@atlaskit/platform-feature-flags/fg';
-import { Box, Inline } from '@atlaskit/primitives/compiled';
+import { Box } from '@atlaskit/primitives/compiled/box';
+import { Inline } from '@atlaskit/primitives/compiled/inline';
 import { mergeStyles } from '@atlaskit/react-select/styles';
 import { DateTimePickerContainer } from '../internal/date-time-picker-container';
 import { formatDateTimeZoneIntoIso } from '../internal/format-date-time-zone-into-iso';
@@ -28,7 +29,7 @@ import { convertTokens } from '../internal/parse-tokens';
 import DatePicker from './date-picker';
 import TimePicker from './time-picker';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.2.0";
+var packageVersion = "19.3.1";
 var analyticsAttributes = {
   componentName: 'dateTimePicker',
   packageName: packageName,

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

@@ -24,14 +24,13 @@ import Select from '@atlaskit/select/default';
 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 { PickerButtonContainer } from '../internal/picker-button-container';
 import { placeholderDatetime } from '../internal/placeholder-date-time';
 import { makeSingleValue } from '../internal/single-value';
 var packageName = "@atlaskit/datetime-picker";
-var packageVersion = "19.2.0";
+var packageVersion = "19.3.1";
 var defaultTimeFormat = 'h:mma';
 var menuStyles = {
   /* Need to remove default absolute positioning as that causes issues with position fixed */
@@ -331,9 +330,11 @@ var TimePicker = /*#__PURE__*/forwardRef(function (_ref2, _ref) {
     id: valueId,
     lang: locale
   });
-  var selectComponents = _objectSpread({
-    DropdownIndicator: EmptyComponent,
-    Menu: fg('platform-dst-top-layer') ? FixedLayerMenuTopLayer : FixedLayerMenu,
+  var selectComponents = _objectSpread(_objectSpread({
+    DropdownIndicator: EmptyComponent
+  }, !fg('platform-dst-top-layer') && {
+    Menu: FixedLayerMenu
+  }), {}, {
     SingleValue: SingleValue
   }, hideIcon && {
     ClearIndicator: EmptyComponent

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

@@ -17,7 +17,6 @@
  */
 // oxlint-disable-next-line @atlassian/no-restricted-imports
 import { isValid, parse } from 'date-fns';
-import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { defaultDateFormat } from './default-date-format';
 import { convertTokens } from './parse-tokens';
 
@@ -41,7 +40,7 @@ export var parseDate = function parseDate(date, di) {
   if (dateFormat) {
     // date-fns uses the reference year to resolve two-digit years and fill
     // omitted years. Use the current local date rather than the Unix epoch.
-    var referenceDate = fg('platform-dst-dp-current-reference-date') ? new Date() : new Date(0);
+    var referenceDate = new Date();
     var parsed = parse(date, convertTokens(dateFormat), referenceDate);
     // `dateFormat` is a display format, so typed input does not always match
     // it. Locale parsing stays as the fallback so those entries still work.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/datetime-picker",
-	"version": "19.3.0",
+	"version": "19.3.2",
 	"description": "A date time picker allows the user to select an associated date and time.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -48,7 +48,7 @@
 		"@atlaskit/react-compiler-gating": "^0.2.0",
 		"@atlaskit/react-select": "^4.12.0",
 		"@atlaskit/select": "^23.1.0",
-		"@atlaskit/tokens": "^20.3.0",
+		"@atlaskit/tokens": "^20.4.0",
 		"@atlaskit/top-layer": "^6.2.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
@@ -91,9 +91,6 @@
 		"platform-dst-top-layer": {
 			"type": "boolean"
 		},
-		"platform-dst-dp-current-reference-date": {
-			"type": "boolean"
-		},
 		"platform-dst-motion-uplift-input": {
 			"type": "boolean",
 			"referenceOnly": true

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

@@ -1,118 +0,0 @@
-/* fixed-layer-menu-top-layer.tsx generated by @compiled/babel-plugin v3.0.2 */
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FixedLayerMenuTopLayer = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var React = _react;
-var _runtime = require("@compiled/react/runtime");
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _components = require("@atlaskit/react-select/components");
-var _index = require("@atlaskit/top-layer/placement-map/index");
-var _popoverSurface = require("@atlaskit/top-layer/popover-surface");
-var _popover = require("@atlaskit/top-layer/popover/popover");
-var _useAnchoredPopover = require("@atlaskit/top-layer/use-anchored-popover");
-var _excluded = ["className", "clearValue", "cx", "getStyles", "getValue", "hasValue", "innerProps", "innerRef", "isLoading", "isMulti", "isRtl", "maxMenuHeight", "menuPlacement", "menuPosition", "menuShouldScrollIntoView", "minMenuHeight", "options", "placement", "selectOption", "selectProps", "setValue", "children"];
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-/**
- * Bottom-start placement: time options menu appears below and aligned to the
- * start edge of the trigger (the select input).
- */
-var popupPlacement = (0, _index.fromLegacyPlacement)({
-  legacy: 'bottom-start'
-});
-
-/**
- * Top-layer version of the fixed layer menu used in the time picker.
- *
- * Uses `Popover` + `useAnchoredPopover` 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 = exports.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 = (0, _objectWithoutProperties2.default)(_ref, _excluded);
-  // The select's container element is the anchor for the popup.
-  var triggerRef = (0, _react.useRef)((_selectProps$fixedLay = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay !== void 0 ? _selectProps$fixedLay : null);
-  triggerRef.current = (_selectProps$fixedLay2 = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay2 !== void 0 ? _selectProps$fixedLay2 : null;
-  var popoverRef = (0, _react.useRef)(null);
-  (0, _useAnchoredPopover.useAnchoredPopover)({
-    anchorRef: triggerRef,
-    popoverRef: popoverRef,
-    placement: popupPlacement,
-    // The Popover is rendered with `isOpen` always true while this
-    // component is mounted (react-select conditionally mounts/unmounts
-    // the menu), so positioning is always active.
-    isOpen: true
-  });
-  return /*#__PURE__*/React.createElement(_popover.Popover, {
-    ref: popoverRef,
-    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,
-    shouldAnimate: true,
-    testId: selectProps.testId && "".concat(selectProps.testId, "--popup")
-  }, /*#__PURE__*/React.createElement(_popoverSurface.PopoverSurface, null, /*#__PURE__*/React.createElement(_components.components.Menu, (0, _extends2.default)({}, 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/fixed-layer-menu-top-layer.js

@@ -1,109 +0,0 @@
-/* fixed-layer-menu-top-layer.tsx generated by @compiled/babel-plugin v3.0.2 */
-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/react-select/components';
-import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map/index';
-import { PopoverSurface } from '@atlaskit/top-layer/popover-surface';
-import { Popover } from '@atlaskit/top-layer/popover/popover';
-import { useAnchoredPopover } from '@atlaskit/top-layer/use-anchored-popover';
-
-/**
- * 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 `Popover` + `useAnchoredPopover` 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.
-  const triggerRef = useRef((_selectProps$fixedLay = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay !== void 0 ? _selectProps$fixedLay : null);
-  triggerRef.current = (_selectProps$fixedLay2 = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay2 !== void 0 ? _selectProps$fixedLay2 : null;
-  const popoverRef = useRef(null);
-  useAnchoredPopover({
-    anchorRef: triggerRef,
-    popoverRef,
-    placement: popupPlacement,
-    // The Popover is rendered with `isOpen` always true while this
-    // component is mounted (react-select conditionally mounts/unmounts
-    // the menu), so positioning is always active.
-    isOpen: true
-  });
-  return /*#__PURE__*/React.createElement(Popover, {
-    ref: popoverRef,
-    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,
-    shouldAnimate: true,
-    testId: selectProps.testId && `${selectProps.testId}--popup`
-  }, /*#__PURE__*/React.createElement(PopoverSurface, 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/esm/internal/fixed-layer-menu-top-layer.js

@@ -1,111 +0,0 @@
-/* fixed-layer-menu-top-layer.tsx generated by @compiled/babel-plugin v3.0.2 */
-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/react-select/components';
-import { fromLegacyPlacement } from '@atlaskit/top-layer/placement-map/index';
-import { PopoverSurface } from '@atlaskit/top-layer/popover-surface';
-import { Popover } from '@atlaskit/top-layer/popover/popover';
-import { useAnchoredPopover } from '@atlaskit/top-layer/use-anchored-popover';
-
-/**
- * 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 `Popover` + `useAnchoredPopover` 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.
-  var triggerRef = useRef((_selectProps$fixedLay = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay !== void 0 ? _selectProps$fixedLay : null);
-  triggerRef.current = (_selectProps$fixedLay2 = selectProps.fixedLayerRef) !== null && _selectProps$fixedLay2 !== void 0 ? _selectProps$fixedLay2 : null;
-  var popoverRef = useRef(null);
-  useAnchoredPopover({
-    anchorRef: triggerRef,
-    popoverRef: popoverRef,
-    placement: popupPlacement,
-    // The Popover is rendered with `isOpen` always true while this
-    // component is mounted (react-select conditionally mounts/unmounts
-    // the menu), so positioning is always active.
-    isOpen: true
-  });
-  return /*#__PURE__*/React.createElement(Popover, {
-    ref: popoverRef,
-    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,
-    shouldAnimate: true,
-    testId: selectProps.testId && "".concat(selectProps.testId, "--popup")
-  }, /*#__PURE__*/React.createElement(PopoverSurface, 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/types/internal/fixed-layer-menu-top-layer.d.ts

@@ -1,12 +0,0 @@
-import type { MenuProps, OptionType } from '@atlaskit/select/types';
-/**
- * Top-layer version of the fixed layer menu used in the time picker.
- *
- * Uses `Popover` + `useAnchoredPopover` 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 declare 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 }: MenuProps<OptionType>) => JSX.Element;