@ionic/core 8.7.18-dev.11769790854.11895f8f → 8.7.18-dev.11770316329.126ef4af

package/dist/collection/components/popover/animations/ios.enter.js

@@ -31,7 +31,7 @@ export const iosEnterAnimation = (baseEl, opts) => {
     const results = getPopoverPosition(isRTL, contentWidth, contentHeight, arrowWidth, arrowHeight, reference, side, align, defaultPosition, trigger, ev);
     const padding = size === 'cover' ? 0 : POPOVER_IOS_BODY_PADDING;
     const margin = size === 'cover' ? 0 : 25;
-    const { originX, originY, top, left, bottom, checkSafeAreaTop, checkSafeAreaBottom, checkSafeAreaLeft, checkSafeAreaRight, arrowTop, arrowLeft, addPopoverBottomClass, } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, margin, results.originX, results.originY, results.referenceCoordinates, results.arrowTop, results.arrowLeft, arrowHeight);
+    const { originX, originY, top, left, bottom, checkSafeAreaLeft, checkSafeAreaRight, arrowTop, arrowLeft, addPopoverBottomClass, } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, margin, results.originX, results.originY, results.referenceCoordinates, results.arrowTop, results.arrowLeft, arrowHeight);
     const baseAnimation = createAnimation();
     const backdropAnimation = createAnimation();
     const contentAnimation = createAnimation();
@@ -61,35 +61,19 @@ export const iosEnterAnimation = (baseEl, opts) => {
         if (addPopoverBottomClass) {
             baseEl.classList.add('popover-bottom');
         }
-        /**
-         * Safe area CSS variable adjustments.
-         * When the popover is positioned near an edge, we add the corresponding
-         * safe-area inset to ensure the popover doesn't overlap with system UI
-         * (status bars, home indicators, navigation bars on Android API 36+, etc.)
-         */
-        const safeAreaTop = ' + var(--ion-safe-area-top, 0)';
-        const safeAreaBottom = ' + var(--ion-safe-area-bottom, 0)';
+        if (bottom !== undefined) {
+            contentEl.style.setProperty('bottom', `${bottom}px`);
+        }
         const safeAreaLeft = ' + var(--ion-safe-area-left, 0)';
         const safeAreaRight = ' - var(--ion-safe-area-right, 0)';
-        let topValue = `${top}px`;
-        let bottomValue = bottom !== undefined ? `${bottom}px` : undefined;
         let leftValue = `${left}px`;
-        if (checkSafeAreaTop) {
-            topValue = `${top}px${safeAreaTop}`;
-        }
-        if (checkSafeAreaBottom && bottomValue !== undefined) {
-            bottomValue = `${bottom}px${safeAreaBottom}`;
-        }
         if (checkSafeAreaLeft) {
             leftValue = `${left}px${safeAreaLeft}`;
         }
         if (checkSafeAreaRight) {
             leftValue = `${left}px${safeAreaRight}`;
         }
-        if (bottomValue !== undefined) {
-            contentEl.style.setProperty('bottom', `calc(${bottomValue})`);
-        }
-        contentEl.style.setProperty('top', `calc(${topValue} + var(--offset-y, 0))`);
+        contentEl.style.setProperty('top', `calc(${top}px + var(--offset-y, 0))`);
         contentEl.style.setProperty('left', `calc(${leftValue} + var(--offset-x, 0))`);
         contentEl.style.setProperty('transform-origin', `${originY} ${originX}`);
         if (arrowEl !== null) {

package/dist/collection/components/popover/animations/md.enter.js

@@ -28,32 +28,7 @@ export const mdEnterAnimation = (baseEl, opts) => {
     };
     const results = getPopoverPosition(isRTL, contentWidth, contentHeight, 0, 0, reference, side, align, defaultPosition, trigger, ev);
     const padding = size === 'cover' ? 0 : POPOVER_MD_BODY_PADDING;
-    const { originX, originY, top, left, bottom, checkSafeAreaTop, checkSafeAreaBottom, checkSafeAreaLeft, checkSafeAreaRight, } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, 0, results.originX, results.originY, results.referenceCoordinates);
-    /**
-     * Safe area CSS variable adjustments.
-     * When the popover is positioned near an edge, we add the corresponding
-     * safe-area inset to ensure the popover doesn't overlap with system UI
-     * (status bars, home indicators, navigation bars on Android API 36+, etc.)
-     */
-    const safeAreaTop = ' + var(--ion-safe-area-top, 0)';
-    const safeAreaBottom = ' + var(--ion-safe-area-bottom, 0)';
-    const safeAreaLeft = ' + var(--ion-safe-area-left, 0)';
-    const safeAreaRight = ' - var(--ion-safe-area-right, 0)';
-    let topValue = `${top}px`;
-    let bottomValue = bottom !== undefined ? `${bottom}px` : undefined;
-    let leftValue = `${left}px`;
-    if (checkSafeAreaTop) {
-        topValue = `${top}px${safeAreaTop}`;
-    }
-    if (checkSafeAreaBottom && bottomValue !== undefined) {
-        bottomValue = `${bottom}px${safeAreaBottom}`;
-    }
-    if (checkSafeAreaLeft) {
-        leftValue = `${left}px${safeAreaLeft}`;
-    }
-    if (checkSafeAreaRight) {
-        leftValue = `${left}px${safeAreaRight}`;
-    }
+    const { originX, originY, top, left, bottom } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, 0, results.originX, results.originY, results.referenceCoordinates);
     const baseAnimation = createAnimation();
     const backdropAnimation = createAnimation();
     const wrapperAnimation = createAnimation();
