@ionic/core 8.8.19 → 8.8.20-dev.11787158518.168a2fea

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

@@ -3,9 +3,9 @@
  */
 'use strict';
 
-var index = require('./index-BfaXsATC.js');
-var theme = require('./theme-CeDs6Hcv.js');
-var ionicGlobal = require('./ionic-global-BerQGEpE.js');
+var index = require('./index-uvry__L4.js');
+var theme = require('./theme-Bw0rpaNN.js');
+var ionicGlobal = require('./ionic-global-k6hOWWpn.js');
 var spinnerConfigs = require('./spinner-configs-DxHKnd3-.js');
 
 const spinnerCss = () => `:host{display:inline-block;position:relative;width:28px;height:28px;color:var(--color);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}:host(.ion-color){color:var(--ion-color-base)}svg{-webkit-transform-origin:center;transform-origin:center;position:absolute;top:0;left:0;width:100%;height:100%;-webkit-transform:translateZ(0);transform:translateZ(0)}:host-context([dir=rtl]) svg{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}[dir=rtl] svg{-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}@supports selector(:dir(rtl)){svg:dir(rtl){-webkit-transform-origin:calc(100% - center);transform-origin:calc(100% - center)}}:host(.spinner-lines) line,:host(.spinner-lines-small) line{stroke-width:7px}:host(.spinner-lines-sharp) line,:host(.spinner-lines-sharp-small) line{stroke-width:4px}:host(.spinner-lines) line,:host(.spinner-lines-small) line,:host(.spinner-lines-sharp) line,:host(.spinner-lines-sharp-small) line{stroke-linecap:round;stroke:currentColor}:host(.spinner-lines) svg,:host(.spinner-lines-small) svg,:host(.spinner-lines-sharp) svg,:host(.spinner-lines-sharp-small) svg{-webkit-animation:spinner-fade-out 1s linear infinite;animation:spinner-fade-out 1s linear infinite}:host(.spinner-bubbles) svg{-webkit-animation:spinner-scale-out 1s linear infinite;animation:spinner-scale-out 1s linear infinite;fill:currentColor}:host(.spinner-circles) svg{-webkit-animation:spinner-fade-out 1s linear infinite;animation:spinner-fade-out 1s linear infinite;fill:currentColor}:host(.spinner-crescent) circle{fill:transparent;stroke-width:4px;stroke-dasharray:128px;stroke-dashoffset:82px;stroke:currentColor}:host(.spinner-crescent) svg{-webkit-animation:spinner-rotate 1s linear infinite;animation:spinner-rotate 1s linear infinite}:host(.spinner-dots) circle{stroke-width:0;fill:currentColor}:host(.spinner-dots) svg{-webkit-animation:spinner-dots 1s linear infinite;animation:spinner-dots 1s linear infinite}:host(.spinner-circular) svg{-webkit-animation:spinner-circular linear infinite;animation:spinner-circular linear infinite}:host(.spinner-circular) circle{-webkit-animation:spinner-circular-inner ease-in-out infinite;animation:spinner-circular-inner ease-in-out infinite;stroke:currentColor;stroke-dasharray:80px, 200px;stroke-dashoffset:0px;stroke-width:5.6;fill:none}:host(.spinner-paused),:host(.spinner-paused) svg,:host(.spinner-paused) circle{-webkit-animation-play-state:paused;animation-play-state:paused}@-webkit-keyframes spinner-fade-out{0%{opacity:1}100%{opacity:0}}@keyframes spinner-fade-out{0%{opacity:1}100%{opacity:0}}@-webkit-keyframes spinner-scale-out{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1)}100%{-webkit-transform:scale(0, 0);transform:scale(0, 0)}}@keyframes spinner-scale-out{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1)}100%{-webkit-transform:scale(0, 0);transform:scale(0, 0)}}@-webkit-keyframes spinner-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spinner-rotate{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes spinner-dots{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}50%{-webkit-transform:scale(0.4, 0.4);transform:scale(0.4, 0.4);opacity:0.3}100%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}}@keyframes spinner-dots{0%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}50%{-webkit-transform:scale(0.4, 0.4);transform:scale(0.4, 0.4);opacity:0.3}100%{-webkit-transform:scale(1, 1);transform:scale(1, 1);opacity:0.9}}@-webkit-keyframes spinner-circular{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spinner-circular{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes spinner-circular-inner{0%{stroke-dasharray:1px, 200px;stroke-dashoffset:0px}50%{stroke-dasharray:100px, 200px;stroke-dashoffset:-15px}100%{stroke-dasharray:100px, 200px;stroke-dashoffset:-125px}}@keyframes spinner-circular-inner{0%{stroke-dasharray:1px, 200px;stroke-dashoffset:0px}50%{stroke-dasharray:100px, 200px;stroke-dashoffset:-15px}100%{stroke-dasharray:100px, 200px;stroke-dashoffset:-125px}}`;
