@atlaskit/top-layer 3.2.0 → 4.0.0

package/AGENTS.md

@@ -110,4 +110,6 @@ const [state, setState] = useState<TState>({ type: 'idle' });
 
 ## Versioning
 
-This package is still on `0.x` releases. All changes should be a `minor` (`0.x`) release.
+This package is on stable releases. Follow semantic versioning: use `major` for public API removals
+or incompatible behavior changes, `minor` for public API additions, and `patch` for compatible fixes
+and internal implementation changes.

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # @atlaskit/top-layer
 
+## 4.0.0
+
+### Major Changes
+
+- [`eff4aad608ff2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/eff4aad608ff2) -
+  Remove the obsolete `@atlaskit/top-layer/animations` entry point and simplify internal helpers.
+  Use the built-in `shouldAnimate` behavior on `Popover` and `Dialog`, with phase-specific xcss
+  overrides when customization is required.
+
 ## 3.2.0
 
 ### Minor Changes

package/README.md

@@ -92,20 +92,6 @@ for entry and
 [`allow-discrete`](https://developer.mozilla.org/en-US/docs/Web/CSS/transition-behavior) on
 `display`/`overlay` for exit — no JavaScript animation coordination required.
 
-Presets are available from `@atlaskit/top-layer/animations`:
-
-```tsx
-import {
-	// Popover presets
-	slideAndFade,
-	fade,
-	scaleAndFade,
-	// Dialog presets
-	dialogSlideUpAndFade,
-	dialogFade,
-} from '@atlaskit/top-layer/animations';
-```
-
 ### Popover animation
 
 Pass `shouldAnimate` to enable the default popover entry and exit animation:

package/dist/cjs/focus/is-in-same-layer.js

@@ -13,11 +13,5 @@ var topLayerSelector = '[popover], dialog, [role="dialog"], [role="alertdialog"]
 function isInSameLayer(_ref) {
   var element = _ref.element,
     container = _ref.container;
-  var elementLayer = element.closest(topLayerSelector);
-  var containerLayer = container.closest(topLayerSelector);
-  // Both elements are in the "document" layer
-  if (!elementLayer && !containerLayer) {
-    return true;
-  }
-  return elementLayer === containerLayer;
+  return element.closest(topLayerSelector) === container.closest(topLayerSelector);
 }

package/dist/cjs/focus/selectors.js

@@ -8,7 +8,7 @@ var selectors = exports.selectors = function () {
   // Common exclusion filter applied to every selector.
   var not = ':not([tabindex="-1"]):not([aria-disabled="true"]):not([aria-hidden="true"])';
   var notDisabled = ":not([disabled])".concat(not);
-  var focusable = ["a[href]".concat(not), "area[href]".concat(not), "input".concat(notDisabled, ":not([type=\"hidden\"])"), "select".concat(notDisabled), "textarea".concat(notDisabled), "button".concat(notDisabled), "iframe".concat(not), "audio[controls]".concat(not), "video[controls]".concat(not), "[contenteditable]:not([contenteditable=\"false\"])".concat(not), "[tabindex]".concat(notDisabled).concat(not)];
+  var focusable = ["a[href]".concat(not), "area[href]".concat(not), "input".concat(notDisabled, ":not([type=\"hidden\"])"), "select".concat(notDisabled), "textarea".concat(notDisabled), "button".concat(notDisabled), "iframe".concat(not), "audio[controls]".concat(not), "video[controls]".concat(not), "[contenteditable]:not([contenteditable=\"false\"])".concat(not), "[tabindex]".concat(notDisabled)];
   return {
     focusable: focusable.join(','),
     // Build the `:focus` selector

package/dist/cjs/internal/get-aria-for-trigger.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getAriaForTrigger = getAriaForTrigger;
-var _roleToAriaHasPopup = require("./role-to-aria-has-popup");
 /**
  * Roles accepted by `getAriaForTrigger`.
  *
@@ -14,12 +13,34 @@ var _roleToAriaHasPopup = require("./role-to-aria-has-popup");
  * manually for tooltip triggers.
  */
 
+/**
+ * Valid values for the `aria-haspopup` attribute.
+ *
+ * Derived from the HTML spec - maps popover roles to what the trigger
+ * announces. `undefined` means the attribute is omitted entirely (used for
+ * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
+ * `aria-haspopup` would be misleading).
+ *
+ * `true` is intentionally NOT in the union - the runtime only ever produces
+ * the explicit string forms, so widening the type would invite consumers to
+ * pass `true` and get an `aria-haspopup="true"` serialisation that the
+ * runtime no longer emits.
+ */
+
 /**
  * Non-undefined subset of `TAriaHasPopupValue`. Every role accepted by
  * `getAriaForTrigger` maps to a concrete `aria-haspopup` string, so the
  * trigger always receives a defined attribute value.
  */
 
+var roleToAriaHasPopup = {
+  dialog: 'dialog',
+  alertdialog: 'dialog',
+  menu: 'menu',
+  listbox: 'listbox',
+  tree: 'tree',
+  grid: 'grid'
+};
 /**
  * Returns the ARIA attributes to spread onto a click-activated popover trigger.
  *
@@ -71,13 +92,6 @@ function getAriaForTrigger(_ref) {
   var role = _ref.role,
     isOpen = _ref.isOpen,
     popoverId = _ref.popoverId;
-  // `roleToAriaHasPopup` accepts a wider role union (including tooltip-family
-  // roles that map to `undefined`). `TAriaForTriggerRole` excludes those, so
-  // the returned value is guaranteed to be a defined string. The cast narrows
-  // the wider helper signature to match.
-  var ariaHasPopup = (0, _roleToAriaHasPopup.roleToAriaHasPopup)({
-    role: role
-  });
   // `aria-controls` is set to `undefined` while closed. The `Popover` /
   // `Dialog` primitives unmount their host element after the exit
   // animation finishes, so a closed-state `aria-controls` would point
@@ -86,7 +100,7 @@ function getAriaForTrigger(_ref) {
   // until the target exists, avoiding the dangling reference while
   // keeping the relationship live whenever it is meaningful.
   return {
-    'aria-haspopup': ariaHasPopup,
+    'aria-haspopup': roleToAriaHasPopup[role],
     'aria-expanded': isOpen,
     'aria-controls': isOpen ? popoverId : undefined
   };

package/dist/cjs/internal/role-types.js

@@ -1,64 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.shouldFocusIntoPopover = shouldFocusIntoPopover;
-/**
- * Valid values for the `aria-haspopup` attribute.
- *
- * Derived from the HTML spec - maps popover roles to what the trigger
- * announces. `undefined` means the attribute is omitted entirely (used for
- * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
- * `aria-haspopup` would be misleading).
- *
- * `true` is intentionally NOT in the union - the runtime only ever produces
- * the explicit string forms, so widening the type would invite consumers to
- * pass `true` and get an `aria-haspopup="true"` serialisation that the
- * runtime no longer emits.
- */
-
-/**
- * Roles that require an accessible name (`label` or `labelledBy`) per WCAG 4.1.2.
- * Without a name, assistive technology cannot identify these landmarks.
- */
-
-/**
- * Roles where the accessible name is derived from content or provided externally
- * (e.g. a combobox labels its listbox, tooltip content IS the accessible name).
- */
-
-// Shared ARIA role discrimination types
-//
-// These encode the WCAG 4.1.2 constraint: roles like `dialog`, `alertdialog`,
-// and `menu` MUST have an accessible name (either `label` or `labelledBy`).
-// TypeScript enforces this at compile time via discriminated unions.
-
-/**
- * ARIA role props where a role is always required.
- *
- * Used by `TPopupContentProps`. Popup content must always declare
- * its role so assistive technology can identify the layer.
- */
-
-/**
- * ARIA role props where a role is optional.
- *
- * Used by `TPopoverProps`. The low-level primitive allows omitting
- * the role for cases where it is set externally or not needed.
- */
-
-var rolesThatMoveFocus = new Set(['dialog', 'alertdialog', 'menu', 'listbox', 'tree', 'grid']);
-
-/**
- * Returns `true` when the given popover role moves focus into the popover
- * on open, and `false` otherwise (including when `role` is `undefined`).
- */
-// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
-function shouldFocusIntoPopover(_ref) {
-  var role = _ref.role;
-  if (!role) {
-    return false;
-  }
-  return rolesThatMoveFocus.has(role);
-}
+"use strict";

package/dist/cjs/internal/use-anchor-position.js

@@ -324,11 +324,10 @@ function useAnchorPosition(_ref3) {
        * See `notes/decisions/anchor-name-lifetime.md`
        */
       trigger.style.setProperty('anchor-name', anchorName);
-      var _undoPositioning = (0, _combine.combine)((0, _setStyle.setStyle)({
+      return (0, _setStyle.setStyle)({
         element: popover,
         styles: popoverStyles
-      }));
-      return _undoPositioning;
+      });
     }
 
     // JS fallback. The popover is already in the top layer via

package/dist/cjs/popover/popover.js

@@ -16,7 +16,7 @@ var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
 var _once = _interopRequireDefault(require("@atlaskit/ds-lib/once"));
 var _useNotifyOpenLayerObserver = require("@atlaskit/layering/use-notify-open-layer-observer");
 var _resolvePlacement2 = require("../internal/resolve-placement");
-var _roleTypes = require("../internal/role-types");
+var _shouldFocusIntoPopover = require("../internal/should-focus-into-popover");
 var _useAnimatedVisibility = require("../internal/use-animated-visibility");
 var _useFocusWrap = require("../internal/use-focus-wrap");
 var _useInitialFocus = require("../internal/use-initial-focus");
@@ -234,7 +234,7 @@ var Popover = exports.Popover = /*#__PURE__*/(0, _react.forwardRef)(function Pop
         var previouslyFocused = previouslyFocusedElementRef.current;
         var _reason = closeReasonRef.current;
         var isProgrammatic = programmaticCloseRef.current;
-        var shouldRestore = previouslyFocused !== null && previouslyFocused.isConnected && (0, _roleTypes.shouldFocusIntoPopover)({
+        var shouldRestore = previouslyFocused !== null && previouslyFocused.isConnected && (0, _shouldFocusIntoPopover.shouldFocusIntoPopover)({
           role: role
         }) && (_reason === 'escape' || isProgrammatic);
         if (shouldRestore && previouslyFocused) {

package/dist/es2019/focus/is-in-same-layer.js

@@ -8,11 +8,5 @@ export function isInSameLayer({
   element,
   container
 }) {
-  const elementLayer = element.closest(topLayerSelector);
-  const containerLayer = container.closest(topLayerSelector);
-  // Both elements are in the "document" layer
-  if (!elementLayer && !containerLayer) {
-    return true;
-  }
-  return elementLayer === containerLayer;
+  return element.closest(topLayerSelector) === container.closest(topLayerSelector);
 }

package/dist/es2019/focus/selectors.js

@@ -2,7 +2,7 @@ export const selectors = (() => {
   // Common exclusion filter applied to every selector.
   const not = ':not([tabindex="-1"]):not([aria-disabled="true"]):not([aria-hidden="true"])';
   const notDisabled = `:not([disabled])${not}`;
-  const focusable = [`a[href]${not}`, `area[href]${not}`, `input${notDisabled}:not([type="hidden"])`, `select${notDisabled}`, `textarea${notDisabled}`, `button${notDisabled}`, `iframe${not}`, `audio[controls]${not}`, `video[controls]${not}`, `[contenteditable]:not([contenteditable="false"])${not}`, `[tabindex]${notDisabled}${not}`];
+  const focusable = [`a[href]${not}`, `area[href]${not}`, `input${notDisabled}:not([type="hidden"])`, `select${notDisabled}`, `textarea${notDisabled}`, `button${notDisabled}`, `iframe${not}`, `audio[controls]${not}`, `video[controls]${not}`, `[contenteditable]:not([contenteditable="false"])${not}`, `[tabindex]${notDisabled}`];
   return {
     focusable: focusable.join(','),
     // Build the `:focus` selector

package/dist/es2019/internal/get-aria-for-trigger.js

@@ -1,5 +1,3 @@
-import { roleToAriaHasPopup } from './role-to-aria-has-popup';
-
 /**
  * Roles accepted by `getAriaForTrigger`.
  *
@@ -9,12 +7,34 @@ import { roleToAriaHasPopup } from './role-to-aria-has-popup';
  * manually for tooltip triggers.
  */
 
+/**
+ * Valid values for the `aria-haspopup` attribute.
+ *
+ * Derived from the HTML spec - maps popover roles to what the trigger
+ * announces. `undefined` means the attribute is omitted entirely (used for
+ * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
+ * `aria-haspopup` would be misleading).
+ *
+ * `true` is intentionally NOT in the union - the runtime only ever produces
+ * the explicit string forms, so widening the type would invite consumers to
+ * pass `true` and get an `aria-haspopup="true"` serialisation that the
+ * runtime no longer emits.
+ */
+
 /**
  * Non-undefined subset of `TAriaHasPopupValue`. Every role accepted by
  * `getAriaForTrigger` maps to a concrete `aria-haspopup` string, so the
  * trigger always receives a defined attribute value.
  */
 
+const roleToAriaHasPopup = {
+  dialog: 'dialog',
+  alertdialog: 'dialog',
+  menu: 'menu',
+  listbox: 'listbox',
+  tree: 'tree',
+  grid: 'grid'
+};
 /**
  * Returns the ARIA attributes to spread onto a click-activated popover trigger.
  *
@@ -67,13 +87,6 @@ export function getAriaForTrigger({
   isOpen,
   popoverId
 }) {
-  // `roleToAriaHasPopup` accepts a wider role union (including tooltip-family
-  // roles that map to `undefined`). `TAriaForTriggerRole` excludes those, so
-  // the returned value is guaranteed to be a defined string. The cast narrows
-  // the wider helper signature to match.
-  const ariaHasPopup = roleToAriaHasPopup({
-    role
-  });
   // `aria-controls` is set to `undefined` while closed. The `Popover` /
   // `Dialog` primitives unmount their host element after the exit
   // animation finishes, so a closed-state `aria-controls` would point
@@ -82,7 +95,7 @@ export function getAriaForTrigger({
   // until the target exists, avoiding the dangling reference while
   // keeping the relationship live whenever it is meaningful.
   return {
-    'aria-haspopup': ariaHasPopup,
+    'aria-haspopup': roleToAriaHasPopup[role],
     'aria-expanded': isOpen,
     'aria-controls': isOpen ? popoverId : undefined
   };

package/dist/es2019/internal/role-types.js

@@ -1,59 +0,0 @@
-/**
- * Valid values for the `aria-haspopup` attribute.
- *
- * Derived from the HTML spec - maps popover roles to what the trigger
- * announces. `undefined` means the attribute is omitted entirely (used for
- * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
- * `aria-haspopup` would be misleading).
- *
- * `true` is intentionally NOT in the union - the runtime only ever produces
- * the explicit string forms, so widening the type would invite consumers to
- * pass `true` and get an `aria-haspopup="true"` serialisation that the
- * runtime no longer emits.
- */
-
-/**
- * Roles that require an accessible name (`label` or `labelledBy`) per WCAG 4.1.2.
- * Without a name, assistive technology cannot identify these landmarks.
- */
-
-/**
- * Roles where the accessible name is derived from content or provided externally
- * (e.g. a combobox labels its listbox, tooltip content IS the accessible name).
- */
-
-// Shared ARIA role discrimination types
-//
-// These encode the WCAG 4.1.2 constraint: roles like `dialog`, `alertdialog`,
-// and `menu` MUST have an accessible name (either `label` or `labelledBy`).
-// TypeScript enforces this at compile time via discriminated unions.
-
-/**
- * ARIA role props where a role is always required.
- *
- * Used by `TPopupContentProps`. Popup content must always declare
- * its role so assistive technology can identify the layer.
- */
-
-/**
- * ARIA role props where a role is optional.
- *
- * Used by `TPopoverProps`. The low-level primitive allows omitting
- * the role for cases where it is set externally or not needed.
- */
-
-const rolesThatMoveFocus = new Set(['dialog', 'alertdialog', 'menu', 'listbox', 'tree', 'grid']);
-
-/**
- * Returns `true` when the given popover role moves focus into the popover
- * on open, and `false` otherwise (including when `role` is `undefined`).
- */
-// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
-export function shouldFocusIntoPopover({
-  role
-}) {
-  if (!role) {
-    return false;
-  }
-  return rolesThatMoveFocus.has(role);
-}

package/dist/es2019/internal/use-anchor-position.js

@@ -307,11 +307,10 @@ export function useAnchorPosition({
        * See `notes/decisions/anchor-name-lifetime.md`
        */
       trigger.style.setProperty('anchor-name', anchorName);
-      const undoPositioning = combine(setStyle({
+      return setStyle({
         element: popover,
         styles: popoverStyles
-      }));
-      return undoPositioning;
+      });
     }
 
     // JS fallback. The popover is already in the top layer via

package/dist/es2019/popover/popover.js

@@ -8,7 +8,7 @@ import mergeRefs from '@atlaskit/ds-lib/merge-refs';
 import once from '@atlaskit/ds-lib/once';
 import { useNotifyOpenLayerObserver } from '@atlaskit/layering/use-notify-open-layer-observer';
 import { resolvePlacement } from '../internal/resolve-placement';
-import { shouldFocusIntoPopover } from '../internal/role-types';
+import { shouldFocusIntoPopover } from '../internal/should-focus-into-popover';
 import { useAnimatedVisibility } from '../internal/use-animated-visibility';
 import { useFocusWrap } from '../internal/use-focus-wrap';
 import { useInitialFocus } from '../internal/use-initial-focus';

package/dist/esm/focus/is-in-same-layer.js

@@ -7,11 +7,5 @@ var topLayerSelector = '[popover], dialog, [role="dialog"], [role="alertdialog"]
 export function isInSameLayer(_ref) {
   var element = _ref.element,
     container = _ref.container;
-  var elementLayer = element.closest(topLayerSelector);
-  var containerLayer = container.closest(topLayerSelector);
-  // Both elements are in the "document" layer
-  if (!elementLayer && !containerLayer) {
-    return true;
-  }
-  return elementLayer === containerLayer;
+  return element.closest(topLayerSelector) === container.closest(topLayerSelector);
 }

package/dist/esm/focus/selectors.js

@@ -2,7 +2,7 @@ export var selectors = function () {
   // Common exclusion filter applied to every selector.
   var not = ':not([tabindex="-1"]):not([aria-disabled="true"]):not([aria-hidden="true"])';
   var notDisabled = ":not([disabled])".concat(not);
-  var focusable = ["a[href]".concat(not), "area[href]".concat(not), "input".concat(notDisabled, ":not([type=\"hidden\"])"), "select".concat(notDisabled), "textarea".concat(notDisabled), "button".concat(notDisabled), "iframe".concat(not), "audio[controls]".concat(not), "video[controls]".concat(not), "[contenteditable]:not([contenteditable=\"false\"])".concat(not), "[tabindex]".concat(notDisabled).concat(not)];
+  var focusable = ["a[href]".concat(not), "area[href]".concat(not), "input".concat(notDisabled, ":not([type=\"hidden\"])"), "select".concat(notDisabled), "textarea".concat(notDisabled), "button".concat(notDisabled), "iframe".concat(not), "audio[controls]".concat(not), "video[controls]".concat(not), "[contenteditable]:not([contenteditable=\"false\"])".concat(not), "[tabindex]".concat(notDisabled)];
   return {
     focusable: focusable.join(','),
     // Build the `:focus` selector

package/dist/esm/internal/get-aria-for-trigger.js

@@ -1,5 +1,3 @@
-import { roleToAriaHasPopup } from './role-to-aria-has-popup';
-
 /**
  * Roles accepted by `getAriaForTrigger`.
  *
@@ -9,12 +7,34 @@ import { roleToAriaHasPopup } from './role-to-aria-has-popup';
  * manually for tooltip triggers.
  */
 
+/**
+ * Valid values for the `aria-haspopup` attribute.
+ *
+ * Derived from the HTML spec - maps popover roles to what the trigger
+ * announces. `undefined` means the attribute is omitted entirely (used for
+ * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
+ * `aria-haspopup` would be misleading).
+ *
+ * `true` is intentionally NOT in the union - the runtime only ever produces
+ * the explicit string forms, so widening the type would invite consumers to
+ * pass `true` and get an `aria-haspopup="true"` serialisation that the
+ * runtime no longer emits.
+ */
+
 /**
  * Non-undefined subset of `TAriaHasPopupValue`. Every role accepted by
  * `getAriaForTrigger` maps to a concrete `aria-haspopup` string, so the
  * trigger always receives a defined attribute value.
  */
 
+var roleToAriaHasPopup = {
+  dialog: 'dialog',
+  alertdialog: 'dialog',
+  menu: 'menu',
+  listbox: 'listbox',
+  tree: 'tree',
+  grid: 'grid'
+};
 /**
  * Returns the ARIA attributes to spread onto a click-activated popover trigger.
  *
@@ -66,13 +86,6 @@ export function getAriaForTrigger(_ref) {
   var role = _ref.role,
     isOpen = _ref.isOpen,
     popoverId = _ref.popoverId;
-  // `roleToAriaHasPopup` accepts a wider role union (including tooltip-family
-  // roles that map to `undefined`). `TAriaForTriggerRole` excludes those, so
-  // the returned value is guaranteed to be a defined string. The cast narrows
-  // the wider helper signature to match.
-  var ariaHasPopup = roleToAriaHasPopup({
-    role: role
-  });
   // `aria-controls` is set to `undefined` while closed. The `Popover` /
   // `Dialog` primitives unmount their host element after the exit
   // animation finishes, so a closed-state `aria-controls` would point
@@ -81,7 +94,7 @@ export function getAriaForTrigger(_ref) {
   // until the target exists, avoiding the dangling reference while
   // keeping the relationship live whenever it is meaningful.
   return {
-    'aria-haspopup': ariaHasPopup,
+    'aria-haspopup': roleToAriaHasPopup[role],
     'aria-expanded': isOpen,
     'aria-controls': isOpen ? popoverId : undefined
   };

package/dist/esm/internal/role-types.js

@@ -1,58 +0,0 @@
-/**
- * Valid values for the `aria-haspopup` attribute.
- *
- * Derived from the HTML spec - maps popover roles to what the trigger
- * announces. `undefined` means the attribute is omitted entirely (used for
- * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
- * `aria-haspopup` would be misleading).
- *
- * `true` is intentionally NOT in the union - the runtime only ever produces
- * the explicit string forms, so widening the type would invite consumers to
- * pass `true` and get an `aria-haspopup="true"` serialisation that the
- * runtime no longer emits.
- */
-
-/**
- * Roles that require an accessible name (`label` or `labelledBy`) per WCAG 4.1.2.
- * Without a name, assistive technology cannot identify these landmarks.
- */
-
-/**
- * Roles where the accessible name is derived from content or provided externally
- * (e.g. a combobox labels its listbox, tooltip content IS the accessible name).
- */
-
-// Shared ARIA role discrimination types
-//
-// These encode the WCAG 4.1.2 constraint: roles like `dialog`, `alertdialog`,
-// and `menu` MUST have an accessible name (either `label` or `labelledBy`).
-// TypeScript enforces this at compile time via discriminated unions.
-
-/**
- * ARIA role props where a role is always required.
- *
- * Used by `TPopupContentProps`. Popup content must always declare
- * its role so assistive technology can identify the layer.
- */
-
-/**
- * ARIA role props where a role is optional.
- *
- * Used by `TPopoverProps`. The low-level primitive allows omitting
- * the role for cases where it is set externally or not needed.
- */
-
-var rolesThatMoveFocus = new Set(['dialog', 'alertdialog', 'menu', 'listbox', 'tree', 'grid']);
-
-/**
- * Returns `true` when the given popover role moves focus into the popover
- * on open, and `false` otherwise (including when `role` is `undefined`).
- */
-// eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
-export function shouldFocusIntoPopover(_ref) {
-  var role = _ref.role;
-  if (!role) {
-    return false;
-  }
-  return rolesThatMoveFocus.has(role);
-}

package/dist/esm/internal/use-anchor-position.js

@@ -317,11 +317,10 @@ export function useAnchorPosition(_ref3) {
        * See `notes/decisions/anchor-name-lifetime.md`
        */
       trigger.style.setProperty('anchor-name', anchorName);
-      var _undoPositioning = combine(setStyle({
+      return setStyle({
         element: popover,
         styles: popoverStyles
-      }));
-      return _undoPositioning;
+      });
     }
 
     // JS fallback. The popover is already in the top layer via

package/dist/esm/popover/popover.js

@@ -8,7 +8,7 @@ import mergeRefs from '@atlaskit/ds-lib/merge-refs';
 import once from '@atlaskit/ds-lib/once';
 import { useNotifyOpenLayerObserver } from '@atlaskit/layering/use-notify-open-layer-observer';
 import { resolvePlacement } from '../internal/resolve-placement';
-import { shouldFocusIntoPopover } from '../internal/role-types';
+import { shouldFocusIntoPopover } from '../internal/should-focus-into-popover';
 import { useAnimatedVisibility } from '../internal/use-animated-visibility';
 import { useFocusWrap } from '../internal/use-focus-wrap';
 import { useInitialFocus } from '../internal/use-initial-focus';

package/dist/types/internal/get-aria-for-trigger.d.ts

@@ -1,4 +1,4 @@
-import { type TAriaHasPopupValue, type TRoleRequiringAccessibleName } from './role-types';
+import { type TRoleRequiringAccessibleName } from './role-types';
 /**
  * Roles accepted by `getAriaForTrigger`.
  *
@@ -8,6 +8,26 @@ import { type TAriaHasPopupValue, type TRoleRequiringAccessibleName } from './ro
  * manually for tooltip triggers.
  */
 type TAriaForTriggerRole = TRoleRequiringAccessibleName | 'listbox' | 'tree' | 'grid';
+/**
+ * Valid values for the `aria-haspopup` attribute.
+ *
+ * Derived from the HTML spec - maps popover roles to what the trigger
+ * announces. `undefined` means the attribute is omitted entirely (used for
+ * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
+ * `aria-haspopup` would be misleading).
+ *
+ * `true` is intentionally NOT in the union - the runtime only ever produces
+ * the explicit string forms, so widening the type would invite consumers to
+ * pass `true` and get an `aria-haspopup="true"` serialisation that the
+ * runtime no longer emits.
+ */
+type TAriaHasPopupValue = 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | undefined;
+/**
+ * Non-undefined subset of `TAriaHasPopupValue`. Every role accepted by
+ * `getAriaForTrigger` maps to a concrete `aria-haspopup` string, so the
+ * trigger always receives a defined attribute value.
+ */
+type TAriaHasPopupForTrigger = Exclude<TAriaHasPopupValue, undefined>;
 type TGetAriaForTriggerOptions = {
     /**
      * The `role` that will be set on the `<Popover>` element. Used to derive
@@ -24,12 +44,6 @@ type TGetAriaForTriggerOptions = {
      */
     popoverId: string;
 };
-/**
- * Non-undefined subset of `TAriaHasPopupValue`. Every role accepted by
- * `getAriaForTrigger` maps to a concrete `aria-haspopup` string, so the
- * trigger always receives a defined attribute value.
- */
-type TAriaHasPopupForTrigger = Exclude<TAriaHasPopupValue, undefined>;
 type TAriaForTrigger = {
     'aria-haspopup': TAriaHasPopupForTrigger;
     'aria-expanded': boolean;

package/dist/types/internal/role-types.d.ts

@@ -1,17 +1,3 @@
-/**
- * Valid values for the `aria-haspopup` attribute.
- *
- * Derived from the HTML spec - maps popover roles to what the trigger
- * announces. `undefined` means the attribute is omitted entirely (used for
- * non-popup roles like `tooltip`/`status`/`alert`/`note`/`log` where
- * `aria-haspopup` would be misleading).
- *
- * `true` is intentionally NOT in the union - the runtime only ever produces
- * the explicit string forms, so widening the type would invite consumers to
- * pass `true` and get an `aria-haspopup="true"` serialisation that the
- * runtime no longer emits.
- */
-export type TAriaHasPopupValue = 'dialog' | 'menu' | 'listbox' | 'tree' | 'grid' | undefined;
 /**
  * Roles that require an accessible name (`label` or `labelledBy`) per WCAG 4.1.2.
  * Without a name, assistive technology cannot identify these landmarks.
@@ -50,22 +36,4 @@ export type TAriaRoleRequired = ({
 } & TAccessibleNameRequired) | ({
     role: TRoleWithImplicitName;
 } & TAccessibleNameOptional);
-/**
- * ARIA role props where a role is optional.
- *
- * Used by `TPopoverProps`. The low-level primitive allows omitting
- * the role for cases where it is set externally or not needed.
- */
-export type TAriaRoleOptional = ({
-    role: TRoleRequiringAccessibleName;
-} & TAccessibleNameRequired) | ({
-    role?: TRoleWithImplicitName;
-} & TAccessibleNameOptional);
-/**
- * Returns `true` when the given popover role moves focus into the popover
- * on open, and `false` otherwise (including when `role` is `undefined`).
- */
-export declare function shouldFocusIntoPopover({ role, }: {
-    role: TRoleRequiringAccessibleName | TRoleWithImplicitName | undefined;
-}): boolean;
 export {};

package/dist/types/popover/types.d.ts

@@ -92,7 +92,7 @@ type TPopoverBaseProps = {
      */
     isOpen: boolean;
     /**
-     * Placement hint for directional animations (e.g. `slideAndFade`).
+     * Placement hint for the default directional animation.
      *
      * When `shouldAnimate` is `true`, placement is used to set CSS custom
      * properties (like `--ds-popover-tx`, `--ds-popover-ty`) that control the

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/top-layer",
-	"version": "3.2.0",
+	"version": "4.0.0",
 	"description": "Low-level layering primitives based on popover and dialog",
 	"homepage": "https://atlassian.design/components/top-layer",
 	"repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
@@ -40,9 +40,9 @@
 		"@atlaskit/ds-lib": "^8.0.0",
 		"@atlaskit/layering": "^5.0.0",
 		"@atlaskit/react-compiler-gating": "^0.2.0",
-		"@atlaskit/tokens": "^16.4.0",
+		"@atlaskit/tokens": "^16.7.0",
 		"@babel/runtime": "^7.0.0",
-		"@compiled/react": "^1.0.0",
+		"@compiled/react": "^1.0.2",
 		"bind-event-listener": "^3.0.0",
 		"raf-schd": "^4.0.3"
 	},
@@ -68,33 +68,6 @@
 		"react-dom": "^19.0.0",
 		"tiny-invariant": "^1.2.0"
 	},
-	"techstack": {
-		"@atlassian/frontend": {
-			"import-structure": [
-				"atlassian-conventions"
-			],
-			"circular-dependencies": [
-				"file-and-folder-level"
-			]
-		},
-		"@repo/internal": {
-			"dom-events": "use-bind-event-listener",
-			"ui-components": [
-				"lite-mode"
-			],
-			"design-tokens": [
-				"color",
-				"spacing"
-			],
-			"deprecation": [
-				"no-deprecated-imports"
-			],
-			"styling": [
-				"static",
-				"compiled"
-			]
-		}
-	},
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
 	}

package/animations/package.json

@@ -1,10 +0,0 @@
-{
-  "name": "@atlaskit/top-layer/animations",
-  "main": "../dist/cjs/entry-points/animations.js",
-  "module": "../dist/esm/entry-points/animations.js",
-  "module:es2019": "../dist/es2019/entry-points/animations.js",
-  "sideEffects": [
-    "*.compiled.css"
-  ],
-  "types": "../dist/types/entry-points/animations.d.ts"
-}

package/dist/cjs/entry-points/animations.js

@@ -1 +0,0 @@
-"use strict";

package/dist/cjs/internal/role-to-aria-has-popup.js

@@ -1,37 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.roleToAriaHasPopup = roleToAriaHasPopup;
-/**
- * Maps a popover content role to the correct `aria-haspopup` value
- * for its trigger element.
- *
- * Returns `undefined` for roles that are not popups in the ARIA sense
- * (`tooltip`, `note`, `status`, `alert`, `log`). Triggers for those roles
- * should not announce a popup at all - emitting `aria-haspopup="dialog"`
- * on a tooltip trigger would mislead assistive technology.
- */
-function roleToAriaHasPopup(_ref) {
-  var role = _ref.role;
-  if (role === 'menu') {
-    return 'menu';
-  }
-  if (role === 'listbox') {
-    return 'listbox';
-  }
-  if (role === 'tree') {
-    return 'tree';
-  }
-  if (role === 'grid') {
-    return 'grid';
-  }
-  if (role === 'dialog' || role === 'alertdialog') {
-    return 'dialog';
-  }
-  // Non-popup roles (tooltip, note, status, alert, log) and the
-  // no-role case: omit `aria-haspopup` entirely. React drops the
-  // attribute when the value is `undefined`.
-  return undefined;
-}

package/dist/cjs/internal/slot.js

@@ -1,65 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Slot = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _react = require("react");
-var _mergeRefs = _interopRequireDefault(require("@atlaskit/ds-lib/merge-refs"));
-var _excluded = ["children"];
-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; }
-/**
- * Extra DOM/event props are passed through to the cloned child.
- */
-
-/**
- * Single element child: merge the caller ref with `child.ref`.
- *
- * Do not read `child.props.ref`: React keeps a `ref` key on `props` for
- * host elements but accessing it logs a warning and returns `undefined`
- * (ref lives on the element as `child.ref`).
- */
-
-function isSlotChild(child) {
-  return /*#__PURE__*/(0, _react.isValidElement)(child);
-}
-
-/**
- * Merges props (including ref) onto a single React element child.
- *
- * A safer alternative to raw `cloneElement` that:
- * 1. Guards with `isValidElement` - non-element children (strings,
- *    fragments, null) are returned as-is instead of crashing.
- * 2. Merges refs via `mergeRefs` so both the caller's ref and the
- *    child's existing ref are honoured.
- * 3. Spreads any additional props (ARIA attributes, event handlers, etc.)
- *    onto the child element.
- *
- * Event handlers (e.g. `onClick`) are **not** auto-merged - the caller's
- * handler replaces the child's. Compose handlers before passing them in.
- *
- * @example
- * ```tsx
- * <Slot ref={triggerRef} onClick={handleClick} aria-expanded={isOpen}>
- *   <button>Open</button>
- * </Slot>
- * ```
- */
-var Slot = exports.Slot = /*#__PURE__*/(0, _react.forwardRef)(function Slot(slotProps, ref) {
-  var rawChildren = slotProps.children,
-    props = (0, _objectWithoutProperties2.default)(slotProps, _excluded);
-  // `TSlotProps` intersects `Record<string, unknown>`, so `children` is typed as `unknown`.
-  var children = rawChildren;
-  if (!isSlotChild(children)) {
-    return children;
-  }
-
-  // eslint-disable-next-line @repo/internal/react/no-clone-element -- Slot is a controlled wrapper around cloneElement with isValidElement guard
-  return /*#__PURE__*/(0, _react.cloneElement)(children, _objectSpread(_objectSpread({}, props), {}, {
-    ref: (0, _mergeRefs.default)([ref, children.ref])
-  }));
-});

package/dist/es2019/internal/role-to-aria-has-popup.js

@@ -1,32 +0,0 @@
-/**
- * Maps a popover content role to the correct `aria-haspopup` value
- * for its trigger element.
- *
- * Returns `undefined` for roles that are not popups in the ARIA sense
- * (`tooltip`, `note`, `status`, `alert`, `log`). Triggers for those roles
- * should not announce a popup at all - emitting `aria-haspopup="dialog"`
- * on a tooltip trigger would mislead assistive technology.
- */
-export function roleToAriaHasPopup({
-  role
-}) {
-  if (role === 'menu') {
-    return 'menu';
-  }
-  if (role === 'listbox') {
-    return 'listbox';
-  }
-  if (role === 'tree') {
-    return 'tree';
-  }
-  if (role === 'grid') {
-    return 'grid';
-  }
-  if (role === 'dialog' || role === 'alertdialog') {
-    return 'dialog';
-  }
-  // Non-popup roles (tooltip, note, status, alert, log) and the
-  // no-role case: omit `aria-haspopup` entirely. React drops the
-  // attribute when the value is `undefined`.
-  return undefined;
-}

package/dist/es2019/internal/slot.js

@@ -1,57 +0,0 @@
-import { cloneElement, forwardRef, isValidElement } from 'react';
-import mergeRefs from '@atlaskit/ds-lib/merge-refs';
-
-/**
- * Extra DOM/event props are passed through to the cloned child.
- */
-
-/**
- * Single element child: merge the caller ref with `child.ref`.
- *
- * Do not read `child.props.ref`: React keeps a `ref` key on `props` for
- * host elements but accessing it logs a warning and returns `undefined`
- * (ref lives on the element as `child.ref`).
- */
-
-function isSlotChild(child) {
-  return /*#__PURE__*/isValidElement(child);
-}
-
-/**
- * Merges props (including ref) onto a single React element child.
- *
- * A safer alternative to raw `cloneElement` that:
- * 1. Guards with `isValidElement` - non-element children (strings,
- *    fragments, null) are returned as-is instead of crashing.
- * 2. Merges refs via `mergeRefs` so both the caller's ref and the
- *    child's existing ref are honoured.
- * 3. Spreads any additional props (ARIA attributes, event handlers, etc.)
- *    onto the child element.
- *
- * Event handlers (e.g. `onClick`) are **not** auto-merged - the caller's
- * handler replaces the child's. Compose handlers before passing them in.
- *
- * @example
- * ```tsx
- * <Slot ref={triggerRef} onClick={handleClick} aria-expanded={isOpen}>
- *   <button>Open</button>
- * </Slot>
- * ```
- */
-export const Slot = /*#__PURE__*/forwardRef(function Slot(slotProps, ref) {
-  const {
-    children: rawChildren,
-    ...props
-  } = slotProps;
-  // `TSlotProps` intersects `Record<string, unknown>`, so `children` is typed as `unknown`.
-  const children = rawChildren;
-  if (!isSlotChild(children)) {
-    return children;
-  }
-
-  // eslint-disable-next-line @repo/internal/react/no-clone-element -- Slot is a controlled wrapper around cloneElement with isValidElement guard
-  return /*#__PURE__*/cloneElement(children, {
-    ...props,
-    ref: mergeRefs([ref, children.ref])
-  });
-});

package/dist/esm/internal/role-to-aria-has-popup.js

@@ -1,31 +0,0 @@
-/**
- * Maps a popover content role to the correct `aria-haspopup` value
- * for its trigger element.
- *
- * Returns `undefined` for roles that are not popups in the ARIA sense
- * (`tooltip`, `note`, `status`, `alert`, `log`). Triggers for those roles
- * should not announce a popup at all - emitting `aria-haspopup="dialog"`
- * on a tooltip trigger would mislead assistive technology.
- */
-export function roleToAriaHasPopup(_ref) {
-  var role = _ref.role;
-  if (role === 'menu') {
-    return 'menu';
-  }
-  if (role === 'listbox') {
-    return 'listbox';
-  }
-  if (role === 'tree') {
-    return 'tree';
-  }
-  if (role === 'grid') {
-    return 'grid';
-  }
-  if (role === 'dialog' || role === 'alertdialog') {
-    return 'dialog';
-  }
-  // Non-popup roles (tooltip, note, status, alert, log) and the
-  // no-role case: omit `aria-haspopup` entirely. React drops the
-  // attribute when the value is `undefined`.
-  return undefined;
-}

package/dist/esm/internal/slot.js

@@ -1,59 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["children"];
-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) { _defineProperty(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; }
-import { cloneElement, forwardRef, isValidElement } from 'react';
-import mergeRefs from '@atlaskit/ds-lib/merge-refs';
-
-/**
- * Extra DOM/event props are passed through to the cloned child.
- */
-
-/**
- * Single element child: merge the caller ref with `child.ref`.
- *
- * Do not read `child.props.ref`: React keeps a `ref` key on `props` for
- * host elements but accessing it logs a warning and returns `undefined`
- * (ref lives on the element as `child.ref`).
- */
-
-function isSlotChild(child) {
-  return /*#__PURE__*/isValidElement(child);
-}
-
-/**
- * Merges props (including ref) onto a single React element child.
- *
- * A safer alternative to raw `cloneElement` that:
- * 1. Guards with `isValidElement` - non-element children (strings,
- *    fragments, null) are returned as-is instead of crashing.
- * 2. Merges refs via `mergeRefs` so both the caller's ref and the
- *    child's existing ref are honoured.
- * 3. Spreads any additional props (ARIA attributes, event handlers, etc.)
- *    onto the child element.
- *
- * Event handlers (e.g. `onClick`) are **not** auto-merged - the caller's
- * handler replaces the child's. Compose handlers before passing them in.
- *
- * @example
- * ```tsx
- * <Slot ref={triggerRef} onClick={handleClick} aria-expanded={isOpen}>
- *   <button>Open</button>
- * </Slot>
- * ```
- */
-export var Slot = /*#__PURE__*/forwardRef(function Slot(slotProps, ref) {
-  var rawChildren = slotProps.children,
-    props = _objectWithoutProperties(slotProps, _excluded);
-  // `TSlotProps` intersects `Record<string, unknown>`, so `children` is typed as `unknown`.
-  var children = rawChildren;
-  if (!isSlotChild(children)) {
-    return children;
-  }
-
-  // eslint-disable-next-line @repo/internal/react/no-clone-element -- Slot is a controlled wrapper around cloneElement with isValidElement guard
-  return /*#__PURE__*/cloneElement(children, _objectSpread(_objectSpread({}, props), {}, {
-    ref: mergeRefs([ref, children.ref])
-  }));
-});

package/dist/types/internal/role-to-aria-has-popup.d.ts

@@ -1,13 +0,0 @@
-import type { TAriaHasPopupValue, TRoleRequiringAccessibleName, TRoleWithImplicitName } from './role-types';
-/**
- * Maps a popover content role to the correct `aria-haspopup` value
- * for its trigger element.
- *
- * Returns `undefined` for roles that are not popups in the ARIA sense
- * (`tooltip`, `note`, `status`, `alert`, `log`). Triggers for those roles
- * should not announce a popup at all - emitting `aria-haspopup="dialog"`
- * on a tooltip trigger would mislead assistive technology.
- */
-export declare function roleToAriaHasPopup({ role, }: {
-    role: TRoleRequiringAccessibleName | TRoleWithImplicitName | undefined;
-}): TAriaHasPopupValue;

package/dist/types/internal/slot.d.ts

@@ -1,29 +0,0 @@
-import { type ForwardRefExoticComponent, type ReactNode, type RefAttributes } from 'react';
-/**
- * Extra DOM/event props are passed through to the cloned child.
- */
-export type TSlotProps = {
-    children: ReactNode;
-} & Record<string, unknown>;
-/**
- * Merges props (including ref) onto a single React element child.
- *
- * A safer alternative to raw `cloneElement` that:
- * 1. Guards with `isValidElement` - non-element children (strings,
- *    fragments, null) are returned as-is instead of crashing.
- * 2. Merges refs via `mergeRefs` so both the caller's ref and the
- *    child's existing ref are honoured.
- * 3. Spreads any additional props (ARIA attributes, event handlers, etc.)
- *    onto the child element.
- *
- * Event handlers (e.g. `onClick`) are **not** auto-merged - the caller's
- * handler replaces the child's. Compose handlers before passing them in.
- *
- * @example
- * ```tsx
- * <Slot ref={triggerRef} onClick={handleClick} aria-expanded={isOpen}>
- *   <button>Open</button>
- * </Slot>
- * ```
- */
-export declare const Slot: ForwardRefExoticComponent<TSlotProps & RefAttributes<HTMLElement>>;