@amwaljs/checkout-button 0.3.1 → 0.3.2

package/dist/components/p-2fc99fef.js

@@ -0,0 +1,262 @@
+import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-ec0e3f3f.js';
+import { h as hasShadowDom, i as inheritAriaAttributes } from './p-2bb89b46.js';
+import { p as printIonWarning } from './p-e187a77c.js';
+import { o as openURL, c as createColorClasses, h as hostContext } from './p-350e7423.js';
+import { g as getIonMode } from './p-901c16c5.js';
+import { d as defineCustomElement$1 } from './p-51c44f42.js';
+
+const buttonIosCss = ":host{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;white-space:nowrap;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;font-kerning:none}:host(.button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.button-solid){--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff)}:host(.button-outline){--border-color:var(--ion-color-primary, #3880ff);--background:transparent;--color:var(--ion-color-primary, #3880ff)}:host(.button-clear){--border-width:0;--background:transparent;--color:var(--ion-color-primary, #3880ff)}:host(.button-block){display:block}:host(.button-block) .button-native{margin-left:0;margin-right:0;width:100%;clear:both;contain:content}:host(.button-block) .button-native::after{clear:both}:host(.button-full){display:block}:host(.button-full) .button-native{margin-left:0;margin-right:0;width:100%;contain:content}:host(.button-full:not(.button-round)) .button-native{border-radius:0;border-right-width:0;border-left-width:0}.button-native{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);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;display:flex;position:relative;align-items:center;width:100%;height:100%;min-height:inherit;transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;box-sizing:border-box;appearance:none}.button-native::-moz-focus-inner{border:0}.button-inner{display:flex;position:relative;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%;z-index:1}::slotted([slot=start]),::slotted([slot=end]){flex-shrink:0}::slotted(ion-icon){font-size:1.35em;pointer-events:none}::slotted(ion-icon[slot=start]){-webkit-margin-start:-0.3em;margin-inline-start:-0.3em;-webkit-margin-end:0.3em;margin-inline-end:0.3em;margin-top:0;margin-bottom:0}::slotted(ion-icon[slot=end]){-webkit-margin-start:0.3em;margin-inline-start:0.3em;-webkit-margin-end:-0.2em;margin-inline-end:-0.2em;margin-top:0;margin-bottom:0}::slotted(ion-icon[slot=icon-only]){font-size:1.8em}ion-ripple-effect{color:var(--ripple-color)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(:hover){color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-activated){color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.button-solid.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.button-outline.ion-color) .button-native{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}:host(.button-clear.ion-color) .button-native{background:transparent;color:var(--ion-color-base)}:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{color:var(--ion-toolbar-color, var(--color))}:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}:host{--border-radius:14px;--padding-top:13px;--padding-bottom:13px;--padding-start:1em;--padding-end:1em;--transition:background-color, opacity 100ms linear;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;margin-top:4px;margin-bottom:4px;min-height:3.1em;font-size:min(1rem, 48px);font-weight:500;letter-spacing:0}:host(.button-solid){--background-activated:var(--ion-color-primary-shade, #3171e0);--background-focused:var(--ion-color-primary-shade, #3171e0);--background-hover:var(--ion-color-primary-tint, #4c8dff);--background-activated-opacity:1;--background-focused-opacity:1;--background-hover-opacity:1}:host(.button-outline){--border-radius:14px;--border-width:1px;--border-style:solid;--background-activated:var(--ion-color-primary, #3880ff);--background-focused:var(--ion-color-primary, #3880ff);--background-hover:transparent;--background-focused-opacity:.1;--color-activated:var(--ion-color-primary-contrast, #fff)}:host(.button-clear){--background-activated:transparent;--background-activated-opacity:0;--background-focused:var(--ion-color-primary, #3880ff);--background-hover:transparent;--background-focused-opacity:.1;font-size:min(1.0625rem, 51px);font-weight:normal}:host(.in-buttons){font-size:clamp(17px, 1.0625rem, 21.08px);font-weight:400}:host(.button-large){--border-radius:16px;--padding-top:17px;--padding-start:1em;--padding-end:1em;--padding-bottom:17px;min-height:3.1em;font-size:min(1.25rem, 60px)}:host(.button-small){--border-radius:6px;--padding-top:4px;--padding-start:0.9em;--padding-end:0.9em;--padding-bottom:4px;min-height:2.1em;font-size:min(0.8125rem, 39px)}:host(.button-has-icon-only){--padding-top:0;--padding-bottom:0}:host(.button-round){--border-radius:64px;--padding-top:0;--padding-start:26px;--padding-end:26px;--padding-bottom:0}:host(.button-strong){font-weight:600}:host(.button-outline.ion-focused.ion-color) .button-native,:host(.button-clear.ion-focused.ion-color) .button-native{color:var(--ion-color-base)}:host(.button-outline.ion-focused.ion-color) .button-native::after,:host(.button-clear.ion-focused.ion-color) .button-native::after{background:var(--ion-color-base)}:host(.button-solid.ion-color.ion-focused) .button-native::after{background:var(--ion-color-shade)}@media (any-hover: hover){:host(.button-clear:not(.ion-activated):hover),:host(.button-outline:not(.ion-activated):hover){opacity:0.6}:host(.button-clear.ion-color:hover) .button-native,:host(.button-outline.ion-color:hover) .button-native{color:var(--ion-color-base)}:host(.button-clear.ion-color:hover) .button-native::after,:host(.button-outline.ion-color:hover) .button-native::after{background:transparent}:host(.button-solid.ion-color:hover) .button-native::after{background:var(--ion-color-tint)}:host(:hover.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color):not(.ion-activated)) .button-native::after{background:#fff;opacity:0.1}}:host(.button-clear.ion-activated){opacity:0.4}:host(.button-outline.ion-activated.ion-color) .button-native{color:var(--ion-color-contrast)}:host(.button-outline.ion-activated.ion-color) .button-native::after{background:var(--ion-color-base)}:host(.button-solid.ion-color.ion-activated) .button-native::after{background:var(--ion-color-shade)}:host(.button-outline.ion-activated.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--color));color:var(--ion-toolbar-background, var(--background), var(--ion-color-primary-contrast, #fff))}";
+
+const buttonMdCss = ":host{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;white-space:nowrap;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;font-kerning:none}:host(.button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.button-solid){--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff)}:host(.button-outline){--border-color:var(--ion-color-primary, #3880ff);--background:transparent;--color:var(--ion-color-primary, #3880ff)}:host(.button-clear){--border-width:0;--background:transparent;--color:var(--ion-color-primary, #3880ff)}:host(.button-block){display:block}:host(.button-block) .button-native{margin-left:0;margin-right:0;width:100%;clear:both;contain:content}:host(.button-block) .button-native::after{clear:both}:host(.button-full){display:block}:host(.button-full) .button-native{margin-left:0;margin-right:0;width:100%;contain:content}:host(.button-full:not(.button-round)) .button-native{border-radius:0;border-right-width:0;border-left-width:0}.button-native{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);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;display:flex;position:relative;align-items:center;width:100%;height:100%;min-height:inherit;transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;box-sizing:border-box;appearance:none}.button-native::-moz-focus-inner{border:0}.button-inner{display:flex;position:relative;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%;z-index:1}::slotted([slot=start]),::slotted([slot=end]){flex-shrink:0}::slotted(ion-icon){font-size:1.35em;pointer-events:none}::slotted(ion-icon[slot=start]){-webkit-margin-start:-0.3em;margin-inline-start:-0.3em;-webkit-margin-end:0.3em;margin-inline-end:0.3em;margin-top:0;margin-bottom:0}::slotted(ion-icon[slot=end]){-webkit-margin-start:0.3em;margin-inline-start:0.3em;-webkit-margin-end:-0.2em;margin-inline-end:-0.2em;margin-top:0;margin-bottom:0}::slotted(ion-icon[slot=icon-only]){font-size:1.8em}ion-ripple-effect{color:var(--ripple-color)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(:hover){color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-activated){color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.button-solid.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.button-outline.ion-color) .button-native{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}:host(.button-clear.ion-color) .button-native{background:transparent;color:var(--ion-color-base)}:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{color:var(--ion-toolbar-color, var(--color))}:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}:host{--border-radius:4px;--padding-top:8px;--padding-bottom:8px;--padding-start:1.1em;--padding-end:1.1em;--transition:box-shadow 280ms cubic-bezier(.4, 0, .2, 1),\n                background-color 15ms linear,\n                color 15ms linear;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;margin-top:4px;margin-bottom:4px;min-height:36px;font-size:0.875rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase}:host(.button-solid){--background-activated:transparent;--background-hover:var(--ion-color-primary-contrast, #fff);--background-focused:var(--ion-color-primary-contrast, #fff);--background-activated-opacity:0;--background-focused-opacity:.24;--background-hover-opacity:.08;--box-shadow:0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12)}:host(.button-solid.ion-activated){--box-shadow:0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12)}:host(.button-outline){--border-width:2px;--border-style:solid;--box-shadow:none;--background-activated:transparent;--background-focused:var(--ion-color-primary, #3880ff);--background-hover:var(--ion-color-primary, #3880ff);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04}:host(.button-outline.ion-activated.ion-color) .button-native{background:transparent}:host(.button-clear){--background-activated:transparent;--background-focused:var(--ion-color-primary, #3880ff);--background-hover:var(--ion-color-primary, #3880ff);--background-activated-opacity:0;--background-focused-opacity:.12;--background-hover-opacity:.04}:host(.button-round){--border-radius:64px;--padding-top:0;--padding-start:26px;--padding-end:26px;--padding-bottom:0}:host(.button-large){--padding-top:14px;--padding-start:1em;--padding-end:1em;--padding-bottom:14px;min-height:2.8em;font-size:1.25rem}:host(.button-small){--padding-top:4px;--padding-start:0.9em;--padding-end:0.9em;--padding-bottom:4px;min-height:2.1em;font-size:0.8125rem}:host(.button-has-icon-only){--padding-top:0;--padding-bottom:0}:host(.button-strong){font-weight:bold}::slotted(ion-icon[slot=icon-only]){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host(.button-solid.ion-color.ion-focused) .button-native::after{background:var(--ion-color-contrast)}:host(.button-clear.ion-color.ion-focused) .button-native::after,:host(.button-outline.ion-color.ion-focused) .button-native::after{background:var(--ion-color-base)}@media (any-hover: hover){:host(.button-solid.ion-color:hover) .button-native::after{background:var(--ion-color-contrast)}:host(.button-clear.ion-color:hover) .button-native::after,:host(.button-outline.ion-color:hover) .button-native::after{background:var(--ion-color-base)}}:host(.button-outline.ion-activated.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-background, var(--color));color:var(--ion-toolbar-color, var(--background), var(--ion-color-primary-contrast, #fff))}";
+
+const Button = /*@__PURE__*/ proxyCustomElement(class Button extends H {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.ionFocus = createEvent(this, "ionFocus", 7);
+    this.ionBlur = createEvent(this, "ionBlur", 7);
+    this.inItem = false;
+    this.inListHeader = false;
+    this.inToolbar = false;
+    this.formButtonEl = null;
+    this.formEl = null;
+    this.inheritedAttributes = {};
+    this.handleClick = (ev) => {
+      const { el } = this;
+      if (this.type === 'button') {
+        openURL(this.href, ev, this.routerDirection, this.routerAnimation);
+      }
+      else if (hasShadowDom(el)) {
+        this.submitForm(ev);
+      }
+    };
+    this.onFocus = () => {
+      this.ionFocus.emit();
+    };
+    this.onBlur = () => {
+      this.ionBlur.emit();
+    };
+    this.color = undefined;
+    this.buttonType = 'button';
+    this.disabled = false;
+    this.expand = undefined;
+    this.fill = undefined;
+    this.routerDirection = 'forward';
+    this.routerAnimation = undefined;
+    this.download = undefined;
+    this.href = undefined;
+    this.rel = undefined;
+    this.shape = undefined;
+    this.size = undefined;
+    this.strong = false;
+    this.target = undefined;
+    this.type = 'button';
+    this.form = undefined;
+  }
+  disabledChanged() {
+    const { disabled } = this;
+    if (this.formButtonEl) {
+      this.formButtonEl.disabled = disabled;
+    }
+  }
+  /**
+   * This is responsible for rendering a hidden native
+   * button element inside the associated form. This allows
+   * users to submit a form by pressing "Enter" when a text
+   * field inside of the form is focused. The native button
+   * rendered inside of `ion-button` is in the Shadow DOM
+   * and therefore does not participate in form submission
+   * which is why the following code is necessary.
+   */
+  renderHiddenButton() {
+    const formEl = (this.formEl = this.findForm());
+    if (formEl) {
+      const { formButtonEl } = this;
+      /**
+       * If the form already has a rendered form button
+       * then do not append a new one again.
+       */
+      if (formButtonEl !== null && formEl.contains(formButtonEl)) {
+        return;
+      }
+      // Create a hidden native button inside of the form
+      const newFormButtonEl = (this.formButtonEl = document.createElement('button'));
+      newFormButtonEl.type = this.type;
+      newFormButtonEl.style.display = 'none';
+      // Only submit if the button is not disabled.
+      newFormButtonEl.disabled = this.disabled;
+      formEl.appendChild(newFormButtonEl);
+    }
+  }
+  componentWillLoad() {
+    this.inToolbar = !!this.el.closest('ion-buttons');
+    this.inListHeader = !!this.el.closest('ion-list-header');
+    this.inItem = !!this.el.closest('ion-item') || !!this.el.closest('ion-item-divider');
+    this.inheritedAttributes = inheritAriaAttributes(this.el);
+  }
+  get hasIconOnly() {
+    return !!this.el.querySelector('[slot="icon-only"]');
+  }
+  get rippleType() {
+    const hasClearFill = this.fill === undefined || this.fill === 'clear';
+    // If the button is in a toolbar, has a clear fill (which is the default)
+    // and only has an icon we use the unbounded "circular" ripple effect
+    if (hasClearFill && this.hasIconOnly && this.inToolbar) {
+      return 'unbounded';
+    }
+    return 'bounded';
+  }
+  /**
+   * Finds the form element based on the provided `form` selector
+   * or element reference provided.
+   */
+  findForm() {
+    const { form } = this;
+    if (form instanceof HTMLFormElement) {
+      return form;
+    }
+    if (typeof form === 'string') {
+      // Check if the string provided is a form id.
+      const el = document.getElementById(form);
+      if (el) {
+        if (el instanceof HTMLFormElement) {
+          return el;
+        }
+        else {
+          /**
+           * The developer specified a string for the form attribute, but the
+           * element with that id is not a form element.
+           */
+          printIonWarning(`Form with selector: "#${form}" could not be found. Verify that the id is attached to a <form> element.`, this.el);
+          return null;
+        }
+      }
+      else {
+        /**
+         * The developer specified a string for the form attribute, but the
+         * element with that id could not be found in the DOM.
+         */
+        printIonWarning(`Form with selector: "#${form}" could not be found. Verify that the id is correct and the form is rendered in the DOM.`, this.el);
+        return null;
+      }
+    }
+    if (form !== undefined) {
+      /**
+       * The developer specified a HTMLElement for the form attribute,
+       * but the element is not a HTMLFormElement.
+       * This will also catch if the developer tries to pass in null
+       * as the form attribute.
+       */
+      printIonWarning(`The provided "form" element is invalid. Verify that the form is a HTMLFormElement and rendered in the DOM.`, this.el);
+      return null;
+    }
+    /**
+     * If the form element is not set, the button may be inside
+     * of a form element. Query the closest form element to the button.
+     */
+    return this.el.closest('form');
+  }
+  submitForm(ev) {
+    // this button wants to specifically submit a form
+    // climb up the dom to see if we're in a <form>
+    // and if so, then use JS to submit it
+    if (this.formEl && this.formButtonEl) {
+      ev.preventDefault();
+      this.formButtonEl.click();
+    }
+  }
+  render() {
+    const mode = getIonMode(this);
+    const { buttonType, type, disabled, rel, target, size, href, color, expand, hasIconOnly, shape, strong, inheritedAttributes, } = this;
+    const finalSize = size === undefined && this.inItem ? 'small' : size;
+    const TagType = href === undefined ? 'button' : 'a';
+    const attrs = TagType === 'button'
+      ? { type }
+      : {
+        download: this.download,
+        href,
+        rel,
+        target,
+      };
+    let fill = this.fill;
+    /**
+     * We check both undefined and null to
+     * work around https://github.com/ionic-team/stencil/issues/3586.
+     */
+    if (fill == null) {
+      fill = this.inToolbar || this.inListHeader ? 'clear' : 'solid';
+    }
+    /**
+     * We call renderHiddenButton in the render function to account
+     * for any properties being set async. For example, changing the
+     * "type" prop from "button" to "submit" after the component has
+     * loaded would warrant the hidden button being added to the
+     * associated form.
+     */
+    {
+      type !== 'button' && this.renderHiddenButton();
+    }
+    return (h(Host, { key: '54569350aae49882123f0e22a720956eddee33f5', onClick: this.handleClick, "aria-disabled": disabled ? 'true' : null, class: createColorClasses(color, {
+        [mode]: true,
+        [buttonType]: true,
+        [`${buttonType}-${expand}`]: expand !== undefined,
+        [`${buttonType}-${finalSize}`]: finalSize !== undefined,
+        [`${buttonType}-${shape}`]: shape !== undefined,
+        [`${buttonType}-${fill}`]: true,
+        [`${buttonType}-strong`]: strong,
+        'in-toolbar': hostContext('ion-toolbar', this.el),
+        'in-toolbar-color': hostContext('ion-toolbar[color]', this.el),
+        'in-buttons': hostContext('ion-buttons', this.el),
+        'button-has-icon-only': hasIconOnly,
+        'button-disabled': disabled,
+        'ion-activatable': true,
+        'ion-focusable': true,
+      }) }, h(TagType, Object.assign({ key: '95c196fc5bf080ef308532c3627e2a9d68f24996' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), h("span", { key: 'e247013b847158187258d28f37ab23905fe49110', class: "button-inner" }, h("slot", { key: '58ac0bd8f643f4392ddbe465fab26eedffe02b7a', name: "icon-only" }), h("slot", { key: '2289d37a37a64472ffe818b3b1126945cebf101e', name: "start" }), h("slot", { key: 'b69a915dff465d251f0466449b91450d4a4048a9' }), h("slot", { key: '594a80d6707fd5edabc03e467f7aae3011d020f6', name: "end" })), mode === 'md' && h("ion-ripple-effect", { key: 'b034770cadefe74922ed6564a17147ddc6c9fdb1', type: this.rippleType }))));
+  }
+  get el() { return this; }
+  static get watchers() { return {
+    "disabled": ["disabledChanged"]
+  }; }
+  static get style() { return {
+    ios: buttonIosCss,
+    md: buttonMdCss
+  }; }
+}, [33, "ion-button", {
+    "color": [513],
+    "buttonType": [1025, "button-type"],
+    "disabled": [516],
+    "expand": [513],
+    "fill": [1537],
+    "routerDirection": [1, "router-direction"],
+    "routerAnimation": [16],
+    "download": [1],
+    "href": [1],
+    "rel": [1],
+    "shape": [513],
+    "size": [513],
+    "strong": [4],
+    "target": [1],
+    "type": [1],
+    "form": [1]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["ion-button", "ion-ripple-effect"];
+  components.forEach(tagName => { switch (tagName) {
+    case "ion-button":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, Button);
+      }
+      break;
+    case "ion-ripple-effect":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+
+export { Button as B, defineCustomElement as d };

package/dist/{esm/input-shims-DSFPFhb7.js → components/p-3296ebd9.js}

@@ -1,9 +1,7 @@
-import { w as win, d as doc } from './index-ZjP4CjeZ.js';
-import { g as getScrollElement, c as scrollByPoint, f as findClosestIonContent } from './index-BMJhFU53.js';
-import { a as addEventListener, r as removeEventListener, d as raf, c as componentOnReady } from './helpers-C6kqtbmV.js';
-import { a as KeyboardResize, K as Keyboard } from './keyboard-DgiyREKb.js';
-import './index-D8d_89Nl.js';
-import './capacitor-CG3xQUND.js';
+import { w as win, d as doc } from './p-d7fe59ee.js';
+import { g as getScrollElement, c as scrollByPoint, a as findClosestIonContent } from './p-1596e301.js';
+import { a as addEventListener, r as removeEventListener, b as raf, c as componentOnReady } from './p-2bb89b46.js';
+import { a as KeyboardResize, K as Keyboard } from './p-9b519de5.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License

package/dist/{esm/data-Cl-_yBA0.js → components/p-39ad94cf.js}

@@ -1,4 +1,4 @@
-import { p as printIonWarning } from './index-D8d_89Nl.js';
+import { p as printIonWarning } from './p-e187a77c.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
@@ -1625,4 +1625,4 @@ const getTimeColumnsData = (locale, refParts, hourCycle, minParts, maxParts, all
     };
 };
 
-export { clampDate as A, convertToArrayOfNumbers as B, convertDataToISO as C, getClosestValidDate as D, generateMonths as E, getNumDaysInMonth as F, getCombinedDateColumnData as G, getMonthColumnData as H, getDayColumnData as I, getYearColumnData as J, isMonthFirstLocale as K, getTimeColumnsData as L, isLocaleDayPeriodRTL as M, calculateHourFromAMPM as N, getDaysOfWeek as O, getMonthAndYear as P, getDaysOfMonth as Q, formatValue as R, getHourCycle as a, getLocalizedDateTime as b, getLocalizedTime as c, isAfter as d, getPreviousMonth as e, getNextMonth as f, getToday as g, isSameDay as h, isBefore as i, getDay as j, generateDayAriaLabel as k, getPartsFromCalendarDay as l, getNextYear as m, getPreviousYear as n, getEndOfWeek as o, parseDate as p, getStartOfWeek as q, getPreviousDay as r, getNextDay as s, getPreviousWeek as t, getNextWeek as u, validateParts as v, parseMinParts as w, parseMaxParts as x, warnIfValueOutOfBounds as y, parseAmPm as z };
+export { getDayColumnData as A, getYearColumnData as B, isMonthFirstLocale as C, getTimeColumnsData as D, isLocaleDayPeriodRTL as E, getDaysOfWeek as F, getMonthAndYear as G, getDaysOfMonth as H, generateMonths as I, getHourCycle as J, getLocalizedTime as K, getLocalizedDateTime as L, formatValue as M, getNextYear as N, getPreviousYear as O, clampDate as P, parseAmPm as Q, calculateHourFromAMPM as R, getDay as a, isAfter as b, isSameDay as c, getPreviousMonth as d, getNextMonth as e, getPartsFromCalendarDay as f, generateDayAriaLabel as g, getEndOfWeek as h, isBefore as i, getStartOfWeek as j, getPreviousDay as k, getNextDay as l, getPreviousWeek as m, getNextWeek as n, parseMaxParts as o, parseMinParts as p, parseDate as q, convertToArrayOfNumbers as r, convertDataToISO as s, getToday as t, getClosestValidDate as u, validateParts as v, warnIfValueOutOfBounds as w, getNumDaysInMonth as x, getCombinedDateColumnData as y, getMonthColumnData as z };

package/dist/{esm/capacitor-CG3xQUND.js → components/p-3d3eefc3.js}

@@ -1,4 +1,4 @@
-import { w as win } from './index-ZjP4CjeZ.js';
+import { w as win } from './p-d7fe59ee.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License

package/dist/{esm/form-controller-xetTxjL6.js → components/p-3e1d2896.js}

@@ -1,4 +1,4 @@
-import { b as findItemLabel } from './helpers-C6kqtbmV.js';
+import { k as findItemLabel } from './p-2bb89b46.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License

package/dist/{esm/keyboard-controller-CqGCg8tB.js → components/p-3e1e3453.js}

@@ -1,5 +1,5 @@
-import { w as win, d as doc } from './index-ZjP4CjeZ.js';
-import { K as Keyboard, a as KeyboardResize } from './keyboard-DgiyREKb.js';
+import { w as win, d as doc } from './p-d7fe59ee.js';
+import { K as Keyboard, a as KeyboardResize } from './p-9b519de5.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License

package/dist/{esm/md.transition-BQT2r4ED.js → components/p-503328f2.js}

@@ -1,8 +1,5 @@
-import { c as createAnimation } from './animation-DRf3dwMu.js';
-import { g as getIonPageElement } from './index-CNcx43L8.js';
-import './index-ZjP4CjeZ.js';
-import './helpers-C6kqtbmV.js';
-import './index-93OyAGoo.js';
+import { c as createAnimation } from './p-89c4c5cb.js';
+import { g as getIonPageElement } from './p-089e034e.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License

package/dist/components/p-51c44f42.js

@@ -0,0 +1,98 @@
+import { p as proxyCustomElement, H, r as readTask, w as writeTask, h, d as Host } from './p-ec0e3f3f.js';
+import { g as getIonMode } from './p-901c16c5.js';
+
+const rippleEffectCss = ":host{left:0;right:0;top:0;bottom:0;position:absolute;contain:strict;pointer-events:none}:host(.unbounded){contain:layout size style}.ripple-effect{border-radius:50%;position:absolute;background-color:currentColor;color:inherit;contain:strict;opacity:0;animation:225ms rippleAnimation forwards, 75ms fadeInAnimation forwards;will-change:transform, opacity;pointer-events:none}.fade-out{transform:translate(var(--translate-end)) scale(var(--final-scale, 1));animation:150ms fadeOutAnimation forwards}@keyframes rippleAnimation{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:scale(1)}to{transform:translate(var(--translate-end)) scale(var(--final-scale, 1))}}@keyframes fadeInAnimation{from{animation-timing-function:linear;opacity:0}to{opacity:0.16}}@keyframes fadeOutAnimation{from{animation-timing-function:linear;opacity:0.16}to{opacity:0}}";
+
+const RippleEffect = /*@__PURE__*/ proxyCustomElement(class RippleEffect extends H {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.type = 'bounded';
+  }
+  /**
+   * Adds the ripple effect to the parent element.
+   *
+   * @param x The horizontal coordinate of where the ripple should start.
+   * @param y The vertical coordinate of where the ripple should start.
+   */
+  async addRipple(x, y) {
+    return new Promise((resolve) => {
+      readTask(() => {
+        const rect = this.el.getBoundingClientRect();
+        const width = rect.width;
+        const height = rect.height;
+        const hypotenuse = Math.sqrt(width * width + height * height);
+        const maxDim = Math.max(height, width);
+        const maxRadius = this.unbounded ? maxDim : hypotenuse + PADDING;
+        const initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE);
+        const finalScale = maxRadius / initialSize;
+        let posX = x - rect.left;
+        let posY = y - rect.top;
+        if (this.unbounded) {
+          posX = width * 0.5;
+          posY = height * 0.5;
+        }
+        const styleX = posX - initialSize * 0.5;
+        const styleY = posY - initialSize * 0.5;
+        const moveX = width * 0.5 - posX;
+        const moveY = height * 0.5 - posY;
+        writeTask(() => {
+          const div = document.createElement('div');
+          div.classList.add('ripple-effect');
+          const style = div.style;
+          style.top = styleY + 'px';
+          style.left = styleX + 'px';
+          style.width = style.height = initialSize + 'px';
+          style.setProperty('--final-scale', `${finalScale}`);
+          style.setProperty('--translate-end', `${moveX}px, ${moveY}px`);
+          const container = this.el.shadowRoot || this.el;
+          container.appendChild(div);
+          setTimeout(() => {
+            resolve(() => {
+              removeRipple(div);
+            });
+          }, 225 + 100);
+        });
+      });
+    });
+  }
+  get unbounded() {
+    return this.type === 'unbounded';
+  }
+  render() {
+    const mode = getIonMode(this);
+    return (h(Host, { key: 'f1129019a6d556b008c754aeb79618c69baea9f8', role: "presentation", class: {
+        [mode]: true,
+        unbounded: this.unbounded,
+      } }));
+  }
+  get el() { return this; }
+  static get style() { return rippleEffectCss; }
+}, [1, "ion-ripple-effect", {
+    "type": [1],
+    "addRipple": [64]
+  }]);
+const removeRipple = (ripple) => {
+  ripple.classList.add('fade-out');
+  setTimeout(() => {
+    ripple.remove();
+  }, 200);
+};
+const PADDING = 10;
+const INITIAL_ORIGIN_SCALE = 0.5;
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["ion-ripple-effect"];
+  components.forEach(tagName => { switch (tagName) {
+    case "ion-ripple-effect":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, RippleEffect);
+      }
+      break;
+  } });
+}
+
+export { RippleEffect as R, defineCustomElement as d };

