voyager-ionic-core 8.6.1 → 8.7.2

package/dist/cjs/ion-picker-column.cjs.entry.js

@@ -3,10 +3,11 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
+var index = require('./index-DNh170BW.js');
 var index$1 = require('./index-DkNv4J_i.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var haptic = require('./haptic-ClPPQ_PS.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
 var theme = require('./theme-CeDs6Hcv.js');
 require('./capacitor-DmA66EwP.js');
 
@@ -123,7 +124,7 @@ const PickerColumn = class {
              * an iOS-only feature. As a result, they should
              * be disabled on Android.
              */
-            const enableHaptics = index.isPlatform('ios');
+            const enableHaptics = ionicGlobal.isPlatform('ios');
             const { el, scrollEl } = this;
             let timeout;
             let activeEl = this.activeItem;
@@ -180,7 +181,25 @@ const PickerColumn = class {
                      * elementsFromPoint can returns multiple elements
                      * so find the relevant picker column option if one exists.
                      */
-                    const newActiveElement = elementsAtPoint.find((el) => el.tagName === 'ION-PICKER-COLUMN-OPTION');
+                    let newActiveElement = elementsAtPoint.find((el) => el.tagName === 'ION-PICKER-COLUMN-OPTION');
+                    /**
+                     * TODO(FW-6594): Remove this workaround when iOS 16 is no longer
+                     * supported.
+                     *
+                     * If `elementsFromPoint` failed to find the active element (a known
+                     * issue on iOS 16 when elements are in a Shadow DOM and the
+                     * referenceNode is the document), a fallback to `elementFromPoint`
+                     * is used. While `elementsFromPoint` returns all elements,
+                     * `elementFromPoint` returns only the top-most, which is sufficient
+                     * for this use case and appears to handle Shadow DOM retargeting
+                     * more reliably in this specific iOS bug.
+                     */
+                    if (newActiveElement === undefined) {
+                        const fallbackActiveElement = referenceNode.elementFromPoint(centerX, centerY);
+                        if ((fallbackActiveElement === null || fallbackActiveElement === void 0 ? void 0 : fallbackActiveElement.tagName) === 'ION-PICKER-COLUMN-OPTION') {
+                            newActiveElement = fallbackActiveElement;
+                        }
+                    }
                     if (activeEl !== undefined) {
                         this.setPickerItemActiveState(activeEl, false);
                     }
@@ -348,7 +367,7 @@ const PickerColumn = class {
              * cause the next option to be selected. The Home/End operations remain
              * unchanged because those always represent the first/last options, respectively.
              */
-            const mobile = index.isPlatform('mobile');
+            const mobile = ionicGlobal.isPlatform('mobile');
             let newOption = null;
             switch (ev.key) {
                 case 'ArrowDown':
@@ -547,13 +566,13 @@ const PickerColumn = class {
     }
     render() {
         const { color, disabled, isActive, numericInput } = this;
-        const mode = index.getIonMode(this);
-        return (index.h(index.Host, { key: 'a221dc10f1eb7c41637a16d2c7167c16939822fd', class: theme.createColorClasses(color, {
+        const mode = ionicGlobal.getIonMode(this);
+        return (index.h(index.Host, { key: 'ea0280355b2f87895bf7dddd289ccf473aa759f3', class: theme.createColorClasses(color, {
                 [mode]: true,
                 ['picker-column-active']: isActive,
                 ['picker-column-numeric-input']: numericInput,
                 ['picker-column-disabled']: disabled,
-            }) }, this.renderAssistiveFocusable(), index.h("slot", { key: '81b0656f606856f3dc0a657bf167d81a5011405e', name: "prefix" }), index.h("div", { key: '71b9de67c04150255dd66592601c9d926db0c31c', "aria-hidden": "true", class: "picker-opts", ref: (el) => {
+            }) }, this.renderAssistiveFocusable(), index.h("slot", { key: '482992131cdeb85b1f61430d7fe1322a16345769', name: "prefix" }), index.h("div", { key: '43f7f80d621d411ef366b3ca1396299e8c9a0c97', "aria-hidden": "true", class: "picker-opts", ref: (el) => {
                 this.scrollEl = el;
             },
             /**
@@ -574,7 +593,7 @@ const PickerColumn = class {
              * To prevent this, we set the tabIndex to -1. This
              * will match the behavior of the other browsers.
              */
-            tabIndex: -1 }, index.h("div", { key: 'ebdc2f08c83db0cf17b4be29f28fcb00f529601e', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '04ab56fcb8e6a7d6af00204c4560feb99ff34a56', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '6cf8f538903faf0fe1e4130f3eaf7b4e2e17cb52', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("slot", { key: '1cc392307b70c576be5b81b5226ceba735957f0f' }), index.h("div", { key: '23e3f28e2a99b9aa8b7c8f68ad9583e3ca63e9e2', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '8a0563f09780c3116af0caebe4f40587ec1f041f', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '13207e248fc0009f37e0c90a3ee2bac2f130b856', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), index.h("slot", { key: '55ecf2ab5f214f936c2468cbdb7952daf89416b8', name: "suffix" })));
+            tabIndex: -1 }, index.h("div", { key: '13a9ee686132af32240710730765de4c0003a9e8', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: 'dbccba4920833cfcebe9b0fc763458ec3053705a', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '682b43f83a5ea2e46067457f3af118535e111edb', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("slot", { key: 'd27e1e1dc0504b2f4627a29912a05bb91e8e413a' }), index.h("div", { key: '61c948dbb9cf7469aed3018542bc0954211585ba', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: 'cf46c277fbee65e35ff44ce0d53ce12aa9cbf9db', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: 'bbc0e2d491d3f836ab849493ade2f7fa6ad9244e', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), index.h("slot", { key: 'd25cbbe14b2914fe7b878d43b4e3f4a8c8177d24', name: "suffix" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-picker.cjs.entry.js

@@ -3,8 +3,8 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index = require('./index-DNh170BW.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 
 const pickerIosCss = ":host{display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:200px;direction:ltr;z-index:0}:host .picker-before,:host .picker-after{position:absolute;width:100%;-webkit-transform:translateZ(0);transform:translateZ(0);z-index:1;pointer-events:none}:host .picker-before{top:0;height:83px}:host .picker-before{inset-inline-start:0}:host .picker-after{top:116px;height:84px}:host .picker-after{inset-inline-start:0}:host .picker-highlight{border-radius:var(--highlight-border-radius, 8px);left:0;right:0;top:50%;bottom:0;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;position:absolute;width:calc(100% - 16px);height:34px;-webkit-transform:translateY(-50%);transform:translateY(-50%);background:var(--highlight-background);z-index:-1}:host input{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}:host ::slotted(ion-picker-column:first-of-type){text-align:start}:host ::slotted(ion-picker-column:last-of-type){text-align:end}:host ::slotted(ion-picker-column:only-child){text-align:center}:host .picker-before{background:-webkit-gradient(linear, left top, left bottom, color-stop(20%, rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 1)), to(rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 0.8)));background:linear-gradient(to bottom, rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 1) 20%, rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 0.8) 100%)}:host .picker-after{background:-webkit-gradient(linear, left bottom, left top, color-stop(20%, rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 1)), to(rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 0.8)));background:linear-gradient(to top, rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 1) 20%, rgba(var(--fade-background-rgb, var(--background-rgb, var(--ion-background-color-rgb, 255, 255, 255))), 0.8) 100%)}:host .picker-highlight{background:var(--highlight-background, var(--ion-color-step-150, var(--ion-background-color-step-150, #eeeeef)))}";
 

package/dist/cjs/ion-popover.cjs.entry.js

@@ -3,16 +3,17 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
-var overlays = require('./overlays-DRDumz2b.js');
-var frameworkDelegate = require('./framework-delegate-C7sIJyT5.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index = require('./index-DNh170BW.js');
+var overlays = require('./overlays-CglR7j-u.js');
+var frameworkDelegate = require('./framework-delegate-WkyjrnCx.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var lockController = require('./lock-controller-aDB9wrEf.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
 var theme = require('./theme-CeDs6Hcv.js');
-var index$1 = require('./index-y0QaNtCi.js');
-var animation = require('./animation-0T7gKwOt.js');
+var index$1 = require('./index-BzEyuIww.js');
+var animation = require('./animation-ZJ1lAkZD.js');
 require('./index-DkNv4J_i.js');
-require('./hardware-back-button-D90qZxju.js');
+require('./hardware-back-button-BxdNu76F.js');
 require('./gesture-controller-dtqlP_q4.js');
 
 /**
@@ -1186,7 +1187,7 @@ const Popover = class {
         const popoverId = (_b = (_a = this.htmlAttributes) === null || _a === void 0 ? void 0 : _a.id) !== null && _b !== void 0 ? _b : overlays.setOverlayId(el);
         this.parentPopover = el.closest(`ion-popover:not(#${popoverId})`);
         if (this.alignment === undefined) {
-            this.alignment = index.getIonMode(this) === 'ios' ? 'center' : 'start';
+            this.alignment = ionicGlobal.getIonMode(this) === 'ios' ? 'center' : 'start';
         }
     }
     componentDidLoad() {
@@ -1263,6 +1264,8 @@ const Popover = class {
      * Developers can pass a mouse, touch, or pointer event
      * to position the popover relative to where that event
      * was dispatched.
+     *
+     * @param event The event to position the popover relative to.
      */
     async present(event) {
         const unlock = await this.lockController.lock();
@@ -1326,15 +1329,14 @@ const Popover = class {
     }
     /**
      * Dismiss the popover overlay after it has been presented.
+     * This is a no-op if the overlay has not been presented yet. If you want
+     * to remove an overlay from the DOM that was never presented, use the
+     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      *
      * @param data Any data to emit in the dismiss events.
-     * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
+     * @param role The role of the element that is dismissing the popover. For example, `cancel` or `backdrop`.
      * @param dismissParentPopover If `true`, dismissing this popover will also dismiss
      * a parent popover if this popover is nested. Defaults to `true`.
-     *
-     * This is a no-op if the overlay has not been presented yet. If you want
-     * to remove an overlay from the DOM that was never presented, use the
-     * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
      */
     async dismiss(data, role, dismissParentPopover = true) {
         const unlock = await this.lockController.lock();
@@ -1382,13 +1384,13 @@ const Popover = class {
         return overlays.eventMethod(this.el, 'ionPopoverWillDismiss');
     }
     render() {
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes, focusTrap } = this;
-        const desktop = index.isPlatform('desktop');
+        const desktop = ionicGlobal.isPlatform('desktop');
         const enableArrow = arrow && !parentPopover;
-        return (index.h(index.Host, Object.assign({ key: '1de4862099cfcb5035e78008e6dc7c1371846f9a', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: '16866c02534968c982cf4730d2936d03a5107c8b', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + this.overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [overlays.FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && index.h("ion-backdrop", { key: '981aa4e0102cb93312ffbd8243cdf2a0cdc60469', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), index.h("div", { key: '1a28ed55e9d34ef78cf0eb0178643301fd2dd75d', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && index.h("div", { key: '1c206ea5eb3c0b5883a3d45c34cd22dd5ffe4b65', class: "popover-arrow", part: "arrow" }), index.h("div", { key: '5ba561486a328c0c7ab825995fdbfb7a196429a4', class: "popover-content", part: "content" }, index.h("slot", { key: '00fc244ce9dcc2dfc677e6c34b7c8e7a330b2b03' })))));
+            }, class: Object.assign(Object.assign({}, theme.getClassMap(this.cssClass)), { [mode]: true, 'popover-translucent': this.translucent, 'overlay-hidden': true, 'popover-desktop': desktop, [`popover-side-${side}`]: true, [overlays.FOCUS_TRAP_DISABLE_CLASS]: focusTrap === false, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && index.h("ion-backdrop", { key: '0df258601a4d30df3c27aa8234a7d5e056c3ecbb', tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), index.h("div", { key: 'f94e80ed996b957b5cd09b826472b4f60e8fcc78', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && index.h("div", { key: '185ce22f6386e8444a9cc7b8818dbfc16c463c99', class: "popover-arrow", part: "arrow" }), index.h("div", { key: '206202b299404e110de5397b229678cca18568d3', class: "popover-content", part: "content" }, index.h("slot", { key: 'ee543a0b92d6e35a837c0a0e4617c7b0fc4ad0b0' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/ion-progress-bar.cjs.entry.js

@@ -3,9 +3,10 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index = require('./index-DNh170BW.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var theme = require('./theme-CeDs6Hcv.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
 
 const progressBarIosCss = ":host{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.3);--progress-background:var(--ion-color-primary, #0054e9);display:block;position:relative;width:100%;contain:strict;direction:ltr;overflow:hidden}.progress,.progress-indeterminate,.indeterminate-bar-primary,.indeterminate-bar-secondary,.progress-buffer-bar{left:0;right:0;top:0;bottom:0;position:absolute;width:100%;height:100%}.buffer-circles-container,.buffer-circles{left:0;right:0;top:0;bottom:0;position:absolute}.buffer-circles{right:-10px;left:-10px;}.progress,.progress-buffer-bar,.buffer-circles-container{-webkit-transform-origin:left top;transform-origin:left top;-webkit-transition:-webkit-transform 150ms linear;transition:-webkit-transform 150ms linear;transition:transform 150ms linear;transition:transform 150ms linear, -webkit-transform 150ms linear}.progress,.progress-indeterminate{background:var(--progress-background);z-index:2}.progress-buffer-bar{background:var(--background);z-index:1}.buffer-circles-container{overflow:hidden}.indeterminate-bar-primary{top:0;right:0;bottom:0;left:-145.166611%;-webkit-animation:primary-indeterminate-translate 2s infinite linear;animation:primary-indeterminate-translate 2s infinite linear}.indeterminate-bar-primary .progress-indeterminate{-webkit-animation:primary-indeterminate-scale 2s infinite linear;animation:primary-indeterminate-scale 2s infinite linear;-webkit-animation-play-state:inherit;animation-play-state:inherit}.indeterminate-bar-secondary{top:0;right:0;bottom:0;left:-54.888891%;-webkit-animation:secondary-indeterminate-translate 2s infinite linear;animation:secondary-indeterminate-translate 2s infinite linear}.indeterminate-bar-secondary .progress-indeterminate{-webkit-animation:secondary-indeterminate-scale 2s infinite linear;animation:secondary-indeterminate-scale 2s infinite linear;-webkit-animation-play-state:inherit;animation-play-state:inherit}.buffer-circles{background-image:radial-gradient(ellipse at center, var(--background) 0%, var(--background) 30%, transparent 30%);background-repeat:repeat-x;background-position:5px center;background-size:10px 10px;z-index:0;-webkit-animation:buffering 450ms infinite linear;animation:buffering 450ms infinite linear}:host(.progress-bar-reversed){-webkit-transform:scaleX(-1);transform:scaleX(-1)}:host(.progress-paused) .indeterminate-bar-secondary,:host(.progress-paused) .indeterminate-bar-primary,:host(.progress-paused) .buffer-circles{-webkit-animation-play-state:paused;animation-play-state:paused}:host(.ion-color) .buffer-circles{background-image:radial-gradient(ellipse at center, rgba(var(--ion-color-base-rgb), 0.3) 0%, rgba(var(--ion-color-base-rgb), 0.3) 30%, transparent 30%)}:host(.ion-color) .progress,:host(.ion-color) .progress-indeterminate{background:var(--ion-color-base)}@-webkit-keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%)}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%)}}@keyframes primary-indeterminate-translate{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{-webkit-animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);-webkit-transform:translateX(0);transform:translateX(0)}59.15%{-webkit-animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);-webkit-transform:translateX(83.67142%);transform:translateX(83.67142%)}100%{-webkit-transform:translateX(200.611057%);transform:translateX(200.611057%)}}@-webkit-keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);-webkit-transform:scaleX(0.661479);transform:scaleX(0.661479)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@keyframes primary-indeterminate-scale{0%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}36.65%{-webkit-animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);animation-timing-function:cubic-bezier(0.334731, 0.12482, 0.785844, 1);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}69.15%{-webkit-animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);animation-timing-function:cubic-bezier(0.06, 0.11, 0.6, 1);-webkit-transform:scaleX(0.661479);transform:scaleX(0.661479)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@-webkit-keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%)}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%)}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%)}}@keyframes secondary-indeterminate-translate{0%{-webkit-animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);animation-timing-function:cubic-bezier(0.15, 0, 0.515058, 0.409685);-webkit-transform:translateX(0);transform:translateX(0)}25%{-webkit-animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);animation-timing-function:cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);-webkit-transform:translateX(37.651913%);transform:translateX(37.651913%)}48.35%{-webkit-animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);animation-timing-function:cubic-bezier(0.4, 0.627035, 0.6, 0.902026);-webkit-transform:translateX(84.386165%);transform:translateX(84.386165%)}100%{-webkit-transform:translateX(160.277782%);transform:translateX(160.277782%)}}@-webkit-keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);-webkit-transform:scaleX(0.457104);transform:scaleX(0.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);-webkit-transform:scaleX(0.72796);transform:scaleX(0.72796)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@keyframes secondary-indeterminate-scale{0%{-webkit-animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);animation-timing-function:cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}19.15%{-webkit-animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);animation-timing-function:cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);-webkit-transform:scaleX(0.457104);transform:scaleX(0.457104)}44.15%{-webkit-animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);animation-timing-function:cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);-webkit-transform:scaleX(0.72796);transform:scaleX(0.72796)}100%{-webkit-transform:scaleX(0.08);transform:scaleX(0.08)}}@-webkit-keyframes buffering{to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}@keyframes buffering{to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}:host{border-radius:9999px;height:4px}:host(.progress-bar-solid){--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #e6e6e6))}";
 
@@ -38,7 +39,7 @@ const ProgressBar = class {
     render() {
         const { color, type, reversed, value, buffer } = this;
         const paused = index.config.getBoolean('_testing');
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         // If the progress is displayed as a solid bar.
         const progressSolid = buffer === 1;
         return (index.h(index.Host, { key: 'dc69693b5d2dcb2b6e4296d7cb85bc27507f3fa6', role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: theme.createColorClasses(color, {
@@ -65,6 +66,7 @@ const renderProgress = (value, buffer) => {
          * When finalBuffer === 1, we use display: none
          * instead of removing the element to avoid flickering.
          */
+        // TODO(FW-6697): change `ion-hide` class to `ion-display-none` or another class
         index.h("div", { class: { 'buffer-circles-container': true, 'ion-hide': finalBuffer === 1 }, style: { transform: `translateX(${finalBuffer * 100}%)` } }, index.h("div", { class: "buffer-circles-container", style: { transform: `translateX(-${finalBuffer * 100}%)` } }, index.h("div", { part: "stream", class: "buffer-circles" }))),
         index.h("div", { part: "track", class: "progress-buffer-bar", style: { transform: `scaleX(${finalBuffer})` } }),
     ];

package/dist/cjs/ion-radio_2.cjs.entry.js

@@ -3,10 +3,11 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index = require('./index-DNh170BW.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var compareWithUtils = require('./compare-with-utils-DSicavqM.js');
 var theme = require('./theme-CeDs6Hcv.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
 
 const radioIosCss = ":host{--inner-border-radius:50%;display:inline-block;position:relative;max-width:100%;min-height:inherit;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2;-webkit-box-sizing:border-box;box-sizing:border-box}:host(.radio-disabled){pointer-events:none}.radio-icon{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;contain:layout size style}.radio-icon,.radio-inner{-webkit-box-sizing:border-box;box-sizing:border-box}input{position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;margin:0;padding:0;border:0;outline:0;clip:rect(0 0 0 0);opacity:0;overflow:hidden;-webkit-appearance:none;-moz-appearance:none}:host(:focus){outline:none}:host(.in-item){-ms-flex:1 1 0px;flex:1 1 0;width:100%;height:100%}:host([slot=start]),:host([slot=end]){-ms-flex:initial;flex:initial;width:auto}.radio-wrapper{display:-ms-flexbox;display:flex;position:relative;-ms-flex-positive:1;flex-grow:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:inherit;min-height:inherit;cursor:inherit}.label-text-wrapper{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host(.in-item) .label-text-wrapper{margin-top:10px;margin-bottom:10px}:host(.in-item.radio-label-placement-stacked) .label-text-wrapper{margin-top:10px;margin-bottom:16px}:host(.in-item.radio-label-placement-stacked) .native-wrapper{margin-bottom:10px}.label-text-wrapper-hidden{display:none}.native-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host(.radio-justify-space-between) .radio-wrapper{-ms-flex-pack:justify;justify-content:space-between}:host(.radio-justify-start) .radio-wrapper{-ms-flex-pack:start;justify-content:start}:host(.radio-justify-end) .radio-wrapper{-ms-flex-pack:end;justify-content:end}:host(.radio-alignment-start) .radio-wrapper{-ms-flex-align:start;align-items:start}:host(.radio-alignment-center) .radio-wrapper{-ms-flex-align:center;align-items:center}:host(.radio-justify-space-between),:host(.radio-justify-start),:host(.radio-justify-end),:host(.radio-alignment-start),:host(.radio-alignment-center){display:block}:host(.radio-label-placement-start) .radio-wrapper{-ms-flex-direction:row;flex-direction:row}:host(.radio-label-placement-start) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.radio-label-placement-end) .radio-wrapper{-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.radio-label-placement-end) .label-text-wrapper{-webkit-margin-start:16px;margin-inline-start:16px;-webkit-margin-end:0;margin-inline-end:0}:host(.radio-label-placement-fixed) .label-text-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:16px;margin-inline-end:16px}:host(.radio-label-placement-fixed) .label-text-wrapper{-ms-flex:0 0 100px;flex:0 0 100px;width:100px;min-width:100px}:host(.radio-label-placement-stacked) .radio-wrapper{-ms-flex-direction:column;flex-direction:column}:host(.radio-label-placement-stacked) .label-text-wrapper{-webkit-transform:scale(0.75);transform:scale(0.75);margin-left:0;margin-right:0;margin-bottom:16px;max-width:calc(100% / 0.75)}:host(.radio-label-placement-stacked.radio-alignment-start) .label-text-wrapper{-webkit-transform-origin:left top;transform-origin:left top}:host-context([dir=rtl]):host(.radio-label-placement-stacked.radio-alignment-start) .label-text-wrapper,:host-context([dir=rtl]).radio-label-placement-stacked.radio-alignment-start .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}@supports selector(:dir(rtl)){:host(.radio-label-placement-stacked.radio-alignment-start:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:right top;transform-origin:right top}}:host(.radio-label-placement-stacked.radio-alignment-center) .label-text-wrapper{-webkit-transform-origin:center top;transform-origin:center top}:host-context([dir=rtl]):host(.radio-label-placement-stacked.radio-alignment-center) .label-text-wrapper,:host-context([dir=rtl]).radio-label-placement-stacked.radio-alignment-center .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}@supports selector(:dir(rtl)){:host(.radio-label-placement-stacked.radio-alignment-center:dir(rtl)) .label-text-wrapper{-webkit-transform-origin:calc(100% - center) top;transform-origin:calc(100% - center) top}}:host{--color-checked:var(--ion-color-primary, #0054e9)}:host(.ion-color.radio-checked) .radio-inner{border-color:var(--ion-color-base)}.item-radio.item-ios ion-label{-webkit-margin-start:0;margin-inline-start:0}.radio-inner{width:33%;height:50%}:host(.radio-checked) .radio-inner{-webkit-transform:rotate(45deg);transform:rotate(45deg);border-width:0.125rem;border-top-width:0;border-left-width:0;border-style:solid;border-color:var(--color-checked)}:host(.radio-disabled){opacity:0.3}:host(.ion-focused) .radio-icon::after{border-radius:var(--inner-border-radius);top:-8px;display:block;position:absolute;width:36px;height:36px;background:var(--ion-color-primary-tint, #1a65eb);content:\"\";opacity:0.2}:host(.ion-focused) .radio-icon::after{inset-inline-start:-9px}.native-wrapper .radio-icon{width:0.9375rem;height:1.5rem}";
 
@@ -134,7 +135,7 @@ const Radio = class {
     }
     render() {
         const { checked, disabled, color, el, justify, labelPlacement, hasLabel, buttonTabindex, alignment } = this;
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         const inItem = theme.hostContext('ion-item', el);
         return (index.h(index.Host, { key: '3353b28172b7f837d4b38964169b5b5f4ba02788', onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: theme.createColorClasses(color, {
                 [mode]: true,
@@ -351,7 +352,7 @@ const RadioGroup = class {
     }
     render() {
         const { label, labelId, el, name, value } = this;
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         helpers.renderHiddenInput(true, el, name, value, false);
         return (index.h(index.Host, { key: '81b8ebc96b2f383c36717f290d2959cc921ad6e8', role: "radiogroup", "aria-labelledby": label ? labelId : null, "aria-describedby": this.getHintTextID(), "aria-invalid": this.getHintTextID() === this.errorTextId, onClick: this.onClick, class: mode }, this.renderHintText(), index.h("div", { key: '45b09efc10776b889a8f372cba80d25a3fc849da', class: "radio-group-wrapper" }, index.h("slot", { key: '58714934542c2fdd7396de160364f3f06b32e8f8' }))));
     }

package/dist/cjs/ion-range.cjs.entry.js

@@ -3,11 +3,12 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
-var index$1 = require('./index-CVa6JE57.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index = require('./index-DNh170BW.js');
+var index$1 = require('./index-Cc5PNMyz.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var dir = require('./dir-Cn0z1rJH.js');
 var theme = require('./theme-CeDs6Hcv.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
 
 function getDecimalPlaces(n) {
     if (!helpers.isSafeNumber(n))
@@ -215,6 +216,45 @@ const Range = class {
                 this.ionFocus.emit();
             }
         };
+        this.onKnobFocus = (knob) => {
+            if (!this.hasFocus) {
+                this.hasFocus = true;
+                this.ionFocus.emit();
+            }
+            // Manually manage ion-focused class for dual knobs
+            if (this.dualKnobs && this.el.shadowRoot) {
+                const knobA = this.el.shadowRoot.querySelector('.range-knob-a');
+                const knobB = this.el.shadowRoot.querySelector('.range-knob-b');
+                // Remove ion-focused from both knobs first
+                knobA === null || knobA === void 0 ? void 0 : knobA.classList.remove('ion-focused');
+                knobB === null || knobB === void 0 ? void 0 : knobB.classList.remove('ion-focused');
+                // Add ion-focused only to the focused knob
+                const focusedKnobEl = knob === 'A' ? knobA : knobB;
+                focusedKnobEl === null || focusedKnobEl === void 0 ? void 0 : focusedKnobEl.classList.add('ion-focused');
+            }
+        };
+        this.onKnobBlur = () => {
+            // Check if focus is moving to another knob within the same range
+            // by delaying the reset to allow the new focus to register
+            setTimeout(() => {
+                var _a;
+                const activeElement = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.activeElement;
+                const isStillFocusedOnKnob = activeElement && activeElement.classList.contains('range-knob-handle');
+                if (!isStillFocusedOnKnob) {
+                    if (this.hasFocus) {
+                        this.hasFocus = false;
+                        this.ionBlur.emit();
+                    }
+                    // Remove ion-focused from both knobs when focus leaves the range
+                    if (this.dualKnobs && this.el.shadowRoot) {
+                        const knobA = this.el.shadowRoot.querySelector('.range-knob-a');
+                        const knobB = this.el.shadowRoot.querySelector('.range-knob-b');
+                        knobA === null || knobA === void 0 ? void 0 : knobA.classList.remove('ion-focused');
+                        knobB === null || knobB === void 0 ? void 0 : knobB.classList.remove('ion-focused');
+                    }
+                }
+            }, 0);
+        };
     }
     debounceChanged() {
         const { ionInput, debounce, originalIonInput } = this;
@@ -647,6 +687,8 @@ const Range = class {
             min,
             max,
             inheritedAttributes,
+            onKnobFocus: this.onKnobFocus,
+            onKnobBlur: this.onKnobBlur,
         }), this.dualKnobs &&
             renderKnob(rtl, {
                 knob: 'B',
@@ -660,6 +702,8 @@ const Range = class {
                 min,
                 max,
                 inheritedAttributes,
+                onKnobFocus: this.onKnobFocus,
+                onKnobBlur: this.onKnobBlur,
             })));
     }
     render() {
@@ -677,9 +721,9 @@ const Range = class {
          */
         const hasEndContent = (hasLabel && labelPlacement === 'end') || this.hasEndSlotContent;
         const needsEndAdjustment = inItem && !hasEndContent;
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         helpers.renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
-        return (index.h(index.Host, { key: '124909954930d95f353e8593fd967de1486b0315', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: 'ef7b01f80515bcaeb2983934ad7f10a6bd5d13ec', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 'in-item': inItem,
                 'range-disabled': disabled,
@@ -688,10 +732,10 @@ const Range = class {
                 [`range-label-placement-${labelPlacement}`]: true,
                 'range-item-start-adjustment': needsStartAdjustment,
                 'range-item-end-adjustment': needsEndAdjustment,
-            }) }, index.h("label", { key: '0af177a2ba5869d3441c4b3f393835218807a418', class: "range-wrapper", id: "range-label" }, index.h("div", { key: '4d834224b9c834e88497f58af4339348cec9ca1c', class: {
+            }) }, index.h("label", { key: 'fd8aa90a9d52be9da024b907e68858dae424449d', class: "range-wrapper", id: "range-label" }, index.h("div", { key: '2172b4f329c22017dd23475c80aac25ba6e753eb', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !hasLabel,
-            }, part: "label" }, label !== undefined ? index.h("div", { class: "label-text" }, label) : index.h("slot", { name: "label" })), index.h("div", { key: '797d39ac73610f6d81d0b99d71982f98f2a66c88', class: "native-wrapper" }, index.h("slot", { key: '88824589cac5bb2134c30bed067ed11f6e81d887', name: "start" }), this.renderRangeSlider(), index.h("slot", { key: '7207a1164b272f56634435f7bff9114fb5d9f085', name: "end" })))));
+            }, part: "label" }, label !== undefined ? index.h("div", { class: "label-text" }, label) : index.h("slot", { name: "label" })), index.h("div", { key: '3c318bf2ea0576646d4c010bf44573fd0f483186', class: "native-wrapper" }, index.h("slot", { key: '6586fd6fc96271e73f8a86c202d1913ad1a26f96', name: "start" }), this.renderRangeSlider(), index.h("slot", { key: '74ac0bc2d2cb66ef708bb729f88b6ecbc1b2155d', name: "end" })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -704,7 +748,7 @@ const Range = class {
         "value": ["valueChanged"]
     }; }
 };
-const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard, pinFormatter, inheritedAttributes }) => {
+const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard, pinFormatter, inheritedAttributes, onKnobFocus, onKnobBlur, }) => {
     const start = rtl ? 'right' : 'left';
     const knobStyle = () => {
         const style = {};
@@ -725,7 +769,7 @@ const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin,
                 ev.preventDefault();
                 ev.stopPropagation();
             }
-        }, class: {
+        }, onFocus: () => onKnobFocus(knob), onBlur: onKnobBlur, class: {
             'range-knob-handle': true,
             'range-knob-a': knob === 'A',
             'range-knob-b': knob === 'B',

package/dist/cjs/ion-refresher_2.cjs.entry.js

@@ -3,14 +3,15 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
+var index = require('./index-DNh170BW.js');
 var cubicBezier = require('./cubic-bezier-DAjy1V-e.js');
-var index$1 = require('./index-CVa6JE57.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index$1 = require('./index-Cc5PNMyz.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var haptic = require('./haptic-ClPPQ_PS.js');
-var animation = require('./animation-0T7gKwOt.js');
-var config = require('./config-U7OAuj53.js');
-var index$2 = require('./index-CPbAsnJK.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
+var animation = require('./animation-ZJ1lAkZD.js');
+var config = require('./config-CKhELRRu.js');
+var index$2 = require('./index-DqmRDbxg.js');
 var spinnerConfigs = require('./spinner-configs-DxHKnd3-.js');
 require('./capacitor-DmA66EwP.js');
 require('./index-DkNv4J_i.js');
@@ -287,7 +288,7 @@ const Refresher = class {
         }
     }
     async checkNativeRefresher() {
-        const useNativeRefresher = await shouldUseNativeRefresher(this.el, index.getIonMode(this));
+        const useNativeRefresher = await shouldUseNativeRefresher(this.el, ionicGlobal.getIonMode(this));
         if (useNativeRefresher && !this.nativeRefresher) {
             const contentEl = this.el.closest('ion-content');
             this.setupNativeRefresher(contentEl);
@@ -305,7 +306,7 @@ const Refresher = class {
     }
     async resetNativeRefresher(el, state) {
         this.state = state;
-        if (index.getIonMode(this) === 'ios') {
+        if (ionicGlobal.getIonMode(this) === 'ios') {
             await translateElement(el, undefined, 300);
         }
         else {
@@ -527,7 +528,7 @@ const Refresher = class {
         this.nativeRefresher = true;
         const pullingSpinner = this.el.querySelector('ion-refresher-content .refresher-pulling ion-spinner');
         const refreshingSpinner = this.el.querySelector('ion-refresher-content .refresher-refreshing ion-spinner');
-        if (index.getIonMode(this) === 'ios') {
+        if (ionicGlobal.getIonMode(this) === 'ios') {
             this.setupiOSNativeRefresher(pullingSpinner, refreshingSpinner);
         }
         else {
@@ -570,7 +571,7 @@ const Refresher = class {
              * hidden because it is positioned behind the background content element.
              */
             this.contentFullscreen = contentEl.fullscreen;
-            if (await shouldUseNativeRefresher(this.el, index.getIonMode(this))) {
+            if (await shouldUseNativeRefresher(this.el, ionicGlobal.getIonMode(this))) {
                 this.setupNativeRefresher(contentEl);
             }
             else {
@@ -870,7 +871,7 @@ const Refresher = class {
         }
     }
     render() {
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         return (index.h(index.Host, { key: '8c7a5cc32da02a9cbeaa954258148683f60a6d1b', slot: "fixed", class: {
                 [mode]: true,
                 // Used internally for styling
@@ -907,12 +908,12 @@ const RefresherContent = class {
              * the native iOS refresher.
              */
             const hasRubberBandScrolling = supportsRubberBandScrolling();
-            const mode = index.getIonMode(this);
+            const mode = ionicGlobal.getIonMode(this);
             const overflowRefresher = hasRubberBandScrolling ? 'lines' : index$2.arrowDown;
             this.pullingIcon = index.config.get('refreshingIcon', mode === 'ios' && hasRubberBandScrolling ? index.config.get('spinner', overflowRefresher) : 'circular');
         }
         if (this.refreshingSpinner === undefined) {
-            const mode = index.getIonMode(this);
+            const mode = ionicGlobal.getIonMode(this);
             this.refreshingSpinner = index.config.get('refreshingSpinner', index.config.get('spinner', mode === 'ios' ? 'lines' : 'circular'));
         }
     }
@@ -933,7 +934,7 @@ const RefresherContent = class {
     render() {
         const pullingIcon = this.pullingIcon;
         const hasSpinner = pullingIcon != null && spinnerConfigs.SPINNERS[pullingIcon] !== undefined;
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         return (index.h(index.Host, { key: 'e235f8a9a84070ece2e2066ced234a64663bfa1d', class: mode }, index.h("div", { key: '9121691818ddaa35801a5f442e144ac27686cf19', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (index.h("div", { key: 'c8d65d740f1575041bd3b752c789077927397fe4', class: "refresher-pulling-icon" }, index.h("div", { key: '309dd904977eaa788b09ea95b7fa4996a73bec5b', class: "spinner-arrow-container" }, index.h("ion-spinner", { key: 'a2a1480f67775d56ca7822e76be1e9f983bca2f9', name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (index.h("div", { key: '811d7e06d324bf4b6a18a31427a43e5177f3ae3a', class: "arrow-container" }, index.h("ion-icon", { key: '86cc48e2e8dc054ff6ff1299094da35b524be63d', icon: index$2.caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (index.h("div", { key: '464ae097dbc95c18a2dd7dfd03f8489153dab719', class: "refresher-pulling-icon" }, index.h("ion-icon", { key: 'ed6875978b9035add562caa743a68353743d978f', icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), index.h("div", { key: 'aff891924e44354543fec484e5cde1ca92e69904', class: "refresher-refreshing" }, this.refreshingSpinner && (index.h("div", { key: '842d7ac4ff10a1058775493d62f31cbdcd34f7a0', class: "refresher-refreshing-icon" }, index.h("ion-spinner", { key: '8c3e6195501e7e78d5cde1e3ad1fef90fd4a953f', name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
     }
     get el() { return index.getElement(this); }

package/dist/cjs/ion-reorder_2.cjs.entry.js

@@ -3,10 +3,11 @@
  */
 'use strict';
 
-var index = require('./index-DODXXb_r.js');
-var index$1 = require('./index-CPbAsnJK.js');
-var index$2 = require('./index-CVa6JE57.js');
-var helpers = require('./helpers-BITAzJfi.js');
+var index = require('./index-DNh170BW.js');
+var index$1 = require('./index-DqmRDbxg.js');
+var ionicGlobal = require('./ionic-global-UI5YPSi-.js');
+var index$2 = require('./index-Cc5PNMyz.js');
+var helpers = require('./helpers-DgwmcYAu.js');
 var haptic = require('./haptic-ClPPQ_PS.js');
 require('./capacitor-DmA66EwP.js');
 require('./index-DkNv4J_i.js');
@@ -29,7 +30,7 @@ const Reorder = class {
         }
     }
     render() {
-        const mode = index.getIonMode(this);
+        const mode = ionicGlobal.getIonMode(this);
         const reorderIcon = mode === 'ios' ? index$1.reorderThreeOutline : index$1.reorderTwoSharp;
         return (index.h(index.Host, { key: 'e6807bb349725682e99e791ac65e729a360d64e8', class: mode }, index.h("slot", { key: '1c691cdbffa6427ba08dc12184c69559ed5d5506' }, index.h("ion-icon", { key: '8b4150302cdca475379582b2251737b5e74079b1', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
     }
@@ -46,6 +47,9 @@ const ReorderGroup = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.ionItemReorder = index.createEvent(this, "ionItemReorder", 7);
+        this.ionReorderStart = index.createEvent(this, "ionReorderStart", 7);
+        this.ionReorderMove = index.createEvent(this, "ionReorderMove", 7);
+        this.ionReorderEnd = index.createEvent(this, "ionReorderEnd", 7);
         this.lastToIndex = -1;
         this.cachedHeights = [];
         this.scrollElTop = 0;
@@ -91,7 +95,7 @@ const ReorderGroup = class {
         }
     }
     /**
-     * Completes the reorder operation. Must be called by the `ionItemReorder` event.
+     * Completes the reorder operation. Must be called by the `ionReorderEnd` event.
      *
      * If a list of items is passed, the list will be reordered and returned in the
      * proper order.
@@ -128,7 +132,7 @@ const ReorderGroup = class {
         const heights = this.cachedHeights;
         heights.length = 0;
         const el = this.el;
-        const children = el.children;
+        const children = el.__children || el.children;
         if (!children || children.length === 0) {
             return;
         }
@@ -158,6 +162,7 @@ const ReorderGroup = class {
         this.state = 1 /* ReorderGroupState.Active */;
         item.classList.add(ITEM_REORDER_SELECTED);
         haptic.hapticSelectionStart();
+        this.ionReorderStart.emit();
     }
     onMove(ev) {
         const selectedItem = this.selectedItemEl;
@@ -172,6 +177,7 @@ const ReorderGroup = class {
         const currentY = Math.max(top, Math.min(ev.currentY, bottom));
         const deltaY = scroll + currentY - ev.startY;
         const normalizedY = currentY - top;
+        const fromIndex = this.lastToIndex;
         const toIndex = this.itemIndexForTop(normalizedY);
         if (toIndex !== this.lastToIndex) {
             const fromIndex = indexForItem(selectedItem);
@@ -181,6 +187,10 @@ const ReorderGroup = class {
         }
         // Update selected item position
         selectedItem.style.transform = `translateY(${deltaY}px)`;
+        this.ionReorderMove.emit({
+            from: fromIndex,
+            to: toIndex,
+        });
     }
     onEnd() {
         const selectedItemEl = this.selectedItemEl;
@@ -195,6 +205,7 @@ const ReorderGroup = class {
             this.completeReorder();
         }
         else {
+            // TODO(FW-6590): Remove this once the deprecated event is removed
             this.ionItemReorder.emit({
                 from: fromIndex,
                 to: toIndex,
@@ -202,11 +213,16 @@ const ReorderGroup = class {
             });
         }
         haptic.hapticSelectionEnd();
+        this.ionReorderEnd.emit({
+            from: fromIndex,
+            to: toIndex,
+            complete: this.completeReorder.bind(this),
+        });
     }
     completeReorder(listOrReorder) {
         const selectedItemEl = this.selectedItemEl;
         if (selectedItemEl && this.state === 2 /* ReorderGroupState.Complete */) {
-            const children = this.el.children;
+            const children = this.el.__children || this.el.children;
             const len = children.length;
             const toIndex = this.lastToIndex;
             const fromIndex = indexForItem(selectedItemEl);
@@ -248,7 +264,7 @@ const ReorderGroup = class {
     /********* DOM WRITE ********* */
     reorderMove(fromIndex, toIndex) {
         const itemHeight = this.selectedItemHeight;
-        const children = this.el.children;
+        const children = this.el.__children || this.el.children;
         for (let i = 0; i < children.length; i++) {
             const style = children[i].style;
             let value = '';
@@ -278,8 +294,8 @@ const ReorderGroup = class {
         return this.scrollEl.scrollTop - this.scrollElInitial;
     }
     render() {
-        const mode = index.getIonMode(this);
-        return (index.h(index.Host, { key: 'f30613b361c5c3095b7928a92fb4b1e8d6eff600', class: {
+        const mode = ionicGlobal.getIonMode(this);
+        return (index.h(index.Host, { key: 'b9641f3061d67fbfe68317b901ec33267046e073', class: {
                 [mode]: true,
                 'reorder-enabled': !this.disabled,
                 'reorder-list-active': this.state !== 0 /* ReorderGroupState.Idle */,