voyager-ionic-core 8.0.0-beta.2 → 8.0.0-beta.3

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

@@ -7,7 +7,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
 const index$1 = require('./index-c8d52405.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.js');
 const haptic = require('./haptic-b882e0bb.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
 const theme = require('./theme-d1c573d2.js');
@@ -279,7 +279,11 @@ const PickerColumn = class {
          */
         const parentEl = (this.parentEl = this.el.closest('ion-picker'));
         const visibleCallback = (entries) => {
-            const ev = entries[0];
+            /**
+             * Browsers will sometimes group multiple IO events into a single callback.
+             * As a result, we want to grab the last/most recent event in case there are multiple events.
+             */
+            const ev = entries[entries.length - 1];
             if (ev.isIntersecting) {
                 const { activeItem, el } = this;
                 this.isColumnVisible = true;
@@ -383,14 +387,14 @@ const PickerColumn = class {
     render() {
         const { color, disabled, isActive, numericInput } = this;
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: '6658bfcf04d2e16e5a1acdb82c7b99fba27a6e36', class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '20de89f624d0fdbb4eadf912a6a8a8c1f3c374bc', class: theme.createColorClasses(color, {
                 [mode]: true,
                 ['picker-column-active']: isActive,
                 ['picker-column-numeric-input']: numericInput,
                 ['picker-column-disabled']: disabled,
-            }) }, index.h("slot", { key: 'a763810ee7cdb6757a6b769edc7b22d0e5d31300', name: "prefix" }), index.h("div", { key: 'b782e731803faa9afddbd7ecf117cf13b7fed392', class: "picker-opts", tabindex: disabled ? undefined : 0, ref: (el) => {
+            }) }, index.h("slot", { key: '39bd2171785e21aef935787d8222949a2d29a771', name: "prefix" }), index.h("div", { key: '97217b758b65913db869f322b8f127f0da3a1c28', class: "picker-opts", tabindex: disabled ? undefined : 0, ref: (el) => {
                 this.scrollEl = el;
-            } }, index.h("div", { key: '1ad66da148e1b68654fb239e5b0378b6588952ec', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '40d9a15a9387fd6505cf2089dc0bd025c1d024ef', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '6594be21a3dea1668cc90488d0b9b611ca8f65a8', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("slot", { key: '3e848b150f81d6283e5a04876f9b7cd61ba8079e' }), index.h("div", { key: 'e1e4ccb1cd80e937aee528f99fa969cf45228db3', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '1cc415a51d3f525777f2dfcc0ff0fea670307f9e', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: 'aa247ca6aa986648a5b2822a8eb648d246de695c', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), index.h("slot", { key: '712e32d320c95cf293eb71ec395988414a3aea11', name: "suffix" })));
+            } }, index.h("div", { key: '8cfd8f5de1c274f7b2b5b14c7f6f875d475edc5c', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: 'cfbf7e8abe54c4df98addb9a24e82dd803ba95c0', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '8049923186d8b5ce28da2ce90ad720c244395f9c', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("slot", { key: '180efa3b7874e2b4269fb150794eaeab9f648f2e' }), index.h("div", { key: '9161cc3e344b92354276981813e1d55ef9979dea', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: 'ce703fb3ea07d5ea2abf526d64ca85d2beed15f1', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0"), index.h("div", { key: '6ce6cb5de80ac316a664e9cfcecf1897c8f90e58', class: "picker-item-empty", "aria-hidden": "true" }, "\u00A0")), index.h("slot", { key: 'ecccfa6bd8f6d2d641109e74d0788081e3f29801', name: "suffix" })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.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)))}";
 const IonPickerIosStyle0 = pickerIosCss;
@@ -484,7 +484,7 @@ const Picker = class {
         this.emitInputModeChange();
     }
     render() {
-        return (index.h(index.Host, { key: '6d9d2f8427c722ac1e4ad401e3091f86b95af503', onPointerDown: (ev) => this.onPointerDown(ev), onClick: () => this.onClick() }, index.h("input", { key: 'b885e06c95ad966d477d873154627766ecf5f5f9', "aria-hidden": "true", tabindex: -1, inputmode: "numeric", type: "number", onKeyDown: (ev) => {
+        return (index.h(index.Host, { key: '16c8d2d72dcbd64e2b2fb77200ead6a2107d24a6', onPointerDown: (ev) => this.onPointerDown(ev), onClick: () => this.onClick() }, index.h("input", { key: 'f7f4c77bde934813a18f221308277580c45715e3', "aria-hidden": "true", tabindex: -1, inputmode: "numeric", type: "number", onKeyDown: (ev) => {
                 var _a;
                 /**
                  * The "Enter" key represents
@@ -499,7 +499,7 @@ const Picker = class {
                 if (ev.key === 'Enter') {
                     (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.blur();
                 }
-            }, ref: (el) => (this.inputEl = el), onInput: () => this.onInputChange(), onBlur: () => this.exitInputMode() }), index.h("div", { key: '91e060f4dd634ebaca072dbe7726a84f6f2c7040', class: "picker-before" }), index.h("div", { key: '2e06c9db12040c5a7af48c79ce3e1c32ce7a6ae4', class: "picker-after" }), index.h("div", { key: '791a934f6886ca89b370f71cd5c848ee6dac5b90', class: "picker-highlight", ref: (el) => (this.highlightEl = el) }), index.h("slot", { key: 'aed4fe303f87b804ce00f2633b0af4905600670a' })));
+            }, ref: (el) => (this.inputEl = el), onInput: () => this.onInputChange(), onBlur: () => this.exitInputMode() }), index.h("div", { key: '0eead52707acfa004c83fe0acfd4f9162b19f09b', class: "picker-before" }), index.h("div", { key: '5b4b531e3ed4fd35f1380156cf5332a455433a19', class: "picker-after" }), index.h("div", { key: '2b478202ac99703e4f72b30906915c7058ca9b9f', class: "picker-highlight", ref: (el) => (this.highlightEl = el) }), index.h("slot", { key: '4a93ca36194ea1d2cec8bef8a0f402c14ee74576' })));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -6,15 +6,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const overlays = require('./overlays-44b8d0e0.js');
-const frameworkDelegate = require('./framework-delegate-0499d444.js');
-const helpers = require('./helpers-668b3d95.js');
+const overlays = require('./overlays-30b83581.js');
+const frameworkDelegate = require('./framework-delegate-df3a2b04.js');
+const helpers = require('./helpers-71097d9c.js');
 const lockController = require('./lock-controller-6585a42a.js');
 const index$1 = require('./index-5915f9b3.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
 const theme = require('./theme-d1c573d2.js');
-const index$2 = require('./index-e4b6c97e.js');
-const animation = require('./animation-3e7bb91e.js');
+const index$2 = require('./index-14ae0c27.js');
+const animation = require('./animation-58ecfe20.js');
 require('./index-c8d52405.js');
 require('./hardware-back-button-1c67a5a2.js');
 require('./gesture-controller-9436f482.js');
@@ -1296,9 +1296,9 @@ const Popover = class {
         const { onLifecycle, parentPopover, dismissOnSelect, side, arrow, htmlAttributes } = this;
         const desktop = ionicGlobal.isPlatform('desktop');
         const enableArrow = arrow && !parentPopover;
-        return (index.h(index.Host, Object.assign({ key: 'fb58b5b3124ea4b0ced6d73558844121245a0951', "aria-modal": "true", "no-router": true, tabindex: "-1" }, htmlAttributes, { style: {
+        return (index.h(index.Host, Object.assign({ key: 'e8cc03cd7766a460172a1536d1498e63a0bf0b7f', "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, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && index.h("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), index.h("div", { key: 'a7b6a76eeeb840b806434cf5c9beaaf43a975867', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && index.h("div", { class: "popover-arrow", part: "arrow" }), index.h("div", { key: '9c59d1a567f66fb939aa194e452b46fd1dbef27c', class: "popover-content", part: "content" }, index.h("slot", { key: 'a8e260ace3d487c9e9c861725488a4bef7aeeb02' })))));
+            }, 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, 'popover-nested': !!parentPopover }), onIonPopoverDidPresent: onLifecycle, onIonPopoverWillPresent: onLifecycle, onIonPopoverWillDismiss: onLifecycle, onIonPopoverDidDismiss: onLifecycle, onIonBackdropTap: this.onBackdropTap }), !parentPopover && index.h("ion-backdrop", { tappable: this.backdropDismiss, visible: this.showBackdrop, part: "backdrop" }), index.h("div", { key: 'b24b30bc740796b3a5d9ea74e26e34e634c8cc9a', class: "popover-wrapper ion-overlay-wrapper", onClick: dismissOnSelect ? () => this.dismiss() : undefined }, enableArrow && index.h("div", { class: "popover-arrow", part: "arrow" }), index.h("div", { key: '04de0f983c074f945065705bf008fa96f8ce31eb', class: "popover-content", part: "content" }, index.h("slot", { key: 'dc56cb477ed4c891e425fdae256676791a1cf7c8' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.js');
 const theme = require('./theme-d1c573d2.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
 
@@ -31,7 +31,7 @@ const ProgressBar = class {
         const mode = ionicGlobal.getIonMode(this);
         // If the progress is displayed as a solid bar.
         const progressSolid = buffer === 1;
-        return (index.h(index.Host, { key: 'b38b62bfe013dfe5f847a6faf6934b02ce32c113', role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '9afb53853b0f805cee6de3311577bbae529d23a6', role: "progressbar", "aria-valuenow": type === 'determinate' ? value : null, "aria-valuemin": "0", "aria-valuemax": "1", class: theme.createColorClasses(color, {
                 [mode]: true,
                 [`progress-bar-${type}`]: true,
                 'progress-paused': paused,

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

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.js');
 const compareWithUtils = require('./compare-with-utils-df1001d7.js');
 const theme = require('./theme-d1c573d2.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
@@ -112,7 +112,7 @@ const Radio = class {
         const { checked, disabled, color, el, justify, labelPlacement, hasLabel, buttonTabindex, alignment } = this;
         const mode = ionicGlobal.getIonMode(this);
         const inItem = theme.hostContext('ion-item', el);
-        return (index.h(index.Host, { key: 'dace1b39a24a928486fa73031277db04c0f437c0', onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '939b9f982252f986e80cfc4384b483268c147116', onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick, class: theme.createColorClasses(color, {
                 [mode]: true,
                 'in-item': inItem,
                 'radio-checked': checked,
@@ -123,10 +123,10 @@ const Radio = class {
                 // Focus and active styling should not apply when the radio is in an item
                 'ion-activatable': !inItem,
                 'ion-focusable': !inItem,
-            }), role: "radio", "aria-checked": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabindex: buttonTabindex }, index.h("label", { key: '4a9ab56b16003ea5fe2a737adf2bc1f4be02d2c7', class: "radio-wrapper" }, index.h("div", { key: '4545fc8a73dc428c20f521de02e0d65b4d365dc1', class: {
+            }), role: "radio", "aria-checked": checked ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, tabindex: buttonTabindex }, index.h("label", { key: '40b54d34dc0d92aaf875ba6f523e786f38deb583', class: "radio-wrapper" }, index.h("div", { key: 'd7e8230729bda5c4f101662707509480934773dd', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': !hasLabel,
-            }, part: "label" }, index.h("slot", { key: '6c0ab29c0a724314c0591915a72ec004d66532e3' })), index.h("div", { key: '03ce5e87635fdbe5c0b3455e7dc2cbcb0ce189b6', class: "native-wrapper" }, this.renderRadioControl()))));
+            }, part: "label" }, index.h("slot", { key: '2e906be3e02467f8ad3469f0006f62cf9fde3036' })), index.h("div", { key: '6bbe0a60f552d9ba9e4fc55c626ff85f450e93e5', class: "native-wrapper" }, this.renderRadioControl()))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -291,7 +291,7 @@ const RadioGroup = class {
         const { label, labelId, el, name, value } = this;
         const mode = ionicGlobal.getIonMode(this);
         helpers.renderHiddenInput(true, el, name, value, false);
-        return index.h(index.Host, { key: 'db2e1c69be545dcb95fa7c7bd0c36a1fd3423294', role: "radiogroup", "aria-labelledby": label ? labelId : null, onClick: this.onClick, class: mode });
+        return index.h(index.Host, { key: '6e448f4e0fbc7867865bead79985608e59fe06f2', role: "radiogroup", "aria-labelledby": label ? labelId : null, onClick: this.onClick, class: mode });
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -6,8 +6,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const index$2 = require('./index-c49cb371.js');
-const helpers = require('./helpers-668b3d95.js');
+const index$2 = require('./index-7479ea5a.js');
+const helpers = require('./helpers-71097d9c.js');
 const index$1 = require('./index-5915f9b3.js');
 const dir = require('./dir-94c21456.js');
 const theme = require('./theme-d1c573d2.js');
@@ -464,16 +464,7 @@ const Range = class {
     }
     renderRangeSlider() {
         var _a;
-        const { min, max, step, el, handleKeyboard, pressedKnob, disabled, pin, ratioLower, ratioUpper, inheritedAttributes, rangeId, pinFormatter, } = this;
-        /**
-         * Look for external label, ion-label, or aria-labelledby.
-         * If none, see if user placed an aria-label on the host
-         * and use that instead.
-         */
-        let { labelText } = helpers.getAriaLabel(el, rangeId);
-        if (labelText === undefined || labelText === null) {
-            labelText = inheritedAttributes['aria-label'];
-        }
+        const { min, max, step, handleKeyboard, pressedKnob, disabled, pin, ratioLower, ratioUpper, pinFormatter, inheritedAttributes, } = this;
         let barStart = `${ratioLower * 100}%`;
         let barEnd = `${100 - ratioUpper * 100}%`;
         const rtl = dir.isRTL(this.el);
@@ -533,10 +524,6 @@ const Range = class {
                 ticks.push(tick);
             }
         }
-        let labelledBy;
-        if (this.hasLabel) {
-            labelledBy = 'range-label';
-        }
         return (index.h("div", { class: "range-slider", ref: (rangeEl) => (this.rangeSlider = rangeEl),
             /**
              * Since the gesture has a threshold, the value
@@ -584,8 +571,7 @@ const Range = class {
             handleKeyboard,
             min,
             max,
-            labelText,
-            labelledBy,
+            inheritedAttributes,
         }), this.dualKnobs &&
             renderKnob(rtl, {
                 knob: 'B',
@@ -598,8 +584,7 @@ const Range = class {
                 handleKeyboard,
                 min,
                 max,
-                labelText,
-                labelledBy,
+                inheritedAttributes,
             })));
     }
     render() {
@@ -619,7 +604,7 @@ const Range = class {
         const needsEndAdjustment = inItem && !hasEndContent;
         const mode = ionicGlobal.getIonMode(this);
         helpers.renderHiddenInput(true, el, this.name, JSON.stringify(this.getValue()), disabled);
-        return (index.h(index.Host, { key: '576015afd256abb6faa88630dc482b75333c69e0', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: '2ddcec5645566b2581a9c45891926722e903487e', onFocusin: this.onFocus, onFocusout: this.onBlur, id: rangeId, class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 'in-item': inItem,
                 'range-disabled': disabled,
@@ -628,10 +613,10 @@ const Range = class {
                 [`range-label-placement-${labelPlacement}`]: true,
                 'range-item-start-adjustment': needsStartAdjustment,
                 'range-item-end-adjustment': needsEndAdjustment,
-            }) }, index.h("label", { key: '45619166eaf5015154ca24aeac8d088fed9606ec', class: "range-wrapper", id: "range-label" }, index.h("div", { key: 'e5ce095b0b1545dd9d39a04bc0d81fa643ec3739', class: {
+            }) }, index.h("label", { key: '87ca3578203144d6543f4b7cb4145e99a2a56445', class: "range-wrapper", id: "range-label" }, index.h("div", { key: '9acb1a0778f816d6054443f58fedca219b6fef41', 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: '9bff70bac89c8439b3a8933c2d4dbf0851a49165', class: "native-wrapper" }, index.h("slot", { key: '5c62813869cad97aa70a1c766c5df7a8fd279258', name: "start" }), this.renderRangeSlider(), index.h("slot", { key: '888d5665c12debcda85af5024842f5468b086c70', name: "end" })))));
+            }, part: "label" }, label !== undefined ? index.h("div", { class: "label-text" }, label) : index.h("slot", { name: "label" })), index.h("div", { key: '0c0ca9e634ff1ff257e077630ed46aab599c4087', class: "native-wrapper" }, index.h("slot", { key: '99f5f6c4e3323cbe0d09b7d18fcda2fcf29951e1', name: "start" }), this.renderRangeSlider(), index.h("slot", { key: 'f525b2c755c1287e23d9e1920617518fa2d08e05', name: "end" })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -643,13 +628,15 @@ const Range = class {
         "value": ["valueChanged"]
     }; }
 };
-const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard, labelText, labelledBy, pinFormatter, }) => {
+const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin, handleKeyboard, pinFormatter, inheritedAttributes }) => {
     const start = rtl ? 'right' : 'left';
     const knobStyle = () => {
         const style = {};
         style[start] = `${ratio * 100}%`;
         return style;
     };
+    // The aria label should be preferred over visible text if both are specified
+    const ariaLabel = inheritedAttributes['aria-label'];
     return (index.h("div", { onKeyDown: (ev) => {
             const key = ev.key;
             if (key === 'ArrowLeft' || key === 'ArrowDown') {
@@ -671,7 +658,7 @@ const renderKnob = (rtl, { knob, value, ratio, min, max, disabled, pressed, pin,
             'range-knob-max': value === max,
             'ion-activatable': true,
             'ion-focusable': true,
-        }, style: knobStyle(), role: "slider", tabindex: disabled ? -1 : 0, "aria-label": labelledBy === undefined ? labelText : null, "aria-labelledby": labelledBy !== undefined ? labelledBy : null, "aria-valuemin": min, "aria-valuemax": max, "aria-disabled": disabled ? 'true' : null, "aria-valuenow": value }, pin && (index.h("div", { class: "range-pin", role: "presentation", part: "pin" }, pinFormatter(value))), index.h("div", { class: "range-knob", role: "presentation", part: "knob" })));
+        }, style: knobStyle(), role: "slider", tabindex: disabled ? -1 : 0, "aria-label": ariaLabel !== undefined ? ariaLabel : null, "aria-labelledby": ariaLabel === undefined ? 'range-label' : null, "aria-valuemin": min, "aria-valuemax": max, "aria-disabled": disabled ? 'true' : null, "aria-valuenow": value }, pin && (index.h("div", { class: "range-pin", role: "presentation", part: "pin" }, pinFormatter(value))), index.h("div", { class: "range-knob", role: "presentation", part: "knob" })));
 };
 const ratioToValue = (ratio, min, max, step) => {
     let value = (max - min) * ratio;

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

@@ -7,11 +7,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
 const cubicBezier = require('./cubic-bezier-f2dccc53.js');
-const index$1 = require('./index-c49cb371.js');
-const helpers = require('./helpers-668b3d95.js');
+const index$1 = require('./index-7479ea5a.js');
+const helpers = require('./helpers-71097d9c.js');
 const haptic = require('./haptic-b882e0bb.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
-const animation = require('./animation-3e7bb91e.js');
+const animation = require('./animation-58ecfe20.js');
 const config = require('./config-4f60b98a.js');
 const index$2 = require('./index-f52c6d38.js');
 const spinnerConfigs = require('./spinner-configs-282fd50a.js');
@@ -800,7 +800,7 @@ const Refresher = class {
     }
     render() {
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: 'b5f7ccfe964f0f970c46ae813649c36625d82a1d', slot: "fixed", class: {
+        return (index.h(index.Host, { key: 'a0de60286257949f47ce80fccc7d35477a0cbfa1', slot: "fixed", class: {
                 [mode]: true,
                 // Used internally for styling
                 [`refresher-${mode}`]: true,
@@ -867,7 +867,7 @@ const RefresherContent = class {
         const pullingIcon = this.pullingIcon;
         const hasSpinner = pullingIcon != null && spinnerConfigs.SPINNERS[pullingIcon] !== undefined;
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: '14a4ef75a0f56d499ee0e0bb6ba23565626ad442', class: mode }, index.h("div", { key: 'b738ea69256548d66512744ecaa5cbf651c1f6dd', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (index.h("div", { class: "refresher-pulling-icon" }, index.h("div", { class: "spinner-arrow-container" }, index.h("ion-spinner", { name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (index.h("div", { class: "arrow-container" }, index.h("ion-icon", { icon: index$2.caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (index.h("div", { class: "refresher-pulling-icon" }, index.h("ion-icon", { icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), index.h("div", { key: '6cbcc1f90df56b53c51a99c5a63e185dba00e9b2', class: "refresher-refreshing" }, this.refreshingSpinner && (index.h("div", { class: "refresher-refreshing-icon" }, index.h("ion-spinner", { name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
+        return (index.h(index.Host, { key: '09b538ace5a850e4cfd206e13a3c04ecb6c383e1', class: mode }, index.h("div", { key: '13c564d2970939f250ff8d2ec6bab2c6ad20ea88', class: "refresher-pulling" }, this.pullingIcon && hasSpinner && (index.h("div", { class: "refresher-pulling-icon" }, index.h("div", { class: "spinner-arrow-container" }, index.h("ion-spinner", { name: this.pullingIcon, paused: true }), mode === 'md' && this.pullingIcon === 'circular' && (index.h("div", { class: "arrow-container" }, index.h("ion-icon", { icon: index$2.caretBackSharp, "aria-hidden": "true" })))))), this.pullingIcon && !hasSpinner && (index.h("div", { class: "refresher-pulling-icon" }, index.h("ion-icon", { icon: this.pullingIcon, lazy: false, "aria-hidden": "true" }))), this.pullingText !== undefined && this.renderPullingText()), index.h("div", { key: '21e7d4014f5779238ecf9fee4b9d492232835753', class: "refresher-refreshing" }, this.refreshingSpinner && (index.h("div", { class: "refresher-refreshing-icon" }, index.h("ion-spinner", { name: this.refreshingSpinner }))), this.refreshingText !== undefined && this.renderRefreshingText())));
     }
     get el() { return index.getElement(this); }
 };

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

@@ -8,8 +8,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-2d21d526.js');
 const index$1 = require('./index-f52c6d38.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
-const index$2 = require('./index-c49cb371.js');
-const helpers = require('./helpers-668b3d95.js');
+const index$2 = require('./index-7479ea5a.js');
+const helpers = require('./helpers-71097d9c.js');
 const haptic = require('./haptic-b882e0bb.js');
 require('./index-5915f9b3.js');
 require('./capacitor-c04564bf.js');
@@ -37,7 +37,7 @@ const Reorder = class {
     render() {
         const mode = ionicGlobal.getIonMode(this);
         const reorderIcon = mode === 'ios' ? index$1.reorderThreeOutline : index$1.reorderTwoSharp;
-        return (index.h(index.Host, { key: '068457526894b0f557537d5b85f5596781988bbd', class: mode }, index.h("slot", { key: '006afcb58b0c8c0e4988e58d2c1441a7f4472de1' }, index.h("ion-icon", { key: '25e63dd8a8eeee62e6c5095bb39f887af2c82124', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
+        return (index.h(index.Host, { key: '0a7ac59a7c42bce0b76a13a5e03a0e2f13539cea', class: mode }, index.h("slot", { key: 'cd9c737ec8dfd0afe0bd558141f9f7b66bca66cf' }, index.h("ion-icon", { key: '3dc8fb3478bd2be7f99c1e15b51a41f18b421dbb', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
     }
     get el() { return index.getElement(this); }
 };
@@ -283,7 +283,7 @@ const ReorderGroup = class {
     }
     render() {
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: '868762829627e101926293f5e7e9f4bcf54490b1', class: {
+        return (index.h(index.Host, { key: '1fe29e61375e3c7fa810b49cf55fb17fd6d9ec82', class: {
                 [mode]: true,
                 'reorder-enabled': !this.disabled,
                 'reorder-list-active': this.state !== 0 /* ReorderGroupState.Idle */,

package/dist/cjs/ion-ripple-effect.cjs.entry.js

@@ -68,7 +68,7 @@ const RippleEffect = class {
     }
     render() {
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: '97bc96ca8dc4bf162302d0cf6980f45534495a3d', role: "presentation", class: {
+        return (index.h(index.Host, { key: '2bf24209bf2e1f0ba43e2c38357a54a2a17a4565', role: "presentation", class: {
                 [mode]: true,
                 unbounded: this.unbounded,
             } }));

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

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.js');
 const theme = require('./theme-d1c573d2.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
 
@@ -882,10 +882,10 @@ const RouterLink = class {
             rel: this.rel,
             target: this.target,
         };
-        return (index.h(index.Host, { key: '9dac58d3edaa6b5278c3636e0e245c7ddc2cb888', onClick: this.onClick, class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: '95f4eb3b6292a5525db6d3ed6111d4fbce48fd8b', onClick: this.onClick, class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 'ion-activatable': true,
-            }) }, index.h("a", Object.assign({ key: '81d2ffd44f798703da2cd6f926576c6e96a7c41f' }, attrs), index.h("slot", { key: '26853d510e4cdb93b436cdf70ebb5a7dca288bfb' }))));
+            }) }, index.h("a", Object.assign({ key: '19178223d3927ed9cc6ef423050691f80e01e115' }, attrs), index.h("slot", { key: '0e046007427a5bc096c89c4d1a596d19cd8f89ab' }))));
     }
 };
 RouterLink.style = IonRouterLinkStyle0;

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

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.js');
 const dir = require('./dir-94c21456.js');
 const theme = require('./theme-d1c573d2.js');
 const index$1 = require('./index-f52c6d38.js');
@@ -393,8 +393,8 @@ const Searchbar = class {
         const clearIcon = this.clearIcon || (mode === 'ios' ? index$1.closeCircle : index$1.closeSharp);
         const searchIcon = this.searchIcon || (mode === 'ios' ? index$1.searchOutline : index$1.searchSharp);
         const shouldShowCancelButton = this.shouldShowCancelButton();
-        const cancelButton = this.showCancelButton !== 'never' && (index.h("button", { key: '66091918b5b97012b4105238b9aa1e0bc2133885', "aria-label": cancelButtonText, "aria-hidden": shouldShowCancelButton ? undefined : 'true', type: "button", tabIndex: mode === 'ios' && !shouldShowCancelButton ? -1 : undefined, onMouseDown: this.onCancelSearchbar, onTouchStart: this.onCancelSearchbar, class: "searchbar-cancel-button" }, index.h("div", { key: 'bfe5602ce36cd82dae870b632de767bde3de2f8a', "aria-hidden": "true" }, mode === 'md' ? (index.h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
-        return (index.h(index.Host, { key: '8604e83a9e11f5c561c470ce4630bdc5a38f1098', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: theme.createColorClasses(this.color, {
+        const cancelButton = this.showCancelButton !== 'never' && (index.h("button", { key: '5b5b1f76c164a3d06c24cc4e8caf831355063a3d', "aria-label": cancelButtonText, "aria-hidden": shouldShowCancelButton ? undefined : 'true', type: "button", tabIndex: mode === 'ios' && !shouldShowCancelButton ? -1 : undefined, onMouseDown: this.onCancelSearchbar, onTouchStart: this.onCancelSearchbar, class: "searchbar-cancel-button" }, index.h("div", { key: '8dbe0a644441d7c02053183f214847766ac0ef2b', "aria-hidden": "true" }, mode === 'md' ? (index.h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
+        return (index.h(index.Host, { key: '2741c301a182cc20cb0c828b75b3dca9c9e3a3f5', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 'searchbar-animated': animated,
                 'searchbar-disabled': this.disabled,
@@ -404,14 +404,14 @@ const Searchbar = class {
                 'searchbar-has-focus': this.focused,
                 'searchbar-should-show-clear': this.shouldShowClearButton(),
                 'searchbar-should-show-cancel': this.shouldShowCancelButton(),
-            }) }, index.h("div", { key: '4d94b664e0bb7c47f094a25f26fc92b210b96ae3', class: "searchbar-input-container" }, index.h("input", Object.assign({ key: '78a82dcd609fdb0327ff153a49b5904a0290663d', "aria-label": "search text", disabled: this.disabled, ref: (el) => (this.nativeInput = el), class: "searchbar-input", inputMode: this.inputmode, enterKeyHint: this.enterkeyhint, name: this.name, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, minLength: this.minlength, maxLength: this.maxlength, placeholder: this.placeholder, type: this.type, value: this.getValue(), autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, index.h("ion-icon", { key: '4da87bc57573758ed758332789bac63f253b1678', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), index.h("button", { key: '410d65bac177b3534c0ef7a6ecc1fe6381b46efd', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
+            }) }, index.h("div", { key: '380ad3d3ce925d0fe826318aad1f73892f7817a8', class: "searchbar-input-container" }, index.h("input", Object.assign({ key: '50f51e3c3d71cbbceeee2196c3ac033ef77e8a77', "aria-label": "search text", disabled: this.disabled, ref: (el) => (this.nativeInput = el), class: "searchbar-input", inputMode: this.inputmode, enterKeyHint: this.enterkeyhint, name: this.name, onInput: this.onInput, onChange: this.onChange, onBlur: this.onBlur, onFocus: this.onFocus, minLength: this.minlength, maxLength: this.maxlength, placeholder: this.placeholder, type: this.type, value: this.getValue(), autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, index.h("ion-icon", { key: '6eb4cfbbad36cf31d134fc3d8221111dc10a35ae', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), index.h("button", { key: 'b0ac8e45b69c4337dfc86d24c7e953f9d4b428c2', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
                 /**
                  * This prevents mobile browsers from
                  * blurring the input when the clear
                  * button is activated.
                  */
                 ev.preventDefault();
-            }, onClick: () => this.onClearInput(true) }, index.h("ion-icon", { key: 'feb89ebe3b4df01402762b9d65c56d26852ca1a6', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
+            }, onClick: () => this.onClearInput(true) }, index.h("ion-icon", { key: 'f41efbb052f98c3c67e926d95e4b299794d3d012', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

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

@@ -6,7 +6,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-2d21d526.js');
-const helpers = require('./helpers-668b3d95.js');
+const helpers = require('./helpers-71097d9c.js');
 const dir = require('./dir-94c21456.js');
 const theme = require('./theme-d1c573d2.js');
 const ionicGlobal = require('./ionic-global-5762eca9.js');
@@ -430,14 +430,14 @@ const Segment = class {
     }
     render() {
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: 'a5268f36524465945e66f838c1fcb7b2ca4980b5', role: "tablist", onClick: this.onClick, class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: '78c3072c35c9f62f62cd88e6a9d8eba52a09b030', role: "tablist", onClick: this.onClick, class: theme.createColorClasses(this.color, {
                 [mode]: true,
                 'in-toolbar': theme.hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': theme.hostContext('ion-toolbar[color]', this.el),
                 'segment-activated': this.activated,
                 'segment-disabled': this.disabled,
                 'segment-scrollable': this.scrollable,
-            }) }, index.h("slot", { key: 'b399f99ec57ab319cdb0635d2bb1efcd74b709bc' })));
+            }) }, index.h("slot", { key: '11985d112b9a0d3a973d8b94408c793269f88225' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -525,7 +525,7 @@ const SegmentButton = class {
         const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
         const mode = ionicGlobal.getIonMode(this);
         const hasSegmentColor = () => (segmentEl === null || segmentEl === void 0 ? void 0 : segmentEl.color) !== undefined;
-        return (index.h(index.Host, { key: 'b2c9b735e7c578e50d7a41cb0c47cf661b83aa49', class: {
+        return (index.h(index.Host, { key: 'b81255f116704fa84b0a3a57b16c6ab65ae07476', class: {
                 [mode]: true,
                 'in-toolbar': theme.hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': theme.hostContext('ion-toolbar[color]', this.el),
@@ -541,10 +541,10 @@ const SegmentButton = class {
                 'ion-activatable': true,
                 'ion-activatable-instant': true,
                 'ion-focusable': true,
-            } }, index.h("button", Object.assign({ key: '1b6e56709f281be94c754a52dd80d9968d1e6bb1', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), index.h("span", { key: '3a0508e0d859dffd78dc54dc574cf3ed5c03f110', class: "button-inner" }, index.h("slot", { key: '05f0eb4f773d2cbd929035087af4550a0f4ab038' })), mode === 'md' && index.h("ion-ripple-effect", null)), index.h("div", { key: '75370e50f989a5db5d6b8ffa80894acba1797d85', part: "indicator", class: {
+            } }, index.h("button", Object.assign({ key: '3d1a946472d5be4ec2d3ae897e795fdc8de18317', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), index.h("span", { key: 'e4ea2923bde903c79deb7f4f9608a37f05f62941', class: "button-inner" }, index.h("slot", { key: '2df19fbc41e1fb03ca2416ff2050c8225b0a5ce5' })), mode === 'md' && index.h("ion-ripple-effect", null)), index.h("div", { key: '4cb31e2f3d78086d489f31ec072dad91bbfaae0e', part: "indicator", class: {
                 'segment-button-indicator': true,
                 'segment-button-indicator-animated': true,
-            } }, index.h("div", { key: '8123d414c166d97c5e3dae707b89d4e94f2c6f92', part: "indicator-background", class: "segment-button-indicator-background" }))));
+            } }, index.h("div", { key: '6444409904e159e32c3901c1a0857a5558a6af55', part: "indicator-background", class: "segment-button-indicator-background" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {