@ionic/core 8.7.19-dev.11772655618.1af0949f → 8.7.19-dev.11773072221.15efeed0

package/components/p-CslsoGzv.js

@@ -0,0 +1,192 @@
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+import { p as proxyCustomElement, H, h, i as forceUpdate, d as Host } from './p-DWoUQeZ3.js';
+import { s as safeCall } from './p-c-XJ9XhZ.js';
+import { g as getClassMap } from './p-DiVJyqlX.js';
+import { b as getIonMode } from './p-Bxl5etF4.js';
+import { d as defineCustomElement$9 } from './p-DyFBFrV7.js';
+import { d as defineCustomElement$8 } from './p-Wro9IPHE.js';
+import { d as defineCustomElement$7 } from './p-aIWC4ZEV.js';
+import { d as defineCustomElement$6 } from './p-Cdm3dKWf.js';
+import { d as defineCustomElement$5 } from './p-B25GjpND.js';
+import { d as defineCustomElement$4 } from './p-NhiRFRn9.js';
+import { d as defineCustomElement$3 } from './p-Bt_moUyl.js';
+import { d as defineCustomElement$2 } from './p-BANeLH_G.js';
+import { d as defineCustomElement$1 } from './p-LgLeKTkH.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 H {
+    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: '0c9845a40d3fc392b0a7d64e2a6ed27d94bb7634', class: getIonMode(this) }, h("ion-list", { key: '84a30f6661b0f8c00e6fa199658ed2adbcf27358' }, header !== undefined && h("ion-list-header", { key: '13f5f56bbfbc06751fa516291a2da72629b60ece' }, header), hasSubHeaderOrMessage && (h("ion-item", { key: '3d39d18e720e798bbde334e79e6832091c7dfb81' }, h("ion-label", { key: 'd3051b0d140120b44bf5e79572f6f287e7cfb03a', class: "ion-text-wrap" }, subHeader !== undefined && h("h3", { key: 'b16805956f3316f8ec703c123b76f717488e8637' }, subHeader), message !== undefined && h("p", { key: '2215ac4ab4146a14e75a79192e319a8016286b5f' }, 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/p-CtWGkNnJ.js

@@ -1,4 +1,165 @@
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
  */
-import{w as o,d as i}from"./p-ZjP4CjeZ.js";import{K as n,a as l}from"./p-D13Eaw-8.js";const r=o=>{if(void 0===i||o===l.None||void 0===o)return null;const n=i.querySelector("ion-app");return null!=n?n:i.body},e=o=>{const i=r(o);return null===i?0:i.clientHeight},s=async i=>{let l,s,t,a;const d=async()=>{const i=await n.getResizeMode(),r=void 0===i?void 0:i.mode;l=()=>{void 0===a&&(a=e(r)),t=!0,u(t,r)},s=()=>{t=!1,u(t,r)},null==o||o.addEventListener("keyboardWillShow",l),null==o||o.addEventListener("keyboardWillHide",s)},u=(o,n)=>{i&&i(o,c(n))},c=o=>{if(0===a||a===e(o))return;const i=r(o);return null!==i?new Promise((o=>{const n=new ResizeObserver((()=>{i.clientHeight===a&&(n.disconnect(),o())}));n.observe(i)})):void 0};return await d(),{init:d,destroy:()=>{null==o||o.removeEventListener("keyboardWillShow",l),null==o||o.removeEventListener("keyboardWillHide",s),l=s=void 0},isKeyboardVisible:()=>t}};export{s as c}
+import { w as win, d as doc } from './p-ZjP4CjeZ.js';
+import { K as Keyboard, a as KeyboardResize } from './p-D13Eaw-8.js';
+
+/**
+ * The element that resizes when the keyboard opens
+ * is going to depend on the resize mode
+ * which is why we check that here.
+ */
+const getResizeContainer = (resizeMode) => {
+    /**
+     * If doc is undefined then we are
+     * in an SSR environment, so the keyboard
+     * adjustment does not apply.
+     * If the webview does not resize then there
+     * is no container to resize.
+     */
+    if (doc === undefined || resizeMode === KeyboardResize.None || resizeMode === undefined) {
+        return null;
+    }
+    /**
+     * The three remaining resize modes: Native, Ionic, and Body
+     * all cause `ion-app` to resize, so we can listen for changes
+     * on that. In the event `ion-app` is not available then
+     * we can fall back to `body`.
+     */
+    const ionApp = doc.querySelector('ion-app');
+    return ionApp !== null && ionApp !== void 0 ? ionApp : doc.body;
+};
+/**
+ * Get the height of ion-app or body.
+ * This is used for determining if the webview
+ * has resized before the keyboard closed.
+ * */
+const getResizeContainerHeight = (resizeMode) => {
+    const containerElement = getResizeContainer(resizeMode);
+    return containerElement === null ? 0 : containerElement.clientHeight;
+};
+/**
+ * Creates a controller that tracks and reacts to opening or closing the keyboard.
+ *
+ * @internal
+ * @param keyboardChangeCallback A function to call when the keyboard opens or closes.
+ */
+const createKeyboardController = async (keyboardChangeCallback) => {
+    let keyboardWillShowHandler;
+    let keyboardWillHideHandler;
+    let keyboardVisible;
+    /**
+     * This lets us determine if the webview content
+     * has resized as a result of the keyboard.
+     */
+    let initialResizeContainerHeight;
+    const init = async () => {
+        const resizeOptions = await Keyboard.getResizeMode();
+        const resizeMode = resizeOptions === undefined ? undefined : resizeOptions.mode;
+        keyboardWillShowHandler = () => {
+            /**
+             * We need to compute initialResizeContainerHeight right before
+             * the keyboard opens to guarantee the resize container is visible.
+             * The resize container may not be visible if we compute this
+             * as soon as the keyboard controller is created.
+             * We should only need to do this once to avoid additional clientHeight
+             * computations.
+             */
+            if (initialResizeContainerHeight === undefined) {
+                initialResizeContainerHeight = getResizeContainerHeight(resizeMode);
+            }
+            keyboardVisible = true;
+            fireChangeCallback(keyboardVisible, resizeMode);
+        };
+        keyboardWillHideHandler = () => {
+            keyboardVisible = false;
+            fireChangeCallback(keyboardVisible, resizeMode);
+        };
+        win === null || win === void 0 ? void 0 : win.addEventListener('keyboardWillShow', keyboardWillShowHandler);
+        win === null || win === void 0 ? void 0 : win.addEventListener('keyboardWillHide', keyboardWillHideHandler);
+    };
+    const fireChangeCallback = (state, resizeMode) => {
+        if (keyboardChangeCallback) {
+            keyboardChangeCallback(state, createResizePromiseIfNeeded(resizeMode));
+        }
+    };
+    /**
+     * Code responding to keyboard lifecycles may need
+     * to show/hide content once the webview has
+     * resized as a result of the keyboard showing/hiding.
+     * createResizePromiseIfNeeded provides a way for code to wait for the
+     * resize event that was triggered as a result of the keyboard.
+     */
+    const createResizePromiseIfNeeded = (resizeMode) => {
+        if (
+        /**
+         * If we are in an SSR environment then there is
+         * no window to resize. Additionally, if there
+         * is no resize mode or the resize mode is "None"
+         * then initialResizeContainerHeight will be 0
+         */
+        initialResizeContainerHeight === 0 ||
+            /**
+             * If the keyboard is closed before the webview resizes initially
+             * then the webview will never resize.
+             */
+            initialResizeContainerHeight === getResizeContainerHeight(resizeMode)) {
+            return;
+        }
+        /**
+         * Get the resize container so we can
+         * attach the ResizeObserver below to
+         * the correct element.
+         */
+        const containerElement = getResizeContainer(resizeMode);
+        if (containerElement === null) {
+            return;
+        }
+        /**
+         * Some part of the web content should resize,
+         * and we need to listen for a resize.
+         */
+        return new Promise((resolve) => {
+            const callback = () => {
+                /**
+                 * As per the spec, the ResizeObserver
+                 * will fire when observation starts if
+                 * the observed element is rendered and does not
+                 * have a size of 0 x 0. However, the watched element
+                 * may or may not have resized by the time this first
+                 * callback is fired. As a result, we need to check
+                 * the dimensions of the element.
+                 *
+                 * https://www.w3.org/TR/resize-observer/#intro
+                 */
+                if (containerElement.clientHeight === initialResizeContainerHeight) {
+                    /**
+                     * The resize happened, so stop listening
+                     * for resize on this element.
+                     */
+                    ro.disconnect();
+                    resolve();
+                }
+            };
+            /**
+             * In Capacitor there can be delay between when the window
+             * resizes and when the container element resizes, so we cannot
+             * rely on a 'resize' event listener on the window.
+             * Instead, we need to determine when the container
+             * element resizes using a ResizeObserver.
+             */
+            const ro = new ResizeObserver(callback);
+            ro.observe(containerElement);
+        });
+    };
+    const destroy = () => {
+        win === null || win === void 0 ? void 0 : win.removeEventListener('keyboardWillShow', keyboardWillShowHandler);
+        win === null || win === void 0 ? void 0 : win.removeEventListener('keyboardWillHide', keyboardWillHideHandler);
+        keyboardWillShowHandler = keyboardWillHideHandler = undefined;
+    };
+    const isKeyboardVisible = () => keyboardVisible;
+    await init();
+    return { init, destroy, isKeyboardVisible };
+};
+
+export { createKeyboardController as c };

package/components/p-Cyd00tgZ.js

@@ -0,0 +1,167 @@
+/*!
+ * (C) Ionic http://ionicframework.com - MIT License
+ */
+import { d as doc } from './p-ZjP4CjeZ.js';
+import { q as pointerCoord } from './p-D5hF6rwn.js';
+
+const startTapClick = (config) => {
+    if (doc === undefined) {
+        return;
+    }
+    let lastActivated = 0;
+    let activatableEle;
+    let activeRipple;
+    let activeDefer;
+    const useRippleEffect = config.getBoolean('animated', true) && config.getBoolean('rippleEffect', true);
+    const clearDefers = new WeakMap();
+    const cancelActive = () => {
+        if (activeDefer)
+            clearTimeout(activeDefer);
+        activeDefer = undefined;
+        if (activatableEle) {
+            removeActivated(false);
+            activatableEle = undefined;
+        }
+    };
+    const pointerDown = (ev) => {
+        // Ignore right clicks
+        if (activatableEle || ev.button === 2) {
+            return;
+        }
+        setActivatedElement(getActivatableTarget(ev), ev);
+    };
+    const pointerUp = (ev) => {
+        setActivatedElement(undefined, ev);
+    };
+    const setActivatedElement = (el, ev) => {
+        // do nothing
+        if (el && el === activatableEle) {
+            return;
+        }
+        if (activeDefer)
+            clearTimeout(activeDefer);
+        activeDefer = undefined;
+        const { x, y } = pointerCoord(ev);
+        // deactivate selected
+        if (activatableEle) {
+            if (clearDefers.has(activatableEle)) {
+                throw new Error('internal error');
+            }
+            if (!activatableEle.classList.contains(ACTIVATED)) {
+                addActivated(activatableEle, x, y);
+            }
+            removeActivated(true);
+        }
+        // activate
+        if (el) {
+            const deferId = clearDefers.get(el);
+            if (deferId) {
+                clearTimeout(deferId);
+                clearDefers.delete(el);
+            }
+            el.classList.remove(ACTIVATED);
+            const callback = () => {
+                addActivated(el, x, y);
+                activeDefer = undefined;
+            };
+            if (isInstant(el)) {
+                callback();
+            }
+            else {
+                activeDefer = setTimeout(callback, ADD_ACTIVATED_DEFERS);
+            }
+        }
+        activatableEle = el;
+    };
+    const addActivated = (el, x, y) => {
+        lastActivated = Date.now();
+        el.classList.add(ACTIVATED);
+        if (!useRippleEffect)
+            return;
+        const rippleEffect = getRippleEffect(el);
+        if (rippleEffect !== null) {
+            removeRipple();
+            activeRipple = rippleEffect.addRipple(x, y);
+        }
+    };
+    const removeRipple = () => {
+        if (activeRipple !== undefined) {
+            activeRipple.then((remove) => remove());
+            activeRipple = undefined;
+        }
+    };
+    const removeActivated = (smooth) => {
+        removeRipple();
+        const active = activatableEle;
+        if (!active) {
+            return;
+        }
+        const time = CLEAR_STATE_DEFERS - Date.now() + lastActivated;
+        if (smooth && time > 0 && !isInstant(active)) {
+            const deferId = setTimeout(() => {
+                active.classList.remove(ACTIVATED);
+                clearDefers.delete(active);
+            }, CLEAR_STATE_DEFERS);
+            clearDefers.set(active, deferId);
+        }
+        else {
+            active.classList.remove(ACTIVATED);
+        }
+    };
+    doc.addEventListener('ionGestureCaptured', cancelActive);
+    doc.addEventListener('pointerdown', pointerDown, true);
+    doc.addEventListener('pointerup', pointerUp, true);
+    /**
+     * Tap click effects such as the ripple effect should
+     * not happen when scrolling. For example, if a user scrolls
+     * the page but also happens to do a touchstart on a button
+     * as part of the scroll, the ripple effect should not
+     * be dispatched. The ripple effect should only happen
+     * if the button is activated and the page is not scrolling.
+     *
+     * pointercancel is dispatched on a gesture when scrolling
+     * starts, so this lets us avoid having to listen for
+     * ion-content's scroll events.
+     */
+    doc.addEventListener('pointercancel', cancelActive, true);
+};
+// TODO(FW-2832): type
+const getActivatableTarget = (ev) => {
+    if (ev.composedPath !== undefined) {
+        /**
+         * composedPath returns EventTarget[]. However,
+         * objects other than Element can be targets too.
+         * For example, AudioContext can be a target. In this
+         * case, we know that the event is a UIEvent so we
+         * can assume that the path will contain either Element
+         * or ShadowRoot.
+         */
+        const path = ev.composedPath();
+        for (let i = 0; i < path.length - 2; i++) {
+            const el = path[i];
+            if (!(el instanceof ShadowRoot) && el.classList.contains('ion-activatable')) {
+                return el;
+            }
+        }
+    }
+    else {
+        return ev.target.closest('.ion-activatable');
+    }
+};
+const isInstant = (el) => {
+    return el.classList.contains('ion-activatable-instant');
+};
+const getRippleEffect = (el) => {
+    if (el.shadowRoot) {
+        const ripple = el.shadowRoot.querySelector('ion-ripple-effect');
+        if (ripple) {
+            return ripple;
+        }
+    }
+    return el.querySelector('ion-ripple-effect');
+};
+const ACTIVATED = 'ion-activated';
+const ADD_ACTIVATED_DEFERS = 100;
+const CLEAR_STATE_DEFERS = 150;
+
+export { startTapClick };