@ionic/core 8.7.17-dev.11771959013.18adabe2 → 8.7.17-dev.11772030258.1ee4f499

package/components/ion-reorder-group.js

@@ -1,4 +1,325 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as t,HTMLElement as s,createEvent as e,h as i,Host as r,transformTag as o}from"@stencil/core/internal/client";import{a as n,g as h}from"./index8.js";import{r as a}from"./helpers.js";import{b as c,a as d,h as l}from"./haptic.js";import{b as m}from"./ionic-global.js";const u=t(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.ionItemReorder=e(this,"ionItemReorder",7),this.ionReorderStart=e(this,"ionReorderStart",7),this.ionReorderMove=e(this,"ionReorderMove",7),this.ionReorderEnd=e(this,"ionReorderEnd",7),this.lastToIndex=-1,this.cachedHeights=[],this.scrollElTop=0,this.scrollElBottom=0,this.scrollElInitial=0,this.containerTop=0,this.containerBottom=0,this.state=0,this.disabled=!0}disabledChanged(){this.gesture&&this.gesture.enable(!this.disabled)}async connectedCallback(){const t=n(this.el);t&&(this.scrollEl=await h(t)),this.gesture=(await import("./index3.js")).createGesture({el:this.el,gestureName:"reorder",gesturePriority:110,threshold:0,direction:"y",passive:!1,canStart:t=>this.canStart(t),onStart:t=>this.onStart(t),onMove:t=>this.onMove(t),onEnd:()=>this.onEnd()}),this.disabledChanged()}disconnectedCallback(){this.onEnd(),this.gesture&&(this.gesture.destroy(),this.gesture=void 0)}complete(t){return Promise.resolve(this.completeReorder(t))}canStart(t){if(this.selectedItemEl||0!==this.state)return!1;const s=t.event.target.closest("ion-reorder");if(!s)return!1;const e=f(s,this.el);return!!e&&(t.data=e,!0)}onStart(t){t.event.preventDefault();const s=this.selectedItemEl=t.data,e=this.cachedHeights;e.length=0;const i=this.el,r=i.__children||i.children;if(!r||0===r.length)return;let o=0;for(let t=0;t<r.length;t++){const s=r[t];o+=s.offsetHeight,e.push(o),s.$ionIndex=t}const n=i.getBoundingClientRect();if(this.containerTop=n.top,this.containerBottom=n.bottom,this.scrollEl){const t=this.scrollEl.getBoundingClientRect();this.scrollElInitial=this.scrollEl.scrollTop,this.scrollElTop=t.top+p,this.scrollElBottom=t.bottom-p}else this.scrollElInitial=0,this.scrollElTop=0,this.scrollElBottom=0;this.lastToIndex=b(s),this.selectedItemHeight=s.offsetHeight,this.state=1,s.classList.add(w),c(),this.ionReorderStart.emit()}onMove(t){const s=this.selectedItemEl;if(!s)return;const e=this.autoscroll(t.currentY),i=this.containerTop-e,r=Math.max(i,Math.min(t.currentY,this.containerBottom-e)),o=e+r-t.startY,n=this.lastToIndex,h=this.itemIndexForTop(r-i);if(h!==this.lastToIndex){const t=b(s);this.lastToIndex=h,d(),this.reorderMove(t,h)}s.style.transform=`translateY(${o}px)`,this.ionReorderMove.emit({from:n,to:h})}onEnd(){const t=this.selectedItemEl;if(this.state=2,!t)return void(this.state=0);const s=this.lastToIndex,e=b(t);s===e?this.completeReorder():this.ionItemReorder.emit({from:e,to:s,complete:this.completeReorder.bind(this)}),l(),this.ionReorderEnd.emit({from:e,to:s,complete:this.completeReorder.bind(this)})}completeReorder(t){const s=this.selectedItemEl;if(s&&2===this.state){const e=this.el.__children||this.el.children,i=e.length,r=this.lastToIndex,o=b(s);a((()=>{r===o||void 0!==t&&!0!==t||this.el.insertBefore(s,o<r?e[r+1]:e[r]);for(let t=0;t<i;t++)e[t].style.transform=""})),Array.isArray(t)&&(t=k(t,o,r)),s.style.transition="",s.classList.remove(w),this.selectedItemEl=void 0,this.state=0}return t}itemIndexForTop(t){const s=this.cachedHeights;for(let e=0;e<s.length;e++)if(s[e]>t)return e;return s.length-1}reorderMove(t,s){const e=this.selectedItemHeight,i=this.el.__children||this.el.children;for(let r=0;r<i.length;r++){let o="";r>t&&r<=s?o=`translateY(${-e}px)`:r<t&&r>=s&&(o=`translateY(${e}px)`),i[r].style.transform=o}}autoscroll(t){if(!this.scrollEl)return 0;let s=0;return t<this.scrollElTop?s=-10:t>this.scrollElBottom&&(s=g),0!==s&&this.scrollEl.scrollBy(0,s),this.scrollEl.scrollTop-this.scrollElInitial}render(){const t=m(this);return i(r,{key:"b9641f3061d67fbfe68317b901ec33267046e073",class:{[t]:!0,"reorder-enabled":!this.disabled,"reorder-list-active":0!==this.state}})}get el(){return this}static get watchers(){return{disabled:[{disabledChanged:0}]}}static get style(){return".reorder-list-active>*{display:block;-webkit-transition:-webkit-transform 300ms;transition:-webkit-transform 300ms;transition:transform 300ms;transition:transform 300ms, -webkit-transform 300ms;will-change:transform}.reorder-enabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.reorder-enabled ion-reorder{display:block;cursor:-webkit-grab;cursor:grab;pointer-events:all;-ms-touch-action:none;touch-action:none}.reorder-selected,.reorder-selected ion-reorder{cursor:-webkit-grabbing;cursor:grabbing}.reorder-selected{position:relative;-webkit-transition:none !important;transition:none !important;-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.4);box-shadow:0 0 10px rgba(0, 0, 0, 0.4);opacity:0.8;z-index:100}.reorder-visible ion-reorder .reorder-icon{-webkit-transform:translate3d(0,  0,  0);transform:translate3d(0,  0,  0)}"}},[0,"ion-reorder-group",{disabled:[4],state:[32],complete:[64]},void 0,{disabled:[{disabledChanged:0}]}]),b=t=>t.$ionIndex,f=(t,s)=>{let e;for(;t;){if(e=t.parentElement,e===s)return t;t=e}},p=60,g=10,w="reorder-selected",k=(t,s,e)=>{const i=t[s];return t.splice(s,1),t.splice(e,0,i),t.slice()},v=u,x=function(){"undefined"!=typeof customElements&&["ion-reorder-group"].forEach((t=>{"ion-reorder-group"===t&&(customElements.get(o(t))||customElements.define(o(t),u))}))};export{v as IonReorderGroup,x as defineCustomElement}
+import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
+import { a as findClosestIonContent, g as getScrollElement } from './index8.js';
+import { r as raf } from './helpers.js';
+import { b as hapticSelectionStart, a as hapticSelectionChanged, h as hapticSelectionEnd } from './haptic.js';
+import { b as getIonMode } from './ionic-global.js';
+
+const reorderGroupCss = ".reorder-list-active>*{display:block;-webkit-transition:-webkit-transform 300ms;transition:-webkit-transform 300ms;transition:transform 300ms;transition:transform 300ms, -webkit-transform 300ms;will-change:transform}.reorder-enabled{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.reorder-enabled ion-reorder{display:block;cursor:-webkit-grab;cursor:grab;pointer-events:all;-ms-touch-action:none;touch-action:none}.reorder-selected,.reorder-selected ion-reorder{cursor:-webkit-grabbing;cursor:grabbing}.reorder-selected{position:relative;-webkit-transition:none !important;transition:none !important;-webkit-box-shadow:0 0 10px rgba(0, 0, 0, 0.4);box-shadow:0 0 10px rgba(0, 0, 0, 0.4);opacity:0.8;z-index:100}.reorder-visible ion-reorder .reorder-icon{-webkit-transform:translate3d(0,  0,  0);transform:translate3d(0,  0,  0)}";
+
+const ReorderGroup = /*@__PURE__*/ proxyCustomElement(class ReorderGroup extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.ionItemReorder = createEvent(this, "ionItemReorder", 7);
+        this.ionReorderStart = createEvent(this, "ionReorderStart", 7);
+        this.ionReorderMove = createEvent(this, "ionReorderMove", 7);
+        this.ionReorderEnd = createEvent(this, "ionReorderEnd", 7);
+        this.lastToIndex = -1;
+        this.cachedHeights = [];
+        this.scrollElTop = 0;
+        this.scrollElBottom = 0;
+        this.scrollElInitial = 0;
+        this.containerTop = 0;
+        this.containerBottom = 0;
+        this.state = 0 /* ReorderGroupState.Idle */;
+        /**
+         * If `true`, the reorder will be hidden.
+         */
+        this.disabled = true;
+    }
+    disabledChanged() {
+        if (this.gesture) {
+            this.gesture.enable(!this.disabled);
+        }
+    }
+    async connectedCallback() {
+        const contentEl = findClosestIonContent(this.el);
+        if (contentEl) {
+            this.scrollEl = await getScrollElement(contentEl);
+        }
+        this.gesture = (await import('./index3.js')).createGesture({
+            el: this.el,
+            gestureName: 'reorder',
+            gesturePriority: 110,
+            threshold: 0,
+            direction: 'y',
+            passive: false,
+            canStart: (detail) => this.canStart(detail),
+            onStart: (ev) => this.onStart(ev),
+            onMove: (ev) => this.onMove(ev),
+            onEnd: () => this.onEnd(),
+        });
+        this.disabledChanged();
+    }
+    disconnectedCallback() {
+        this.onEnd();
+        if (this.gesture) {
+            this.gesture.destroy();
+            this.gesture = undefined;
+        }
+    }
+    /**
+     * Completes the reorder operation. Must be called by the `ionReorderEnd` event.
+     *
+     * If a list of items is passed, the list will be reordered and returned in the
+     * proper order.
+     *
+     * If no parameters are passed or if `true` is passed in, the reorder will complete
+     * and the item will remain in the position it was dragged to. If `false` is passed,
+     * the reorder will complete and the item will bounce back to its original position.
+     *
+     * @param listOrReorder A list of items to be sorted and returned in the new order or a
+     * boolean of whether or not the reorder should reposition the item.
+     */
+    complete(listOrReorder) {
+        return Promise.resolve(this.completeReorder(listOrReorder));
+    }
+    canStart(ev) {
+        if (this.selectedItemEl || this.state !== 0 /* ReorderGroupState.Idle */) {
+            return false;
+        }
+        const target = ev.event.target;
+        const reorderEl = target.closest('ion-reorder');
+        if (!reorderEl) {
+            return false;
+        }
+        const item = findReorderItem(reorderEl, this.el);
+        if (!item) {
+            return false;
+        }
+        ev.data = item;
+        return true;
+    }
+    onStart(ev) {
+        ev.event.preventDefault();
+        const item = (this.selectedItemEl = ev.data);
+        const heights = this.cachedHeights;
+        heights.length = 0;
+        const el = this.el;
+        const children = el.__children || el.children;
+        if (!children || children.length === 0) {
+            return;
+        }
+        let sum = 0;
+        for (let i = 0; i < children.length; i++) {
+            const child = children[i];
+            sum += child.offsetHeight;
+            heights.push(sum);
+            child.$ionIndex = i;
+        }
+        const box = el.getBoundingClientRect();
+        this.containerTop = box.top;
+        this.containerBottom = box.bottom;
+        if (this.scrollEl) {
+            const scrollBox = this.scrollEl.getBoundingClientRect();
+            this.scrollElInitial = this.scrollEl.scrollTop;
+            this.scrollElTop = scrollBox.top + AUTO_SCROLL_MARGIN;
+            this.scrollElBottom = scrollBox.bottom - AUTO_SCROLL_MARGIN;
+        }
+        else {
+            this.scrollElInitial = 0;
+            this.scrollElTop = 0;
+            this.scrollElBottom = 0;
+        }
+        this.lastToIndex = indexForItem(item);
+        this.selectedItemHeight = item.offsetHeight;
+        this.state = 1 /* ReorderGroupState.Active */;
+        item.classList.add(ITEM_REORDER_SELECTED);
+        hapticSelectionStart();
+        this.ionReorderStart.emit();
+    }
+    onMove(ev) {
+        const selectedItem = this.selectedItemEl;
+        if (!selectedItem) {
+            return;
+        }
+        // Scroll if we reach the scroll margins
+        const scroll = this.autoscroll(ev.currentY);
+        // // Get coordinate
+        const top = this.containerTop - scroll;
+        const bottom = this.containerBottom - scroll;
+        const currentY = Math.max(top, Math.min(ev.currentY, bottom));
+        const deltaY = scroll + currentY - ev.startY;
+        const normalizedY = currentY - top;
+        const fromIndex = this.lastToIndex;
+        const toIndex = this.itemIndexForTop(normalizedY);
+        if (toIndex !== this.lastToIndex) {
+            const fromIndex = indexForItem(selectedItem);
+            this.lastToIndex = toIndex;
+            hapticSelectionChanged();
+            this.reorderMove(fromIndex, toIndex);
+        }
+        // Update selected item position
+        selectedItem.style.transform = `translateY(${deltaY}px)`;
+        this.ionReorderMove.emit({
+            from: fromIndex,
+            to: toIndex,
+        });
+    }
+    onEnd() {
+        const selectedItemEl = this.selectedItemEl;
+        this.state = 2 /* ReorderGroupState.Complete */;
+        if (!selectedItemEl) {
+            this.state = 0 /* ReorderGroupState.Idle */;
+            return;
+        }
+        const toIndex = this.lastToIndex;
+        const fromIndex = indexForItem(selectedItemEl);
+        if (toIndex === fromIndex) {
+            this.completeReorder();
+        }
+        else {
+            // TODO(FW-6590): Remove this once the deprecated event is removed
+            this.ionItemReorder.emit({
+                from: fromIndex,
+                to: toIndex,
+                complete: this.completeReorder.bind(this),
+            });
+        }
+        hapticSelectionEnd();
+        this.ionReorderEnd.emit({
+            from: fromIndex,
+            to: toIndex,
+            complete: this.completeReorder.bind(this),
+        });
+    }
+    completeReorder(listOrReorder) {
+        const selectedItemEl = this.selectedItemEl;
+        if (selectedItemEl && this.state === 2 /* ReorderGroupState.Complete */) {
+            const children = this.el.__children || this.el.children;
+            const len = children.length;
+            const toIndex = this.lastToIndex;
+            const fromIndex = indexForItem(selectedItemEl);
+            /**
+             * insertBefore and setting the transform
+             * needs to happen in the same frame otherwise
+             * there will be a duplicate transition. This primarily
+             * impacts Firefox where insertBefore and transform operations
+             * are happening in two separate frames.
+             */
+            raf(() => {
+                if (toIndex !== fromIndex && (listOrReorder === undefined || listOrReorder === true)) {
+                    const ref = fromIndex < toIndex ? children[toIndex + 1] : children[toIndex];
+                    this.el.insertBefore(selectedItemEl, ref);
+                }
+                for (let i = 0; i < len; i++) {
+                    children[i].style['transform'] = '';
+                }
+            });
+            if (Array.isArray(listOrReorder)) {
+                listOrReorder = reorderArray(listOrReorder, fromIndex, toIndex);
+            }
+            selectedItemEl.style.transition = '';
+            selectedItemEl.classList.remove(ITEM_REORDER_SELECTED);
+            this.selectedItemEl = undefined;
+            this.state = 0 /* ReorderGroupState.Idle */;
+        }
+        return listOrReorder;
+    }
+    itemIndexForTop(deltaY) {
+        const heights = this.cachedHeights;
+        for (let i = 0; i < heights.length; i++) {
+            if (heights[i] > deltaY) {
+                return i;
+            }
+        }
+        return heights.length - 1;
+    }
+    /********* DOM WRITE ********* */
+    reorderMove(fromIndex, toIndex) {
+        const itemHeight = this.selectedItemHeight;
+        const children = this.el.__children || this.el.children;
+        for (let i = 0; i < children.length; i++) {
+            const style = children[i].style;
+            let value = '';
+            if (i > fromIndex && i <= toIndex) {
+                value = `translateY(${-itemHeight}px)`;
+            }
+            else if (i < fromIndex && i >= toIndex) {
+                value = `translateY(${itemHeight}px)`;
+            }
+            style['transform'] = value;
+        }
+    }
+    autoscroll(posY) {
+        if (!this.scrollEl) {
+            return 0;
+        }
+        let amount = 0;
+        if (posY < this.scrollElTop) {
+            amount = -10;
+        }
+        else if (posY > this.scrollElBottom) {
+            amount = SCROLL_JUMP;
+        }
+        if (amount !== 0) {
+            this.scrollEl.scrollBy(0, amount);
+        }
+        return this.scrollEl.scrollTop - this.scrollElInitial;
+    }
+    render() {
+        const mode = getIonMode(this);
+        return (h(Host, { key: 'b9641f3061d67fbfe68317b901ec33267046e073', class: {
+                [mode]: true,
+                'reorder-enabled': !this.disabled,
+                'reorder-list-active': this.state !== 0 /* ReorderGroupState.Idle */,
+            } }));
+    }
+    get el() { return this; }
+    static get watchers() { return {
+        "disabled": ["disabledChanged"]
+    }; }
+    static get style() { return reorderGroupCss; }
+}, [256, "ion-reorder-group", {
+        "disabled": [4],
+        "state": [32],
+        "complete": [64]
+    }, undefined, {
+        "disabled": ["disabledChanged"]
+    }]);
+const indexForItem = (element) => {
+    return element['$ionIndex'];
+};
+const findReorderItem = (node, container) => {
+    let parent;
+    while (node) {
+        parent = node.parentElement;
+        if (parent === container) {
+            return node;
+        }
+        node = parent;
+    }
+    return undefined;
+};
+const AUTO_SCROLL_MARGIN = 60;
+const SCROLL_JUMP = 10;
+const ITEM_REORDER_SELECTED = 'reorder-selected';
+const reorderArray = (array, from, to) => {
+    const element = array[from];
+    array.splice(from, 1);
+    array.splice(to, 0, element);
+    return array.slice();
+};
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-reorder-group"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-reorder-group":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, ReorderGroup);
+            }
+            break;
+    } });
+}
+
+const IonReorderGroup = ReorderGroup;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonReorderGroup, defineCustomElement };

