@atlaskit/top-layer 4.4.2 → 4.4.4

package/dist/esm/popover/popover.js

@@ -1,4 +1,4 @@
-/* popover.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* popover.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./popover.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { forwardRef, useCallback, useId, useLayoutEffect, useMemo, useRef } from 'react';
@@ -89,7 +89,9 @@ var POPUP_ROLES = new Set(['menu', 'listbox', 'dialog', 'alertdialog', 'tree', '
  * ### 📜 Browser dismiss is non-cancellable
  *
  * Per the popover spec, `beforetoggle` is cancellable on open transitions
- * only, not on close.
+ * only, not on close. Consumers should update controlled intent by setting
+ * `isOpen` to `false` from `onClose`. If controlled intent remains open after
+ * native close, the Popover remains closed until the prop changes.
  *
  * - Spec: <https://html.spec.whatwg.org/multipage/popover.html#the-popover-attribute>
  * - <https://github.com/whatwg/html/issues/8973>
@@ -128,44 +130,25 @@ export var Popover = /*#__PURE__*/forwardRef(function Popover(_ref, ref) {
   var combinedRef = mergeRefs([ownRef, ref].filter(Boolean));
   // `useId()` colons are invalid in CSS selectors and popover target attributes.
   var popoverId = idProp !== null && idProp !== void 0 ? idProp : "popover-".concat(autoId.replace(/:/g, ''));
-  var _useAnimatedVisibilit = useAnimatedVisibility({
-      isOpen: isOpen,
-      shouldAnimate: shouldAnimate,
-      elementRef: ownRef,
-      onEnterFinish: onEnterFinish,
-      onExitFinish: onExitFinish
-    }),
-    phase = _useAnimatedVisibilit.phase,
-    onToggle = _useAnimatedVisibilit.onToggle;
 
-  // True while the host element is mounted (any phase except `closed`).
-  // Used as a dep so listener-rebind effects re-attach after a remount.
-  var isVisible = phase !== 'closed';
-
-  // Focus management: initial focus on entry (role-dependent), Tab cycling
-  // for dialog roles. Restoration is native for outermost popovers; nested
-  // focus-capturing roles are handled below via the `beforetoggle` snapshot.
-  // Passing `phase` keeps `useFocusWrap` attached through the animated-exit
-  // window (WCAG 2.4.3 guard). See notes/architecture/focus-restoration.md.
-  useFocusWrap({
-    elementRef: ownRef,
-    role: role,
-    phase: phase
-  });
-  useInitialFocus({
-    elementRef: ownRef,
-    phase: phase,
-    role: role
-  });
+  // Keep semantic callbacks current without rebinding native lifecycle
+  // listeners during the same commit that calls showPopover()/hidePopover().
+  var onCloseRef = useRef(onClose);
+  var roleRef = useRef(role);
+  useLayoutEffect(function () {
+    onCloseRef.current = onClose;
+    roleRef.current = role;
+  }, [onClose, role]);
 
   // Register with open layer observer so `closeLayers()` and open-count
   // subscriptions work. Only popup-like roles register as `popup`; passive
   // roles (tooltip, status, etc.) leave `type` undefined.
   var handleObserverClose = useCallback(function () {
-    onClose === null || onClose === void 0 || onClose({
+    var _onCloseRef$current;
+    (_onCloseRef$current = onCloseRef.current) === null || _onCloseRef$current === void 0 || _onCloseRef$current.call(onCloseRef, {
       reason: 'programmatic'
     });
-  }, [onClose]);
+  }, []);
   useNotifyOpenLayerObserver({
     type: role && POPUP_ROLES.has(role) ? 'popup' : undefined,
     isOpen: isOpen,
@@ -206,51 +189,75 @@ export var Popover = /*#__PURE__*/forwardRef(function Popover(_ref, ref) {
     var active = document.activeElement;
     previouslyFocusedElementRef.current = active instanceof HTMLElement ? active : null;
   }, []);
-  var handleToggle = useCallback(function (event) {
-    var element = ownRef.current;
-    if (event.newState === 'open') {
-      onToggle(event);
-      return;
+  var restorePreviouslyFocusedElement = useCallback(function () {
+    var previouslyFocused = previouslyFocusedElementRef.current;
+    previouslyFocusedElementRef.current = null;
+    if (previouslyFocused !== null && previouslyFocused.isConnected && shouldFocusIntoPopover({
+      role: roleRef.current
+    })) {
+      previouslyFocused.focus({
+        preventScroll: true
+      });
+    }
+  }, []);
+  var handleToggleClosed = useCallback(function (_event) {
+    var _onCloseRef$current2;
+    // Nested-popover focus restoration fallback (browser only
+    // restores outermost; Firefox skips nested entirely).
+    // Restore only when the role moved focus in on open AND the
+    // close was Escape/programmatic. For light dismiss, the
+    // click target keeps focus per HTML spec
+    // (`focusPreviousElement=false`).
+    var reason = closeReasonRef.current;
+    var isProgrammatic = programmaticCloseRef.current;
+    if (reason === 'escape' || isProgrammatic) {
+      restorePreviouslyFocusedElement();
+    } else {
+      previouslyFocusedElementRef.current = null;
     }
-    if (event.newState === 'closed') {
-      if (element) {
-        // Nested-popover focus restoration fallback (browser only
-        // restores outermost; Firefox skips nested entirely).
-        // Restore only when the role moved focus in on open AND the
-        // close was Escape/programmatic. For light dismiss, the
-        // click target keeps focus per HTML spec
-        // (`focusPreviousElement=false`).
-        var previouslyFocused = previouslyFocusedElementRef.current;
-        var reason = closeReasonRef.current;
-        var isProgrammatic = programmaticCloseRef.current;
-        var shouldRestore = previouslyFocused !== null && previouslyFocused.isConnected && shouldFocusIntoPopover({
-          role: role
-        }) && (reason === 'escape' || isProgrammatic);
-        if (shouldRestore && previouslyFocused) {
-          previouslyFocused.focus({
-            preventScroll: true
-          });
-        }
-        previouslyFocusedElementRef.current = null;
-      }
 
-      // Programmatic close: consumer already knows.
-      if (programmaticCloseRef.current) {
-        // Reset reason so a stale 'escape' from a race with Escape keydown
-        // does not corrupt the next browser-dismiss cycle.
-        closeReasonRef.current = 'light-dismiss';
-      } else {
-        // Browser dismiss (Escape/click-outside).
-        var _reason = closeReasonRef.current;
-        closeReasonRef.current = 'light-dismiss';
-        // Optional: `manual` mode has no `onClose` in the forwarded type.
-        onClose === null || onClose === void 0 || onClose({
-          reason: _reason
-        });
-      }
+    // Reset reason so a stale 'escape' from a race with Escape keydown
+    // does not corrupt the next browser-dismiss cycle.
+    closeReasonRef.current = 'light-dismiss';
+
+    // Programmatic close: consumer already knows.
+    if (isProgrammatic) {
+      return;
     }
-    onToggle(event);
-  }, [onClose, onToggle, role]);
+
+    // Browser dismiss (Escape/click-outside).
+    // Optional: `manual` mode has no `onClose` in the forwarded type.
+    (_onCloseRef$current2 = onCloseRef.current) === null || _onCloseRef$current2 === void 0 || _onCloseRef$current2.call(onCloseRef, {
+      reason: reason
+    });
+  }, [restorePreviouslyFocusedElement]);
+  var _useAnimatedVisibilit = useAnimatedVisibility({
+      isOpen: isOpen,
+      shouldAnimate: shouldAnimate,
+      elementRef: ownRef,
+      onEnterFinish: onEnterFinish,
+      onExitFinish: onExitFinish
+    }),
+    phase = _useAnimatedVisibilit.phase,
+    isMounted = _useAnimatedVisibilit.isMounted,
+    onBeforeToggle = _useAnimatedVisibilit.onBeforeToggle,
+    onToggle = _useAnimatedVisibilit.onToggle;
+
+  // Focus management: initial focus on entry (role-dependent), Tab cycling
+  // for dialog roles. Restoration is native for outermost popovers; nested
+  // focus-capturing roles are handled above via the `beforetoggle` snapshot.
+  // Passing `phase` keeps `useFocusWrap` attached through the animated-exit
+  // window (WCAG 2.4.3 guard). See notes/architecture/focus-restoration.md.
+  useFocusWrap({
+    elementRef: ownRef,
+    role: role,
+    phase: phase
+  });
+  useInitialFocus({
+    elementRef: ownRef,
+    phase: phase,
+    role: role
+  });
 
   // Bind via `useLayoutEffect`, and BEFORE the show/hide layout effect
   // below, so listeners are attached when `showPopover()` synchronously
@@ -278,19 +285,28 @@ export var Popover = /*#__PURE__*/forwardRef(function Popover(_ref, ref) {
     });
     var unbindToggle = bind(element, {
       type: 'toggle',
-      listener: handleToggle
+      listener: function listener(event) {
+        if (event.newState === 'closed') {
+          handleToggleClosed(event);
+        }
+        onToggle(event);
+      }
     });
-    // Snapshot `document.activeElement` before `useInitialFocus` moves it.
+    // Snapshot `document.activeElement` before `useInitialFocus` moves it,
+    // then advance the shared visibility lifecycle.
     var unbindBeforeToggle = bind(element, {
       type: 'beforetoggle',
-      listener: handleBeforeToggle
+      listener: function listener(event) {
+        handleBeforeToggle(event);
+        onBeforeToggle(event);
+      }
     });
     return function () {
       unbindEscape();
       unbindToggle();
       unbindBeforeToggle();
     };
-  }, [handleToggle, handleBeforeToggle, isVisible]);
+  }, [handleBeforeToggle, handleToggleClosed, isMounted, onBeforeToggle, onToggle]);
 
   // Show/hide based on isOpen. `showPopover`/`hidePopover` are no-ops when
   // already in the target state. Try/catch guards `InvalidStateError` on
@@ -303,8 +319,8 @@ export var Popover = /*#__PURE__*/forwardRef(function Popover(_ref, ref) {
     if (isOpen) {
       programmaticCloseRef.current = false;
       // Clear stale 'escape' from a prior cycle: the ref outlives
-      // the host element, and the no-animation path unmounts before
-      // `handleToggle` can reset it.
+      // the host element, and interrupted close lifecycles may not reach
+      // `handleToggleClosed` to reset it.
       closeReasonRef.current = 'light-dismiss';
       try {
         element.showPopover();
@@ -325,7 +341,7 @@ export var Popover = /*#__PURE__*/forwardRef(function Popover(_ref, ref) {
   // Unmount the host once exit completes so it does not leave an empty
   // `role`/`popover` element in the accessibility tree. The element
   // remounts on the next open; the `popoverId` is stable across opens.
-  if (!isVisible) {
+  if (!isMounted) {
     return null;
   }
   return /*#__PURE__*/React.createElement("div", {

package/dist/esm/popover-surface/popover-surface.js

@@ -1,4 +1,4 @@
-/* popover-surface.tsx generated by @compiled/babel-plugin v2.0.0 */
+/* popover-surface.tsx generated by @compiled/babel-plugin v3.0.1 */
 import "./popover-surface.compiled.css";
 import * as React from 'react';
 import { ax, ix } from "@compiled/react/runtime";

package/dist/types/dialog/types.d.ts

@@ -25,12 +25,13 @@ export type TDialogDismissedBy = 'none' | 'escape' | 'escape-and-outside-click';
 type TDialogBaseProps = {
     children: ReactNode;
     /**
-     * Whether the dialog is open.
+     * Controlled visibility intent for the dialog. Native visibility and lifecycle
+     * phase can temporarily differ from this value while a close settles.
      *
      * - `true`: calls `showModal()`. When `shouldAnimate` is `true`, the entry
      *   animation plays via `@starting-style`.
      * - `false`: calls `close()`. When `shouldAnimate` is `true`, the exit
-     *   animation plays via `allow-discrete` before the dialog becomes logically closed.
+     *   animation plays via `allow-discrete` while the lifecycle phase is `exiting`.
      *
      * **Lifecycle observable to consumers:**
      *
@@ -119,8 +120,9 @@ type TDialogBaseProps = {
      */
     onEnterFinish?: () => void;
     /**
-     * Called after the exit animation completes (or immediately on close when
-     * there is no animation or reduced motion is active).
+     * Called after the native closed `toggle` and any exit animations settle.
+     * With no animation or reduced motion, this still waits for the browser's
+     * task-queued `toggle` so focus restoration finishes against a mounted host.
      *
      * Use this for external lifecycle coordination, e.g. firing an
      * `onCloseComplete` callback or notifying ExitingPersistence.

package/dist/types/focus/get-closest-layer.d.ts

@@ -0,0 +1,3 @@
+export declare function getClosestLayer({ element }: {
+    element: HTMLElement;
+}): Element | null;

package/dist/types/focus/get-focusables.d.ts

@@ -1,6 +1,8 @@
 import type { TFocusableFilter } from './types';
 /**
  * Returns all focusable HTMLElements within the container, optionally filtered.
+ * Elements with `tabindex="-1"` are excluded because they can be focused
+ * programmatically but are not sequential focus navigation destinations.
  *
  * Focusables that belong to a nested top-layer scope (a `[popover]` or
  * `<dialog>` descendant of the container) are excluded - those elements

package/dist/types/focus/get-next-focusable.d.ts

@@ -2,8 +2,12 @@
  * Returns the next focusable element in the given direction relative to the
  * currently focused element within the container. Wraps around at both ends.
  *
- * Returns `null` if there is no focused element within the container or if
- * the focused element is not in the list of focusable elements.
+ * The currently focused element does not need to be tabbable. This prevents
+ * navigation from getting stuck on an element that was programmatically or
+ * pointer focused with `tabindex="-1"`. Negative-tab-index elements remain
+ * excluded as destinations.
+ *
+ * Returns `null` if there is no focused element within the container.
  */
 import type { TFocusableFilter } from './types';
 export declare function getNextFocusable({ container, direction, filter, }: {

package/dist/types/focus/is-nested-layer-focused.d.ts

@@ -1,7 +1,7 @@
 /**
  * Returns `true` when `document.activeElement` is inside a nested top-layer
- * descendant of `container` (a `[popover]`, `<dialog>`, `[role="dialog"]` or
- * `[role="alertdialog"]` that is itself a descendant of `container`).
+ * descendant of `container` (a `[popover]` or `<dialog>` that is itself a
+ * descendant of `container`).
  */
 export declare function isNestedLayerFocused({ container }: {
     container: HTMLElement;

package/dist/types/internal/use-animated-visibility.d.ts

@@ -1,46 +1,48 @@
 import { type RefObject } from 'react';
 type TUseAnimatedVisibilityArgs = {
     /**
-     * Whether the element is logically open.
+     * Controlled visibility intent from the consumer. This can temporarily differ
+     * from native visibility during browser-initiated dismissal and close settlement.
      */
     isOpen: boolean;
     /**
-     * Animation config for entry/exit transitions.
-     * Pass `false` or `undefined` to disable animation.
+     * Animation config for entry/exit animations.
+     * Pass `false` to disable animation.
      */
     shouldAnimate: boolean;
     /**
-     * Ref to the DOM element that plays the entry/exit transitions.
-     * Used to inspect active animations.
+     * Ref to the DOM element that plays the entry/exit animations.
+     * Used to inspect its active animations.
      */
     elementRef: RefObject<HTMLElement | null>;
     /**
-     * Called after the entry animation completes (or immediately on open
-     * when there is no animation or reduced motion is active).
-     * This includes initial mount with `isOpen=true`.
+     * Called after entry settles and the `open` phase has committed, so the
+     * callback observes the host without its entering styles. This includes
+     * initial mount with `isOpen=true`.
      */
     onEnterFinish?: () => void;
     /**
-     * Called after the exit animation completes (or immediately on close
-     * when there is no animation or reduced motion is active).
+     * Called after the native closed `toggle` and any exit animations settle.
+     * With animation disabled, this still waits for the task-queued `toggle`.
+     * The callback runs immediately before the host transitions to `closed`,
+     * so the element remains mounted while the callback runs.
      */
     onExitFinish?: () => void;
 };
 type TUseAnimatedVisibilityResult = {
     /**
-     * Current visibility phase. See `TPhase` for the full lifecycle.
-     *
-     * `phase !== 'closed'` means the host element is mounted and on
-     * screen, including during animated entry, animated exit, and the
-     * non-animated close handshake. Use this when you need "the user
-     * can still see / interact with the element" semantics (e.g. focus
-     * trapping, listeners that must outlive the exit).
+     * Current visibility phase. The host element is mounted whenever
+     * `phase !== 'closed'`.
      */
     phase: TPhase;
+    isMounted: boolean;
     /**
-     * Notifies the visibility lifecycle after the primitive has finished its
-     * own native toggle handling. Closing toggles make native dismissal
-     * authoritative while preserving primitive-specific handler ordering.
+     * Bind to the primitive's native `beforetoggle` event.
+     */
+    onBeforeToggle: (event: ToggleEvent) => void;
+    /**
+     * Bind to the primitive's native `toggle` event after any primitive-specific
+     * close handling that must complete before exit settlement.
      */
     onToggle: (event: ToggleEvent) => void;
 };
@@ -55,11 +57,11 @@ type TUseAnimatedVisibilityResult = {
  *   animation disabled the lifecycle goes directly `closed → open`.
  * - `open`: host element is mounted and settled. No transition is
  *   playing.
- * - `exiting`: `isOpen` has flipped to `false` but the host element
- *   is still mounted. Emitted while the CSS exit transition is playing
- *   (animation enabled) OR while we wait for the browser's
- *   `toggle`/`close` event to fire on the still-attached element so
- *   focus restoration can run (animation disabled).
+ * - `exiting`: a native close has begun but the host element remains
+ *   mounted. Usually this follows `isOpen` changing to `false`, but it can
+ *   also begin with a browser-initiated dismissal while controlled intent
+ *   is still open. With animation disabled, this phase lasts until the
+ *   browser's closed `toggle` fires so native focus restoration can finish.
  *
  * State machine:
  * ```
@@ -69,41 +71,26 @@ type TUseAnimatedVisibilityResult = {
  *                   exiting  → entering (reopen mid-exit, animated)
  *                   exiting  → open     (reopen mid-handshake, non-animated)
  * ```
- *
- * `phase !== 'closed'` is the canonical "host is currently in the DOM
- * and on screen" predicate.
  */
 export type TPhase = 'closed' | 'entering' | 'open' | 'exiting';
 /**
- * Manages the children mount/unmount lifecycle around CSS exit transitions.
- *
- * Used by both `Popover` and `Dialog` to share the same animation lifecycle
- * logic. Those components own their own show/hide mechanisms (showPopover /
- * hidePopover vs showModal / close) and event handling - this hook only
- * manages the relationship between `isOpen` and when children are rendered.
+ * Coordinates controlled intent, native visibility, lifecycle phase, and host
+ * mounting around CSS exit transitions. The canonical contract is documented in
+ * `notes/architecture/animations.md#canonical-visibility-lifecycle-contract`.
  *
- * ## Problem
+ * Used by both `Popover` and `Dialog` to share the same lifecycle logic. Those
+ * components own native event binding, show and hide commands, and
+ * component-specific event handling. This hook returns stable `onBeforeToggle`
+ * and `onToggle` callbacks that advance lifecycle phase and host mounting.
  *
- * We want to delay the unmount of children until a CSS exit transition has
- * finished playing. If we unmount children the moment `isOpen` becomes
- * `false`, the exit animation is never visible - the content just disappears.
- *
- * ## How it works
- *
- * The lifecycle is modeled as a `phase` discriminated union (`closed`,
- * `entering`, `open`, `exiting`). The host element is rendered while
- * `phase !== 'closed'`, so the `exiting` phase keeps the host mounted
- * while the CSS exit transition plays (or, with animation disabled,
- * while we wait for the browser's closing `toggle` event to fire on the
- * still-attached element):
+ * The host element is rendered while `phase !== 'closed'`. The `exiting`
+ * phase keeps it mounted until its CSS animation settles or, with animation
+ * disabled, until the browser reports that the native element has closed.
  *
  * ```
  * isOpen:  true ──────────────── false
  * phase:   open ──────────────── exiting ─── (exit settle) ─── closed
  * ```
- *
- * Every effect dispatches on the single `phase` value instead of a
- * cross-product of booleans.
  */
 export declare function useAnimatedVisibility({ isOpen, shouldAnimate, elementRef, onEnterFinish, onExitFinish, }: TUseAnimatedVisibilityArgs): TUseAnimatedVisibilityResult;
 export {};

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

@@ -16,7 +16,9 @@ import { type TPopoverForwardedProps } from './types';
  * ### 📜 Browser dismiss is non-cancellable
  *
  * Per the popover spec, `beforetoggle` is cancellable on open transitions
- * only, not on close.
+ * only, not on close. Consumers should update controlled intent by setting
+ * `isOpen` to `false` from `onClose`. If controlled intent remains open after
+ * native close, the Popover remains closed until the prop changes.
  *
  * - Spec: <https://html.spec.whatwg.org/multipage/popover.html#the-popover-attribute>
  * - <https://github.com/whatwg/html/issues/8973>

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

@@ -62,13 +62,15 @@ type TPopoverBaseProps = {
      */
     id?: string;
     /**
-     * Whether the popover is open.
+     * Controlled visibility intent for the popover. Native visibility and lifecycle
+     * phase can temporarily differ from this value while a close settles.
      *
      * - **`true`:** show the popover (calls `showPopover()`). When `shouldAnimate`
      *   is `true`, the entry animation plays via `@starting-style`.
      * - **`false`:** hide the popover. When `shouldAnimate` is `true`, the exit
-     *   animation plays via `allow-discrete` before the popover becomes logically closed.
-     *   Otherwise hides instantly.
+     *   animation plays via `allow-discrete` while the lifecycle phase is `exiting`.
+     *   Otherwise it hides visually without animation, while lifecycle settlement still
+     *   waits for the native closed `toggle`.
      *
      * The consumer does not conditionally render the `Popover` - visibility is driven
      * by this prop.
@@ -88,7 +90,7 @@ type TPopoverBaseProps = {
      * via light dismiss (Escape, click outside) independently of this prop. When that
      * happens, `onClose` is called and the consumer should respond by setting `isOpen`
      * to `false`. If `isOpen` remains `true` after a browser dismiss, the DOM and
-     * React state will be out of sync (the popover will be hidden despite `isOpen={true}`).
+     * React state remain out of sync until the consumer changes the prop.
      */
     isOpen: boolean;
     /**
@@ -110,8 +112,9 @@ type TPopoverBaseProps = {
      */
     onEnterFinish?: () => void;
     /**
-     * Called after the exit animation completes (or immediately on close when
-     * there is no animation or reduced motion is active).
+     * Called after the native closed `toggle` and any exit animations settle.
+     * With no animation or reduced motion, this still waits for the browser's
+     * task-queued `toggle` so focus restoration finishes against a mounted host.
      *
      * Use this for external lifecycle coordination, e.g. notifying a manager
      * that the hide sequence is finished, or firing an `onCloseComplete` callback.
@@ -146,9 +149,9 @@ export type TPopoverProps = TPopoverBaseProps & TAriaRoleRequired & ({
      * Called when the popover is dismissed via light dismiss
      * (Escape, click outside).
      *
-     * Required for `auto` and `hint` modes - without it, browser
-     * dismissals leave the consumer's `isOpen` stuck at `true` while
-     * the DOM is hidden, producing a stale-open state.
+     * Required for `auto` and `hint` modes so the consumer can update
+     * controlled intent after native dismissal. If `isOpen` remains `true`,
+     * the Popover remains natively closed until the prop changes.
      *
      * The `reason` field indicates how the dismiss occurred:
      * - `'escape'`: the user pressed the Escape key.

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/top-layer",
-	"version": "4.4.2",
+	"version": "4.4.4",
 	"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",
@@ -36,11 +36,11 @@
 	},
 	"dependencies": {
 		"@atlaskit/browser-apis": "^1.2.0",
-		"@atlaskit/css": "^1.0.0",
+		"@atlaskit/css": "^1.1.0",
 		"@atlaskit/ds-lib": "^8.0.0",
-		"@atlaskit/layering": "^5.1.0",
+		"@atlaskit/layering": "^5.2.0",
 		"@atlaskit/react-compiler-gating": "^0.2.0",
-		"@atlaskit/tokens": "^16.8.0",
+		"@atlaskit/tokens": "^16.11.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
 		"bind-event-listener": "^3.0.0",
@@ -53,14 +53,19 @@
 	"devDependencies": {
 		"@af/integration-testing": "workspace:^",
 		"@af/visual-regression": "workspace:^",
-		"@atlaskit/button": "^25.2.0",
-		"@atlaskit/heading": "^7.1.0",
-		"@atlaskit/lozenge": "^15.3.0",
-		"@atlaskit/primitives": "^22.4.0",
+		"@atlaskit/button": "^25.3.0",
+		"@atlaskit/checkbox": "^19.2.0",
+		"@atlaskit/heading": "^7.2.0",
+		"@atlaskit/lozenge": "^15.4.0",
+		"@atlaskit/pragmatic-drag-and-drop": "^3.1.0",
+		"@atlaskit/primitives": "^22.5.0",
+		"@atlaskit/select": "^22.11.0",
 		"@atlaskit/ssr": "workspace:^",
-		"@atlaskit/textfield": "^10.1.0",
+		"@atlaskit/textfield": "^10.2.0",
+		"@atlaskit/toggle": "^17.3.0",
 		"@atlassian/ssr-tests": "workspace:^",
 		"@atlassian/testing-library": "^0.11.0",
+		"@atlassian/workbench": "workspace:*",
 		"@testing-library/jest-dom": "^6.4.5",
 		"@types/raf-schd": "^4.0.1",
 		"react": "^19.0.0",

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

@@ -1,17 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.isInSameLayer = isInSameLayer;
-var topLayerSelector = '[popover], dialog, [role="dialog"], [role="alertdialog"]';
-
-/**
- * Returns true when `element` and `container` resolve to the same nearest
- * top-layer host (or both resolve to `null`, meaning the document layer).
- */
-function isInSameLayer(_ref) {
-  var element = _ref.element,
-    container = _ref.container;
-  return element.closest(topLayerSelector) === container.closest(topLayerSelector);
-}

package/dist/cjs/focus/selectors.js

@@ -1,19 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.selectors = void 0;
-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)];
-  return {
-    focusable: focusable.join(','),
-    // Build the `:focus` selector
-    focused: focusable.map(function (selector) {
-      return "".concat(selector, ":focus");
-    }).join(',')
-  };
-}();

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

@@ -1,12 +0,0 @@
-const topLayerSelector = '[popover], dialog, [role="dialog"], [role="alertdialog"]';
-
-/**
- * Returns true when `element` and `container` resolve to the same nearest
- * top-layer host (or both resolve to `null`, meaning the document layer).
- */
-export function isInSameLayer({
-  element,
-  container
-}) {
-  return element.closest(topLayerSelector) === container.closest(topLayerSelector);
-}

package/dist/es2019/focus/selectors.js

@@ -1,11 +0,0 @@
-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}`];
-  return {
-    focusable: focusable.join(','),
-    // Build the `:focus` selector
-    focused: focusable.map(selector => `${selector}:focus`).join(',')
-  };
-})();