@venite/components 0.16.53 → 0.17.1

package/dist/cjs/ion-infinite-scroll.cjs.entry.js

@@ -1,206 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-01fdec29.js');
-const ionicGlobal = require('./ionic-global-bd0aab94.js');
-const index$1 = require('./index-9c7b27e4.js');
-require('./helpers-c2496722.js');
-require('./index-e56e09b8.js');
-
-const infiniteScrollCss = "ion-infinite-scroll{display:none;width:100%}.infinite-scroll-enabled{display:block}";
-
-const InfiniteScroll = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.ionInfinite = index.createEvent(this, "ionInfinite", 7);
-    this.thrPx = 0;
-    this.thrPc = 0;
-    this.didFire = false;
-    this.isBusy = false;
-    this.isLoading = false;
-    /**
-     * The threshold distance from the bottom
-     * of the content to call the `infinite` output event when scrolled.
-     * The threshold value can be either a percent, or
-     * in pixels. For example, use the value of `10%` for the `infinite`
-     * output event to get called when the user has scrolled 10%
-     * from the bottom of the page. Use the value `100px` when the
-     * scroll is within 100 pixels from the bottom of the page.
-     */
-    this.threshold = '15%';
-    /**
-     * If `true`, the infinite scroll will be hidden and scroll event listeners
-     * will be removed.
-     *
-     * Set this to true to disable the infinite scroll from actively
-     * trying to receive new data while scrolling. This is useful
-     * when it is known that there is no more data that can be added, and
-     * the infinite scroll is no longer needed.
-     */
-    this.disabled = false;
-    /**
-     * The position of the infinite scroll element.
-     * The value can be either `top` or `bottom`.
-     */
-    this.position = 'bottom';
-    this.onScroll = () => {
-      const scrollEl = this.scrollEl;
-      if (!scrollEl || !this.canStart()) {
-        return 1;
-      }
-      const infiniteHeight = this.el.offsetHeight;
-      if (infiniteHeight === 0) {
-        // if there is no height of this element then do nothing
-        return 2;
-      }
-      const scrollTop = scrollEl.scrollTop;
-      const scrollHeight = scrollEl.scrollHeight;
-      const height = scrollEl.offsetHeight;
-      const threshold = this.thrPc !== 0 ? height * this.thrPc : this.thrPx;
-      const distanceFromInfinite = this.position === 'bottom'
-        ? scrollHeight - infiniteHeight - scrollTop - threshold - height
-        : scrollTop - infiniteHeight - threshold;
-      if (distanceFromInfinite < 0) {
-        if (!this.didFire) {
-          this.isLoading = true;
-          this.didFire = true;
-          this.ionInfinite.emit();
-          return 3;
-        }
-      }
-      else {
-        this.didFire = false;
-      }
-      return 4;
-    };
-  }
-  thresholdChanged() {
-    const val = this.threshold;
-    if (val.lastIndexOf('%') > -1) {
-      this.thrPx = 0;
-      this.thrPc = parseFloat(val) / 100;
-    }
-    else {
-      this.thrPx = parseFloat(val);
-      this.thrPc = 0;
-    }
-  }
-  disabledChanged() {
-    const disabled = this.disabled;
-    if (disabled) {
-      this.isLoading = false;
-      this.isBusy = false;
-    }
-    this.enableScrollEvents(!disabled);
-  }
-  async connectedCallback() {
-    const contentEl = index$1.findClosestIonContent(this.el);
-    if (!contentEl) {
-      index$1.printIonContentErrorMsg(this.el);
-      return;
-    }
-    this.scrollEl = await index$1.getScrollElement(contentEl);
-    this.thresholdChanged();
-    this.disabledChanged();
-    if (this.position === 'top') {
-      index.writeTask(() => {
-        if (this.scrollEl) {
-          this.scrollEl.scrollTop = this.scrollEl.scrollHeight - this.scrollEl.clientHeight;
-        }
-      });
-    }
-  }
-  disconnectedCallback() {
-    this.enableScrollEvents(false);
-    this.scrollEl = undefined;
-  }
-  /**
-   * Call `complete()` within the `ionInfinite` output event handler when
-   * your async operation has completed. For example, the `loading`
-   * state is while the app is performing an asynchronous operation,
-   * such as receiving more data from an AJAX request to add more items
-   * to a data list. Once the data has been received and UI updated, you
-   * then call this method to signify that the loading has completed.
-   * This method will change the infinite scroll's state from `loading`
-   * to `enabled`.
-   */
-  async complete() {
-    const scrollEl = this.scrollEl;
-    if (!this.isLoading || !scrollEl) {
-      return;
-    }
-    this.isLoading = false;
-    if (this.position === 'top') {
-      /**
-       * New content is being added at the top, but the scrollTop position stays the same,
-       * which causes a scroll jump visually. This algorithm makes sure to prevent this.
-       * (Frame 1)
-       *    - complete() is called, but the UI hasn't had time to update yet.
-       *    - Save the current content dimensions.
-       *    - Wait for the next frame using _dom.read, so the UI will be updated.
-       * (Frame 2)
-       *    - Read the new content dimensions.
-       *    - Calculate the height difference and the new scroll position.
-       *    - Delay the scroll position change until other possible dom reads are done using _dom.write to be performant.
-       * (Still frame 2, if I'm correct)
-       *    - Change the scroll position (= visually maintain the scroll position).
-       *    - Change the state to re-enable the InfiniteScroll.
-       *    - This should be after changing the scroll position, or it could
-       *    cause the InfiniteScroll to be triggered again immediately.
-       * (Frame 3)
-       *    Done.
-       */
-      this.isBusy = true;
-      // ******** DOM READ ****************
-      // Save the current content dimensions before the UI updates
-      const prev = scrollEl.scrollHeight - scrollEl.scrollTop;
-      // ******** DOM READ ****************
-      requestAnimationFrame(() => {
-        index.readTask(() => {
-          // UI has updated, save the new content dimensions
-          const scrollHeight = scrollEl.scrollHeight;
-          // New content was added on top, so the scroll position should be changed immediately to prevent it from jumping around
-          const newScrollTop = scrollHeight - prev;
-          // ******** DOM WRITE ****************
-          requestAnimationFrame(() => {
-            index.writeTask(() => {
-              scrollEl.scrollTop = newScrollTop;
-              this.isBusy = false;
-            });
-          });
-        });
-      });
-    }
-  }
-  canStart() {
-    return !this.disabled && !this.isBusy && !!this.scrollEl && !this.isLoading;
-  }
-  enableScrollEvents(shouldListen) {
-    if (this.scrollEl) {
-      if (shouldListen) {
-        this.scrollEl.addEventListener('scroll', this.onScroll);
-      }
-      else {
-        this.scrollEl.removeEventListener('scroll', this.onScroll);
-      }
-    }
-  }
-  render() {
-    const mode = ionicGlobal.getIonMode(this);
-    const disabled = this.disabled;
-    return (index.h(index.Host, { class: {
-        [mode]: true,
-        'infinite-scroll-loading': this.isLoading,
-        'infinite-scroll-enabled': !disabled,
-      } }));
-  }
-  get el() { return index.getElement(this); }
-  static get watchers() { return {
-    "threshold": ["thresholdChanged"],
-    "disabled": ["disabledChanged"]
-  }; }
-};
-InfiniteScroll.style = infiniteScrollCss;
-
-exports.ion_infinite_scroll = InfiniteScroll;

