@ionic/core 8.7.17-dev.11772118942.181221d4 → 8.7.17-dev.11772568074.1d7a4aea

package/components/ion-tab.js

@@ -1,94 +1,4 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { proxyCustomElement, HTMLElement, Build, h, Host } from '@stencil/core/internal/client';
-import { a as attachComponent } from './framework-delegate.js';
-import { a as printIonError } from './index4.js';
-
-const tabCss = ":host(.tab-hidden){display:none !important}";
-
-const Tab = /*@__PURE__*/ proxyCustomElement(class Tab extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.loaded = false;
-        /** @internal */
-        this.active = false;
-    }
-    async componentWillLoad() {
-        if (Build.isDev) {
-            if (this.component !== undefined && this.el.childElementCount > 0) {
-                printIonError('[ion-tab] - You can not use a lazy-loaded component in a tab and inlined content at the same time.' +
-                    `- Remove the component attribute in: <ion-tab component="${this.component}">` +
-                    ` or` +
-                    `- Remove the embedded content inside the ion-tab: <ion-tab></ion-tab>`);
-            }
-        }
-        if (this.active) {
-            await this.setActive();
-        }
-    }
-    /** Set the active component for the tab */
-    async setActive() {
-        await this.prepareLazyLoaded();
-        this.active = true;
-    }
-    changeActive(isActive) {
-        if (isActive) {
-            this.prepareLazyLoaded();
-        }
-    }
-    prepareLazyLoaded() {
-        if (!this.loaded && this.component != null) {
-            this.loaded = true;
-            try {
-                return attachComponent(this.delegate, this.el, this.component, ['ion-page']);
-            }
-            catch (e) {
-                printIonError('[ion-tab] - Exception in prepareLazyLoaded:', e);
-            }
-        }
-        return Promise.resolve(undefined);
-    }
-    render() {
-        const { tab, active, component } = this;
-        return (h(Host, { key: 'dbad8fe9f1566277d14647626308eaf1601ab01f', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
-                'ion-page': component === undefined,
-                'tab-hidden': !active,
-            } }, h("slot", { key: '3be64f4e7161f6769aaf8e4dcb5293fcaa09af45' })));
-    }
-    get el() { return this; }
-    static get watchers() { return {
-        "active": ["changeActive"]
-    }; }
-    static get style() { return tabCss; }
-}, [257, "ion-tab", {
-        "active": [1028],
-        "delegate": [16],
-        "tab": [1],
-        "component": [1],
-        "setActive": [64]
-    }, undefined, {
-        "active": ["changeActive"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ion-tab"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ion-tab":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, Tab);
-            }
-            break;
-    } });
-}
-
-const IonTab = Tab;
-const defineCustomElement = defineCustomElement$1;
-
-export { IonTab, defineCustomElement };
+import{proxyCustomElement as t,HTMLElement as e,Build as a,h as i,Host as n,transformTag as o}from"@stencil/core/internal/client";import{a as s}from"./framework-delegate.js";import{a as c}from"./index4.js";const r=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.loaded=!1,this.active=!1}async componentWillLoad(){a.isDev&&void 0!==this.component&&this.el.childElementCount>0&&c(`[ion-tab] - You can not use a lazy-loaded component in a tab and inlined content at the same time.- Remove the component attribute in: <ion-tab component="${this.component}"> or- Remove the embedded content inside the ion-tab: <ion-tab></ion-tab>`),this.active&&await this.setActive()}async setActive(){await this.prepareLazyLoaded(),this.active=!0}changeActive(t){t&&this.prepareLazyLoaded()}prepareLazyLoaded(){if(!this.loaded&&null!=this.component){this.loaded=!0;try{return s(this.delegate,this.el,this.component,["ion-page"])}catch(t){c("[ion-tab] - Exception in prepareLazyLoaded:",t)}}return Promise.resolve(void 0)}render(){const{tab:t,active:e,component:a}=this;return i(n,{key:"dbad8fe9f1566277d14647626308eaf1601ab01f",role:"tabpanel","aria-hidden":e?null:"true","aria-labelledby":"tab-button-"+t,class:{"ion-page":void 0===a,"tab-hidden":!e}},i("slot",{key:"3be64f4e7161f6769aaf8e4dcb5293fcaa09af45"}))}get el(){return this}static get watchers(){return{active:[{changeActive:0}]}}static get style(){return":host(.tab-hidden){display:none !important}"}},[257,"ion-tab",{active:[1028],delegate:[16],tab:[1],component:[1],setActive:[64]},void 0,{active:[{changeActive:0}]}]),d=r,h=function(){"undefined"!=typeof customElements&&["ion-tab"].forEach((t=>{"ion-tab"===t&&(customElements.get(o(t))||customElements.define(o(t),r))}))};export{d as IonTab,h as defineCustomElement}