package/components/ion-reorder.js

@@ -1,4 +1,63 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as o,HTMLElement as e,h as i,Host as n,transformTag as t}from"@stencil/core/internal/client";import{r,s}from"./index6.js";import{b as c}from"./ionic-global.js";import{d}from"./icon.js";const l=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.__attachShadow()}onClick(o){const e=this.el.closest("ion-reorder-group");o.preventDefault(),e&&e.disabled||o.stopImmediatePropagation()}render(){const o=c(this);return i(n,{key:"e6807bb349725682e99e791ac65e729a360d64e8",class:o},i("slot",{key:"1c691cdbffa6427ba08dc12184c69559ed5d5506"},i("ion-icon",{key:"8b4150302cdca475379582b2251737b5e74079b1",icon:"ios"===o?r:s,lazy:!1,class:"reorder-icon",part:"icon","aria-hidden":"true"})))}get el(){return this}static get style(){return{ios:":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:2.125rem;opacity:0.4}",md:":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:1.9375rem;opacity:0.3}"}}},[289,"ion-reorder",void 0,[[2,"click","onClick"]]]),a=l,m=function(){"undefined"!=typeof customElements&&["ion-reorder","ion-icon"].forEach((o=>{switch(o){case"ion-reorder":customElements.get(t(o))||customElements.define(t(o),l);break;case"ion-icon":customElements.get(t(o))||d()}}))};export{a as IonReorder,m as defineCustomElement}
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { r as reorderThreeOutline, s as reorderTwoSharp } from './index6.js';
+import { b as getIonMode } from './ionic-global.js';
+import { d as defineCustomElement$2 } from './icon.js';
+
+const reorderIosCss = ":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:2.125rem;opacity:0.4}";
+
+const reorderMdCss = ":host([slot]){display:none;line-height:0;z-index:100}.reorder-icon{display:block}::slotted(ion-icon){font-size:dynamic-font(16px)}.reorder-icon{font-size:1.9375rem;opacity:0.3}";
+
+const Reorder = /*@__PURE__*/ proxyCustomElement(class Reorder extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+    }
+    onClick(ev) {
+        const reorderGroup = this.el.closest('ion-reorder-group');
+        ev.preventDefault();
+        // Only stop event propagation if the reorder is inside of an enabled
+        // reorder group. This allows interaction with clickable children components.
+        if (!reorderGroup || !reorderGroup.disabled) {
+            ev.stopImmediatePropagation();
+        }
+    }
+    render() {
+        const mode = getIonMode(this);
+        const reorderIcon = mode === 'ios' ? reorderThreeOutline : reorderTwoSharp;
+        return (h(Host, { key: 'e6807bb349725682e99e791ac65e729a360d64e8', class: mode }, h("slot", { key: '1c691cdbffa6427ba08dc12184c69559ed5d5506' }, h("ion-icon", { key: '8b4150302cdca475379582b2251737b5e74079b1', icon: reorderIcon, lazy: false, class: "reorder-icon", part: "icon", "aria-hidden": "true" }))));
+    }
+    get el() { return this; }
+    static get style() { return {
+        ios: reorderIosCss,
+        md: reorderMdCss
+    }; }
+}, [289, "ion-reorder", undefined, [[2, "click", "onClick"]]]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-reorder", "ion-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-reorder":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Reorder);
+            }
+            break;
+        case "ion-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const IonReorder = Reorder;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonReorder, defineCustomElement };

