@angular/cdk 20.0.3 → 20.1.0-next.0

package/collections/index.d.ts

@@ -2,8 +2,8 @@ import { Observable } from 'rxjs';
 import { D as DataSource } from '../data-source.d-Bblv7Zvh.js';
 export { C as CollectionViewer, L as ListRange, i as isDataSource } from '../data-source.d-Bblv7Zvh.js';
 import { IterableChanges, ViewContainerRef } from '@angular/core';
-import { _ as _ViewRepeaterItemContext, a as _ViewRepeater, b as _ViewRepeaterItemContextFactory, c as _ViewRepeaterItemValueResolver, d as _ViewRepeaterItemChanged } from '../view-repeater.d-DUdkOYhk.js';
-export { h as _VIEW_REPEATER_STRATEGY, g as _ViewRepeaterItemChange, e as _ViewRepeaterItemInsertArgs, f as _ViewRepeaterOperation } from '../view-repeater.d-DUdkOYhk.js';
+import { _ as _ViewRepeaterItemContext, a as _ViewRepeater, b as _ViewRepeaterItemContextFactory, c as _ViewRepeaterItemValueResolver, d as _ViewRepeaterItemChanged } from '../view-repeater.d-BKljR8u8.js';
+export { h as _VIEW_REPEATER_STRATEGY, g as _ViewRepeaterItemChange, e as _ViewRepeaterItemInsertArgs, f as _ViewRepeaterOperation } from '../view-repeater.d-BKljR8u8.js';
 import { S as SelectionModel } from '../selection-model.d-DNgOONDg.js';
 export { a as SelectionChange, g as getMultipleValuesInSingleSelectionError } from '../selection-model.d-DNgOONDg.js';
 export { U as UniqueSelectionDispatcher, a as UniqueSelectionDispatcherListener } from '../unique-selection-dispatcher.d-DSFqf1MM.js';