package/dist/cjs/ion-item-divider.cjs.entry.js

@@ -1,40 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-01fdec29.js');
-const ionicGlobal = require('./ionic-global-bd0aab94.js');
-const theme = require('./theme-b0b295c1.js');
-
-const itemDividerIosCss = ":host{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--inner-padding-top:0px;--inner-padding-end:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:100;box-sizing:border-box}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-inline-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.item-divider-sticky){position:sticky;top:0}.item-divider-inner{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--inner-padding-start);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);display:flex;flex:1;flex-direction:inherit;align-items:inherit;align-self:stretch;min-height:inherit;border:0;overflow:hidden}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.item-divider-inner{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--inner-padding-start);padding-inline-start:var(--inner-padding-start);-webkit-padding-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-inline-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end))}}.item-divider-wrapper{display:flex;flex:1;flex-direction:inherit;align-items:inherit;align-self:stretch;text-overflow:ellipsis;overflow:hidden}:host{--background:var(--ion-color-step-100, #e6e6e6);--color:var(--ion-color-step-850, #262626);--padding-start:20px;--inner-padding-end:10px;border-radius:0;position:relative;min-height:28px;font-size:17px;font-weight:600}:host([slot=start]){margin-left:0;margin-right:20px;margin-top:2px;margin-bottom:2px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host([slot=start]){margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:20px;margin-inline-end:20px}}:host([slot=end]){margin-left:10px;margin-right:10px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host([slot=end]){margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}::slotted(ion-icon[slot=start]),::slotted(ion-icon[slot=end]){margin-top:7px;margin-bottom:7px}::slotted(h1){margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}::slotted(h2){margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:17px;font-weight:normal}::slotted(h3),::slotted(h4),::slotted(h5),::slotted(h6){margin-left:0;margin-right:0;margin-top:0;margin-bottom:3px;font-size:14px;font-weight:normal;line-height:normal}::slotted(p){margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.4);font-size:14px;line-height:normal;text-overflow:inherit;overflow:inherit}::slotted(h2:last-child) ::slotted(h3:last-child),::slotted(h4:last-child),::slotted(h5:last-child),::slotted(h6:last-child),::slotted(p:last-child){margin-bottom:0}";
-
-const itemDividerMdCss = ":host{--padding-top:0px;--padding-end:0px;--padding-bottom:0px;--padding-start:0px;--inner-padding-top:0px;--inner-padding-end:0px;--inner-padding-bottom:0px;--inner-padding-start:0px;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-right:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);display:flex;align-items:center;justify-content:space-between;width:100%;background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit);overflow:hidden;z-index:100;box-sizing:border-box}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host{padding-left:unset;padding-right:unset;-webkit-padding-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));padding-inline-start:calc(var(--padding-start) + var(--ion-safe-area-left, 0px));-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end)}}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.item-divider-sticky){position:sticky;top:0}.item-divider-inner{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;padding-left:var(--inner-padding-start);padding-right:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-top:var(--inner-padding-top);padding-bottom:var(--inner-padding-bottom);display:flex;flex:1;flex-direction:inherit;align-items:inherit;align-self:stretch;min-height:inherit;border:0;overflow:hidden}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.item-divider-inner{padding-left:unset;padding-right:unset;-webkit-padding-start:var(--inner-padding-start);padding-inline-start:var(--inner-padding-start);-webkit-padding-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end));padding-inline-end:calc(var(--ion-safe-area-right, 0px) + var(--inner-padding-end))}}.item-divider-wrapper{display:flex;flex:1;flex-direction:inherit;align-items:inherit;align-self:stretch;text-overflow:ellipsis;overflow:hidden}:host{--background:var(--ion-background-color, #fff);--color:var(--ion-color-step-400, #999999);--padding-start:16px;--inner-padding-end:0;min-height:30px;border-bottom:1px solid var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))));font-size:14px}::slotted([slot=start]){margin-right:32px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=start]){margin-right:unset;-webkit-margin-end:32px;margin-inline-end:32px}}::slotted([slot=end]){margin-left:32px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=end]){margin-left:unset;-webkit-margin-start:32px;margin-inline-start:32px}}::slotted(ion-label){margin-left:0;margin-right:0;margin-top:13px;margin-bottom:10px}::slotted(ion-icon){color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);font-size:24px}:host(.ion-color) ::slotted(ion-icon){color:var(--ion-color-contrast)}::slotted(ion-icon[slot]){margin-top:12px;margin-bottom:12px}::slotted(ion-icon[slot=start]){margin-right:32px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted(ion-icon[slot=start]){margin-right:unset;-webkit-margin-end:32px;margin-inline-end:32px}}::slotted(ion-icon[slot=end]){margin-left:16px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted(ion-icon[slot=end]){margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}::slotted(ion-note){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;align-self:flex-start;font-size:11px}::slotted(ion-note[slot]){padding-left:0;padding-right:0;padding-top:18px;padding-bottom:10px}::slotted(ion-note[slot=start]){padding-right:16px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted(ion-note[slot=start]){padding-right:unset;-webkit-padding-end:16px;padding-inline-end:16px}}::slotted(ion-note[slot=end]){padding-left:16px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted(ion-note[slot=end]){padding-left:unset;-webkit-padding-start:16px;padding-inline-start:16px}}::slotted(ion-avatar){width:40px;height:40px}::slotted(ion-thumbnail){width:56px;height:56px}::slotted(ion-avatar),::slotted(ion-thumbnail){margin-top:8px;margin-bottom:8px}::slotted(ion-avatar[slot=start]),::slotted(ion-thumbnail[slot=start]){margin-right:16px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted(ion-avatar[slot=start]),::slotted(ion-thumbnail[slot=start]){margin-right:unset;-webkit-margin-end:16px;margin-inline-end:16px}}::slotted(ion-avatar[slot=end]),::slotted(ion-thumbnail[slot=end]){margin-left:16px}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted(ion-avatar[slot=end]),::slotted(ion-thumbnail[slot=end]){margin-left:unset;-webkit-margin-start:16px;margin-inline-start:16px}}::slotted(h1){margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;font-size:24px;font-weight:normal}::slotted(h2){margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:16px;font-weight:normal}::slotted(h3,h4,h5,h6){margin-left:0;margin-right:0;margin-top:2px;margin-bottom:2px;font-size:14px;font-weight:normal;line-height:normal}::slotted(p){margin-left:0;margin-right:0;margin-top:0;margin-bottom:2px;color:var(--ion-color-step-600, #666666);font-size:14px;line-height:normal;text-overflow:inherit;overflow:inherit}";
-
-const ItemDivider = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /**
-     * When it's set to `true`, the item-divider will stay visible when it reaches the top
-     * of the viewport until the next `ion-item-divider` replaces it.
-     *
-     * This feature relies in `position:sticky`:
-     * https://caniuse.com/#feat=css-sticky
-     */
-    this.sticky = false;
-  }
-  render() {
-    const mode = ionicGlobal.getIonMode(this);
-    return (index.h(index.Host, { class: theme.createColorClasses(this.color, {
-        [mode]: true,
-        'item-divider-sticky': this.sticky,
-        item: true,
-      }) }, index.h("slot", { name: "start" }), index.h("div", { class: "item-divider-inner" }, index.h("div", { class: "item-divider-wrapper" }, index.h("slot", null)), index.h("slot", { name: "end" }))));
-  }
-  get el() { return index.getElement(this); }
-};
-ItemDivider.style = {
-  ios: itemDividerIosCss,
-  md: itemDividerMdCss
-};
-
-exports.ion_item_divider = ItemDivider;