package/components/ion-ripple-effect.js

@@ -1,4 +1,9 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{R as e,d as o}from"./ripple-effect.js";const p=e,r=o;export{p as IonRippleEffect,r as defineCustomElement}
+import { R as RippleEffect, d as defineCustomElement$1 } from './ripple-effect.js';
+
+const IonRippleEffect = RippleEffect;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonRippleEffect, defineCustomElement };

package/components/ion-route-redirect.js

@@ -1,4 +1,48 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as e,HTMLElement as t,createEvent as o,transformTag as r}from"@stencil/core/internal/client";const n=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.ionRouteRedirectChanged=o(this,"ionRouteRedirectChanged",7)}propDidChange(){this.ionRouteRedirectChanged.emit()}connectedCallback(){this.ionRouteRedirectChanged.emit()}static get watchers(){return{from:[{propDidChange:0}],to:[{propDidChange:0}]}}},[0,"ion-route-redirect",{from:[1],to:[1]},void 0,{from:[{propDidChange:0}],to:[{propDidChange:0}]}]),i=n,c=function(){"undefined"!=typeof customElements&&["ion-route-redirect"].forEach((e=>{"ion-route-redirect"===e&&(customElements.get(r(e))||customElements.define(r(e),n))}))};export{i as IonRouteRedirect,c as defineCustomElement}
+import { proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
+
+const RouteRedirect = /*@__PURE__*/ proxyCustomElement(class RouteRedirect extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.ionRouteRedirectChanged = createEvent(this, "ionRouteRedirectChanged", 7);
+    }
+    propDidChange() {
+        this.ionRouteRedirectChanged.emit();
+    }
+    connectedCallback() {
+        this.ionRouteRedirectChanged.emit();
+    }
+    static get watchers() { return {
+        "from": ["propDidChange"],
+        "to": ["propDidChange"]
+    }; }
+}, [0, "ion-route-redirect", {
+        "from": [1],
+        "to": [1]
+    }, undefined, {
+        "from": ["propDidChange"],
+        "to": ["propDidChange"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-route-redirect"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-route-redirect":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, RouteRedirect);
+            }
+            break;
+    } });
+}
+
+const IonRouteRedirect = RouteRedirect;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonRouteRedirect, defineCustomElement };