@@ -18,7 +18,7 @@ declare class ArrayDataSource<T> extends DataSource<T> {
 
 /**
  * A repeater that destroys views when they are removed from a
- * `ViewContainerRef`. When new items are inserted into the container,
+ * {@link ViewContainerRef}. When new items are inserted into the container,
  * the repeater will always construct a new embedded view for each item.
  *
  * @template T The type for the embedded view's $implicit property.
@@ -32,7 +32,7 @@ declare class _DisposeViewRepeaterStrategy<T, R, C extends _ViewRepeaterItemCont
 
 /**
  * A repeater that caches views when they are removed from a
- * `ViewContainerRef`. When new items are inserted into the container,
+ * {@link ViewContainerRef}. When new items are inserted into the container,
  * the repeater will reuse one of the cached views instead of creating a new
  * embedded view. Recycling cached views reduces the quantity of expensive DOM
  * inserts.

package/dialog/index.d.ts

@@ -1,16 +1,16 @@
 import * as i0 from '@angular/core';
 import { ViewContainerRef, Injector, StaticProvider, Type, OnDestroy, ElementRef, NgZone, ChangeDetectorRef, ComponentRef, EmbeddedViewRef, TemplateRef, InjectionToken } from '@angular/core';
+import { Observable, Subject } from 'rxjs';
 import { F as FocusOrigin } from '../focus-monitor.d-CvvJeQRc.js';
 import { F as FocusTrapFactory, A as A11yModule } from '../a11y-module.d-DBHGyKoh.js';
 import { B as BasePortalOutlet, f as CdkPortalOutlet, C as ComponentPortal, T as TemplatePortal, D as DomPortal, a as ComponentType, h as PortalModule } from '../portal-directives.d-DbeNrI5D.js';
 export { c as ɵɵCdkPortal, g as ɵɵPortalHostDirective, d as ɵɵTemplatePortalDirective } from '../portal-directives.d-DbeNrI5D.js';
 import { a as Direction } from '../bidi-module.d-IN1Vp56w.js';
-import { P as PositionStrategy, S as ScrollStrategy, O as OverlayRef, a as OverlayModule } from '../overlay-module.d-C2CxnwqT.js';
-import { Observable, Subject } from 'rxjs';
+import { P as PositionStrategy, S as ScrollStrategy, O as OverlayRef, a as OverlayModule } from '../overlay-module.d-CVO-IcaN.js';
 import * as _angular_cdk_portal from '@angular/cdk/portal';
 import '../observers/index.js';
 import '../number-property.d-CJVxXUcb.js';
-import '../scrolling-module.d-C_w4tIrZ.js';
+import '../scrolling-module.d-BvCGMKMo.js';
 import '../data-source.d-Bblv7Zvh.js';
 import '@angular/common';
 import '../scrolling/index.js';
@@ -21,8 +21,14 @@ import '../style-loader.d-BXZfQZTF.js';
 type AutoFocusTarget = 'dialog' | 'first-tabbable' | 'first-heading';
 /** Valid ARIA roles for a dialog. */
 type DialogRole = 'dialog' | 'alertdialog';
+/** Component that can be used as the container for the dialog. */
+type DialogContainer = BasePortalOutlet & {
+    _focusTrapped?: Observable<void>;
+    _closeInteractionType?: FocusOrigin;
+    _recaptureFocus?: () => void;
+};
 /** Configuration for opening a modal dialog. */
-declare class DialogConfig<D = unknown, R = unknown, C extends BasePortalOutlet = BasePortalOutlet> {
+declare class DialogConfig<D = unknown, R = unknown, C extends DialogContainer = BasePortalOutlet> {
     /**
      * Where the attached component should live in Angular's *logical* component tree.
      * This affects what is available for injection and the change detection order for the
@@ -147,7 +153,7 @@ declare function throwDialogContentAlreadyAttachedError(): void;
  * Internal component that wraps user-provided dialog content.
  * @docs-private
  */
-declare class CdkDialogContainer<C extends DialogConfig = DialogConfig> extends BasePortalOutlet implements OnDestroy {
+declare class CdkDialogContainer<C extends DialogConfig = DialogConfig> extends BasePortalOutlet implements DialogContainer, OnDestroy {
     protected _elementRef: ElementRef<HTMLElement>;
     protected _focusTrapFactory: FocusTrapFactory;
     readonly _config: C;
@@ -155,10 +161,13 @@ declare class CdkDialogContainer<C extends DialogConfig = DialogConfig> extends
     protected _ngZone: NgZone;
     private _focusMonitor;
     private _renderer;
+    protected readonly _changeDetectorRef: ChangeDetectorRef;
+    private _injector;
     private _platform;
     protected _document: Document;
     /** The portal outlet inside of this container into which the dialog content will be loaded. */
     _portalOutlet: CdkPortalOutlet;
+    _focusTrapped: Observable<void>;
     /** The class that traps and manages focus within the dialog. */
     private _focusTrap;
     /** Element that was focused before the dialog was opened. Save this to restore upon close. */
@@ -176,8 +185,6 @@ declare class CdkDialogContainer<C extends DialogConfig = DialogConfig> extends
      * the rest are present.
      */
     _ariaLabelledByQueue: string[];
-    protected readonly _changeDetectorRef: ChangeDetectorRef;
-    private _injector;
     private _isDestroyed;
     constructor(...args: unknown[]);
     _addAriaLabelledBy(id: string): void;
@@ -246,7 +253,7 @@ interface DialogCloseOptions {
  */
 declare class DialogRef<R = unknown, C = unknown> {
     readonly overlayRef: OverlayRef;
-    readonly config: DialogConfig<any, DialogRef<R, C>, BasePortalOutlet>;
+    readonly config: DialogConfig<any, DialogRef<R, C>, DialogContainer>;
     /**
      * Instance of component opened into the dialog. Will be
      * null when the dialog is opened using a `TemplateRef`.
@@ -258,10 +265,7 @@ declare class DialogRef<R = unknown, C = unknown> {
      */
     readonly componentRef: ComponentRef<C> | null;
     /** Instance of the container that is rendering out the dialog content. */
-    readonly containerInstance: BasePortalOutlet & {
-        _closeInteractionType?: FocusOrigin;
-        _recaptureFocus?: () => void;
-    };
+    readonly containerInstance: DialogContainer;
     /** Whether the user is allowed to close the dialog. */
     disableClose: boolean | undefined;
     /** Emits when the dialog has been closed. */
@@ -276,7 +280,7 @@ declare class DialogRef<R = unknown, C = unknown> {
     readonly id: string;
     /** Subscription to external detachments of the dialog. */
     private _detachSubscription;
-    constructor(overlayRef: OverlayRef, config: DialogConfig<any, DialogRef<R, C>, BasePortalOutlet>);
+    constructor(overlayRef: OverlayRef, config: DialogConfig<any, DialogRef<R, C>, DialogContainer>);
     /**
      * Close the dialog.
      * @param result Optional result to return to the dialog opener.
@@ -405,4 +409,4 @@ declare const DIALOG_DATA: InjectionToken<any>;
 declare const DEFAULT_DIALOG_CONFIG: InjectionToken<DialogConfig<unknown, unknown, _angular_cdk_portal.BasePortalOutlet>>;
 
 export { CdkDialogContainer, DEFAULT_DIALOG_CONFIG, DIALOG_DATA, DIALOG_SCROLL_STRATEGY, Dialog, DialogConfig, DialogModule, DialogRef, throwDialogContentAlreadyAttachedError, CdkPortalOutlet as ɵɵCdkPortalOutlet };
-export type { AutoFocusTarget, DialogCloseOptions, DialogRole };
+export type { AutoFocusTarget, DialogCloseOptions, DialogContainer, DialogRole };

package/drag-drop/index.d.ts

@@ -4,8 +4,8 @@ import { a as Direction } from '../bidi-module.d-IN1Vp56w.js';
 import { Subject, Observable } from 'rxjs';
 import { ViewportRuler } from '../scrolling/index.js';
 import { N as NumberInput } from '../number-property.d-CJVxXUcb.js';
-import { b as CdkScrollableModule } from '../scrolling-module.d-C_w4tIrZ.js';
-export { C as ɵɵCdkScrollable } from '../scrolling-module.d-C_w4tIrZ.js';
+import { b as CdkScrollableModule } from '../scrolling-module.d-BvCGMKMo.js';
+export { C as ɵɵCdkScrollable } from '../scrolling-module.d-BvCGMKMo.js';
 import '../data-source.d-Bblv7Zvh.js';
 
 /** Possible values that can be used to configure the drag start delay. */
@@ -63,6 +63,10 @@ declare class DropListRef<T = any> {
     autoScrollDisabled: boolean;
     /** Number of pixels to scroll for each frame when auto-scrolling an element. */
     autoScrollStep: number;
+    /**
+     * Whether the items in the list should leave an anchor node when leaving the initial container.
+     */
+    hasAnchor: boolean;
     /**
      * Function that is used to determine whether an item
      * is allowed to be moved into a drop container.
@@ -229,6 +233,11 @@ declare class DropListRef<T = any> {
      * @param item Item whose index should be determined.
      */
     getItemIndex(item: DragRef): number;
+    /**
+     * Gets the item at a specific index.
+     * @param index Index at which to retrieve the item.
+     */
+    getItemAtIndex(index: number): DragRef | null;
     /**
      * Whether the list is able to receive the item that
      * is currently being dragged inside a connected drop list.
@@ -375,6 +384,18 @@ declare class CdkDropList<T = any> implements OnDestroy {
      * ```
      */
     elementContainerSelector: string | null;
+    /**
+     * By default when an item leaves its initial container, its placeholder will be transferred
+     * to the new container. If that's not desirable for your use case, you can enable this option
+     * which will clone the placeholder and leave it inside the original container. If the item is
+     * returned to the initial container, the anchor element will be removed automatically.
+     *
+     * The cloned placeholder can be styled by targeting the `cdk-drag-anchor` class.
+     *
+     * This option is useful in combination with `cdkDropListSortingDisabled` to implement copying
+     * behavior in a drop list.
+     */
+    hasAnchor: boolean;
     /** Emits when the user drops an item inside the container. */
     readonly dropped: EventEmitter<CdkDragDrop<T, any>>;
     /**
@@ -413,10 +434,11 @@ declare class CdkDropList<T = any> implements OnDestroy {
     /** Syncs up the registered drag items with underlying drop list ref. */
     private _syncItemsWithRef;
     static ɵfac: i0.ɵɵFactoryDeclaration<CdkDropList<any>, never>;
-    static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDropList<any>, "[cdkDropList], cdk-drop-list", ["cdkDropList"], { "connectedTo": { "alias": "cdkDropListConnectedTo"; "required": false; }; "data": { "alias": "cdkDropListData"; "required": false; }; "orientation": { "alias": "cdkDropListOrientation"; "required": false; }; "id": { "alias": "id"; "required": false; }; "lockAxis": { "alias": "cdkDropListLockAxis"; "required": false; }; "disabled": { "alias": "cdkDropListDisabled"; "required": false; }; "sortingDisabled": { "alias": "cdkDropListSortingDisabled"; "required": false; }; "enterPredicate": { "alias": "cdkDropListEnterPredicate"; "required": false; }; "sortPredicate": { "alias": "cdkDropListSortPredicate"; "required": false; }; "autoScrollDisabled": { "alias": "cdkDropListAutoScrollDisabled"; "required": false; }; "autoScrollStep": { "alias": "cdkDropListAutoScrollStep"; "required": false; }; "elementContainerSelector": { "alias": "cdkDropListElementContainer"; "required": false; }; }, { "dropped": "cdkDropListDropped"; "entered": "cdkDropListEntered"; "exited": "cdkDropListExited"; "sorted": "cdkDropListSorted"; }, never, never, true, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<CdkDropList<any>, "[cdkDropList], cdk-drop-list", ["cdkDropList"], { "connectedTo": { "alias": "cdkDropListConnectedTo"; "required": false; }; "data": { "alias": "cdkDropListData"; "required": false; }; "orientation": { "alias": "cdkDropListOrientation"; "required": false; }; "id": { "alias": "id"; "required": false; }; "lockAxis": { "alias": "cdkDropListLockAxis"; "required": false; }; "disabled": { "alias": "cdkDropListDisabled"; "required": false; }; "sortingDisabled": { "alias": "cdkDropListSortingDisabled"; "required": false; }; "enterPredicate": { "alias": "cdkDropListEnterPredicate"; "required": false; }; "sortPredicate": { "alias": "cdkDropListSortPredicate"; "required": false; }; "autoScrollDisabled": { "alias": "cdkDropListAutoScrollDisabled"; "required": false; }; "autoScrollStep": { "alias": "cdkDropListAutoScrollStep"; "required": false; }; "elementContainerSelector": { "alias": "cdkDropListElementContainer"; "required": false; }; "hasAnchor": { "alias": "cdkDropListHasAnchor"; "required": false; }; }, { "dropped": "cdkDropListDropped"; "entered": "cdkDropListEntered"; "exited": "cdkDropListExited"; "sorted": "cdkDropListSorted"; }, never, never, true, never>;
     static ngAcceptInputType_disabled: unknown;
     static ngAcceptInputType_sortingDisabled: unknown;
     static ngAcceptInputType_autoScrollDisabled: unknown;
+    static ngAcceptInputType_hasAnchor: unknown;
 }
 
 /** Event emitted when the user starts dragging a draggable. */
@@ -927,9 +949,13 @@ declare class DragRef<T = any> {
     /** Coordinates on the page at which the user picked up the element. */
     private _pickupPositionOnPage;
     /**
-     * Anchor node used to save the place in the DOM where the element was
+     * Marker node used to save the place in the DOM where the element was
      * picked up so that it can be restored at the end of the drag sequence.
      */
+    private _marker;
+    /**
+     * Element indicating the position from which the item was picked up initially.
+     */
     private _anchor;
     /**
      * CSS `transform` applied to the element when it isn't being dragged. We need a
@@ -1288,6 +1314,8 @@ declare class DragRef<T = any> {
     private _nativeDragStart;
     /** Gets a handle that is the target of an event. */
     private _getTargetHandle;
+    /** Inserts the anchor element, if it's valid. */
+    private _conditionallyInsertAnchor;
 }
 
 /**

package/fesm2022/cdk.mjs

@@ -1,7 +1,7 @@
 import { Version } from '@angular/core';
 
 /** Current version of the Angular Component Development Kit. */
-const VERSION = new Version('20.0.3');
+const VERSION = new Version('20.1.0-next.0');
 
 export { VERSION };
 //# sourceMappingURL=cdk.mjs.map

package/fesm2022/cdk.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cdk.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-46c76129e412/bin/src/cdk/version.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Version} from '@angular/core';\n\n/** Current version of the Angular Component Development Kit. */\nexport const VERSION = new Version('20.0.3');\n"],"names":[],"mappings":";;AAUA;MACa,OAAO,GAAG,IAAI,OAAO,CAAC,mBAAmB;;;;"}
+{"version":3,"file":"cdk.mjs","sources":["../../../../../darwin_arm64-fastbuild-ST-46c76129e412/bin/src/cdk/version.ts"],"sourcesContent":["/**\n * @license\n * Copyright Google LLC All Rights Reserved.\n *\n * Use of this source code is governed by an MIT-style license that can be\n * found in the LICENSE file at https://angular.dev/license\n */\n\nimport {Version} from '@angular/core';\n\n/** Current version of the Angular Component Development Kit. */\nexport const VERSION = new Version('20.1.0-next.0');\n"],"names":[],"mappings":";;AAUA;MACa,OAAO,GAAG,IAAI,OAAO,CAAC,mBAAmB;;;;"}

package/fesm2022/collections.mjs

@@ -1,7 +1,7 @@
 export { U as UniqueSelectionDispatcher } from './unique-selection-dispatcher-Cewa_Eg3.mjs';
-export { A as ArrayDataSource, _ as _RecycleViewRepeaterStrategy, b as _VIEW_REPEATER_STRATEGY, a as _ViewRepeaterOperation } from './recycle-view-repeater-strategy-SfuyU210.mjs';
+export { A as ArrayDataSource, _ as _RecycleViewRepeaterStrategy, b as _VIEW_REPEATER_STRATEGY, a as _ViewRepeaterOperation } from './recycle-view-repeater-strategy-DoWdPqVw.mjs';
 export { D as DataSource, i as isDataSource } from './data-source-D34wiQZj.mjs';
-export { _ as _DisposeViewRepeaterStrategy } from './dispose-view-repeater-strategy-Cvpav0PR.mjs';
+export { _ as _DisposeViewRepeaterStrategy } from './dispose-view-repeater-strategy-D_JReLI1.mjs';
 export { S as SelectionModel, g as getMultipleValuesInSingleSelectionError } from './selection-model-BCgC8uEN.mjs';
 import '@angular/core';
 import 'rxjs';

package/fesm2022/dialog.mjs

@@ -1,15 +1,15 @@
 import * as i0 from '@angular/core';
-import { inject, ElementRef, NgZone, Renderer2, DOCUMENT, ChangeDetectorRef, Injector, afterNextRender, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, InjectionToken, TemplateRef, Injectable, signal, EventEmitter, NgModule } from '@angular/core';
+import { inject, ElementRef, NgZone, Renderer2, ChangeDetectorRef, Injector, DOCUMENT, afterNextRender, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, InjectionToken, TemplateRef, Injectable, signal, EventEmitter, NgModule } from '@angular/core';
+import { Subject, defer } from 'rxjs';
 import { BasePortalOutlet, CdkPortalOutlet, ComponentPortal, TemplatePortal, PortalModule } from './portal.mjs';
 export { CdkPortal as ɵɵCdkPortal, PortalHostDirective as ɵɵPortalHostDirective, TemplatePortalDirective as ɵɵTemplatePortalDirective } from './portal.mjs';
 import { F as FocusTrapFactory, I as InteractivityChecker, A as A11yModule } from './a11y-module-DHa4AVFz.mjs';
 import { F as FocusMonitor } from './focus-monitor-DLjkiju1.mjs';
 import { P as Platform } from './platform-DNDzkVcI.mjs';
 import { c as _getFocusedElementPierceShadowDom } from './shadow-dom-B0oHn41l.mjs';
-import { Subject, defer } from 'rxjs';
 import { g as ESCAPE } from './keycodes-CpHkExLC.mjs';
 import { hasModifierKey } from './keycodes.mjs';
-import { startWith } from 'rxjs/operators';
+import { startWith, take } from 'rxjs/operators';
 import { s as createBlockScrollStrategy, O as OverlayContainer, c as createOverlayRef, i as OverlayConfig, f as createGlobalPositionStrategy, d as OverlayRef, t as OverlayModule } from './overlay-module-Bd2UplUU.mjs';
 import { _ as _IdGenerator } from './id-generator-LuoRZSid.mjs';
 import { D as Directionality } from './directionality-CChdj3az.mjs';
@@ -27,7 +27,7 @@ import './css-pixel-value-C_HEqLhI.mjs';
 import './scrolling.mjs';
 import './scrolling-BkvA05C8.mjs';
 import './bidi.mjs';
-import './recycle-view-repeater-strategy-SfuyU210.mjs';
+import './recycle-view-repeater-strategy-DoWdPqVw.mjs';
 import './data-source-D34wiQZj.mjs';
 
 /** Configuration for opening a modal dialog. */
@@ -163,10 +163,13 @@ class CdkDialogContainer extends BasePortalOutlet {
     _ngZone = inject(NgZone);
     _focusMonitor = inject(FocusMonitor);
     _renderer = inject(Renderer2);
+    _changeDetectorRef = inject(ChangeDetectorRef);
+    _injector = inject(Injector);
     _platform = inject(Platform);
     _document = inject(DOCUMENT, { optional: true });
     /** The portal outlet inside of this container into which the dialog content will be loaded. */
     _portalOutlet;
+    _focusTrapped = new Subject();
     /** The class that traps and manages focus within the dialog. */
     _focusTrap = null;
     /** Element that was focused before the dialog was opened. Save this to restore upon close. */
@@ -184,8 +187,6 @@ class CdkDialogContainer extends BasePortalOutlet {
      * the rest are present.
      */
     _ariaLabelledByQueue = [];
-    _changeDetectorRef = inject(ChangeDetectorRef);
-    _injector = inject(Injector);
     _isDestroyed = false;
     constructor() {
         super();
@@ -219,6 +220,7 @@ class CdkDialogContainer extends BasePortalOutlet {
         this._trapFocus();
     }
     ngOnDestroy() {
+        this._focusTrapped.complete();
         this._isDestroyed = true;
         this._restoreFocus();
     }
@@ -339,6 +341,7 @@ class CdkDialogContainer extends BasePortalOutlet {
                     this._focusByCssSelector(this._config.autoFocus, options);
                     break;
             }
+            this._focusTrapped.next();
         }, { injector: this._injector });
     }
     /** Restores focus to the element that was focused before the dialog opened. */
@@ -604,11 +607,21 @@ class Dialog {
         const dialogRef = new DialogRef(overlayRef, config);
         const dialogContainer = this._attachContainer(overlayRef, dialogRef, config);
         dialogRef.containerInstance = dialogContainer;
-        this._attachDialogContent(componentOrTemplateRef, dialogRef, dialogContainer, config);
         // If this is the first dialog that we're opening, hide all the non-overlay content.
         if (!this.openDialogs.length) {
-            this._hideNonDialogContentFromAssistiveTechnology();
+            // Resolve this ahead of time, because some internal apps
+            // mock it out and depend on it being synchronous.
+            const overlayContainer = this._overlayContainer.getContainerElement();
+            if (dialogContainer._focusTrapped) {
+                dialogContainer._focusTrapped.pipe(take(1)).subscribe(() => {
+                    this._hideNonDialogContentFromAssistiveTechnology(overlayContainer);
+                });
+            }
+            else {
+                this._hideNonDialogContentFromAssistiveTechnology(overlayContainer);
+            }
         }
+        this._attachDialogContent(componentOrTemplateRef, dialogRef, dialogContainer, config);
         this.openDialogs.push(dialogRef);
         dialogRef.closed.subscribe(() => this._removeOpenDialog(dialogRef, true));
         this.afterOpened.next(dialogRef);
@@ -793,8 +806,7 @@ class Dialog {
         }
     }
     /** Hides all of the content that isn't an overlay from assistive technology. */
-    _hideNonDialogContentFromAssistiveTechnology() {
-        const overlayContainer = this._overlayContainer.getContainerElement();
+    _hideNonDialogContentFromAssistiveTechnology(overlayContainer) {
         // Ensure that the overlay container is attached to the DOM.
         if (overlayContainer.parentElement) {
             const siblings = overlayContainer.parentElement.children;