Non-adaptive DatePicker in Window opening adaptive actionsheet on small resolution

[zstoyanova9]

Description

The DatePicker component displays its in adaptive actionsheet rendering when used inside a Window component on small screen resolutions in the browser's device emulator.

The issue seems to occur when the following conditions are met (all of them might not be related, but I am mentioning them for reference based on my findings):

• DatePicker is placed inside a Window component
• Device emulator with small resolution is used
• DatePicker is configured as a formControl
• Window is maximized
• Material or Bootstrap theme is applied (does not reproduce with Default theme)

Steps To Reproduce

1. Open the following StackBlitz example in a new tab - https://stackblitz.com/edit/angular-spnd3mf9?file=src%2Fapp%2Fmy-window.component.ts (new tab link - might not work, so I am also linking the demo in StackBlitz editor)
2. Toggle the device emulator in responsive mode.
3. Resize the screen width to be <= 500px.
4. Open the DatePicker and select a value.

Screenshots or video

Screen.Recording.2025-12-05.at.16.26.59.mov

Actual Behavior

The adaptive actionsheet rendering is displayed, although the DatePicker's adaptive mode is disabled.

Expected Behavior

The adaptive actionsheet rendering of the DatePicker should not appear in this scenario.

Workaround

Use the popupSettings property of the DatePicker and set its appendTo option to "component":

https://stackblitz.com/edit/angular-spnd3mf9-ckleue6o?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fmy-window.component.ts