package/components/ion-route.js

@@ -1,4 +1,77 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as o,HTMLElement as t,createEvent as e,transformTag as n}from"@stencil/core/internal/client";const s=o(class extends t{constructor(o){super(),!1!==o&&this.__registerHost(),this.ionRouteDataChanged=e(this,"ionRouteDataChanged",7),this.url=""}onUpdate(o){this.ionRouteDataChanged.emit(o)}onComponentProps(o,t){if(o===t)return;const e=o?Object.keys(o):[];if(e.length===(t?Object.keys(t):[]).length){for(const n of e)if(o[n]!==t[n])return void this.onUpdate(o)}else this.onUpdate(o)}connectedCallback(){this.ionRouteDataChanged.emit()}static get watchers(){return{url:[{onUpdate:0}],component:[{onUpdate:0}],componentProps:[{onComponentProps:0}]}}},[0,"ion-route",{url:[1],component:[1],componentProps:[16],beforeLeave:[16],beforeEnter:[16]},void 0,{url:[{onUpdate:0}],component:[{onUpdate:0}],componentProps:[{onComponentProps:0}]}]),r=s,c=function(){"undefined"!=typeof customElements&&["ion-route"].forEach((o=>{"ion-route"===o&&(customElements.get(n(o))||customElements.define(n(o),s))}))};export{r as IonRoute,c as defineCustomElement}
+import { proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
+
+const Route = /*@__PURE__*/ proxyCustomElement(class Route extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.ionRouteDataChanged = createEvent(this, "ionRouteDataChanged", 7);
+        /**
+         * Relative path that needs to match in order for this route to apply.
+         *
+         * Accepts paths similar to expressjs so that you can define parameters
+         * in the url /foo/:bar where bar would be available in incoming props.
+         */
+        this.url = '';
+    }
+    onUpdate(newValue) {
+        this.ionRouteDataChanged.emit(newValue);
+    }
+    onComponentProps(newValue, oldValue) {
+        if (newValue === oldValue) {
+            return;
+        }
+        const keys1 = newValue ? Object.keys(newValue) : [];
+        const keys2 = oldValue ? Object.keys(oldValue) : [];
+        if (keys1.length !== keys2.length) {
+            this.onUpdate(newValue);
+            return;
+        }
+        for (const key of keys1) {
+            if (newValue[key] !== oldValue[key]) {
+                this.onUpdate(newValue);
+                return;
+            }
+        }
+    }
+    connectedCallback() {
+        this.ionRouteDataChanged.emit();
+    }
+    static get watchers() { return {
+        "url": ["onUpdate"],
+        "component": ["onUpdate"],
+        "componentProps": ["onComponentProps"]
+    }; }
+}, [0, "ion-route", {
+        "url": [1],
+        "component": [1],
+        "componentProps": [16],
+        "beforeLeave": [16],
+        "beforeEnter": [16]
+    }, undefined, {
+        "url": ["onUpdate"],
+        "component": ["onUpdate"],
+        "componentProps": ["onComponentProps"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-route"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-route":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Route);
+            }
+            break;
+    } });
+}
+
+const IonRoute = Route;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonRoute, defineCustomElement };