@@ -13,11 +13,26 @@ const spinnerCss = () => `:host{display:inline-block;position:relative;width:28p
 const Spinner = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        /**
-         * If `true`, the spinner's animation will be paused.
-         */
-        this.paused = false;
     }
+    /**
+     * The color to use from your application's color palette.
+     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
+     * For more information on colors, see [theming](/docs/theming/basics).
+     */
+    color;
+    /**
+     * Duration of the spinner animation in milliseconds. The default varies based on the spinner.
+     */
+    duration;
+    /**
+     * The name of the SVG spinner to use. If a name is not provided, the platform's default
+     * spinner will be used.
+     */
+    name;
+    /**
+     * If `true`, the spinner's animation will be paused.
+     */
+    paused = false;
     getName() {
         const spinnerName = this.name || index.config.get('spinner');
         const mode = ionicGlobal.getIonMode(this);
@@ -27,11 +42,10 @@ const Spinner = class {
         return mode === 'ios' ? 'lines' : 'circular';
     }
     render() {
-        var _a;
         const self = this;
         const mode = ionicGlobal.getIonMode(self);
         const spinnerName = self.getName();
-        const spinner = (_a = spinnerConfigs.SPINNERS[spinnerName]) !== null && _a !== void 0 ? _a : spinnerConfigs.SPINNERS['lines'];
+        const spinner = spinnerConfigs.SPINNERS[spinnerName] ?? spinnerConfigs.SPINNERS['lines'];
         const duration = typeof self.duration === 'number' && self.duration > 10 ? self.duration : spinner.dur;
         const svgs = [];
         if (spinner.circles !== undefined) {
@@ -44,7 +58,7 @@ const Spinner = class {
                 svgs.push(buildLine(spinner, duration, i, spinner.lines));
             }
         }
-        return (index.h(index.Host, { key: 'dd1954e557fa14b943e761474e29e4316ba53938', class: theme.createColorClasses(self.color, {
+        return (index.h(index.Host, { key: '87102ff9ea58b0ecde5d0978386374f7d0e9cf98', class: theme.createColorClasses(self.color, {
                 [mode]: true,
                 [`spinner-${spinnerName}`]: true,
                 'spinner-paused': self.paused || index.config.getBoolean('_testing'),

package/dist/cjs/ion-split-pane.cjs.entry.js

@@ -3,8 +3,8 @@
  */
 'use strict';
 
-var index = require('./index-BfaXsATC.js');
-var ionicGlobal = require('./ionic-global-BerQGEpE.js');
+var index = require('./index-uvry__L4.js');
+var ionicGlobal = require('./ionic-global-k6hOWWpn.js');
 
 const splitPaneIosCss = () => `:host{--side-width:100%;left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:row;flex-direction:row;-ms-flex-wrap:nowrap;flex-wrap:nowrap;contain:strict}:host(.split-pane-visible) ::slotted(.split-pane-main){left:0;right:0;top:0;bottom:0;position:relative;-ms-flex:1;flex:1;-webkit-box-shadow:none;box-shadow:none;overflow:hidden;z-index:0}::slotted(.split-pane-side:not(ion-menu)){display:none}:host{--border:0.55px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, var(--ion-background-color-step-250, #c8c7cc))));--side-min-width:270px;--side-max-width:28%}`;
 
@@ -25,18 +25,32 @@ const SplitPane = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.ionSplitPaneVisible = index.createEvent(this, "ionSplitPaneVisible", 7);
-        this.visible = false;
-        /**
-         * If `true`, the split pane will be hidden.
-         */
-        this.disabled = false;
-        /**
-         * When the split-pane should be shown.
-         * Can be a CSS media query expression, or a shortcut expression.
-         * Can also be a boolean expression.
-         */
-        this.when = QUERY['lg'];
     }
+    rmL;
+    get el() { return index.getElement(this); }
+    visible = false;
+    /**
+     * The `id` of the main content. When using
+     * a router this is typically `ion-router-outlet`.
+     * When not using a router, this is typically
+     * your main view's `ion-content`. This is not the
+     * id of the `ion-content` inside of your `ion-menu`.
+     */
+    contentId;
+    /**
+     * If `true`, the split pane will be hidden.
+     */
+    disabled = false;
+    /**
+     * When the split-pane should be shown.
+     * Can be a CSS media query expression, or a shortcut expression.
+     * Can also be a boolean expression.
+     */
+    when = QUERY['lg'];
+    /**
+     * Expression to be called when the split-pane visibility has changed
+     */
+    ionSplitPaneVisible;
     visibleChanged(visible) {
         this.ionSplitPaneVisible.emit({ visible });
     }
@@ -128,14 +142,13 @@ const SplitPane = class {
     }
     render() {
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: '05c88c009fbe2e223fd261760a2b49da1653ff62', class: {
+        return (index.h(index.Host, { key: '652bc0965ae962dc36a67fd7129dacaa1ba8e551', class: {
                 [mode]: true,
                 // Used internally for styling
                 [`split-pane-${mode}`]: true,
                 'split-pane-visible': this.visible,
-            } }, index.h("slot", { key: 'b35865082661253c4468520d79234fa5dab5bd35' })));
+            } }, index.h("slot", { key: '9eac85f4c4e33ec00e8e16e2679f5975d7652452' })));
     }