package/components/ion-tabs.js

@@ -1,208 +1,4 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { a as printIonError } from './index4.js';
-
-const tabsCss = ":host{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%;contain:layout size style;z-index:0}.tabs-inner{position:relative;-ms-flex:1;flex:1;contain:layout size style}";
-
-const Tabs = /*@__PURE__*/ proxyCustomElement(class Tabs extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.ionNavWillLoad = createEvent(this, "ionNavWillLoad", 7);
-        this.ionTabsWillChange = createEvent(this, "ionTabsWillChange", 3);
-        this.ionTabsDidChange = 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);
-            }
-        };
-    }
-    async componentWillLoad() {
-        if (!this.useRouter) {
-            /**
-             * JavaScript and StencilJS use `ion-router`, while
-             * the other frameworks use `ion-router-outlet`.
-             *
-             * If either component is present then tabs will not use
-             * a basic tab-based navigation. It will use the history
-             * stack or URL updates associated with the router.
-             */
-            this.useRouter =
-                (!!this.el.querySelector('ion-router-outlet') || !!document.querySelector('ion-router')) &&
-                    !this.el.closest('[no-router]');
-        }
-        if (!this.useRouter) {
-            const tabs = this.tabs;
-            if (tabs.length > 0) {
-                await this.select(tabs[0]);
-            }
-        }
-        this.ionNavWillLoad.emit();
-    }
-    componentDidLoad() {
-        this.updateTabBar();
-    }
-    componentDidUpdate() {
-        this.updateTabBar();
-    }
-    updateTabBar() {
-        const tabBar = this.el.querySelector('ion-tab-bar');
-        if (!tabBar) {
-            return;
-        }
-        const tab = this.selectedTab ? this.selectedTab.tab : undefined;
-        // If tabs has no selected tab but tab-bar already has a selected-tab set,
-        // don't overwrite it. This handles cases where tab-bar is used without ion-tab elements.
-        if (tab === undefined) {
-            return;
-        }
-        if (tabBar.selectedTab === tab) {
-            return;
-        }
-        tabBar.selectedTab = tab;
-    }
-    /**
-     * Select a tab by the value of its `tab` property or an element reference. This method is only available for vanilla JavaScript projects. The Angular, React, and Vue implementations of tabs are coupled to each framework's router.
-     *
-     * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.
-     */
-    async select(tab) {
-        const selectedTab = getTab(this.tabs, tab);
-        if (!this.shouldSwitch(selectedTab)) {
-            return false;
-        }
-        await this.setActive(selectedTab);
-        await this.notifyRouter();
-        this.tabSwitch();
-        return true;
-    }
-    /**
-     * Get a specific tab by the value of its `tab` property or an element reference. This method is only available for vanilla JavaScript projects. The Angular, React, and Vue implementations of tabs are coupled to each framework's router.
-     *
-     * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.
-     */
-    async getTab(tab) {
-        return getTab(this.tabs, tab);
-    }
-    /**
-     * Get the currently selected tab. This method is only available for vanilla JavaScript projects. The Angular, React, and Vue implementations of tabs are coupled to each framework's router.
-     */
-    getSelected() {
-        return Promise.resolve(this.selectedTab ? this.selectedTab.tab : undefined);
-    }
-    /** @internal */
-    async setRouteId(id) {
-        const selectedTab = getTab(this.tabs, id);
-        if (!this.shouldSwitch(selectedTab)) {
-            return { changed: false, element: this.selectedTab };
-        }
-        await this.setActive(selectedTab);
-        return {
-            changed: true,
-            element: this.selectedTab,
-            markVisible: () => this.tabSwitch(),
-        };
-    }
-    /** @internal */
-    async getRouteId() {
-        var _a;
-        const tabId = (_a = this.selectedTab) === null || _a === void 0 ? void 0 : _a.tab;
-        return tabId !== undefined ? { id: tabId, element: this.selectedTab } : undefined;
-    }
-    setActive(selectedTab) {
-        if (this.transitioning) {
-            return Promise.reject('transitioning already happening');
-        }
-        this.transitioning = true;
-        this.leavingTab = this.selectedTab;
-        this.selectedTab = selectedTab;
-        this.ionTabsWillChange.emit({ tab: selectedTab.tab });
-        selectedTab.active = true;
-        this.updateTabBar();
-        return Promise.resolve();
-    }
-    tabSwitch() {
-        const selectedTab = this.selectedTab;
-        const leavingTab = this.leavingTab;
-        this.leavingTab = undefined;
-        this.transitioning = false;
-        if (!selectedTab) {
-            return;
-        }
-        if (leavingTab !== selectedTab) {
-            if (leavingTab) {
-                leavingTab.active = false;
-            }
-            this.ionTabsDidChange.emit({ tab: selectedTab.tab });
-        }
-    }
-    notifyRouter() {
-        if (this.useRouter) {
-            const router = document.querySelector('ion-router');
-            if (router) {
-                return router.navChanged('forward');
-            }
-        }
-        return Promise.resolve(false);
-    }
-    shouldSwitch(selectedTab) {
-        const leavingTab = this.selectedTab;
-        return selectedTab !== undefined && selectedTab !== leavingTab && !this.transitioning;
-    }
-    get tabs() {
-        return Array.from(this.el.querySelectorAll('ion-tab'));
-    }
-    render() {
-        return (h(Host, { key: '7b4b302f2942d8d131f6fc24e817989a8be08867', onIonTabButtonClick: this.onTabClicked }, h("slot", { key: '2c51cf14c0f17a8ddf2d879858c984cdf8fd3147', name: "top" }), h("div", { key: '7e9d6055092d41bd9bc80ae15965f77e216feb84', class: "tabs-inner" }, h("slot", { key: 'c308a787e37ff7f6653531d70deca597a7602d26' })), h("slot", { key: 'd5f5e693710c853570811602f859cf3e88272684', name: "bottom" })));
-    }
-    get el() { return this; }
-    static get style() { return tabsCss; }
-}, [257, "ion-tabs", {
-        "useRouter": [1028, "use-router"],
-        "selectedTab": [32],
-        "select": [64],
-        "getTab": [64],
-        "getSelected": [64],
-        "setRouteId": [64],
-        "getRouteId": [64]
-    }]);
-const getTab = (tabs, tab) => {
-    const tabEl = typeof tab === 'string' ? tabs.find((t) => t.tab === tab) : tab;
-    if (!tabEl) {
-        printIonError(`[ion-tabs] - Tab with id: "${tabEl}" does not exist`);
-    }
-    return tabEl;
-};
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ion-tabs"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ion-tabs":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, Tabs);
-            }
-            break;
-    } });
-}
-
-const IonTabs = Tabs;
-const defineCustomElement = defineCustomElement$1;
-
-export { IonTabs, defineCustomElement };
+import{proxyCustomElement as t,HTMLElement as e,createEvent as i,h as s,Host as o,transformTag as n}from"@stencil/core/internal/client";import{a as r}from"./index4.js";const a=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.ionNavWillLoad=i(this,"ionNavWillLoad",7),this.ionTabsWillChange=i(this,"ionTabsWillChange",3),this.ionTabsDidChange=i(this,"ionTabsDidChange",3),this.transitioning=!1,this.useRouter=!1,this.onTabClicked=t=>{const{href:e,tab:i}=t.detail;if(this.useRouter&&void 0!==e){const t=document.querySelector("ion-router");t&&t.push(e)}else this.select(i)}}async componentWillLoad(){if(this.useRouter||(this.useRouter=!(!this.el.querySelector("ion-router-outlet")&&!document.querySelector("ion-router")||this.el.closest("[no-router]"))),!this.useRouter){const t=this.tabs;t.length>0&&await this.select(t[0])}this.ionNavWillLoad.emit()}componentDidLoad(){this.updateTabBar()}componentDidUpdate(){this.updateTabBar()}updateTabBar(){const t=this.el.querySelector("ion-tab-bar");if(!t)return;const e=this.selectedTab?this.selectedTab.tab:void 0;void 0!==e&&t.selectedTab!==e&&(t.selectedTab=e)}async select(t){const e=h(this.tabs,t);return!!this.shouldSwitch(e)&&(await this.setActive(e),await this.notifyRouter(),this.tabSwitch(),!0)}async getTab(t){return h(this.tabs,t)}getSelected(){return Promise.resolve(this.selectedTab?this.selectedTab.tab:void 0)}async setRouteId(t){const e=h(this.tabs,t);return this.shouldSwitch(e)?(await this.setActive(e),{changed:!0,element:this.selectedTab,markVisible:()=>this.tabSwitch()}):{changed:!1,element:this.selectedTab}}async getRouteId(){var t;const e=null===(t=this.selectedTab)||void 0===t?void 0:t.tab;return void 0!==e?{id:e,element:this.selectedTab}:void 0}setActive(t){return this.transitioning?Promise.reject("transitioning already happening"):(this.transitioning=!0,this.leavingTab=this.selectedTab,this.selectedTab=t,this.ionTabsWillChange.emit({tab:t.tab}),t.active=!0,this.updateTabBar(),Promise.resolve())}tabSwitch(){const t=this.selectedTab,e=this.leavingTab;this.leavingTab=void 0,this.transitioning=!1,t&&e!==t&&(e&&(e.active=!1),this.ionTabsDidChange.emit({tab:t.tab}))}notifyRouter(){if(this.useRouter){const t=document.querySelector("ion-router");if(t)return t.navChanged("forward")}return Promise.resolve(!1)}shouldSwitch(t){return void 0!==t&&t!==this.selectedTab&&!this.transitioning}get tabs(){return Array.from(this.el.querySelectorAll("ion-tab"))}render(){return s(o,{key:"7b4b302f2942d8d131f6fc24e817989a8be08867",onIonTabButtonClick:this.onTabClicked},s("slot",{key:"2c51cf14c0f17a8ddf2d879858c984cdf8fd3147",name:"top"}),s("div",{key:"7e9d6055092d41bd9bc80ae15965f77e216feb84",class:"tabs-inner"},s("slot",{key:"c308a787e37ff7f6653531d70deca597a7602d26"})),s("slot",{key:"d5f5e693710c853570811602f859cf3e88272684",name:"bottom"}))}get el(){return this}static get style(){return":host{left:0;right:0;top:0;bottom:0;display:-ms-flexbox;display:flex;position:absolute;-ms-flex-direction:column;flex-direction:column;width:100%;height:100%;contain:layout size style;z-index:0}.tabs-inner{position:relative;-ms-flex:1;flex:1;contain:layout size style}"}},[257,"ion-tabs",{useRouter:[1028,"use-router"],selectedTab:[32],select:[64],getTab:[64],getSelected:[64],setRouteId:[64],getRouteId:[64]}]),h=(t,e)=>{const i="string"==typeof e?t.find((t=>t.tab===e)):e;return i||r(`[ion-tabs] - Tab with id: "${i}" does not exist`),i},c=a,d=function(){"undefined"!=typeof customElements&&["ion-tabs"].forEach((t=>{"ion-tabs"===t&&(customElements.get(n(t))||customElements.define(n(t),a))}))};export{c as IonTabs,d as defineCustomElement}

