@rdlabo/ionic-theme-ios27 0.1.0-0

package/dist/docs.json

@@ -0,0 +1,234 @@
+{
+  "api": {
+    "name": "IonicThemeIos26Api",
+    "slug": "ionicthemeios26api",
+    "docs": "Documentation facade for `@rdlabo/ionic-theme-ios26`.\nNot part of the public runtime API.",
+    "tags": [],
+    "methods": [
+      {
+        "name": "registerTabBarEffect",
+        "signature": "(targetElement: HTMLElement) => registeredEffect | undefined",
+        "parameters": [
+          {
+            "name": "targetElement",
+            "docs": "",
+            "type": "HTMLElement"
+          }
+        ],
+        "returns": "registeredEffect",
+        "tags": [],
+        "docs": "Registers the liquid-glass selection effect for an Ionic tab bar.",
+        "complexTypes": [
+          "registeredEffect",
+          "HTMLElement"
+        ],
+        "slug": "registertabbareffect"
+      },
+      {
+        "name": "registerSegmentEffect",
+        "signature": "(targetElement: HTMLElement) => registeredEffect | undefined",
+        "parameters": [
+          {
+            "name": "targetElement",
+            "docs": "",
+            "type": "HTMLElement"
+          }
+        ],
+        "returns": "registeredEffect",
+        "tags": [],
+        "docs": "Registers the liquid-glass selection effect for an Ionic segment.",
+        "complexTypes": [
+          "registeredEffect",
+          "HTMLElement"
+        ],
+        "slug": "registersegmenteffect"
+      },
+      {
+        "name": "attachTabBarSearchable",
+        "signature": "(ionTabBar: HTMLElement, ionFabButton: HTMLElement, ionFooter: HTMLElement) => TabBarSearchableFunction",
+        "parameters": [
+          {
+            "name": "ionTabBar",
+            "docs": "",
+            "type": "HTMLElement"
+          },
+          {
+            "name": "ionFabButton",
+            "docs": "",
+            "type": "HTMLElement"
+          },
+          {
+            "name": "ionFooter",
+            "docs": "",
+            "type": "HTMLElement"
+          }
+        ],
+        "returns": "TabBarSearchableFunction",
+        "tags": [],
+        "docs": "Attaches the searchable tab-bar transition and returns its event handler.",
+        "complexTypes": [
+          "TabBarSearchableFunction",
+          "HTMLElement"
+        ],
+        "slug": "attachtabbarsearchable"
+      },
+      {
+        "name": "iosTransitionAnimation",
+        "signature": "(navEl: HTMLElement, opts: unknown) => unknown",
+        "parameters": [
+          {
+            "name": "navEl",
+            "docs": "",
+            "type": "HTMLElement"
+          },
+          {
+            "name": "opts",
+            "docs": "",
+            "type": "unknown"
+          }
+        ],
+        "returns": "unknown",
+        "tags": [],
+        "docs": "Builds the package's iOS navigation transition.",
+        "complexTypes": [
+          "HTMLElement"
+        ],
+        "slug": "iostransitionanimation"
+      },
+      {
+        "name": "popoverEnterAnimation",
+        "signature": "(baseEl: HTMLElement, opts?: unknown) => unknown",
+        "parameters": [
+          {
+            "name": "baseEl",
+            "docs": "",
+            "type": "HTMLElement"
+          },
+          {
+            "name": "opts",
+            "docs": "",
+            "type": "unknown"
+          }
+        ],
+        "returns": "unknown",
+        "tags": [],
+        "docs": "Builds the iOS popover enter animation.",
+        "complexTypes": [
+          "HTMLElement"
+        ],
+        "slug": "popoverenteranimation"
+      },
+      {
+        "name": "popoverLeaveAnimation",
+        "signature": "(baseEl: HTMLElement) => unknown",
+        "parameters": [
+          {
+            "name": "baseEl",
+            "docs": "",
+            "type": "HTMLElement"
+          }
+        ],
+        "returns": "unknown",
+        "tags": [],
+        "docs": "Builds the iOS popover leave animation.",
+        "complexTypes": [
+          "HTMLElement"
+        ],
+        "slug": "popoverleaveanimation"
+      }
+    ],
+    "properties": []
+  },
+  "interfaces": [
+    {
+      "name": "registeredEffect",
+      "slug": "registeredeffect",
+      "docs": "",
+      "tags": [],
+      "methods": [],
+      "properties": [
+        {
+          "name": "destroy",
+          "tags": [],
+          "docs": "Removes listeners and effect elements created by registration.",
+          "complexTypes": [],
+          "type": "() => void"
+        }
+      ]
+    },
+    {
+      "name": "EffectScales",
+      "slug": "effectscales",
+      "docs": "",
+      "tags": [],
+      "methods": [],
+      "properties": [
+        {
+          "name": "small",
+          "tags": [],
+          "docs": "Small effect scale.",
+          "complexTypes": [],
+          "type": "string"
+        },
+        {
+          "name": "medium",
+          "tags": [],
+          "docs": "Medium effect scale.",
+          "complexTypes": [],
+          "type": "string"
+        },
+        {
+          "name": "large",
+          "tags": [],
+          "docs": "Large effect scale.",
+          "complexTypes": [],
+          "type": "string"
+        },
+        {
+          "name": "xlarge",
+          "tags": [],
+          "docs": "Extra-large effect scale.",
+          "complexTypes": [],
+          "type": "string"
+        }
+      ]
+    }
+  ],
+  "enums": [
+    {
+      "name": "TabBarSearchableType",
+      "slug": "tabbarsearchabletype",
+      "members": [
+        {
+          "name": "Enter",
+          "value": "'enter'",
+          "tags": [],
+          "docs": "Enters searchable mode."
+        },
+        {
+          "name": "Leave",
+          "value": "'leave'",
+          "tags": [],
+          "docs": "Leaves searchable mode."
+        }
+      ]
+    }
+  ],
+  "typeAliases": [
+    {
+      "name": "TabBarSearchableFunction",
+      "slug": "tabbarsearchablefunction",
+      "docs": "Event handler returned by `attachTabBarSearchable`.",
+      "types": [
+        {
+          "text": "(event: Event, type: TabBarSearchableType): Promise<void>",
+          "complexTypes": [
+            "Event",
+            "TabBarSearchableType"
+          ]
+        }
+      ]
+    }
+  ],
+  "pluginConfigs": []
+}