-    get el() { return index.getElement(this); }
     static get watchers() { return {
         "visible": [{
                 "visibleChanged": 0

package/dist/cjs/ion-tab-bar_2.cjs.entry.js

@@ -3,15 +3,15 @@
  */
 'use strict';
 
-var index = require('./index-BfaXsATC.js');
-var keyboardController = require('./keyboard-controller-GXBiBRKS.js');
-var theme = require('./theme-CeDs6Hcv.js');
-var ionicGlobal = require('./ionic-global-BerQGEpE.js');
-var helpers = require('./helpers-DdZyl6WL.js');
+var index = require('./index-uvry__L4.js');
+var keyboardController = require('./keyboard-controller-PtZoN2GS.js');
+var theme = require('./theme-Bw0rpaNN.js');
+var ionicGlobal = require('./ionic-global-k6hOWWpn.js');
+var helpers = require('./helpers-YPQybDph.js');
 require('./index-DkNv4J_i.js');
-require('./keyboard-UuAS4D_9.js');
+require('./keyboard-cHxZlTyz.js');
 require('./capacitor-DmA66EwP.js');
-require('./dir-DD0jPVH3.js');
+require('./dir-zwDPRE5K.js');
 
 const tabBarIosCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:auto;padding-right:var(--ion-safe-area-right);padding-bottom:var(--ion-safe-area-bottom, 0);padding-left:var(--ion-safe-area-left);border-top:var(--border);background:var(--background);color:var(--color);text-align:center;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:10;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}:host(.ion-color) ::slotted(ion-tab-button){--background-focused:var(--ion-color-shade);--color-selected:var(--ion-color-contrast)}:host(.ion-color) ::slotted(.tab-selected){color:var(--ion-color-contrast)}:host(.ion-color),:host(.ion-color) ::slotted(ion-tab-button){color:rgba(var(--ion-color-contrast-rgb), 0.7)}:host(.ion-color),:host(.ion-color) ::slotted(ion-tab-button){background:var(--ion-color-base)}:host(.ion-color) ::slotted(ion-tab-button.ion-focused),:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused){background:var(--background-focused)}:host(.tab-bar-translucent) ::slotted(ion-tab-button){background:transparent}:host([slot=top]){padding-top:var(--ion-safe-area-top, 0);padding-bottom:0;border-top:0;border-bottom:var(--border)}:host(.tab-bar-hidden){display:none !important}:host{--background:var(--ion-tab-bar-background, var(--ion-color-step-50, var(--ion-background-color-step-50, #f7f7f7)));--background-focused:var(--ion-tab-bar-background-focused, #e0e0e0);--border:0.55px solid var(--ion-tab-bar-border-color, var(--ion-border-color, var(--ion-color-step-150, var(--ion-background-color-step-150, rgba(0, 0, 0, 0.2)))));--color:var(--ion-tab-bar-color, var(--ion-color-step-600, var(--ion-text-color-step-400, #666666)));--color-selected:var(--ion-tab-bar-color-selected, var(--ion-color-primary, #0054e9));height:50px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.tab-bar-translucent){--background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(210%) blur(20px);backdrop-filter:saturate(210%) blur(20px)}:host(.ion-color.tab-bar-translucent){background:rgba(var(--ion-color-base-rgb), 0.8)}:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused){background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.6)}}`;
 
@@ -22,17 +22,22 @@ const TabBar = class {
         index.registerInstance(this, hostRef);
         this.ionTabBarChanged = index.createEvent(this, "ionTabBarChanged", 7);
         this.ionTabBarLoaded = index.createEvent(this, "ionTabBarLoaded", 7);
-        this.keyboardCtrl = null;
-        this.keyboardCtrlPromise = null;
-        this.didLoad = false;
-        this.keyboardVisible = false;
-        /**
-         * If `true`, the tab bar will be translucent.
-         * Only applies when the mode is `"ios"` and the device supports
-         * [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
-         */
-        this.translucent = false;
     }
+    keyboardCtrl = null;
+    keyboardCtrlPromise = null;
+    didLoad = false;
+    get el() { return index.getElement(this); }
+    keyboardVisible = false;
+    /**
+     * The color to use from your application's color palette.
+     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
+     * For more information on colors, see [theming](/docs/theming/basics).
+     */
+    color;
+    /**
+     * The selected tab component
+     */
+    selectedTab;
     selectedTabChanged() {
         // Skip the initial watcher call that happens during component load
         // We handle that in componentDidLoad to ensure children are ready
@@ -45,6 +50,21 @@ const TabBar = class {
             });
         }
     }
+    /**
+     * If `true`, the tab bar will be translucent.
+     * Only applies when the mode is `"ios"` and the device supports
+     * [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
+     */
+    translucent = false;
+    /** @internal */
+    ionTabBarChanged;
+    /**
+     * @internal
+     * This event is used in IonContent to correctly
+     * calculate the fullscreen content offsets
+     * when IonTabBar is used.
+     */
+    ionTabBarLoaded;
     componentDidLoad() {
         this.ionTabBarLoaded.emit();
         // Set the flag to indicate the component has loaded
@@ -99,13 +119,12 @@ const TabBar = class {
         const { color, translucent, keyboardVisible } = this;
         const mode = ionicGlobal.getIonMode(this);
         const shouldHide = keyboardVisible && this.el.getAttribute('slot') !== 'top';
-        return (index.h(index.Host, { key: '24e164eaf81a0bec9237b561465618f10990806c', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: theme.createColorClasses(color, {
+        return (index.h(index.Host, { key: '5c56cffd380df7720f3309af7cfca71500817678', role: "tablist", "aria-hidden": shouldHide ? 'true' : null, class: theme.createColorClasses(color, {
                 [mode]: true,
                 'tab-bar-translucent': translucent,
                 'tab-bar-hidden': shouldHide,
-            }) }, index.h("slot", { key: '0ca29a2d97a7c38bbf43f8d79e271b874b4d9be8' })));
+            }) }, index.h("slot", { key: 'a98d3298320f864578e30e0fb79a2cc0cccb46d9' })));
     }
-    get el() { return index.getElement(this); }
     static get watchers() { return {
         "selectedTab": [{
                 "selectedTabChanged": 0
@@ -125,33 +144,66 @@ const TabButton = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.ionTabButtonClick = index.createEvent(this, "ionTabButtonClick", 7);
-        this.inheritedAttributes = {};
-        /**
-         * If `true`, the user cannot interact with the tab button.
-         */
-        this.disabled = false;
-        /**
-         * The selected tab component
-         */
-        this.selected = false;
-        this.onKeyUp = (ev) => {
-            if (ev.key === 'Enter' || ev.key === ' ') {
-                this.selectTab(ev);
-            }
-        };
-        this.onClick = (ev) => {
-            this.selectTab(ev);
-        };
     }
+    inheritedAttributes = {};
+    get el() { return index.getElement(this); }
+    /**
+     * If `true`, the user cannot interact with the tab button.
+     */
+    disabled = false;
+    /**
+     * This attribute instructs browsers to download a URL instead of navigating to
+     * it, so the user will be prompted to save it as a local file. If the attribute
+     * has a value, it is used as the pre-filled file name in the Save prompt
+     * (the user can still change the file name if they want).
+     */
+    download;
+    /**
+     * Contains a URL or a URL fragment that the hyperlink points to.
+     * If this property is set, an anchor tag will be rendered.
+     */
+    href;
+    /**
+     * Specifies the relationship of the target object to the link object.
+     * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).
+     */
+    rel;
+    /**
+     * Set the layout of the text and icon in the tab bar.
+     * It defaults to `"icon-top"`.
+     */
+    layout;
+    /**
+     * The selected tab component
+     */
+    selected = false;
+    /**
+     * A tab id must be provided for each `ion-tab`. It's used internally to reference
+     * the selected tab or by the router to switch between them.
+     */
+    tab;
+    /**
+     * Specifies where to display the linked URL.
+     * Only applies when an `href` is provided.
+     * Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
+     */
+    target;
+    /**
+     * Emitted when the tab bar is clicked
+     * @internal
+     */
+    ionTabButtonClick;
     onTabBarChanged(ev) {
         const dispatchedFrom = ev.target;
         const parent = this.el.parentElement;
-        if (ev.composedPath().includes(parent) || (dispatchedFrom === null || dispatchedFrom === void 0 ? void 0 : dispatchedFrom.contains(this.el))) {
+        if (ev.composedPath().includes(parent) || dispatchedFrom?.contains(this.el)) {
             this.selected = this.tab === ev.detail.tab;
         }
     }
     componentWillLoad() {
-        this.inheritedAttributes = Object.assign({}, helpers.inheritAttributes(this.el, ['aria-label']));
+        this.inheritedAttributes = {
+            ...helpers.inheritAttributes(this.el, ['aria-label']),
+        };
         if (this.layout === undefined) {
             this.layout = index.config.get('tabButtonLayout', 'icon-top');
         }
@@ -174,6 +226,14 @@ const TabButton = class {
     get hasIcon() {
         return !!this.el.querySelector('ion-icon');
     }
+    onKeyUp = (ev) => {
+        if (ev.key === 'Enter' || ev.key === ' ') {
+            this.selectTab(ev);
+        }
+    };
+    onClick = (ev) => {
+        this.selectTab(ev);
+    };
     render() {
         const { disabled, hasIcon, hasLabel, href, rel, target, layout, selected, tab, inheritedAttributes } = this;
         const mode = ionicGlobal.getIonMode(this);
@@ -183,7 +243,7 @@ const TabButton = class {
             rel,
             target,
         };
-        return (index.h(index.Host, { key: '638b93ef40701ec3aefb89b1579eb91aaf6d4f8a', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (index.h(index.Host, { key: '45bb7ffa6d8764202adc2c5c393748d4003e86fe', onClick: this.onClick, onKeyup: this.onKeyUp, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
                 [mode]: true,
                 'tab-selected': selected,
                 'tab-disabled': disabled,
@@ -195,9 +255,8 @@ const TabButton = class {
                 'ion-activatable': true,
                 'ion-selectable': true,
                 'ion-focusable': true,
-            } }, index.h("a", Object.assign({ key: 'c053d32fbcdad8d5e4a409956b47164d7a080c6b' }, attrs, { class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined }, inheritedAttributes), index.h("span", { key: 'b3b460d33ec978a46b069442280d31b23bc8e794', class: "button-inner" }, index.h("slot", { key: '87b3928475c941263261101b8fae27c6370d4671' })), mode === 'md' && index.h("ion-ripple-effect", { key: '6532e5b4546aebe4becaebe1c93ce0e6aedaffe7', type: "unbounded" }))));
+            } }, index.h("a", { key: '78c416609a2b86a6e7c5f217ffd2a6b9f80a5103', ...attrs, class: "button-native", part: "native", role: "tab", "aria-selected": selected ? 'true' : null, "aria-disabled": disabled ? 'true' : null, tabindex: disabled ? '-1' : undefined, ...inheritedAttributes }, index.h("span", { key: '62934156439ffd0ab86674b9cf89d9cfa0d3589c', class: "button-inner" }, index.h("slot", { key: '293ba8f5ef50373c4e6e492dcaa55b3d2aae8d2f' })), mode === 'md' && index.h("ion-ripple-effect", { key: '360b010afedcf17fc1f3ab6d192f0f8c7b1cf112', type: "unbounded" }))));
     }
-    get el() { return index.getElement(this); }
 };
 TabButton.style = {
     ios: tabButtonIosCss(),

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

@@ -3,19 +3,32 @@
  */
 'use strict';
 
-var index = require('./index-BfaXsATC.js');
-var frameworkDelegate = require('./framework-delegate-CEzl4MEA.js');
-require('./helpers-DdZyl6WL.js');
-require('./dir-DD0jPVH3.js');
+var index = require('./index-uvry__L4.js');
+var frameworkDelegate = require('./framework-delegate-Dfo5XsGv.js');
+require('./helpers-YPQybDph.js');
+require('./dir-zwDPRE5K.js');
 
 const tabCss = () => `:host(.tab-hidden){display:none !important}`;
 
 const Tab = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        /** @internal */
-        this.active = false;
     }
+    loadPromise;
+    get el() { return index.getElement(this); }
+    /** @internal */
+    active = false;
+    /** @internal */
+    delegate;
+    /**
+     * A tab id must be provided for each `ion-tab`. It's used internally to reference
+     * the selected tab or by the router to switch between them.
+     */
+    tab;
+    /**
+     * The component to display inside of the tab.
+     */
+    component;
     async componentWillLoad() {
         if (this.active) {
             await this.setActive();
@@ -53,12 +66,11 @@ const Tab = class {
     }
     render() {
         const { tab, active, component } = this;
-        return (index.h(index.Host, { key: 'c35c9f96ed3a73270b23f30d9e279dcad9032e28', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (index.h(index.Host, { key: '8ecbd7a85d3370ed8ed40561cd8134e71584d6aa', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'ion-page': component === undefined,
                 'tab-hidden': !active,
-            } }, index.h("slot", { key: '1c03523327e571f9ba140be0ccd6fe089e16a77a' })));
+            } }, index.h("slot", { key: '8d6326d75812888e33fd09665b7e588e1e270df1' })));
     }
-    get el() { return index.getElement(this); }
     static get watchers() { return {
         "active": [{
                 "changeActive": 0
@@ -75,22 +87,26 @@ const Tabs = class {
         this.ionNavWillLoad = index.createEvent(this, "ionNavWillLoad", 7);
         this.ionTabsWillChange = index.createEvent(this, "ionTabsWillChange", 3);
         this.ionTabsDidChange = index.createEvent(this, "ionTabsDidChange", 3);
-        this.transitioning = false;
-        /** @internal */
-        this.useRouter = false;
-        this.onTabClicked = (ev) => {
-            const { href, tab } = ev.detail;
-            if (this.useRouter && href !== undefined) {
-                const router = document.querySelector('ion-router');
-                if (router) {
-                    router.push(href);
-                }
-            }
-            else {
-                this.select(tab);
-            }
-        };
     }
+    transitioning = false;
+    leavingTab;
+    get el() { return index.getElement(this); }
+    selectedTab;
+    /** @internal */
+    useRouter = false;
+    /**
+     * Emitted when the navigation will load a component.
+     * @internal
+     */
+    ionNavWillLoad;
+    /**
+     * Emitted when the navigation is about to transition to a new component.
+     */
+    ionTabsWillChange;
+    /**
+     * Emitted when the navigation has finished transitioning to a new component.
+     */
+    ionTabsDidChange;
     async componentWillLoad() {
         if (!this.useRouter) {
             /**
@@ -179,8 +195,7 @@ const Tabs = class {
     }
     /** @internal */
     async getRouteId() {
-        var _a;
-        const tabId = (_a = this.selectedTab) === null || _a === void 0 ? void 0 : _a.tab;
+        const tabId = this.selectedTab?.tab;
         return tabId !== undefined ? { id: tabId, element: this.selectedTab } : undefined;
     }
     setActive(selectedTab) {
@@ -226,10 +241,21 @@ const Tabs = class {
     get tabs() {
         return Array.from(this.el.querySelectorAll('ion-tab'));
     }
+    onTabClicked = (ev) => {
+        const { href, tab } = ev.detail;
+        if (this.useRouter && href !== undefined) {
+            const router = document.querySelector('ion-router');
+            if (router) {
+                router.push(href);
+            }
+        }
+        else {
+            this.select(tab);
+        }
+    };
     render() {
-        return (index.h(index.Host, { key: 'c7131135b31aa312dc0207602561e1c0f4ac3e53', onIonTabButtonClick: this.onTabClicked }, index.h("slot", { key: '6c46e91c0389bbcea1f15f35cf3ea513a74ac545', name: "top" }), index.h("div", { key: '4f1b649d8bb60b61402b97359de204979c5eda52', class: "tabs-inner" }, index.h("slot", { key: '8d1ef4952be4fb33567376e1083ea4da697fcae0' })), index.h("slot", { key: '260b8da8031494e9cb4635b3d22c49a433042db1', name: "bottom" })));
+        return (index.h(index.Host, { key: '7b8c6455e0673e343d0c759ed85e0d9970de3bb8', onIonTabButtonClick: this.onTabClicked }, index.h("slot", { key: '7d0d840ae03312ca22bcb694ffca738d6648218e', name: "top" }), index.h("div", { key: 'f336d903800af34af0d36adfc94223b940111e6a', class: "tabs-inner" }, index.h("slot", { key: '14656154959a24ae176eff20f6463043180d2eae' })), index.h("slot", { key: '2be4d114f058d24b0e70fb12cfb0eccd3d6e6a74', name: "bottom" })));
     }
-    get el() { return index.getElement(this); }
 };
 const getTab = (tabs, tab) => {
     const tabEl = typeof tab === 'string' ? tabs.find((t) => t.tab === tab) : tab;

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

@@ -3,9 +3,9 @@
  */
 'use strict';
 
-var index = require('./index-BfaXsATC.js');
-var theme = require('./theme-CeDs6Hcv.js');
-var ionicGlobal = require('./ionic-global-BerQGEpE.js');
+var index = require('./index-uvry__L4.js');
+var theme = require('./theme-Bw0rpaNN.js');
+var ionicGlobal = require('./ionic-global-k6hOWWpn.js');
 
 const textCss = () => `:host(.ion-color){color:var(--ion-color-base)}`;
 
@@ -13,11 +13,17 @@ const Text = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
+    /**
+     * The color to use from your application's color palette.
+     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
+     * For more information on colors, see [theming](/docs/theming/basics).
+     */
+    color;
     render() {
         const mode = ionicGlobal.getIonMode(this);
-        return (index.h(index.Host, { key: 'bfaa49d35f43b8036725ae8a322c716fc6e43bdf', class: theme.createColorClasses(this.color, {
+        return (index.h(index.Host, { key: 'b6f604df1b7aa5705a5b9a458e669a6a921c02a1', class: theme.createColorClasses(this.color, {
                 [mode]: true,
-            }) }, index.h("slot", { key: 'c04880cd1935b42cbe60f58fd523b4d8a96072dc' })));
+            }) }, index.h("slot", { key: '055d07b024a6554dfcf959fc8ed7b405e2730af2' })));
     }
 };
 Text.style = textCss();