package/components/ion-text.js

@@ -1,45 +1,4 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { c as createColorClasses } from './theme.js';
-import { b as getIonMode } from './ionic-global.js';
-
-const textCss = ":host(.ion-color){color:var(--ion-color-base)}";
-
-const Text = /*@__PURE__*/ proxyCustomElement(class Text extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-    }
-    render() {
-        const mode = getIonMode(this);
-        return (h(Host, { key: '361035eae7b92dc109794348d39bad2f596eb6be', class: createColorClasses(this.color, {
-                [mode]: true,
-            }) }, h("slot", { key: 'c7b8835cf485ba9ecd73298f0529276ce1ea0852' })));
-    }
-    static get style() { return textCss; }
-}, [257, "ion-text", {
-        "color": [513]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["ion-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "ion-text":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, Text);
-            }
-            break;
-    } });
-}
-
-const IonText = Text;
-const defineCustomElement = defineCustomElement$1;
-
-export { IonText, defineCustomElement };
+import{proxyCustomElement as t,HTMLElement as e,h as o,Host as s,transformTag as c}from"@stencil/core/internal/client";import{c as n}from"./theme.js";import{b as r}from"./ionic-global.js";const i=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}render(){const t=r(this);return o(s,{key:"361035eae7b92dc109794348d39bad2f596eb6be",class:n(this.color,{[t]:!0})},o("slot",{key:"c7b8835cf485ba9ecd73298f0529276ce1ea0852"}))}static get style(){return":host(.ion-color){color:var(--ion-color-base)}"}},[257,"ion-text",{color:[513]}]),l=i,a=function(){"undefined"!=typeof customElements&&["ion-text"].forEach((t=>{"ion-text"===t&&(customElements.get(c(t))||customElements.define(c(t),i))}))};export{l as IonText,a as defineCustomElement}