package/components/ion-router-link.js

@@ -1,4 +1,64 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as t,HTMLElement as e,h as r,Host as i,transformTag as o}from"@stencil/core/internal/client";import{o as n,c}from"./theme.js";import{b as s}from"./ionic-global.js";const a=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.routerDirection="forward",this.onClick=t=>{n(this.href,t,this.routerDirection,this.routerAnimation)}}render(){const t=s(this),e={href:this.href,rel:this.rel,target:this.target};return r(i,{key:"d7f2affcde45c5fbb6cb46cd1c30008ee92a68c5",onClick:this.onClick,class:c(this.color,{[t]:!0,"ion-activatable":!0})},r("a",Object.assign({key:"babafae85ca5c6429958d383feff0493ff8cf33e"},e),r("slot",{key:"50314e9555bbf6dffa0c50c3f763009dee59b10b"})))}static get style(){return":host{--background:transparent;--color:var(--ion-color-primary, #0054e9);background:var(--background);color:var(--color)}:host(.ion-color){color:var(--ion-color-base)}a{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit}"}},[257,"ion-router-link",{color:[513],href:[1],rel:[1],routerDirection:[1,"router-direction"],routerAnimation:[16],target:[1]}]),l=a,h=function(){"undefined"!=typeof customElements&&["ion-router-link"].forEach((t=>{"ion-router-link"===t&&(customElements.get(o(t))||customElements.define(o(t),a))}))};export{l as IonRouterLink,h as defineCustomElement}
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { o as openURL, c as createColorClasses } from './theme.js';
+import { b as getIonMode } from './ionic-global.js';
+
+const routerLinkCss = ":host{--background:transparent;--color:var(--ion-color-primary, #0054e9);background:var(--background);color:var(--color)}:host(.ion-color){color:var(--ion-color-base)}a{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit}";
+
+const RouterLink = /*@__PURE__*/ proxyCustomElement(class RouterLink extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        /**
+         * When using a router, it specifies the transition direction when navigating to
+         * another page using `href`.
+         */
+        this.routerDirection = 'forward';
+        this.onClick = (ev) => {
+            openURL(this.href, ev, this.routerDirection, this.routerAnimation);
+        };
+    }
+    render() {
+        const mode = getIonMode(this);
+        const attrs = {
+            href: this.href,
+            rel: this.rel,
+            target: this.target,
+        };
+        return (h(Host, { key: 'd7f2affcde45c5fbb6cb46cd1c30008ee92a68c5', onClick: this.onClick, class: createColorClasses(this.color, {
+                [mode]: true,
+                'ion-activatable': true,
+            }) }, h("a", Object.assign({ key: 'babafae85ca5c6429958d383feff0493ff8cf33e' }, attrs), h("slot", { key: '50314e9555bbf6dffa0c50c3f763009dee59b10b' }))));
+    }
+    static get style() { return routerLinkCss; }
+}, [257, "ion-router-link", {
+        "color": [513],
+        "href": [1],
+        "rel": [1],
+        "routerDirection": [1, "router-direction"],
+        "routerAnimation": [16],
+        "target": [1]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-router-link"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-router-link":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, RouterLink);
+            }
+            break;
+    } });
+}
+
+const IonRouterLink = RouterLink;
+const defineCustomElement = defineCustomElement$1;
+
+export { IonRouterLink, defineCustomElement };