package/dist/cjs/ion-item-group.cjs.entry.js

@@ -1,31 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-01fdec29.js');
-const ionicGlobal = require('./ionic-global-bd0aab94.js');
-
-const itemGroupIosCss = "ion-item-group{display:block}";
-
-const itemGroupMdCss = "ion-item-group{display:block}";
-
-const ItemGroup = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-  }
-  render() {
-    const mode = ionicGlobal.getIonMode(this);
-    return (index.h(index.Host, { role: "group", class: {
-        [mode]: true,
-        // Used internally for styling
-        [`item-group-${mode}`]: true,
-        item: true,
-      } }));
-  }
-};
-ItemGroup.style = {
-  ios: itemGroupIosCss,
-  md: itemGroupMdCss
-};
-
-exports.ion_item_group = ItemGroup;

package/dist/cjs/ion-item-option.cjs.entry.js

@@ -1,60 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-01fdec29.js');
-const ionicGlobal = require('./ionic-global-bd0aab94.js');
-const theme = require('./theme-b0b295c1.js');
-
-const itemOptionIosCss = ":host{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit)}:host(.in-list.item-options-end:last-child){padding-right:calc(0.7em + var(--ion-safe-area-right))}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host(.in-list.item-options-end:last-child){padding-right:unset;-webkit-padding-end:calc(0.7em + var(--ion-safe-area-right));padding-inline-end:calc(0.7em + var(--ion-safe-area-right))}}:host(.in-list.item-options-start:first-child){padding-left:calc(0.7em + var(--ion-safe-area-left))}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host(.in-list.item-options-start:first-child){padding-left:unset;-webkit-padding-start:calc(0.7em + var(--ion-safe-area-left));padding-inline-start:calc(0.7em + var(--ion-safe-area-left))}}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}.button-native{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;padding-left:0.7em;padding-right:0.7em;padding-top:0;padding-bottom:0;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;appearance:none;box-sizing:border-box}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.button-native{padding-left:unset;padding-right:unset;-webkit-padding-start:0.7em;padding-inline-start:0.7em;-webkit-padding-end:0.7em;padding-inline-end:0.7em}}.button-inner{display:flex;flex-flow:column nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%}.horizontal-wrapper{display:flex;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%}::slotted(*){flex-shrink:0}::slotted([slot=start]){margin-left:0;margin-right:5px;margin-top:0;margin-bottom:0}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=start]){margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:5px;margin-inline-end:5px}}::slotted([slot=end]){margin-left:5px;margin-right:0;margin-top:0;margin-bottom:0}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=end]){margin-left:unset;margin-right:unset;-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:0;margin-inline-end:0}}::slotted([slot=icon-only]){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:10px;margin-right:10px;margin-top:0;margin-bottom:0;min-width:0.9em;font-size:1.8em}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=icon-only]){margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}:host(.item-option-expandable){flex-shrink:0;transition-duration:0;transition-property:none;transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1)}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;opacity:0.5;pointer-events:none}:host{font-size:16px}:host(.ion-activated){background:var(--ion-color-primary-shade, #3171e0)}:host(.ion-color.ion-activated){background:var(--ion-color-shade)}";
-
-const itemOptionMdCss = ":host{--background:var(--ion-color-primary, #3880ff);--color:var(--ion-color-primary-contrast, #fff);background:var(--background);color:var(--color);font-family:var(--ion-font-family, inherit)}:host(.in-list.item-options-end:last-child){padding-right:calc(0.7em + var(--ion-safe-area-right))}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host(.in-list.item-options-end:last-child){padding-right:unset;-webkit-padding-end:calc(0.7em + var(--ion-safe-area-right));padding-inline-end:calc(0.7em + var(--ion-safe-area-right))}}:host(.in-list.item-options-start:first-child){padding-left:calc(0.7em + var(--ion-safe-area-left))}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){:host(.in-list.item-options-start:first-child){padding-left:unset;-webkit-padding-start:calc(0.7em + var(--ion-safe-area-left));padding-inline-start:calc(0.7em + var(--ion-safe-area-left))}}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}.button-native{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;padding-left:0.7em;padding-right:0.7em;padding-top:0;padding-bottom:0;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;appearance:none;box-sizing:border-box}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.button-native{padding-left:unset;padding-right:unset;-webkit-padding-start:0.7em;padding-inline-start:0.7em;-webkit-padding-end:0.7em;padding-inline-end:0.7em}}.button-inner{display:flex;flex-flow:column nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%}.horizontal-wrapper{display:flex;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%}::slotted(*){flex-shrink:0}::slotted([slot=start]){margin-left:0;margin-right:5px;margin-top:0;margin-bottom:0}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=start]){margin-left:unset;margin-right:unset;-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:5px;margin-inline-end:5px}}::slotted([slot=end]){margin-left:5px;margin-right:0;margin-top:0;margin-bottom:0}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=end]){margin-left:unset;margin-right:unset;-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:0;margin-inline-end:0}}::slotted([slot=icon-only]){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:10px;margin-right:10px;margin-top:0;margin-bottom:0;min-width:0.9em;font-size:1.8em}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){::slotted([slot=icon-only]){margin-left:unset;margin-right:unset;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px}}:host(.item-option-expandable){flex-shrink:0;transition-duration:0;transition-property:none;transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1)}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;opacity:0.5;pointer-events:none}:host{font-size:14px;font-weight:500;text-transform:uppercase}";
-
-const ItemOption = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    /**
-     * If `true`, the user cannot interact with the item option.
-     */
-    this.disabled = false;
-    /**
-     * If `true`, the option will expand to take up the available width and cover any other options.
-     */
-    this.expandable = false;
-    /**
-     * The type of the button.
-     */
-    this.type = 'button';
-    this.onClick = (ev) => {
-      const el = ev.target.closest('ion-item-option');
-      if (el) {
-        ev.preventDefault();
-      }
-    };
-  }
-  render() {
-    const { disabled, expandable, href } = this;
-    const TagType = href === undefined ? 'button' : 'a';
-    const mode = ionicGlobal.getIonMode(this);
-    const attrs = TagType === 'button'
-      ? { type: this.type }
-      : {
-        download: this.download,
-        href: this.href,
-        target: this.target,
-      };
-    return (index.h(index.Host, { onClick: this.onClick, class: theme.createColorClasses(this.color, {
-        [mode]: true,
-        'item-option-disabled': disabled,
-        'item-option-expandable': expandable,
-        'ion-activatable': true,
-      }) }, index.h(TagType, Object.assign({}, attrs, { class: "button-native", part: "native", disabled: disabled }), index.h("span", { class: "button-inner" }, index.h("slot", { name: "top" }), index.h("div", { class: "horizontal-wrapper" }, index.h("slot", { name: "start" }), index.h("slot", { name: "icon-only" }), index.h("slot", null), index.h("slot", { name: "end" })), index.h("slot", { name: "bottom" })), mode === 'md' && index.h("ion-ripple-effect", null))));
-  }
-  get el() { return index.getElement(this); }
-};
-ItemOption.style = {
-  ios: itemOptionIosCss,
-  md: itemOptionMdCss
-};
-
-exports.ion_item_option = ItemOption;