package/dist/components/p-5280b372.js

@@ -0,0 +1,42 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-ec0e3f3f.js';
+import { g as getIonMode } from './p-901c16c5.js';
+
+const buttonsIosCss = ".sc-ion-buttons-ios-h{display:flex;align-items:center;transform:translateZ(0);z-index:99}.sc-ion-buttons-ios-s ion-button{--padding-top:0;--padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-buttons-ios-s ion-button{--padding-top:3px;--padding-bottom:3px;--padding-start:5px;--padding-end:5px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;min-height:32px}.sc-ion-buttons-ios-s .button-has-icon-only{--padding-top:0;--padding-bottom:0}.sc-ion-buttons-ios-s ion-button:not(.button-round){--border-radius:4px}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button{--color:initial;--border-color:initial;--background-focused:var(--ion-color-contrast)}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button-solid,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button-solid{--background:var(--ion-color-contrast);--background-focused:#000;--background-focused-opacity:.12;--background-activated:#000;--background-activated-opacity:.12;--background-hover:var(--ion-color-base);--background-hover-opacity:0.45;--color:var(--ion-color-base);--color-focused:var(--ion-color-base)}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button-clear,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button-clear{--color-activated:var(--ion-color-contrast);--color-focused:var(--ion-color-contrast)}.sc-ion-buttons-ios-h.ion-color.sc-ion-buttons-ios-s .button-outline,.ion-color .sc-ion-buttons-ios-h.sc-ion-buttons-ios-s .button-outline{--color-activated:var(--ion-color-base);--color-focused:var(--ion-color-contrast);--background-activated:var(--ion-color-contrast)}.sc-ion-buttons-ios-s .button-clear,.sc-ion-buttons-ios-s .button-outline{--background-activated:transparent;--background-focused:currentColor;--background-hover:transparent}.sc-ion-buttons-ios-s .button-solid:not(.ion-color){--background-focused:#000;--background-focused-opacity:.12;--background-activated:#000;--background-activated-opacity:.12}.sc-ion-buttons-ios-s ion-icon[slot=start]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-margin-end:0.3em;margin-inline-end:0.3em;font-size:1.41em;line-height:0.67}.sc-ion-buttons-ios-s ion-icon[slot=end]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-margin-start:0.4em;margin-inline-start:0.4em;font-size:1.41em;line-height:0.67}.sc-ion-buttons-ios-s ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;font-size:1.65em;line-height:0.67}";
+
+const buttonsMdCss = ".sc-ion-buttons-md-h{display:flex;align-items:center;transform:translateZ(0);z-index:99}.sc-ion-buttons-md-s ion-button{--padding-top:0;--padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}.sc-ion-buttons-md-s ion-button{--padding-top:3px;--padding-bottom:3px;--padding-start:8px;--padding-end:8px;--box-shadow:none;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;min-height:32px}.sc-ion-buttons-md-s .button-has-icon-only{--padding-top:0;--padding-bottom:0}.sc-ion-buttons-md-s ion-button:not(.button-round){--border-radius:2px}.sc-ion-buttons-md-h.ion-color.sc-ion-buttons-md-s .button,.ion-color .sc-ion-buttons-md-h.sc-ion-buttons-md-s .button{--color:initial;--color-focused:var(--ion-color-contrast);--color-hover:var(--ion-color-contrast);--background-activated:transparent;--background-focused:var(--ion-color-contrast);--background-hover:var(--ion-color-contrast)}.sc-ion-buttons-md-h.ion-color.sc-ion-buttons-md-s .button-solid,.ion-color .sc-ion-buttons-md-h.sc-ion-buttons-md-s .button-solid{--background:var(--ion-color-contrast);--background-activated:transparent;--background-focused:var(--ion-color-shade);--background-hover:var(--ion-color-base);--color:var(--ion-color-base);--color-focused:var(--ion-color-base);--color-hover:var(--ion-color-base)}.sc-ion-buttons-md-h.ion-color.sc-ion-buttons-md-s .button-outline,.ion-color .sc-ion-buttons-md-h.sc-ion-buttons-md-s .button-outline{--border-color:var(--ion-color-contrast)}.sc-ion-buttons-md-s .button-has-icon-only.button-clear{--padding-top:12px;--padding-end:12px;--padding-bottom:12px;--padding-start:12px;--border-radius:50%;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:3rem;height:3rem}.sc-ion-buttons-md-s .button{--background-hover:currentColor}.sc-ion-buttons-md-s .button-solid{--color:var(--ion-toolbar-background, var(--ion-background-color, #fff));--background:var(--ion-toolbar-color, var(--ion-text-color, #424242));--background-activated:transparent;--background-focused:currentColor}.sc-ion-buttons-md-s .button-outline{--color:initial;--background:transparent;--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor;--border-color:currentColor}.sc-ion-buttons-md-s .button-clear{--color:initial;--background:transparent;--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor}.sc-ion-buttons-md-s ion-icon[slot=start]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-margin-end:0.3em;margin-inline-end:0.3em;font-size:1.4em}.sc-ion-buttons-md-s ion-icon[slot=end]{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-webkit-margin-start:0.4em;margin-inline-start:0.4em;font-size:1.4em}.sc-ion-buttons-md-s ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;font-size:1.8em}";
+
+const Buttons = /*@__PURE__*/ proxyCustomElement(class Buttons extends H {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.collapse = false;
+  }
+  render() {
+    const mode = getIonMode(this);
+    return (h(Host, { key: '2929fd8c4469bab2953c23d47f601706acb104f1', class: {
+        [mode]: true,
+        ['buttons-collapse']: this.collapse,
+      } }));
+  }
+  static get style() { return {
+    ios: buttonsIosCss,
+    md: buttonsMdCss
+  }; }
+}, [34, "ion-buttons", {
+    "collapse": [4]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["ion-buttons"];
+  components.forEach(tagName => { switch (tagName) {
+    case "ion-buttons":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, Buttons);
+      }
+      break;
+  } });
+}
+
+export { Buttons as B, defineCustomElement as d };

package/dist/{esm/index-DuUXGZp2.js → components/p-53e2dbe4.js}

@@ -1,5 +1,5 @@
-import { d as doc } from './index-ZjP4CjeZ.js';
-import { n as now, p as pointerCoord } from './helpers-C6kqtbmV.js';
+import { d as doc } from './p-d7fe59ee.js';
+import { u as now, v as pointerCoord } from './p-2bb89b46.js';
 
 /*!
  * (C) Ionic http://ionicframework.com - MIT License
@@ -8,7 +8,7 @@ const startTapClick = (config) => {
     if (doc === undefined) {
         return;
     }
-    let lastTouch = -2500 * 10;
+    let lastTouch = -MOUSE_WAIT * 10;
     let lastActivated = 0;
     let activatableEle;
     let activeRipple;