package/dist/focus-controller/index.d.ts

@@ -0,0 +1,6 @@
+export declare const createFocusController: () => FocusController;
+export type FocusController = {
+    saveViewFocus: (referenceEl?: HTMLElement) => void;
+    setViewFocus: (referenceEl: HTMLElement) => void;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/focus-controller/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/focus-controller/index.ts"],"names":[],"mappings":"AA6BA,eAAO,MAAM,qBAAqB,QAAO,eAsFxC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,aAAa,EAAE,CAAC,WAAW,CAAC,EAAE,WAAW,KAAK,IAAI,CAAC;IACnD,YAAY,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAC;CAClD,CAAC"}

package/dist/focus-controller/index.js

@@ -0,0 +1,62 @@
+import { config } from '../utils';
+const moveFocus = (el) => {
+    el.tabIndex = -1;
+    el.focus();
+};
+const isVisible = (el) => {
+    return el.offsetParent !== null;
+};
+export const createFocusController = () => {
+    const saveViewFocus = (referenceEl) => {
+        const focusManagerEnabled = config.get('focusManagerPriority', false);
+        if (focusManagerEnabled) {
+            const activeEl = document.activeElement;
+            if (activeEl !== null && referenceEl?.contains(activeEl)) {
+                activeEl.setAttribute(LAST_FOCUS, 'true');
+            }
+        }
+    };
+    const setViewFocus = (referenceEl) => {
+        const focusManagerPriorities = config.get('focusManagerPriority', false);
+        if (Array.isArray(focusManagerPriorities) && !referenceEl.contains(document.activeElement)) {
+            const lastFocus = referenceEl.querySelector(`[${LAST_FOCUS}]`);
+            if (lastFocus && isVisible(lastFocus)) {
+                moveFocus(lastFocus);
+                return;
+            }
+            for (const priority of focusManagerPriorities) {
+                switch (priority) {
+                    case 'content':
+                        const content = referenceEl.querySelector('main, [role="main"]');
+                        if (content && isVisible(content)) {
+                            moveFocus(content);
+                            return;
+                        }
+                        break;
+                    case 'heading':
+                        const headingOne = referenceEl.querySelector('h1, [role="heading"][aria-level="1"]');
+                        if (headingOne && isVisible(headingOne)) {
+                            moveFocus(headingOne);
+                            return;
+                        }
+                        break;
+                    case 'banner':
+                        const header = referenceEl.querySelector('header, [role="banner"]');
+                        if (header && isVisible(header)) {
+                            moveFocus(header);
+                            return;
+                        }
+                        break;
+                    default:
+                        break;
+                }
+            }
+            moveFocus(referenceEl);
+        }
+    };
+    return {
+        saveViewFocus,
+        setViewFocus,
+    };
+};
+const LAST_FOCUS = 'ion-last-focus';

package/dist/focus-controller /index.d.ts

@@ -0,0 +1,6 @@
+export declare const createFocusController: () => FocusController;
+export type FocusController = {
+    saveViewFocus: (referenceEl?: HTMLElement) => void;
+    setViewFocus: (referenceEl: HTMLElement) => void;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/focus-controller /index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/focus-controller /index.ts"],"names":[],"mappings":"AA6BA,eAAO,MAAM,qBAAqB,QAAO,eAsFxC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,aAAa,EAAE,CAAC,WAAW,CAAC,EAAE,WAAW,KAAK,IAAI,CAAC;IACnD,YAAY,EAAE,CAAC,WAAW,EAAE,WAAW,KAAK,IAAI,CAAC;CAClD,CAAC"}

package/dist/focus-controller /index.js

@@ -0,0 +1,62 @@
+import { config } from '../utils';
+const moveFocus = (el) => {
+    el.tabIndex = -1;
+    el.focus();
+};
+const isVisible = (el) => {
+    return el.offsetParent !== null;
+};
+export const createFocusController = () => {
+    const saveViewFocus = (referenceEl) => {
+        const focusManagerEnabled = config.get('focusManagerPriority', false);
+        if (focusManagerEnabled) {
+            const activeEl = document.activeElement;
+            if (activeEl !== null && referenceEl?.contains(activeEl)) {
+                activeEl.setAttribute(LAST_FOCUS, 'true');
+            }
+        }
+    };
+    const setViewFocus = (referenceEl) => {
+        const focusManagerPriorities = config.get('focusManagerPriority', false);
+        if (Array.isArray(focusManagerPriorities) && !referenceEl.contains(document.activeElement)) {
+            const lastFocus = referenceEl.querySelector(`[${LAST_FOCUS}]`);
+            if (lastFocus && isVisible(lastFocus)) {
+                moveFocus(lastFocus);
+                return;
+            }
+            for (const priority of focusManagerPriorities) {
+                switch (priority) {
+                    case 'content':
+                        const content = referenceEl.querySelector('main, [role="main"]');
+                        if (content && isVisible(content)) {
+                            moveFocus(content);
+                            return;
+                        }
+                        break;
+                    case 'heading':
+                        const headingOne = referenceEl.querySelector('h1, [role="heading"][aria-level="1"]');
+                        if (headingOne && isVisible(headingOne)) {
+                            moveFocus(headingOne);
+                            return;
+                        }
+                        break;
+                    case 'banner':
+                        const header = referenceEl.querySelector('header, [role="banner"]');
+                        if (header && isVisible(header)) {
+                            moveFocus(header);
+                            return;
+                        }
+                        break;
+                    default:
+                        break;
+                }
+            }
+            moveFocus(referenceEl);
+        }
+    };
+    return {
+        saveViewFocus,
+        setViewFocus,
+    };
+};
+const LAST_FOCUS = 'ion-last-focus';

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+import { registeredEffect } from './sheets-of-glass/interfaces';
+export * from './sheets-of-glass/interfaces';
+export { iosEnterAnimation as popoverEnterAnimation } from './popover/animations/ios.enter';
+export { iosLeaveAnimation as popoverLeaveAnimation } from './popover/animations/ios.leave';
+export * from './tab-bar-searchable';
+export * from './transition/ios.transition';
+export declare const registerTabBarEffect: (targetElement: HTMLElement) => registeredEffect | undefined;
+export declare const registerSegmentEffect: (targetElement: HTMLElement) => registeredEffect | undefined;
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEhE,cAAc,8BAA8B,CAAC;AAC7C,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,OAAO,EAAE,iBAAiB,IAAI,qBAAqB,EAAE,MAAM,gCAAgC,CAAC;AAC5F,cAAc,sBAAsB,CAAC;AACrC,cAAc,6BAA6B,CAAC;AAE5C,eAAO,MAAM,oBAAoB,GAAI,eAAe,WAAW,KAAG,gBAAgB,GAAG,SAOpF,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAAI,eAAe,WAAW,KAAG,gBAAgB,GAAG,SAerF,CAAC"}

package/dist/index.js

@@ -0,0 +1,30 @@
+import { registerEffect } from './sheets-of-glass';
+export * from './sheets-of-glass/interfaces';
+export { iosEnterAnimation as popoverEnterAnimation } from './popover/animations/ios.enter';
+export { iosLeaveAnimation as popoverLeaveAnimation } from './popover/animations/ios.leave';
+export * from './tab-bar-searchable';
+export * from './transition/ios.transition';
+export const registerTabBarEffect = (targetElement) => {
+    return registerEffect(targetElement, 'ion-tab-button', 'tab-selected', {
+        small: 'scale(1.1, 1)',
+        medium: 'scale(1.2)',
+        large: 'scale(1.3)',
+        xlarge: 'scale(1.15, 1.4)',
+    });
+};
+export const registerSegmentEffect = (targetElement) => {
+    const scale = !targetElement.classList.contains('segment-expand')
+        ? {
+            small: 'scale(1.35)',
+            medium: 'scale(1.45)',
+            large: 'scale(1.55)',
+            xlarge: 'scale(1.55, 1.65)',
+        }
+        : {
+            small: 'scale(1.02, 1.35)',
+            medium: 'scale(1.03, 1.45)',
+            large: 'scale(1.04, 1.55)',
+            xlarge: 'scale(1.05, 1.65)',
+        };
+    return registerEffect(targetElement, 'ion-segment-button', 'segment-button-checked', scale);
+};

package/dist/popover/animations/ios.enter.d.ts

@@ -0,0 +1,4 @@
+import type { Animation } from '@ionic/core';
+export declare const POPOVER_IOS_BODY_MARGIN = 8;
+export declare const iosEnterAnimation: (baseEl: HTMLElement, opts?: any) => Animation;
+//# sourceMappingURL=ios.enter.d.ts.map

package/dist/popover/animations/ios.enter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ios.enter.d.ts","sourceRoot":"","sources":["../../../src/popover/animations/ios.enter.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAK7C,eAAO,MAAM,uBAAuB,IAAI,CAAC;AAMzC,eAAO,MAAM,iBAAiB,GAAI,QAAQ,WAAW,EAAE,OAAO,GAAG,KAAG,SAmInE,CAAC"}

package/dist/popover/animations/ios.enter.js

@@ -0,0 +1,97 @@
+import { createAnimation } from '@ionic/core';
+import { getElementRoot } from '../../utils';
+import { calculateWindowAdjustment, getPopoverDimensions, getPopoverPosition } from '../utils';
+const POPOVER_IOS_BODY_PADDING = 5;
+export const POPOVER_IOS_BODY_MARGIN = 8;
+export const iosEnterAnimation = (baseEl, opts) => {
+    const { event: ev, size, trigger, reference, side, align } = opts;
+    const doc = baseEl.ownerDocument;
+    const isRTL = doc.dir === 'rtl';
+    const bodyWidth = doc.defaultView.innerWidth;
+    const bodyHeight = doc.defaultView.innerHeight;
+    const root = getElementRoot(baseEl);
+    const contentEl = root.querySelector('.popover-content');
+    const referenceSizeEl = trigger || ev?.detail?.ionShadowTarget || ev?.target;
+    const { contentWidth, contentHeight } = getPopoverDimensions(size, contentEl, referenceSizeEl);
+    const isReplace = (() => {
+        if (!['ion-button', 'ion-buttons'].includes(referenceSizeEl.localName)) {
+            return false;
+        }
+        if (referenceSizeEl.classList.contains('ios26-disabled')) {
+            return false;
+        }
+        return true;
+    })();
+    const defaultPosition = {
+        top: bodyHeight / 2 - contentHeight / 2,
+        left: bodyWidth / 2 - contentWidth / 2,
+        originX: isRTL ? 'right' : 'left',
+        originY: 'top',
+    };
+    const results = getPopoverPosition(isRTL, contentWidth, contentHeight, reference, side, align, defaultPosition, trigger, ev);
+    const padding = size === 'cover' ? 0 : POPOVER_IOS_BODY_PADDING;
+    const margin = size === 'cover' ? 0 : POPOVER_IOS_BODY_MARGIN;
+    const { originX, originY, top, left, bottom, checkSafeAreaLeft, checkSafeAreaRight, addPopoverBottomClass } = calculateWindowAdjustment(side, results.top, results.left, padding, bodyWidth, bodyHeight, contentWidth, contentHeight, margin, results.originX, results.originY, results.referenceCoordinates, referenceSizeEl.getBoundingClientRect(), isReplace);
+    const baseAnimation = createAnimation();
+    const backdropAnimation = createAnimation();
+    const contentAnimation = createAnimation();
+    const targetAnimation = createAnimation();
+    backdropAnimation
+        .delay(100)
+        .duration(300)
+        .addElement(root.querySelector('ion-backdrop'))
+        .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+        .beforeStyles({
+        'pointer-events': 'none',
+    })
+        .afterClearStyles(['pointer-events']);
+    contentAnimation
+        .easing('cubic-bezier(0, 1, 0.22, 1)')
+        .delay(100)
+        .duration(400)
+        .addElement(root.querySelector('.popover-content'))
+        .beforeStyles({ 'transform-origin': `${originY} ${originX}` })
+        .beforeAddWrite(() => {
+        root.querySelector('.popover-content').dataset['transformOrigin'] = `${originY} ${originX}`;
+    })
+        .fromTo('transform', 'scale(0)', 'scale(1)')
+        .fromTo('opacity', 0.01, 1);
+    if (isReplace) {
+        targetAnimation
+            .delay(0)
+            .duration(200)
+            .addElement(referenceSizeEl)
+            .beforeStyles({ 'transform-origin': `${originY} ${originX}` })
+            .beforeAddClass('ios26-replace-element')
+            .fromTo('transform', 'scale(1)', 'scale(1.05)')
+            .fromTo('opacity', 1, 0);
+    }
+    return baseAnimation
+        .easing('ease')
+        .delay(100)
+        .duration(100)
+        .beforeAddWrite(() => {
+        if (size === 'cover') {
+            baseEl.style.setProperty('--width', `${contentWidth}px`);
+        }
+        if (addPopoverBottomClass) {
+            baseEl.classList.add('popover-bottom');
+        }
+        if (bottom !== undefined) {
+            contentEl.style.setProperty('bottom', `${bottom}px`);
+        }
+        const safeAreaLeft = ' + var(--ion-safe-area-left, 0)';
+        const safeAreaRight = ' - var(--ion-safe-area-right, 0)';
+        let leftValue = `${left}px`;
+        if (checkSafeAreaLeft) {
+            leftValue = `${left}px${safeAreaLeft}`;
+        }
+        if (checkSafeAreaRight) {
+            leftValue = `${left}px${safeAreaRight}`;
+        }
+        contentEl.style.setProperty('top', `calc(${top}px + var(--offset-y, 0))`);
+        contentEl.style.setProperty('left', `calc(${leftValue} + var(--offset-x, 0))`);
+        contentEl.style.setProperty('transform-origin', `${originY} ${originX}`);
+    })
+        .addAnimation([backdropAnimation, contentAnimation, targetAnimation]);
+};

package/dist/popover/animations/ios.leave.d.ts

@@ -0,0 +1,3 @@
+import type { Animation } from '@ionic/core';
+export declare const iosLeaveAnimation: (baseEl: HTMLElement) => Animation;
+//# sourceMappingURL=ios.leave.d.ts.map

package/dist/popover/animations/ios.leave.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ios.leave.d.ts","sourceRoot":"","sources":["../../../src/popover/animations/ios.leave.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAK7C,eAAO,MAAM,iBAAiB,GAAI,QAAQ,WAAW,KAAG,SAmEvD,CAAC"}

package/dist/popover/animations/ios.leave.js

@@ -0,0 +1,60 @@
+import { createAnimation } from '@ionic/core';
+import { getElementRoot } from '../../utils';
+export const iosLeaveAnimation = (baseEl) => {
+    const root = getElementRoot(baseEl);
+    const contentEl = root.querySelector('.popover-content');
+    const arrowEl = root.querySelector('.popover-arrow');
+    const baseAnimation = createAnimation();
+    const backdropAnimation = createAnimation();
+    const contentAnimation = createAnimation();
+    const targetAnimation = createAnimation();
+    const doc = baseEl.ownerDocument;
+    const replaceElement = doc.querySelector('.ios26-replace-element');
+    if (replaceElement) {
+        const ratio = contentEl.getBoundingClientRect().width / contentEl.getBoundingClientRect().height;
+        const scale = ratio > 1 ? `${Math.min(1.2, 1.05 * ratio)}, 1.05` : `1.05, ${Math.min(1.2, 1.05 * ratio)}`;
+        targetAnimation
+            .addElement(replaceElement)
+            .delay(100)
+            .duration(300)
+            .afterRemoveClass('ios26-replace-element')
+            .fromTo('transform', `scale(${scale})`, 'scale(1)')
+            .fromTo('opacity', 0, 0.9);
+    }
+    backdropAnimation.addElement(root.querySelector('ion-backdrop')).fromTo('opacity', 'var(--backdrop-opacity)', 0);
+    contentAnimation
+        .duration(400)
+        .easing('ease')
+        .addElement(root.querySelector('.popover-arrow'))
+        .addElement(root.querySelector('.popover-content'))
+        .fromTo('opacity', 0.99, 0);
+    const popoverContentDataset = root.querySelector('.popover-content').dataset['transformOrigin'];
+    if (popoverContentDataset) {
+        contentAnimation.beforeStyles({ 'transform-origin': popoverContentDataset }).afterAddRead(() => {
+            root.querySelector('.popover-content').dataset['transformOrigin'] = '';
+        });
+        if (replaceElement) {
+            contentAnimation.fromTo('transform', 'scale(1)', 'scale(0.55)');
+        }
+        else {
+            contentAnimation.fromTo('transform', 'scale(1)', 'scale(0)');
+        }
+    }
+    return baseAnimation
+        .easing('ease')
+        .afterAddWrite(() => {
+        baseEl.style.removeProperty('--width');
+        baseEl.classList.remove('popover-bottom');
+        contentEl.style.removeProperty('top');
+        contentEl.style.removeProperty('left');
+        contentEl.style.removeProperty('bottom');
+        contentEl.style.removeProperty('transform-origin');
+        if (arrowEl) {
+            arrowEl.style.removeProperty('top');
+            arrowEl.style.removeProperty('left');
+            arrowEl.style.removeProperty('display');
+        }
+    })
+        .duration(300)
+        .addAnimation([backdropAnimation, contentAnimation, targetAnimation]);
+};

package/dist/popover/popover-interface.d.ts

@@ -0,0 +1,38 @@
+import type { AnimationBuilder, ComponentProps, ComponentRef, FrameworkDelegate, Mode, OverlayInterface } from '@ionic/core';
+export interface PopoverInterface extends OverlayInterface {
+    present: (event?: MouseEvent | TouchEvent | PointerEvent) => Promise<void>;
+}
+export interface PopoverOptions<T extends ComponentRef = ComponentRef> {
+    component: T;
+    componentProps?: ComponentProps<T>;
+    showBackdrop?: boolean;
+    backdropDismiss?: boolean;
+    translucent?: boolean;
+    cssClass?: string | string[];
+    event?: Event;
+    delegate?: FrameworkDelegate;
+    animated?: boolean;
+    focusTrap?: boolean;
+    mode?: Mode;
+    keyboardClose?: boolean;
+    id?: string;
+    htmlAttributes?: {
+        [key: string]: any;
+    };
+    enterAnimation?: AnimationBuilder;
+    leaveAnimation?: AnimationBuilder;
+    size?: PopoverSize;
+    dismissOnSelect?: boolean;
+    reference?: PositionReference;
+    side?: PositionSide;
+    alignment?: PositionAlign;
+    arrow?: boolean;
+    trigger?: string;
+    triggerAction?: string;
+}
+export type PopoverSize = 'cover' | 'auto';
+export type TriggerAction = 'click' | 'hover' | 'context-menu';
+export type PositionReference = 'trigger' | 'event';
+export type PositionSide = 'top' | 'right' | 'bottom' | 'left' | 'start' | 'end';
+export type PositionAlign = 'start' | 'center' | 'end';
+//# sourceMappingURL=popover-interface.d.ts.map

package/dist/popover/popover-interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"popover-interface.d.ts","sourceRoot":"","sources":["../../src/popover/popover-interface.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,cAAc,EAAE,YAAY,EAAE,iBAAiB,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE7H,MAAM,WAAW,gBAAiB,SAAQ,gBAAgB;IACxD,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,GAAG,YAAY,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAC5E;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,YAAY,GAAG,YAAY;IACnE,SAAS,EAAE,CAAC,CAAC;IACb,cAAc,CAAC,EAAE,cAAc,CAAC,CAAC,CAAC,CAAC;IACnC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAC7B,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,QAAQ,CAAC,EAAE,iBAAiB,CAAC;IAC7B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;IAExC,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAClC,cAAc,CAAC,EAAE,gBAAgB,CAAC;IAElC,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,SAAS,CAAC,EAAE,iBAAiB,CAAC;IAC9B,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,MAAM,MAAM,WAAW,GAAG,OAAO,GAAG,MAAM,CAAC;AAE3C,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,OAAO,GAAG,cAAc,CAAC;AAE/D,MAAM,MAAM,iBAAiB,GAAG,SAAS,GAAG,OAAO,CAAC;AACpD,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,CAAC;AACjF,MAAM,MAAM,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC"}

package/dist/popover/popover-interface.js

@@ -0,0 +1 @@
+export {};