@ionic/core 7.6.2-dev.11702957417.1622fcc0 → 7.6.2-dev.11704390532.1202188d

package/dist/collection/components/router/router.js

@@ -378,17 +378,20 @@ export class Router {
                 "complexType": {
                     "signature": "(path: string, direction?: RouterDirection, animation?: AnimationBuilder) => Promise<boolean>",
                     "parameters": [{
-                            "name": "path",
-                            "type": "string",
-                            "docs": "The path to navigate to."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "path The path to navigate to."
+                                }],
+                            "text": "The path to navigate to."
                         }, {
-                            "name": "direction",
-                            "type": "\"root\" | \"back\" | \"forward\"",
-                            "docs": "The direction of the animation. Defaults to `\"forward\"`."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "direction The direction of the animation. Defaults to `\"forward\"`."
+                                }],
+                            "text": "The direction of the animation. Defaults to `\"forward\"`."
                         }, {
-                            "name": "animation",
-                            "type": "AnimationBuilder | undefined",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }],
                     "references": {
                         "Promise": {
@@ -460,9 +463,8 @@ export class Router {
                 "complexType": {
                     "signature": "(direction: RouterDirection) => Promise<boolean>",
                     "parameters": [{
-                            "name": "direction",
-                            "type": "\"root\" | \"back\" | \"forward\"",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/router-outlet/router-outlet.js

@@ -368,17 +368,14 @@ export class RouterOutlet {
                 "complexType": {
                     "signature": "(enteringEl: HTMLElement, leavingEl: HTMLElement | undefined, opts?: RouterOutletOptions) => Promise<boolean>",
                     "parameters": [{
-                            "name": "enteringEl",
-                            "type": "HTMLElement",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }, {
-                            "name": "leavingEl",
-                            "type": "HTMLElement | undefined",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }, {
-                            "name": "opts",
-                            "type": "RouterOutletOptions | undefined",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }],
                     "references": {
                         "Promise": {
@@ -409,21 +406,17 @@ export class RouterOutlet {
                 "complexType": {
                     "signature": "(id: string, params: ComponentProps | undefined, direction: RouterDirection, animation?: AnimationBuilder) => Promise<RouteWrite>",
                     "parameters": [{
-                            "name": "id",
-                            "type": "string",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }, {
-                            "name": "params",
-                            "type": "ComponentProps | undefined",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }, {
-                            "name": "direction",
-                            "type": "\"root\" | \"back\" | \"forward\"",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }, {
-                            "name": "animation",
-                            "type": "AnimationBuilder | undefined",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/select/select.js

@@ -1205,9 +1205,11 @@ Developers can use the "legacy" property to continue using the legacy form marku
                 "complexType": {
                     "signature": "(event?: UIEvent) => Promise<any>",
                     "parameters": [{
-                            "name": "event",
-                            "type": "UIEvent | undefined",
-                            "docs": "The user interface event that called the open."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "event The user interface event that called the open."
+                                }],
+                            "text": "The user interface event that called the open."
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/tabs/tabs.js

@@ -236,9 +236,11 @@ export class Tabs {
                 "complexType": {
                     "signature": "(tab: string | HTMLIonTabElement) => Promise<boolean>",
                     "parameters": [{
-                            "name": "tab",
-                            "type": "string | HTMLIonTabElement",
-                            "docs": "The tab instance to select. If passed a string, it should be the value of the tab's `tab` property."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property."
+                                }],
+                            "text": "The tab instance to select. If passed a string, it should be the value of the tab's `tab` property."
                         }],
                     "references": {
                         "Promise": {
@@ -264,9 +266,11 @@ export class Tabs {
                 "complexType": {
                     "signature": "(tab: string | HTMLIonTabElement) => Promise<HTMLIonTabElement | undefined>",
                     "parameters": [{
-                            "name": "tab",
-                            "type": "string | HTMLIonTabElement",
-                            "docs": "The tab instance to select. If passed a string, it should be the value of the tab's `tab` property."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property."
+                                }],
+                            "text": "The tab instance to select. If passed a string, it should be the value of the tab's `tab` property."
                         }],
                     "references": {
                         "Promise": {
@@ -309,9 +313,8 @@ export class Tabs {
                 "complexType": {
                     "signature": "(id: string) => Promise<RouteWrite>",
                     "parameters": [{
-                            "name": "id",
-                            "type": "string",
-                            "docs": ""
+                            "tags": [],
+                            "text": ""
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/components/toast/toast.js

@@ -1026,13 +1026,17 @@ export class Toast {
                 "complexType": {
                     "signature": "(data?: any, role?: string) => Promise<boolean>",
                     "parameters": [{
-                            "name": "data",
-                            "type": "any",
-                            "docs": "Any data to emit in the dismiss events."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "data Any data to emit in the dismiss events."
+                                }],
+                            "text": "Any data to emit in the dismiss events."
                         }, {
-                            "name": "role",
-                            "type": "string | undefined",
-                            "docs": "The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                            "tags": [{
+                                    "name": "param",
+                                    "text": "role The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
+                                }],
+                            "text": "The role of the element that is dismissing the toast.\nThis can be useful in a button handler for determining which button was\nclicked to dismiss the toast.\nSome examples include: ``\"cancel\"`, `\"destructive\"`, \"selected\"`, and `\"backdrop\"`."
                         }],
                     "references": {
                         "Promise": {

package/dist/collection/utils/gesture/gesture-controller.js

@@ -189,5 +189,5 @@ class BlockerDelegate {
         this.ctrl = undefined;
     }
 }
-const BACKDROP_NO_SCROLL = 'backdrop-no-scroll';
+export const BACKDROP_NO_SCROLL = 'backdrop-no-scroll';
 export const GESTURE_CONTROLLER = new GestureController();

package/dist/collection/utils/overlays.js

@@ -5,6 +5,7 @@ import { doc } from "./browser/index";
 import { config } from "../global/config";
 import { getIonMode } from "../global/ionic-global";
 import { CoreDelegate } from "./framework-delegate";
+import { BACKDROP_NO_SCROLL } from "./gesture/gesture-controller";
 import { OVERLAY_BACK_BUTTON_PRIORITY } from "./hardware-back-button";
 import { addEventListener, componentOnReady, focusElement, getElementRoot, removeEventListener } from "./helpers";
 import { printIonWarning } from "./logging";
@@ -28,7 +29,10 @@ export const alertController = /*@__PURE__*/ createController('ion-alert');
 export const actionSheetController = /*@__PURE__*/ createController('ion-action-sheet');
 export const loadingController = /*@__PURE__*/ createController('ion-loading');
 export const modalController = /*@__PURE__*/ createController('ion-modal');
-export const pickerController = /*@__PURE__*/ createController('ion-picker');
+/**
+ * @deprecated Use the inline ion-picker component instead.
+ */
+export const pickerController = /*@__PURE__*/ createController('ion-picker-legacy');
 export const popoverController = /*@__PURE__*/ createController('ion-popover');
 export const toastController = /*@__PURE__*/ createController('ion-toast');
 /**
@@ -138,7 +142,7 @@ const focusLastDescendant = (ref, overlay) => {
  * Should NOT include: Toast
  */
 const trapKeyboardFocus = (ev, doc) => {
-    const lastOverlay = getPresentedOverlay(doc, 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker,ion-popover');
+    const lastOverlay = getPresentedOverlay(doc, 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker-legacy,ion-popover');
     const target = ev.target;
     /**
      * If no active overlay, ignore this event.
@@ -323,7 +327,7 @@ export const dismissOverlay = (doc, data, role, overlayTag, id) => {
  */
 export const getOverlays = (doc, selector) => {
     if (selector === undefined) {
-        selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker,ion-popover,ion-toast';
+        selector = 'ion-alert,ion-action-sheet,ion-loading,ion-modal,ion-picker-legacy,ion-popover,ion-toast';
     }
     return Array.from(doc.querySelectorAll(selector)).filter((c) => c.overlayIndex > 0);
 };
@@ -389,6 +393,7 @@ export const present = async (overlay, name, iosEnterAnimation, mdEnterAnimation
         return;
     }
     setRootAriaHidden(true);
+    document.body.classList.add(BACKDROP_NO_SCROLL);
     overlay.presented = true;
     overlay.willPresent.emit();
     (_a = overlay.willPresentShorthand) === null || _a === void 0 ? void 0 : _a.emit();
@@ -451,12 +456,14 @@ export const dismiss = async (overlay, data, role, name, iosLeaveAnimation, mdLe
     if (!overlay.presented) {
         return false;
     }
+    const lastOverlay = doc !== undefined && getPresentedOverlays(doc).length === 1;
     /**
      * If this is the last visible overlay then
      * we want to re-add the root to the accessibility tree.
      */
-    if (doc !== undefined && getPresentedOverlays(doc).length === 1) {
+    if (lastOverlay) {
         setRootAriaHidden(false);
+        document.body.classList.remove(BACKDROP_NO_SCROLL);
     }
     overlay.presented = false;
     try {

package/dist/collection/utils/test/overlays/overlays-scroll-blocking.spec.js

@@ -0,0 +1,65 @@
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+import { newSpecPage } from "@stencil/core/testing";
+import { Modal } from "../../../components/modal/modal";
+describe('overlays: scroll blocking', () => {
+    it('should not block scroll when the overlay is created', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal></ion-modal>
+      `,
+        });
+        const body = page.doc.querySelector('body');
+        expect(body).not.toHaveClass('backdrop-no-scroll');
+    });
+    it('should block scroll when the overlay is presented', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal></ion-modal>
+      `,
+        });
+        const modal = page.body.querySelector('ion-modal');
+        const body = page.doc.querySelector('body');
+        await modal.present();
+        expect(body).toHaveClass('backdrop-no-scroll');
+        await modal.dismiss();
+        expect(body).not.toHaveClass('backdrop-no-scroll');
+    });
+    it('should not block scroll when the overlay is dismissed', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal></ion-modal>
+      `,
+        });
+        const modal = page.body.querySelector('ion-modal');
+        const body = page.doc.querySelector('body');
+        await modal.present();
+        expect(body).toHaveClass('backdrop-no-scroll');
+        await modal.dismiss();
+        expect(body).not.toHaveClass('backdrop-no-scroll');
+    });
+    it('should not enable scroll until last overlay is dismissed', async () => {
+        const page = await newSpecPage({
+            components: [Modal],
+            html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+        });
+        const modalOne = page.body.querySelector('#one');
+        const modalTwo = page.body.querySelector('#two');
+        const body = page.doc.querySelector('body');
+        await modalOne.present();
+        expect(body).toHaveClass('backdrop-no-scroll');
+        await modalTwo.present();
+        expect(body).toHaveClass('backdrop-no-scroll');
+        await modalOne.dismiss();
+        expect(body).toHaveClass('backdrop-no-scroll');
+        await modalTwo.dismiss();
+        expect(body).not.toHaveClass('backdrop-no-scroll');
+    });
+});

package/dist/docs.d.ts

@@ -60,10 +60,30 @@ interface ComponentCompilerEventComplexType {
 }
 interface ComponentCompilerMethodComplexType {
   signature: string;
-  parameters: JsonDocMethodParameter[];
+  parameters: CompilerJsDoc[];
   references: ComponentCompilerTypeReferences;
   return: string;
 }
+interface CompilerJsDoc {
+  /**
+   * The text associated with the JSDoc
+   */
+  text: string;
+  /**
+   * Tags included in the JSDoc
+   */
+  tags: CompilerJsDocTagInfo[];
+}
+interface CompilerJsDocTagInfo {
+  /**
+   * The name of the tag - e.g. `@deprecated`
+   */
+  name: string;
+  /**
+   * Additional text that is associated with the tag - e.g. `@deprecated use v2 of this API`
+   */
+  text?: string;
+}
 /**
  * The Type Library holds information about the types which are used in a
  * Stencil project. During compilation, Stencil gathers information about the