@ionic/core 8.8.14-dev.11784037956.17449639 → 8.8.14-dev.11784216165.1ecbf364

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

@@ -23,10 +23,11 @@ export class RouterOutlet {
          */
         this.animated = true;
     }
+    swipeGestureChanged() {
+        this.updateGestureEnabled();
+    }
     swipeHandlerChanged() {
-        if (this.gesture) {
-            this.gesture.enable(this.swipeHandler !== undefined);
-        }
+        this.updateGestureEnabled();
     }
     async connectedCallback() {
         const onStart = () => {
@@ -66,11 +67,21 @@ export class RouterOutlet {
                 this.gestureOrAnimationInProgress = false;
             }
         });
-        this.swipeHandlerChanged();
+        if (this.swipeGesture === undefined) {
+            this.swipeGesture = config.getBoolean('swipeBackEnabled', this.mode === 'ios');
+        }
+        else {
+            this.updateGestureEnabled();
+        }
     }
     componentWillLoad() {
         this.ionNavWillLoad.emit();
     }
+    updateGestureEnabled() {
+        if (this.gesture) {
+            this.gesture.enable(this.swipeHandler !== undefined && this.swipeGesture === true);
+        }
+    }
     disconnectedCallback() {
         if (this.gesture) {
             this.gesture.destroy();
@@ -181,7 +192,7 @@ export class RouterOutlet {
         return true;
     }
     render() {
-        return h("slot", { key: '386c41745b61daba161cf75063da97fe29ba36cb' });
+        return h("slot", { key: 'ce09e6fbba7b0a2276cdde5245bb37c9a162c1c7' });
     }
     static get is() { return "ion-router-outlet"; }
     static get encapsulation() { return "shadow"; }
@@ -293,6 +304,25 @@ export class RouterOutlet {
                 "getter": false,
                 "setter": false
             },
+            "swipeGesture": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean | undefined",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "If `true`, the router-outlet should allow navigation via swipe-to-go-back gesture.\nDefaults to `true` for `\"ios\"` mode and `false` for `\"md\"` mode."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "swipe-gesture"
+            },
             "swipeHandler": {
                 "type": "unknown",
                 "mutable": false,
@@ -514,6 +544,9 @@ export class RouterOutlet {
     static get elementRef() { return "el"; }
     static get watchers() {
         return [{
+                "propName": "swipeGesture",
+                "methodName": "swipeGestureChanged"
+            }, {
                 "propName": "swipeHandler",
                 "methodName": "swipeHandlerChanged"
             }];

package/dist/collection/components/row/row.js

@@ -5,7 +5,7 @@ import { Host, h } from "@stencil/core";
 import { getIonMode } from "../../global/ionic-global";
 export class Row {
     render() {
-        return (h(Host, { key: '8ba906a8cbea060a79ed658c9bf34906f0c11d38', class: getIonMode(this) }, h("slot", { key: 'd1009176f45b588fa52c7d9eb336f3c6d3214bb8' })));
+        return (h(Host, { key: 'a9066661fff12baaf3e80b2e8c08591af72fe5b8', class: getIonMode(this) }, h("slot", { key: '62b103af46d3a5ec9c146019ae300b68a4ae867a' })));
     }
     static get is() { return "ion-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/searchbar/searchbar.js

@@ -35,7 +35,7 @@ export class Searchbar {
         /**
          * Set the input's autocorrect property.
          */
-        this.autocorrect = 'off';
+        this.autocorrect = false;
         /**
          * Set the cancel button icon. Only applies to `md` mode.
          * Defaults to `arrow-back-sharp`.
@@ -459,8 +459,8 @@ export class Searchbar {
         const clearIcon = this.clearIcon || (mode === 'ios' ? closeCircle : closeSharp);
         const searchIcon = this.searchIcon || (mode === 'ios' ? searchOutline : searchSharp);
         const shouldShowCancelButton = this.shouldShowCancelButton();
-        const cancelButton = this.showCancelButton !== 'never' && (h("button", { key: '226b7a676b4819cda4062b8334fa8d4c4cee6f1a', "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" }, h("div", { key: '89adb4efa17a78c973bbd5527cfac91d99ceb9bb', "aria-hidden": "true" }, mode === 'md' ? (h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
-        return (h(Host, { key: '237dd767403dba3cb3d7de8905996e275669da3b', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses(this.color, {
+        const cancelButton = this.showCancelButton !== 'never' && (h("button", { key: '73964da43dbd099fc7f3d30cbc4da11087701ac5', "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" }, h("div", { key: '27335a0e35f6c253c074685fa0b088404927bcbb', "aria-hidden": "true" }, mode === 'md' ? (h("ion-icon", { "aria-hidden": "true", mode: mode, icon: this.cancelButtonIcon, lazy: false })) : (cancelButtonText))));
+        return (h(Host, { key: '1b4f6c4e7dffb02e092f0026ce3875822d98a631', role: "search", "aria-disabled": this.disabled ? 'true' : null, class: createColorClasses(this.color, {
                 [mode]: true,
                 'searchbar-animated': animated,
                 'searchbar-disabled': this.disabled,
@@ -470,14 +470,14 @@ export class Searchbar {
                 'searchbar-has-focus': this.focused,
                 'searchbar-should-show-clear': this.shouldShowClearButton(),
                 'searchbar-should-show-cancel': this.shouldShowCancelButton(),
-            }) }, h("div", { key: '5b4bdf7280bea710304b6975e76390fe6ceb7417', class: "searchbar-input-container" }, h("input", Object.assign({ key: '01a0820a2cf904aec1c7d84b542ab7918d435632', "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: autocapitalize === 'default' ? undefined : autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, h("ion-icon", { key: 'cd64973206b1cc59d221112861733b7ee25f0323', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), h("button", { key: '2061fa8449bbc576cf8c5130ea613378ea492944', "aria-label": "reset", type: "button", "no-blur": true, class: "searchbar-clear-button", onPointerDown: (ev) => {
+            }) }, h("div", { key: '587e1950e329cfb9d3658be5b2a6491e7af9321a', class: "searchbar-input-container" }, h("input", Object.assign({ key: '7f78a3d22cce03af277a538b4d9f85faddf1fa80', "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: autocapitalize === 'default' ? undefined : autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect ? 'on' : 'off', spellcheck: this.spellcheck }, this.inheritedAttributes)), mode === 'md' && cancelButton, h("ion-icon", { key: '9fd3e458978b64e9e3358bcbb26471753f6ff2a6', "aria-hidden": "true", mode: mode, icon: searchIcon, lazy: false, class: "searchbar-search-icon" }), h("button", { key: 'c7864c85923668dfa25f5fc4a70c7dbf6da191b7', "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) }, h("ion-icon", { key: '00df6f7742bff70b1b088d544b8c00e962e7216c', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
+            }, onClick: () => this.onClearInput(true) }, h("ion-icon", { key: '47e7a15c6c6d4df4c54c62b042842e499627da05', "aria-hidden": "true", mode: mode, icon: clearIcon, lazy: false, class: "searchbar-clear-icon" }))), mode === 'ios' && cancelButton));
     }
     static get is() { return "ion-searchbar"; }
     static get encapsulation() { return "scoped"; }
@@ -589,11 +589,11 @@ export class Searchbar {
                 "defaultValue": "'off'"
             },
             "autocorrect": {
-                "type": "string",
+                "type": "boolean",
                 "mutable": false,
                 "complexType": {
-                    "original": "'on' | 'off'",
-                    "resolved": "\"off\" | \"on\"",
+                    "original": "boolean",
+                    "resolved": "boolean",
                     "references": {}
                 },
                 "required": false,
@@ -606,7 +606,7 @@ export class Searchbar {
                 "setter": false,
                 "reflect": false,
                 "attribute": "autocorrect",
-                "defaultValue": "'off'"
+                "defaultValue": "false"
             },
             "cancelButtonIcon": {
                 "type": "string",

package/dist/collection/components/segment/segment.js

@@ -547,14 +547,14 @@ export class Segment {
     }
     render() {
         const mode = getIonMode(this);
-        return (h(Host, { key: 'eda6b7b88b7967b55cf9098c59b655b348a42224', role: "tablist", onClick: this.onClick, class: createColorClasses(this.color, {
+        return (h(Host, { key: 'bb626072e73f09c3433e1a769e09789a00822d8f', role: "tablist", onClick: this.onClick, class: createColorClasses(this.color, {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
                 'segment-activated': this.activated,
                 'segment-disabled': this.disabled,
                 'segment-scrollable': this.scrollable,
-            }) }, h("slot", { key: 'fdb451f235ce59c5bb50c61a13c69160ece2d5df', onSlotchange: this.onSlottedItemsChange })));
+            }) }, h("slot", { key: '652d5037c2c2dee4d47a5710b1d150e691202d25', onSlotchange: this.onSlottedItemsChange })));
     }
     static get is() { return "ion-segment"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segment-button/segment-button.js

@@ -111,7 +111,7 @@ export class SegmentButton {
         const { checked, type, disabled, hasIcon, hasLabel, layout, segmentEl } = this;
         const mode = getIonMode(this);
         const hasSegmentColor = () => (segmentEl === null || segmentEl === void 0 ? void 0 : segmentEl.color) !== undefined;
-        return (h(Host, { key: 'f69e2a24198a7c57543dbe66902da039a6569c64', class: {
+        return (h(Host, { key: '792f621c36260b1fceff2b4ec4fa95d98d51d46b', class: {
                 [mode]: true,
                 'in-toolbar': hostContext('ion-toolbar', this.el),
                 'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
@@ -127,7 +127,7 @@ export class SegmentButton {
                 'ion-activatable': true,
                 'ion-activatable-instant': true,
                 'ion-focusable': true,
-            } }, h("button", Object.assign({ key: '0a6fea3a374074af19f7ece0ba3a7cf1e269ab6d', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), h("span", { key: '991018a38c59a6f3d76b2e952e5569c874d2c13e', class: "button-inner" }, h("slot", { key: '23c547c80108025027b913c7fcbec189286627a3' })), mode === 'md' && h("ion-ripple-effect", { key: '7faa9d06ab6aa7346d16b0b6808979759a79650c' })), h("div", { key: '0d61badf2c227dc38e20185b2b2bb590a5efa434', part: "indicator", class: "segment-button-indicator segment-button-indicator-animated" }, h("div", { key: 'a84035752b78491c344179d1e61d109fb4bd1cf1', part: "indicator-background", class: "segment-button-indicator-background" }))));
+            } }, h("button", Object.assign({ key: '860698be6ceb8f08c0ce3d16ba82d4bb56adf030', "aria-selected": checked ? 'true' : 'false', role: "tab", ref: (el) => (this.nativeEl = el), type: type, class: "button-native", part: "native", disabled: disabled }, this.inheritedAttributes), h("span", { key: 'e903a2642ff46797878a941887b5c596d52fd3a3', class: "button-inner" }, h("slot", { key: '5fc6b842ecb7f0ab8df23b344bf6714f38dda89a' })), mode === 'md' && h("ion-ripple-effect", { key: '710aaf6e4fa2b6cb15897a883e88dec17ef3829f' })), h("div", { key: 'a7b036cba32420e9eb3f2d16487df0519ecc5289', part: "indicator", class: "segment-button-indicator segment-button-indicator-animated" }, h("div", { key: 'a0a5f49ea7f2ecab8014f4f9ca473a27db8348b6', part: "indicator-background", class: "segment-button-indicator-background" }))));
     }
     static get is() { return "ion-segment-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segment-content/segment-content.js

@@ -4,7 +4,7 @@
 import { Host, h } from "@stencil/core";
 export class SegmentContent {
     render() {
-        return (h(Host, { key: '665f41a854621f898eaf7ba9a49e77cc9326501e' }, h("slot", { key: '635aa57fbf6167dcd36fe8dc5dfc1c313637ac04' })));
+        return (h(Host, { key: 'ef39f29c444177c3b083cd35680ba891e4bb6a2a' }, h("slot", { key: '51f9dd9ca084ddd928b376aa9d716509669c32b2' })));
     }
     static get is() { return "ion-segment-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segment-view/segment-view.js

@@ -103,11 +103,11 @@ export class SegmentView {
     }
     render() {
         const { disabled, isManualScroll, swipeGesture } = this;
-        return (h(Host, { key: '2a6e0a1046af75b1fa0eed20a5fbbb4634480297', class: {
+        return (h(Host, { key: 'a6c6ac0232c4bb6f2a954b3de7993019d71f423a', class: {
                 'segment-view-disabled': disabled,
                 'segment-view-scroll-disabled': isManualScroll === false,
                 'segment-view-swipe-disabled': swipeGesture === false,
-            } }, h("slot", { key: '644b60d179d0de3fa204e3bef26a3503ceeaf1d6' })));
+            } }, h("slot", { key: '386305be2a75069c79def12005d9f6b49276763f' })));
     }
     static get is() { return "ion-segment-view"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select/select.ios.css

@@ -75,6 +75,14 @@
    * @prop --border-width: Width of the select border
    *
    * @prop --ripple-color: The color of the ripple effect on MD mode.
+   *
+   * @prop --select-text-media-width: The width of media (icons/images) in the select text.
+   * @prop --select-text-media-height: The height of media (icons/images) in the select text.
+   * @prop --select-text-media-border-width: The border width of media (icons/images) in the select text.
+   * @prop --select-text-media-border-color: The border color of media (icons/images) in the select text.
+   * @prop --select-text-media-border-radius: The border radius of media (icons/images) in the select text.
+   * @prop --select-text-media-border-style: The border style of media (icons/images) in the select text.
+   * @prop --select-text-gap: The gap between elements in the select text.
    */
   --padding-top: 0px;
   --padding-end: 0px;
@@ -87,6 +95,9 @@
   --highlight-color-focused: var(--ion-color-primary, #0054e9);
   --highlight-color-valid: var(--ion-color-success, #2dd55b);
   --highlight-color-invalid: var(--ion-color-danger, #c5000f);
+  --select-text-media-height: 1.5em;
+  --select-text-media-width: 1.5em;
+  --select-text-gap: 12px;
   /**
    * This is a private API that is used to switch
    * out the highlight color based on the state
@@ -227,6 +238,28 @@ button {
   overflow: hidden;
 }
 
+/**
+ * If the select text contains rich content, we want to add some
+ * spacing between the elements without changing the display to
+ * prevent losing the ellipses behavior.
+ */
+.select-text > * + * {
+  margin-inline-start: var(--select-text-gap);
+}
+
+.select-text img,
+.select-text ion-img,
+.select-text ion-icon,
+.select-text ion-thumbnail,
+.select-text ion-avatar {
+  border-radius: var(--select-text-media-border-radius);
+  width: var(--select-text-media-width);
+  height: var(--select-text-media-height);
+  border-width: var(--select-text-media-border-width);
+  border-style: var(--select-text-media-border-style);
+  border-color: var(--select-text-media-border-color);
+}
+
 .select-wrapper {
   -webkit-padding-start: var(--padding-start);
   padding-inline-start: var(--padding-start);