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

package/components/select-popover.js

@@ -1,4 +1,192 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as o,HTMLElement as e,h as i,forceUpdate as t,Host as r,transformTag as s}from"@stencil/core/internal/client";import{s as n}from"./overlays.js";import{g as a}from"./theme.js";import{b as c}from"./ionic-global.js";import{d as l}from"./checkbox.js";import{d as m}from"./icon.js";import{d}from"./item.js";import{d as p}from"./label.js";import{d as b}from"./list.js";import{d as h}from"./list-header.js";import{d as f}from"./radio.js";import{d as u}from"./radio-group.js";import{d as v}from"./ripple-effect.js";const g=o(class extends e{constructor(o){super(),!1!==o&&this.__registerHost(),this.options=[]}findOptionFromEvent(o){const{options:e}=this;return e.find((e=>e.value===o.target.value))}callOptionHandler(o){const e=this.findOptionFromEvent(o),i=this.getValues(o);(null==e?void 0:e.handler)&&n(e.handler,i)}dismissParentPopover(){const o=this.el.closest("ion-popover");o&&o.dismiss()}setChecked(o){const{multiple:e}=this,i=this.findOptionFromEvent(o);e&&i&&(i.checked=o.detail.checked)}getValues(o){const{multiple:e,options:i}=this;if(e)return i.filter((o=>o.checked)).map((o=>o.value));const t=this.findOptionFromEvent(o);return t?t.value:void 0}renderOptions(o){const{multiple:e}=this;return!0===e?this.renderCheckboxOptions(o):this.renderRadioOptions(o)}renderCheckboxOptions(o){return o.map((o=>i("ion-item",{class:Object.assign({"item-checkbox-checked":o.checked},a(o.cssClass))},i("ion-checkbox",{value:o.value,disabled:o.disabled,checked:o.checked,justify:"start",labelPlacement:"end",onIonChange:o=>{this.setChecked(o),this.callOptionHandler(o),t(this)}},o.text))))}renderRadioOptions(o){const e=o.filter((o=>o.checked)).map((o=>o.value))[0];return i("ion-radio-group",{value:e,onIonChange:o=>this.callOptionHandler(o)},o.map((o=>i("ion-item",{class:Object.assign({"item-radio-checked":o.value===e},a(o.cssClass))},i("ion-radio",{value:o.value,disabled:o.disabled,onClick:()=>this.dismissParentPopover(),onKeyUp:o=>{" "===o.key&&this.dismissParentPopover()}},o.text)))))}render(){const{header:o,message:e,options:t,subHeader:s}=this,n=void 0!==s||void 0!==e;return i(r,{key:"ab931b49b59283825bd2afa3f7f995b0e6e05bef",class:c(this)},i("ion-list",{key:"3bd12b67832607596b912a73d5b3ae9b954b244d"},void 0!==o&&i("ion-list-header",{key:"97da930246edf7423a039c030d40e3ff7a5148a3"},o),n&&i("ion-item",{key:"c579df6ea8fac07bb0c59d34c69b149656863224"},i("ion-label",{key:"af699c5f465710ccb13b8cf8e7be66f0e8acfad1",class:"ion-text-wrap"},void 0!==s&&i("h3",{key:"df9a936d42064b134e843c7229f314a2a3ec7e80"},s),void 0!==e&&i("p",{key:"9c3ddad378df00f106afa94e9928cf68c17124dd"},e))),this.renderOptions(t)))}get el(){return this}static get style(){return{ios:".sc-ion-select-popover-ios-h ion-list.sc-ion-select-popover-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-ios,ion-label.sc-ion-select-popover-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-ios-h{overflow-y:auto}",md:'.sc-ion-select-popover-md-h ion-list.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-md,ion-label.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-md-h{overflow-y:auto}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(container),ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md [part~="container"]{display:none}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(label),ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md [part~="label"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-popover-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-popover-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-popover-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}'}}},[34,"ion-select-popover",{header:[1],subHeader:[1,"sub-header"],message:[1],multiple:[4],options:[16]}]);function k(){"undefined"!=typeof customElements&&["ion-select-popover","ion-checkbox","ion-icon","ion-item","ion-label","ion-list","ion-list-header","ion-radio","ion-radio-group","ion-ripple-effect"].forEach((o=>{switch(o){case"ion-select-popover":customElements.get(s(o))||customElements.define(s(o),g);break;case"ion-checkbox":customElements.get(s(o))||l();break;case"ion-icon":customElements.get(s(o))||m();break;case"ion-item":customElements.get(s(o))||d();break;case"ion-label":customElements.get(s(o))||p();break;case"ion-list":customElements.get(s(o))||b();break;case"ion-list-header":customElements.get(s(o))||h();break;case"ion-radio":customElements.get(s(o))||f();break;case"ion-radio-group":customElements.get(s(o))||u();break;case"ion-ripple-effect":customElements.get(s(o))||v()}}))}export{g as S,k as d}
+import { proxyCustomElement, HTMLElement, h, forceUpdate, Host } from '@stencil/core/internal/client';
+import { s as safeCall } from './overlays.js';
+import { g as getClassMap } from './theme.js';
+import { b as getIonMode } from './ionic-global.js';
+import { d as defineCustomElement$9 } from './checkbox.js';
+import { d as defineCustomElement$8 } from './icon.js';
+import { d as defineCustomElement$7 } from './item.js';
+import { d as defineCustomElement$6 } from './label.js';
+import { d as defineCustomElement$5 } from './list.js';
+import { d as defineCustomElement$4 } from './list-header.js';
+import { d as defineCustomElement$3 } from './radio.js';
+import { d as defineCustomElement$2 } from './radio-group.js';
+import { d as defineCustomElement$1 } from './ripple-effect.js';
+
+const selectPopoverIosCss = ".sc-ion-select-popover-ios-h ion-list.sc-ion-select-popover-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-ios,ion-label.sc-ion-select-popover-ios{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-ios-h{overflow-y:auto}";
+
+const selectPopoverMdCss = ".sc-ion-select-popover-md-h ion-list.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-list-header.sc-ion-select-popover-md,ion-label.sc-ion-select-popover-md{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-select-popover-md-h{overflow-y:auto}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(container),ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md [part~=\"container\"]{display:none}ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md::part(label),ion-list.sc-ion-select-popover-md ion-radio.sc-ion-select-popover-md [part~=\"label\"]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}ion-item.sc-ion-select-popover-md{--inner-border-width:0}.item-radio-checked.sc-ion-select-popover-md{--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.08);--background-focused:var(--ion-color-primary, #0054e9);--background-focused-opacity:0.2;--background-hover:var(--ion-color-primary, #0054e9);--background-hover-opacity:0.12}.item-checkbox-checked.sc-ion-select-popover-md{--background-activated:var(--ion-item-color, var(--ion-text-color, #000));--background-focused:var(--ion-item-color, var(--ion-text-color, #000));--background-hover:var(--ion-item-color, var(--ion-text-color, #000));--color:var(--ion-color-primary, #0054e9)}";
+
+const SelectPopover = /*@__PURE__*/ proxyCustomElement(class SelectPopover extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        /**
+         * An array of options for the popover
+         */
+        this.options = [];
+    }
+    findOptionFromEvent(ev) {
+        const { options } = this;
+        return options.find((o) => o.value === ev.target.value);
+    }
+    /**
+     * When an option is selected we need to get the value(s)
+     * of the selected option(s) and return it in the option
+     * handler
+     */
+    callOptionHandler(ev) {
+        const option = this.findOptionFromEvent(ev);
+        const values = this.getValues(ev);
+        if (option === null || option === void 0 ? void 0 : option.handler) {
+            safeCall(option.handler, values);
+        }
+    }
+    /**
+     * Dismisses the host popover that the `ion-select-popover`
+     * is rendered within.
+     */
+    dismissParentPopover() {
+        const popover = this.el.closest('ion-popover');
+        if (popover) {
+            popover.dismiss();
+        }
+    }
+    setChecked(ev) {
+        const { multiple } = this;
+        const option = this.findOptionFromEvent(ev);
+        // this is a popover with checkboxes (multiple value select)
+        // we need to set the checked value for this option
+        if (multiple && option) {
+            option.checked = ev.detail.checked;
+        }
+    }
+    getValues(ev) {
+        const { multiple, options } = this;
+        if (multiple) {
+            // this is a popover with checkboxes (multiple value select)
+            // return an array of all the checked values
+            return options.filter((o) => o.checked).map((o) => o.value);
+        }
+        // this is a popover with radio buttons (single value select)
+        // return the value that was clicked, otherwise undefined
+        const option = this.findOptionFromEvent(ev);
+        return option ? option.value : undefined;
+    }
+    renderOptions(options) {
+        const { multiple } = this;
+        switch (multiple) {
+            case true:
+                return this.renderCheckboxOptions(options);
+            default:
+                return this.renderRadioOptions(options);
+        }
+    }
+    renderCheckboxOptions(options) {
+        return options.map((option) => (h("ion-item", { class: Object.assign({
+                // TODO FW-4784
+                'item-checkbox-checked': option.checked
+            }, getClassMap(option.cssClass)) }, h("ion-checkbox", { value: option.value, disabled: option.disabled, checked: option.checked, justify: "start", labelPlacement: "end", onIonChange: (ev) => {
+                this.setChecked(ev);
+                this.callOptionHandler(ev);
+                // TODO FW-4784
+                forceUpdate(this);
+            } }, option.text))));
+    }
+    renderRadioOptions(options) {
+        const checked = options.filter((o) => o.checked).map((o) => o.value)[0];
+        return (h("ion-radio-group", { value: checked, onIonChange: (ev) => this.callOptionHandler(ev) }, options.map((option) => (h("ion-item", { class: Object.assign({
+                // TODO FW-4784
+                'item-radio-checked': option.value === checked
+            }, getClassMap(option.cssClass)) }, h("ion-radio", { value: option.value, disabled: option.disabled, onClick: () => this.dismissParentPopover(), onKeyUp: (ev) => {
+                if (ev.key === ' ') {
+                    /**
+                     * Selecting a radio option with keyboard navigation,
+                     * either through the Enter or Space keys, should
+                     * dismiss the popover.
+                     */
+                    this.dismissParentPopover();
+                }
+            } }, option.text))))));
+    }
+    render() {
+        const { header, message, options, subHeader } = this;
+        const hasSubHeaderOrMessage = subHeader !== undefined || message !== undefined;
+        return (h(Host, { key: 'ab931b49b59283825bd2afa3f7f995b0e6e05bef', class: getIonMode(this) }, h("ion-list", { key: '3bd12b67832607596b912a73d5b3ae9b954b244d' }, header !== undefined && h("ion-list-header", { key: '97da930246edf7423a039c030d40e3ff7a5148a3' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: 'c579df6ea8fac07bb0c59d34c69b149656863224' }, h("ion-label", { key: 'af699c5f465710ccb13b8cf8e7be66f0e8acfad1', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'df9a936d42064b134e843c7229f314a2a3ec7e80' }, subHeader), message !== undefined && h("p", { key: '9c3ddad378df00f106afa94e9928cf68c17124dd' }, message)))), this.renderOptions(options))));
+    }
+    get el() { return this; }
+    static get style() { return {
+        ios: selectPopoverIosCss,
+        md: selectPopoverMdCss
+    }; }
+}, [290, "ion-select-popover", {
+        "header": [1],
+        "subHeader": [1, "sub-header"],
+        "message": [1],
+        "multiple": [4],
+        "options": [16]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-select-popover", "ion-checkbox", "ion-icon", "ion-item", "ion-label", "ion-list", "ion-list-header", "ion-radio", "ion-radio-group", "ion-ripple-effect"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-select-popover":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, SelectPopover);
+            }
+            break;
+        case "ion-checkbox":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$9();
+            }
+            break;
+        case "ion-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$8();
+            }
+            break;
+        case "ion-item":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$7();
+            }
+            break;
+        case "ion-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$6();
+            }
+            break;
+        case "ion-list":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$5();
+            }
+            break;
+        case "ion-list-header":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$4();
+            }
+            break;
+        case "ion-radio":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "ion-radio-group":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "ion-ripple-effect":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { SelectPopover as S, defineCustomElement as d };