@@ -70,13 +45,13 @@ export const mdEnterAnimation = (baseEl, opts) => {
     contentAnimation
         .addElement(contentEl)
         .beforeStyles({
-        top: `calc(${topValue} + var(--offset-y, 0px))`,
-        left: `calc(${leftValue} + var(--offset-x, 0px))`,
+        top: `calc(${top}px + var(--offset-y, 0px))`,
+        left: `calc(${left}px + var(--offset-x, 0px))`,
         'transform-origin': `${originY} ${originX}`,
     })
         .beforeAddWrite(() => {
-        if (bottomValue !== undefined) {
-            contentEl.style.setProperty('bottom', `calc(${bottomValue})`);
+        if (bottom !== undefined) {
+            contentEl.style.setProperty('bottom', `${bottom}px`);
         }
     })
         .fromTo('transform', 'scale(0.8)', 'scale(1)');

package/dist/collection/components/popover/utils.js

@@ -648,8 +648,6 @@ export const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding
     let bottom;
     let originX = contentOriginX;
     let originY = contentOriginY;
-    let checkSafeAreaTop = false;
-    let checkSafeAreaBottom = false;
     let checkSafeAreaLeft = false;
     let checkSafeAreaRight = false;
     const triggerTop = triggerCoordinates
@@ -694,18 +692,10 @@ export const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding
              * We chose 12 here so that the popover position looks a bit nicer as
              * it is not right up against the edge of the screen.
              */
-            top = Math.max(bodyPadding, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
+            top = Math.max(12, triggerTop - contentHeight - triggerHeight - (arrowHeight - 1));
             arrowTop = top + contentHeight;
             originY = 'bottom';
             addPopoverBottomClass = true;
-            /**
-             * If the popover is positioned near the top edge, account for safe area.
-             * This ensures the popover doesn't overlap with status bars or notches.
-             */
-            if (top <= bodyPadding + safeAreaMargin) {
-                checkSafeAreaTop = true;
-                top = bodyPadding;
-            }
             /**
              * If not enough room for popover to appear
              * above trigger, then cut it off.
@@ -713,35 +703,14 @@ export const calculateWindowAdjustment = (side, coordTop, coordLeft, bodyPadding
         }
         else {
             bottom = bodyPadding;
-            /**
-             * When the popover is pinned to the bottom, account for safe area.
-             * This ensures the popover doesn't overlap with home indicators
-             * or navigation bars (e.g., Android API 36+ edge-to-edge).
-             */
-            checkSafeAreaBottom = true;
         }
     }
-    /**
-     * Final check: If the popover extends into any safe-area region,
-     * ensure the corresponding flag is set regardless of side.
-     * This handles cases where a side-positioned popover (left/right)
-     * still needs bottom safe-area padding because it extends into that region.
-     */
-    const popoverBottom = bottom !== undefined ? bodyHeight - bottom : top + contentHeight;
-    if (popoverBottom + safeAreaMargin > bodyHeight) {
-        checkSafeAreaBottom = true;
-    }
-    if (top < safeAreaMargin) {
-        checkSafeAreaTop = true;
-    }
     return {
         top,
         left,
         bottom,
         originX,
         originY,
-        checkSafeAreaTop,
-        checkSafeAreaBottom,
         checkSafeAreaLeft,
         checkSafeAreaRight,
         arrowTop,

package/dist/collection/components/refresher/refresher.js

@@ -68,8 +68,8 @@ export class Refresher {
          * than `1`. The default value is `1` which is equal to the speed of the cursor.
          * If a negative value is passed in, the factor will be `1` instead.
          *
-         * For example: If the value passed is `1.2` and the content is dragged by
-         * `10` pixels, instead of `10` pixels the content will be pulled by `12` pixels
+         * For example, If the value passed is `1.2` and the content is dragged by
+         * `10` pixels, instead of `10` pixels, the content will be pulled by `12` pixels
          * (an increase of 20 percent). If the value passed is `0.8`, the dragged amount
          * will be `8` pixels, less than the amount the cursor has moved.
          *
@@ -119,6 +119,9 @@ export class Refresher {
         this.animations = [];
         this.progress = 0;
         this.state = 1 /* RefresherState.Inactive */;
+        this.ionPullEnd.emit({
+            reason: state === 32 /* RefresherState.Completing */ ? 'complete' : 'cancel',
+        });
     }
     async setupiOSNativeRefresher(pullingSpinner, refreshingSpinner) {
         this.elementToTransform = this.scrollEl;
@@ -151,6 +154,7 @@ export class Refresher {
                     if (!this.didStart) {
                         this.didStart = true;
                         this.ionStart.emit();
+                        this.ionPullStart.emit();
                     }
                     // emit "pulling" on every move
                     if (this.pointerDown) {
@@ -226,6 +230,7 @@ export class Refresher {
                 this.lastVelocityY = ev.velocityY;
             },
             onEnd: () => {
+                const hadStarted = this.didStart;
                 this.pointerDown = false;
                 this.didStart = false;
                 if (this.needsCompletion) {
@@ -235,6 +240,13 @@ export class Refresher {
                 else if (this.didRefresh) {
                     readTask(() => translateElement(this.elementToTransform, `${this.el.clientHeight}px`));
                 }
+                else if (hadStarted) {
+                    /**
+                     * User started pulling but released before reaching the refresh threshold.
+                     * Emit ionPullEnd to complete the event pair.
+                     */
+                    this.ionPullEnd.emit({ reason: 'cancel' });
+                }
             },
         });
         this.disabledChanged();
@@ -281,6 +293,7 @@ export class Refresher {
                     ev.data.animation = animation;
                     animation.progressStart(false, 0);
                     this.ionStart.emit();
+                    this.ionPullStart.emit();
                     this.animations.push(animation);
                     return;
                 }
@@ -303,6 +316,7 @@ export class Refresher {
                         this.animations = [];
                         this.gesture.enable(true);
                         this.state = 1 /* RefresherState.Inactive */;
+                        this.ionPullEnd.emit({ reason: 'cancel' });
                     });
                     return;
                 }
@@ -547,6 +561,7 @@ export class Refresher {
         if (!this.didStart) {
             this.didStart = true;
             this.ionStart.emit();
+            this.ionPullStart.emit();
         }
         // emit "pulling" on every move
         this.ionPull.emit();
@@ -590,6 +605,15 @@ export class Refresher {
              * available right away.
              */
             this.restoreOverflowStyle();
+            /**
+             * If ionPullStart was emitted, we need to emit ionPullEnd
+             * even though the gesture was aborted before reaching the
+             * pulling threshold.
+             */
+            if (this.didStart) {
+                this.didStart = false;
+                this.ionPullEnd.emit({ reason: 'cancel' });
+            }
         }
     }
     beginRefresh() {
@@ -636,6 +660,9 @@ export class Refresher {
             if (this.contentFullscreen && this.backgroundContentEl) {
                 (_a = this.backgroundContentEl) === null || _a === void 0 ? void 0 : _a.style.removeProperty('--offset-top');
             }
+            this.ionPullEnd.emit({
+                reason: state === 32 /* RefresherState.Completing */ ? 'complete' : 'cancel',
+            });
         }, 600);
         // reset the styles on the scroll element
         // set that the refresh is actively cancelling/completing
@@ -689,7 +716,7 @@ export class Refresher {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: '2d1bd880877b698604542ab2d602d38b9504d975', slot: "fixed", class: {
+        return (h(Host, { key: 'bed0c2f44c32ecac24b7d8326ac7c7ef1d12c44f', slot: "fixed", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`refresher-${mode}`]: true,
@@ -809,7 +836,7 @@ export class Refresher {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "How much to multiply the pull speed by. To slow the pull animation down,\npass a number less than `1`. To speed up the pull, pass a number greater\nthan `1`. The default value is `1` which is equal to the speed of the cursor.\nIf a negative value is passed in, the factor will be `1` instead.\n\nFor example: If the value passed is `1.2` and the content is dragged by\n`10` pixels, instead of `10` pixels the content will be pulled by `12` pixels\n(an increase of 20 percent). If the value passed is `0.8`, the dragged amount\nwill be `8` pixels, less than the amount the cursor has moved.\n\nDoes not apply when the refresher content uses a spinner,\nenabling the native refresher."
+                    "text": "How much to multiply the pull speed by. To slow the pull animation down,\npass a number less than `1`. To speed up the pull, pass a number greater\nthan `1`. The default value is `1` which is equal to the speed of the cursor.\nIf a negative value is passed in, the factor will be `1` instead.\n\nFor example, If the value passed is `1.2` and the content is dragged by\n`10` pixels, instead of `10` pixels, the content will be pulled by `12` pixels\n(an increase of 20 percent). If the value passed is `0.8`, the dragged amount\nwill be `8` pixels, less than the amount the cursor has moved.\n\nDoes not apply when the refresher content uses a spinner,\nenabling the native refresher."
                 },
                 "getter": false,
                 "setter": false,
@@ -888,6 +915,24 @@ export class Refresher {
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
+                "docs": {
+                    "tags": [{
+                            "name": "deprecated",
+                            "text": "Use `ionPullStart` instead."
+                        }],
+                    "text": "Emitted when the user begins to start pulling down.\nTODO(FW-7044): Remove this in a major release"
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "ionPullStart",
+                "name": "ionPullStart",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
                 "docs": {
                     "tags": [],
                     "text": "Emitted when the user begins to start pulling down."
@@ -897,6 +942,27 @@ export class Refresher {
                     "resolved": "void",
                     "references": {}
                 }
+            }, {
+                "method": "ionPullEnd",
+                "name": "ionPullEnd",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitted when the refresher has returned to the inactive state\nafter a pull gesture. This fires whether the refresh completed\nsuccessfully or was canceled."
+                },
+                "complexType": {
+                    "original": "RefresherPullEndEventDetail",
+                    "resolved": "RefresherPullEndEventDetail",
+                    "references": {
+                        "RefresherPullEndEventDetail": {
+                            "location": "import",
+                            "path": "./refresher-interface",
+                            "id": "src/components/refresher/refresher-interface.ts::RefresherPullEndEventDetail"
+                        }
+                    }
+                }
             }];
     }
     static get methods() {

package/dist/docs.json

@@ -1,5 +1,5 @@
 {
-  "timestamp": "2026-01-30T16:35:57",
+  "timestamp": "2026-02-05T18:33:56",
   "compiler": {
     "name": "@stencil/core",
     "version": "4.38.0",
@@ -26514,7 +26514,7 @@
           "mutable": false,
           "attr": "pull-factor",
           "reflectToAttr": false,
-          "docs": "How much to multiply the pull speed by. To slow the pull animation down,\npass a number less than `1`. To speed up the pull, pass a number greater\nthan `1`. The default value is `1` which is equal to the speed of the cursor.\nIf a negative value is passed in, the factor will be `1` instead.\n\nFor example: If the value passed is `1.2` and the content is dragged by\n`10` pixels, instead of `10` pixels the content will be pulled by `12` pixels\n(an increase of 20 percent). If the value passed is `0.8`, the dragged amount\nwill be `8` pixels, less than the amount the cursor has moved.\n\nDoes not apply when the refresher content uses a spinner,\nenabling the native refresher.",
+          "docs": "How much to multiply the pull speed by. To slow the pull animation down,\npass a number less than `1`. To speed up the pull, pass a number greater\nthan `1`. The default value is `1` which is equal to the speed of the cursor.\nIf a negative value is passed in, the factor will be `1` instead.\n\nFor example, If the value passed is `1.2` and the content is dragged by\n`10` pixels, instead of `10` pixels, the content will be pulled by `12` pixels\n(an increase of 20 percent). If the value passed is `0.8`, the dragged amount\nwill be `8` pixels, less than the amount the cursor has moved.\n\nDoes not apply when the refresher content uses a spinner,\nenabling the native refresher.",
           "docsTags": [
             {
               "name": "default",
@@ -26703,6 +26703,40 @@
           "docs": "Emitted while the user is pulling down the content and exposing the refresher.",
           "docsTags": []
         },
+        {
+          "event": "ionPullEnd",
+          "detail": "RefresherPullEndEventDetail",
+          "bubbles": true,
+          "complexType": {
+            "original": "RefresherPullEndEventDetail",
+            "resolved": "RefresherPullEndEventDetail",
+            "references": {
+              "RefresherPullEndEventDetail": {
+                "location": "import",
+                "path": "./refresher-interface",
+                "id": "src/components/refresher/refresher-interface.ts::RefresherPullEndEventDetail"
+              }
+            }
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Emitted when the refresher has returned to the inactive state\nafter a pull gesture. This fires whether the refresh completed\nsuccessfully or was canceled.",
+          "docsTags": []
+        },
+        {
+          "event": "ionPullStart",
+          "detail": "void",
+          "bubbles": true,
+          "complexType": {
+            "original": "void",
+            "resolved": "void",
+            "references": {}
+          },
+          "cancelable": true,
+          "composed": true,
+          "docs": "Emitted when the user begins to start pulling down.",
+          "docsTags": []
+        },
         {
           "event": "ionRefresh",
           "detail": "RefresherEventDetail",
@@ -26734,8 +26768,14 @@
           },
           "cancelable": true,
           "composed": true,
-          "docs": "Emitted when the user begins to start pulling down.",
-          "docsTags": []
+          "docs": "Emitted when the user begins to start pulling down.\nTODO(FW-7044): Remove this in a major release",
+          "docsTags": [
+            {
+              "name": "deprecated",
+              "text": "Use `ionPullStart` instead."
+            }
+          ],
+          "deprecation": "Use `ionPullStart` instead."
         }
       ],
       "listeners": [],
@@ -37551,6 +37591,11 @@
       "docstring": "",
       "path": "src/components/refresher/refresher-interface.ts"
     },
+    "src/components/refresher/refresher-interface.ts::RefresherPullEndEventDetail": {
+      "declaration": "export interface RefresherPullEndEventDetail {\n  reason: 'complete' | 'cancel';\n}",
+      "docstring": "",
+      "path": "src/components/refresher/refresher-interface.ts"
+    },
     "src/components/reorder-group/reorder-group-interface.ts::ItemReorderEventDetail": {
       "declaration": "export interface ItemReorderEventDetail {\n  from: number;\n  to: number;\n  complete: (data?: boolean | any[]) => any;\n}",
       "docstring": "",