diff --git a/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSide.ts b/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSide.ts index a4ae1369ea..ac06e5d39f 100644 --- a/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSide.ts +++ b/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSide.ts @@ -114,13 +114,8 @@ namespace OSFramework.OSUI.Patterns.Dropdown.ServerSide { // Method to move Balloon Options Wrapper to outside of the pattern context private _moveBalloonOptionsWrapper(): void { - /* NOTE: - - When inside BottomSheet the BalloonOptionsWrapper should be moved to the content wrapper - due to position issues related with fixed position of the balloon against BottomSheet fixed position. - More info at Release Note: ROU-11549 - */ - // Ensure DropdownServerSide is inside at BottomSheet - if (Helper.DeviceInfo.IsPhone && this.selfElement.closest(Enum.InsidePattern.BottomSheet)) { + // Check if BalloonOptions should be moved outside of the pattern context + if (this._shouldBalloonOptionsBeMoved()) { // Get the content element where to move the BalloonOptionsWrapper const contentElem = Helper.Dom.ClassSelector(document, GlobalEnum.CssClassElements.Content); // Move the DropdownServerSide ballon element to the content element @@ -451,6 +446,26 @@ namespace OSFramework.OSUI.Patterns.Dropdown.ServerSide { } } + // Method that will check if the BalloonOptionsWrapper should be moved outside of the pattern context + private _shouldBalloonOptionsBeMoved(): boolean { + /* NOTE: + - When inside BottomSheet the BalloonOptionsWrapper should be moved to the content wrapper + due to position issues related with fixed position of the balloon against BottomSheet fixed position. + More info at Release Note: ROU-11549 + */ + // Check if the DropdownServerSide is inside a BottomSheet, Notification, or Sidebar + if ( + Helper.DeviceInfo.IsPhone && + (this.selfElement.closest(Enum.InsidePattern.BottomSheet) || + this.selfElement.closest(Enum.InsidePattern.Notification) || + this.selfElement.closest(Enum.InsidePattern.Sidebar)) + ) { + return true; + } else { + return false; + } + } + // Method used to manage the onTouchMove when we're at mobile devices in order to block the window scroll! // This is an improvement specially to iOS since otherwise it will be able to scroll the pattern when keyboard is open! private _touchMove(): void { diff --git a/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSideEnum.ts b/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSideEnum.ts index 76db037d10..20035a46e4 100644 --- a/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSideEnum.ts +++ b/src/scripts/OSFramework/OSUI/Pattern/Dropdown/ServerSide/DropdownServerSideEnum.ts @@ -57,6 +57,8 @@ namespace OSFramework.OSUI.Patterns.Dropdown.ServerSide.Enum { */ export enum InsidePattern { BottomSheet = '.osui-bottom-sheet', + Notification = '.osui-notification', + Sidebar = '.osui-sidebar', } /**