diff --git a/README.md b/README.md index f532e07b9..7ce089131 100644 --- a/README.md +++ b/README.md @@ -130,11 +130,11 @@ To locally test Atomium using Alpha/Beta versions, follow the steps below: 1. Update the `.release-please-manifest.json` file in the root directory of the Atomium project with the next version number + alpha. Ex: the current version is `2.10.0`, so the next alpha version can be `2.11.0-alpha.1` (OBS: in the example, it is updating only the core lib, update the libs that your changes impact). -![add alpha version to release](https://github.com/user-attachments/assets/3e3adaa2-1bcd-4442-8d1a-118cc14cc274) +![add alpha version to release](https://github.com/user-attachments/assets/91418116-266c-45f1-9cf2-bdf2d6c1a7eb) 2. Add the same version to the repespective `package.json` file in the root directory of the lib project. Ex: packages/core/package.json -![add alpha to package](https://github.com/user-attachments/assets/3e3adaa2-1bcd-4442-8d1a-118cc14cc274) +![add alpha to package](https://github.com/user-attachments/assets/ec4bfbf2-a822-4cf5-b7c4-66575fd36230) 3. Build the Atomium libraries by running the following command in the root directory of the Atomium project diff --git a/packages/core/src/components/modal/modal.tsx b/packages/core/src/components/modal/modal.tsx index a6d55d4e1..d3f9e0be7 100644 --- a/packages/core/src/components/modal/modal.tsx +++ b/packages/core/src/components/modal/modal.tsx @@ -1,20 +1,9 @@ -import { - Component, - Event, - EventEmitter, - Host, - Prop, - Watch, - h, -} from '@stencil/core' +import { Component, Event, EventEmitter, Host, Prop, h } from '@stencil/core' import { IconProps } from '../../icons' type AlertType = Record<'alert' | 'error', { icon: IconProps; color: string }> -/* @todo it's needed to prevent a ionic error. In the version 8.0 it was fixed, remove it after the upgrade. - * https://github.com/ionic-team/ionic-framework/issues/23942 - */ const BACKDROP_NO_SCROLL = 'backdrop-no-scroll' type HTMLAtomModalElement = HTMLIonModalElement & { close: () => Promise } @@ -44,13 +33,6 @@ export class AtomModal { @Event() atomPrimaryClick: EventEmitter @Event() atomSecondaryClick: EventEmitter - @Watch('isOpen') - watchPropHandler(newValue: boolean) { - if (newValue) { - document.body.classList.add(BACKDROP_NO_SCROLL) - } - } - private modal: HTMLAtomModalElement private readonly alertMap: AlertType = { @@ -65,12 +47,16 @@ export class AtomModal { } componentDidLoad() { + /* @todo it's needed to prevent a ionic error. In the version 8.0 it was fixed, remove it after the upgrade. + * https://github.com/ionic-team/ionic-framework/issues/23942 + */ document.body.classList.remove(BACKDROP_NO_SCROLL) this.modal.close = async () => { await this.modal.dismiss() document.body.classList.remove(BACKDROP_NO_SCROLL) + document.documentElement.classList.remove(BACKDROP_NO_SCROLL) } } @@ -80,6 +66,9 @@ export class AtomModal { private readonly handleDidPresent = () => { this.atomDidPresent.emit(this.modal) + + document.body.classList.add(BACKDROP_NO_SCROLL) + document.documentElement.classList.add(BACKDROP_NO_SCROLL) } private readonly handleCloseClick = async () => { diff --git a/packages/core/src/global/global.scss b/packages/core/src/global/global.scss index 3ac44b6ac..29f9b2809 100644 --- a/packages/core/src/global/global.scss +++ b/packages/core/src/global/global.scss @@ -111,3 +111,7 @@ Issue: https://github.com/ionic-team/ionic-framework/issues/27500 } } } + +html.backdrop-no-scroll { + overflow: hidden; +} \ No newline at end of file