package/dist/cjs/ion-item-options.cjs.entry.js

@@ -1,47 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-01fdec29.js');
-const ionicGlobal = require('./ionic-global-bd0aab94.js');
-const helpers = require('./helpers-c2496722.js');
-
-const itemOptionsIosCss = "ion-item-options{top:0;right:0;justify-content:flex-end;display:none;position:absolute;height:100%;font-size:14px;user-select:none;z-index:1}[dir=rtl] ion-item-options,:host-context([dir=rtl]) ion-item-options{justify-content:flex-start}[dir=rtl] ion-item-options:not(.item-options-end),:host-context([dir=rtl]) ion-item-options:not(.item-options-end){right:auto;left:0;justify-content:flex-end}.item-options-start{right:auto;left:0;justify-content:flex-start}[dir=rtl] .item-options-start,:host-context([dir=rtl]) .item-options-start{justify-content:flex-end}.item-options-start ion-item-option:first-child{padding-right:var(--ion-safe-area-left)}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.item-options-start ion-item-option:first-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-left);padding-inline-end:var(--ion-safe-area-left)}}.item-options-end ion-item-option:last-child{padding-right:var(--ion-safe-area-right)}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.item-options-end ion-item-option:last-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}[dir=rtl] .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end),:host-context([dir=rtl]) .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end){width:100%;visibility:visible}.item-sliding-active-slide ion-item-options{display:flex;visibility:hidden}.item-sliding-active-slide.item-sliding-active-options-start .item-options-start,.item-sliding-active-slide.item-sliding-active-options-end ion-item-options:not(.item-options-start){width:100%;visibility:visible}.item-options-ios{border-bottom-width:0;border-bottom-style:solid;border-bottom-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-250, #c8c7cc)))}.item-options-ios.item-options-end{border-bottom-width:0.55px}.list-ios-lines-none .item-options-ios{border-bottom-width:0}.list-ios-lines-full .item-options-ios,.list-ios-lines-inset .item-options-ios.item-options-end{border-bottom-width:0.55px}";
-
-const itemOptionsMdCss = "ion-item-options{top:0;right:0;justify-content:flex-end;display:none;position:absolute;height:100%;font-size:14px;user-select:none;z-index:1}[dir=rtl] ion-item-options,:host-context([dir=rtl]) ion-item-options{justify-content:flex-start}[dir=rtl] ion-item-options:not(.item-options-end),:host-context([dir=rtl]) ion-item-options:not(.item-options-end){right:auto;left:0;justify-content:flex-end}.item-options-start{right:auto;left:0;justify-content:flex-start}[dir=rtl] .item-options-start,:host-context([dir=rtl]) .item-options-start{justify-content:flex-end}.item-options-start ion-item-option:first-child{padding-right:var(--ion-safe-area-left)}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.item-options-start ion-item-option:first-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-left);padding-inline-end:var(--ion-safe-area-left)}}.item-options-end ion-item-option:last-child{padding-right:var(--ion-safe-area-right)}@supports (margin-inline-start: 0) or (-webkit-margin-start: 0){.item-options-end ion-item-option:last-child{padding-right:unset;-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right)}}[dir=rtl] .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end),:host-context([dir=rtl]) .item-sliding-active-slide.item-sliding-active-options-start ion-item-options:not(.item-options-end){width:100%;visibility:visible}.item-sliding-active-slide ion-item-options{display:flex;visibility:hidden}.item-sliding-active-slide.item-sliding-active-options-start .item-options-start,.item-sliding-active-slide.item-sliding-active-options-end ion-item-options:not(.item-options-start){width:100%;visibility:visible}.item-options-md{border-bottom-width:0;border-bottom-style:solid;border-bottom-color:var(--ion-item-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.13))))}.list-md-lines-none .item-options-md{border-bottom-width:0}.list-md-lines-full .item-options-md,.list-md-lines-inset .item-options-md.item-options-end{border-bottom-width:1px}";
-
-const ItemOptions = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.ionSwipe = index.createEvent(this, "ionSwipe", 7);
-    /**
-     * The side the option button should be on. Possible values: `"start"` and `"end"`. If you have multiple `ion-item-options`, a side must be provided for each.
-     *
-     */
-    this.side = 'end';
-  }
-  /** @internal */
-  async fireSwipeEvent() {
-    this.ionSwipe.emit({
-      side: this.side,
-    });
-  }
-  render() {
-    const mode = ionicGlobal.getIonMode(this);
-    const isEnd = helpers.isEndSide(this.side);
-    return (index.h(index.Host, { class: {
-        [mode]: true,
-        // Used internally for styling
-        [`item-options-${mode}`]: true,
-        'item-options-start': !isEnd,
-        'item-options-end': isEnd,
-      } }));
-  }
-  get el() { return index.getElement(this); }
-};
-ItemOptions.style = {
-  ios: itemOptionsIosCss,
-  md: itemOptionsMdCss
-};
-
-exports.ion_item_options = ItemOptions;