package/components/spinner.js

@@ -1,4 +1,227 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{proxyCustomElement as e,HTMLElement as r,h as s,Host as n,transformTag as t}from"@stencil/core/internal/client";import{c as i}from"./theme.js";import{c as a}from"./index4.js";import{b as o}from"./ionic-global.js";const l={bubbles:{dur:1e3,circles:9,fn:(e,r,s)=>{const n=e*r/s-e+"ms",t=2*Math.PI*r/s;return{r:5,style:{top:32*Math.sin(t)+"%",left:32*Math.cos(t)+"%","animation-delay":n}}}},circles:{dur:1e3,circles:8,fn:(e,r,s)=>{const n=r/s,t=e*n-e+"ms",i=2*Math.PI*n;return{r:5,style:{top:32*Math.sin(i)+"%",left:32*Math.cos(i)+"%","animation-delay":t}}}},circular:{dur:1400,elmDuration:!0,circles:1,fn:()=>({r:20,cx:48,cy:48,fill:"none",viewBox:"24 24 48 48",transform:"translate(0,0)",style:{}})},crescent:{dur:750,circles:1,fn:()=>({r:26,style:{}})},dots:{dur:750,circles:3,fn:(e,r)=>({r:6,style:{left:32-32*r+"%","animation-delay":-110*r+"ms"}})},lines:{dur:1e3,lines:8,fn:(e,r,s)=>({y1:14,y2:26,style:{transform:`rotate(${360/s*r+(r<s/2?180:-180)}deg)`,"animation-delay":e*r/s-e+"ms"}})},"lines-small":{dur:1e3,lines:8,fn:(e,r,s)=>({y1:12,y2:20,style:{transform:`rotate(${360/s*r+(r<s/2?180:-180)}deg)`,"animation-delay":e*r/s-e+"ms"}})},"lines-sharp":{dur:1e3,lines:12,fn:(e,r,s)=>({y1:17,y2:29,style:{transform:`rotate(${30*r+(r<6?180:-180)}deg)`,"animation-delay":e*r/s-e+"ms"}})},"lines-sharp-small":{dur:1e3,lines:12,fn:(e,r,s)=>({y1:12,y2:20,style:{transform:`rotate(${30*r+(r<6?180:-180)}deg)`,"animation-delay":e*r/s-e+"ms"}})}},c=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.paused=!1}getName(){const e=this.name||a.get("spinner"),r=o(this);return e||("ios"===r?"lines":"circular")}render(){var e;const r=this,t=o(r),c=r.getName(),m=null!==(e=l[c])&&void 0!==e?e:l.lines,d="number"==typeof r.duration&&r.duration>10?r.duration:m.dur,k=[];if(void 0!==m.circles)for(let e=0;e<m.circles;e++)k.push(f(m,d,e,m.circles));else if(void 0!==m.lines)for(let e=0;e<m.lines;e++)k.push(p(m,d,e,m.lines));return s(n,{key:"a33d6421fcc885995fbc7a348516525f68ca496c",class:i(r.color,{[t]:!0,[`spinner-${c}`]:!0,"spinner-paused":r.paused||a.getBoolean("_testing")}),role:"progressbar",style:m.elmDuration?{animationDuration:d+"ms"}:{}},k)}static get style(){return":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}}"}},[1,"ion-spinner",{color:[513],duration:[2],name:[1],paused:[4]}]),f=(e,r,n,t)=>{const i=e.fn(r,n,t);return i.style["animation-duration"]=r+"ms",s("svg",{viewBox:i.viewBox||"0 0 64 64",style:i.style},s("circle",{transform:i.transform||"translate(32,32)",cx:i.cx,cy:i.cy,r:i.r,style:e.elmDuration?{animationDuration:r+"ms"}:{}}))},p=(e,r,n,t)=>{const i=e.fn(r,n,t);return i.style["animation-duration"]=r+"ms",s("svg",{viewBox:i.viewBox||"0 0 64 64",style:i.style},s("line",{transform:"translate(32,32)",y1:i.y1,y2:i.y2}))};function m(){"undefined"!=typeof customElements&&["ion-spinner"].forEach((e=>{"ion-spinner"===e&&(customElements.get(t(e))||customElements.define(t(e),c))}))}export{l as S,c as a,m as d}
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { c as createColorClasses } from './theme.js';
+import { c as config } from './index4.js';
+import { b as getIonMode } from './ionic-global.js';
+
+const spinners = {
+    bubbles: {
+        dur: 1000,
+        circles: 9,
+        fn: (dur, index, total) => {
+            const animationDelay = `${(dur * index) / total - dur}ms`;
+            const angle = (2 * Math.PI * index) / total;
+            return {
+                r: 5,
+                style: {
+                    top: `${32 * Math.sin(angle)}%`,
+                    left: `${32 * Math.cos(angle)}%`,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+    circles: {
+        dur: 1000,
+        circles: 8,
+        fn: (dur, index, total) => {
+            const step = index / total;
+            const animationDelay = `${dur * step - dur}ms`;
+            const angle = 2 * Math.PI * step;
+            return {
+                r: 5,
+                style: {
+                    top: `${32 * Math.sin(angle)}%`,
+                    left: `${32 * Math.cos(angle)}%`,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+    circular: {
+        dur: 1400,
+        elmDuration: true,
+        circles: 1,
+        fn: () => {
+            return {
+                r: 20,
+                cx: 48,
+                cy: 48,
+                fill: 'none',
+                viewBox: '24 24 48 48',
+                transform: 'translate(0,0)',
+                style: {},
+            };
+        },
+    },
+    crescent: {
+        dur: 750,
+        circles: 1,
+        fn: () => {
+            return {
+                r: 26,
+                style: {},
+            };
+        },
+    },
+    dots: {
+        dur: 750,
+        circles: 3,
+        fn: (_, index) => {
+            const animationDelay = -(110 * index) + 'ms';
+            return {
+                r: 6,
+                style: {
+                    left: `${32 - 32 * index}%`,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+    lines: {
+        dur: 1000,
+        lines: 8,
+        fn: (dur, index, total) => {
+            const transform = `rotate(${(360 / total) * index + (index < total / 2 ? 180 : -180)}deg)`;
+            const animationDelay = `${(dur * index) / total - dur}ms`;
+            return {
+                y1: 14,
+                y2: 26,
+                style: {
+                    transform: transform,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+    'lines-small': {
+        dur: 1000,
+        lines: 8,
+        fn: (dur, index, total) => {
+            const transform = `rotate(${(360 / total) * index + (index < total / 2 ? 180 : -180)}deg)`;
+            const animationDelay = `${(dur * index) / total - dur}ms`;
+            return {
+                y1: 12,
+                y2: 20,
+                style: {
+                    transform: transform,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+    'lines-sharp': {
+        dur: 1000,
+        lines: 12,
+        fn: (dur, index, total) => {
+            const transform = `rotate(${30 * index + (index < 6 ? 180 : -180)}deg)`;
+            const animationDelay = `${(dur * index) / total - dur}ms`;
+            return {
+                y1: 17,
+                y2: 29,
+                style: {
+                    transform: transform,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+    'lines-sharp-small': {
+        dur: 1000,
+        lines: 12,
+        fn: (dur, index, total) => {
+            const transform = `rotate(${30 * index + (index < 6 ? 180 : -180)}deg)`;
+            const animationDelay = `${(dur * index) / total - dur}ms`;
+            return {
+                y1: 12,
+                y2: 20,
+                style: {
+                    transform: transform,
+                    'animation-delay': animationDelay,
+                },
+            };
+        },
+    },
+};
+const SPINNERS = spinners;
+
+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}}";
+
+const Spinner = /*@__PURE__*/ proxyCustomElement(class Spinner extends HTMLElement {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        /**
+         * If `true`, the spinner's animation will be paused.
+         */
+        this.paused = false;
+    }
+    getName() {
+        const spinnerName = this.name || config.get('spinner');
+        const mode = getIonMode(this);
+        if (spinnerName) {
+            return spinnerName;
+        }
+        return mode === 'ios' ? 'lines' : 'circular';
+    }
+    render() {
+        var _a;
+        const self = this;
+        const mode = getIonMode(self);
+        const spinnerName = self.getName();
+        const spinner = (_a = SPINNERS[spinnerName]) !== null && _a !== void 0 ? _a : SPINNERS['lines'];
+        const duration = typeof self.duration === 'number' && self.duration > 10 ? self.duration : spinner.dur;
+        const svgs = [];
+        if (spinner.circles !== undefined) {
+            for (let i = 0; i < spinner.circles; i++) {
+                svgs.push(buildCircle(spinner, duration, i, spinner.circles));
+            }
+        }
+        else if (spinner.lines !== undefined) {
+            for (let i = 0; i < spinner.lines; i++) {
+                svgs.push(buildLine(spinner, duration, i, spinner.lines));
+            }
+        }
+        return (h(Host, { key: 'a33d6421fcc885995fbc7a348516525f68ca496c', class: createColorClasses(self.color, {
+                [mode]: true,
+                [`spinner-${spinnerName}`]: true,
+                'spinner-paused': self.paused || config.getBoolean('_testing'),
+            }), role: "progressbar", style: spinner.elmDuration ? { animationDuration: duration + 'ms' } : {} }, svgs));
+    }
+    static get style() { return spinnerCss; }
+}, [257, "ion-spinner", {
+        "color": [513],
+        "duration": [2],
+        "name": [1],
+        "paused": [4]
+    }]);
+const buildCircle = (spinner, duration, index, total) => {
+    const data = spinner.fn(duration, index, total);
+    data.style['animation-duration'] = duration + 'ms';
+    return (h("svg", { viewBox: data.viewBox || '0 0 64 64', style: data.style }, h("circle", { transform: data.transform || 'translate(32,32)', cx: data.cx, cy: data.cy, r: data.r, style: spinner.elmDuration ? { animationDuration: duration + 'ms' } : {} })));
+};
+const buildLine = (spinner, duration, index, total) => {
+    const data = spinner.fn(duration, index, total);
+    data.style['animation-duration'] = duration + 'ms';
+    return (h("svg", { viewBox: data.viewBox || '0 0 64 64', style: data.style }, h("line", { transform: "translate(32,32)", y1: data.y1, y2: data.y2 })));
+};
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["ion-spinner"];
+    components.forEach(tagName => { switch (tagName) {
+        case "ion-spinner":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Spinner);
+            }
+            break;
+    } });
+}
+
+export { SPINNERS as S, Spinner as a, defineCustomElement as d };

package/components/status-tap.js

@@ -1,4 +1,39 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{readTask as o,writeTask as s}from"@stencil/core/internal/client";import{a as t,s as e}from"./index8.js";import{c as n}from"./helpers.js";const r=()=>{const r=window;r.addEventListener("statusTap",(()=>{o((()=>{const o=document.elementFromPoint(r.innerWidth/2,r.innerHeight/2);if(!o)return;const i=t(o);i&&new Promise((o=>n(i,o))).then((()=>{s((async()=>{i.style.setProperty("--overflow","hidden"),await e(i,300),i.style.removeProperty("--overflow")}))}))}))}))};export{r as startStatusTap}
+import { readTask, writeTask } from '@stencil/core/internal/client';
+import { a as findClosestIonContent, s as scrollToTop } from './index8.js';
+import { c as componentOnReady } from './helpers.js';
+
+const startStatusTap = () => {
+    const win = window;
+    win.addEventListener('statusTap', () => {
+        readTask(() => {
+            const width = win.innerWidth;
+            const height = win.innerHeight;
+            const el = document.elementFromPoint(width / 2, height / 2);
+            if (!el) {
+                return;
+            }
+            const contentEl = findClosestIonContent(el);
+            if (contentEl) {
+                new Promise((resolve) => componentOnReady(contentEl, resolve)).then(() => {
+                    writeTask(async () => {
+                        /**
+                         * If scrolling and user taps status bar,
+                         * only calling scrollToTop is not enough
+                         * as engines like WebKit will jump the
+                         * scroll position back down and complete
+                         * any in-progress momentum scrolling.
+                         */
+                        contentEl.style.setProperty('--overflow', 'hidden');
+                        await scrollToTop(contentEl, 300);
+                        contentEl.style.removeProperty('--overflow');
+                    });
+                });
+            }
+        });
+    });
+};
+
+export { startStatusTap };

package/components/swipe-back.js

@@ -1,4 +1,78 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{f as t}from"./helpers.js";import{i as o}from"./dir.js";import{createGesture as r}from"./index3.js";const s=(s,e,n,a,i)=>{const c=s.ownerDocument.defaultView;let m=o(s);const p=t=>m?-t.deltaX:t.deltaX;return r({el:s,gestureName:"goback-swipe",gesturePriority:101,threshold:10,canStart:t=>(m=o(s),(t=>{const{startX:o}=t;return m?o>=c.innerWidth-50:o<=50})(t)&&e()),onStart:n,onMove:t=>{const o=p(t);a(o/c.innerWidth)},onEnd:o=>{const r=p(o),s=c.innerWidth,e=r/s,n=(t=>m?-t.velocityX:t.velocityX)(o),a=n>=0&&(n>.2||r>s/2),f=(a?1-e:e)*s;let h=0;if(f>5){const t=f/Math.abs(n);h=Math.min(t,540)}i(a,e<=0?.01:t(0,e,.9999),h)}})};export{s as createSwipeBackGesture}
+import { f as clamp } from './helpers.js';
+import { i as isRTL } from './dir.js';
+import { createGesture } from './index3.js';
+
+const createSwipeBackGesture = (el, canStartHandler, onStartHandler, onMoveHandler, onEndHandler) => {
+    const win = el.ownerDocument.defaultView;
+    let rtl = isRTL(el);
+    /**
+     * Determine if a gesture is near the edge
+     * of the screen. If true, then the swipe
+     * to go back gesture should proceed.
+     */
+    const isAtEdge = (detail) => {
+        const threshold = 50;
+        const { startX } = detail;
+        if (rtl) {
+            return startX >= win.innerWidth - threshold;
+        }
+        return startX <= threshold;
+    };
+    const getDeltaX = (detail) => {
+        return rtl ? -detail.deltaX : detail.deltaX;
+    };
+    const getVelocityX = (detail) => {
+        return rtl ? -detail.velocityX : detail.velocityX;
+    };
+    const canStart = (detail) => {
+        /**
+         * The user's locale can change mid-session,
+         * so we need to check text direction at
+         * the beginning of every gesture.
+         */
+        rtl = isRTL(el);
+        return isAtEdge(detail) && canStartHandler();
+    };
+    const onMove = (detail) => {
+        // set the transition animation's progress
+        const delta = getDeltaX(detail);
+        const stepValue = delta / win.innerWidth;
+        onMoveHandler(stepValue);
+    };
+    const onEnd = (detail) => {
+        // the swipe back gesture has ended
+        const delta = getDeltaX(detail);
+        const width = win.innerWidth;
+        const stepValue = delta / width;
+        const velocity = getVelocityX(detail);
+        const z = width / 2.0;
+        const shouldComplete = velocity >= 0 && (velocity > 0.2 || delta > z);
+        const missing = shouldComplete ? 1 - stepValue : stepValue;
+        const missingDistance = missing * width;
+        let realDur = 0;
+        if (missingDistance > 5) {
+            const dur = missingDistance / Math.abs(velocity);
+            realDur = Math.min(dur, 540);
+        }
+        onEndHandler(shouldComplete, stepValue <= 0 ? 0.01 : clamp(0, stepValue, 0.9999), realDur);
+    };
+    return createGesture({
+        el,
+        gestureName: 'goback-swipe',
+        /**
+         * Swipe to go back should have priority over other horizontal swipe
+         * gestures. These gestures have a priority of 100 which is why 101 was chosen here.
+         */
+        gesturePriority: 101,
+        threshold: 10,
+        canStart,
+        onStart: onStartHandler,
+        onMove,
+        onEnd,
+    });
+};
+
+export { createSwipeBackGesture };

package/components/theme.js

@@ -1,4 +1,43 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-const n=(n,o)=>null!==o.closest(n),o=(n,o)=>"string"==typeof n&&n.length>0?Object.assign({"ion-color":!0,[`ion-color-${n}`]:!0},o):o,r=n=>{const o={};return(n=>void 0!==n?(Array.isArray(n)?n:n.split(" ")).filter((n=>null!=n)).map((n=>n.trim())).filter((n=>""!==n)):[])(n).forEach((n=>o[n]=!0)),o},t=/^[a-z][a-z0-9+\-.]*:/,l=async(n,o,r,l)=>{if(null!=n&&"#"!==n[0]&&!t.test(n)){const t=document.querySelector("ion-router");if(t)return null!=o&&o.preventDefault(),t.push(n,r,l)}return!1};export{o as c,r as g,n as h,l as o}
+const hostContext = (selector, el) => {
+    return el.closest(selector) !== null;
+};
+/**
+ * Create the mode and color classes for the component based on the classes passed in
+ */
+const createColorClasses = (color, cssClassMap) => {
+    return typeof color === 'string' && color.length > 0
+        ? Object.assign({ 'ion-color': true, [`ion-color-${color}`]: true }, cssClassMap) : cssClassMap;
+};
+const getClassList = (classes) => {
+    if (classes !== undefined) {
+        const array = Array.isArray(classes) ? classes : classes.split(' ');
+        return array
+            .filter((c) => c != null)
+            .map((c) => c.trim())
+            .filter((c) => c !== '');
+    }
+    return [];
+};
+const getClassMap = (classes) => {
+    const map = {};
+    getClassList(classes).forEach((c) => (map[c] = true));
+    return map;
+};
+const SCHEME = /^[a-z][a-z0-9+\-.]*:/;
+const openURL = async (url, ev, direction, animation) => {
+    if (url != null && url[0] !== '#' && !SCHEME.test(url)) {
+        const router = document.querySelector('ion-router');
+        if (router) {
+            if (ev != null) {
+                ev.preventDefault();
+            }
+            return router.push(url, direction, animation);
+        }
+    }
+    return false;
+};
+
+export { createColorClasses as c, getClassMap as g, hostContext as h, openURL as o };