@rdlabo/ionic-theme-ios26 1.3.3 → 2.0.0

package/dist/transition/index.js

@@ -0,0 +1,219 @@
+import { config } from '../utils';
+import { Build, writeTask } from '@stencil/core';
+import { LIFECYCLE_DID_ENTER, LIFECYCLE_DID_LEAVE, LIFECYCLE_WILL_ENTER, LIFECYCLE_WILL_LEAVE } from '@ionic/core';
+import { createFocusController } from '../focus-controller ';
+import { raf } from '../utils';
+const iosTransitionAnimation = () => import('./ios.transition');
+const focusController = createFocusController();
+export const transition = (opts) => {
+    return new Promise((resolve, reject) => {
+        writeTask(() => {
+            const transitioningInactiveHeader = getIosIonHeader(opts);
+            beforeTransition(opts, transitioningInactiveHeader);
+            runTransition(opts)
+                .then((result) => {
+                if (result.animation) {
+                    result.animation.destroy();
+                }
+                afterTransition(opts);
+                resolve(result);
+            }, (error) => {
+                afterTransition(opts);
+                reject(error);
+            })
+                .finally(() => {
+                setHeaderTransitionClass(transitioningInactiveHeader, false);
+            });
+        });
+    });
+};
+const beforeTransition = (opts, transitioningInactiveHeader) => {
+    const enteringEl = opts.enteringEl;
+    const leavingEl = opts.leavingEl;
+    focusController.saveViewFocus(leavingEl);
+    setZIndex(enteringEl, leavingEl, opts.direction);
+    setHeaderTransitionClass(transitioningInactiveHeader, true);
+    if (opts.showGoBack) {
+        enteringEl.classList.add('can-go-back');
+    }
+    else {
+        enteringEl.classList.remove('can-go-back');
+    }
+    setPageHidden(enteringEl, false);
+    enteringEl.style.setProperty('pointer-events', 'none');
+    if (leavingEl) {
+        setPageHidden(leavingEl, false);
+        leavingEl.style.setProperty('pointer-events', 'none');
+    }
+};
+const runTransition = async (opts) => {
+    const animationBuilder = await getAnimationBuilder(opts);
+    const ani = animationBuilder && Build.isBrowser ? animation(animationBuilder, opts) : noAnimation(opts);
+    return ani;
+};
+const afterTransition = (opts) => {
+    const enteringEl = opts.enteringEl;
+    const leavingEl = opts.leavingEl;
+    enteringEl.classList.remove('ion-page-invisible');
+    enteringEl.style.removeProperty('pointer-events');
+    if (leavingEl !== undefined) {
+        leavingEl.classList.remove('ion-page-invisible');
+        leavingEl.style.removeProperty('pointer-events');
+    }
+    focusController.setViewFocus(enteringEl);
+};
+const getAnimationBuilder = async (opts) => {
+    if (!opts.leavingEl || !opts.animated || opts.duration === 0) {
+        return undefined;
+    }
+    if (opts.animationBuilder) {
+        return opts.animationBuilder;
+    }
+    const getAnimation = (await iosTransitionAnimation()).iosTransitionAnimation;
+    return getAnimation;
+};
+const animation = async (animationBuilder, opts) => {
+    await waitForReady(opts, true);
+    const trans = animationBuilder(opts.baseEl, opts);
+    fireWillEvents(opts.enteringEl, opts.leavingEl);
+    const didComplete = await playTransition(trans, opts);
+    if (opts.progressCallback) {
+        opts.progressCallback(undefined);
+    }
+    if (didComplete) {
+        fireDidEvents(opts.enteringEl, opts.leavingEl);
+    }
+    return {
+        hasCompleted: didComplete,
+        animation: trans,
+    };
+};
+const noAnimation = async (opts) => {
+    const enteringEl = opts.enteringEl;
+    const leavingEl = opts.leavingEl;
+    const focusManagerEnabled = config.get('focusManagerPriority', false);
+    await waitForReady(opts, focusManagerEnabled);
+    fireWillEvents(enteringEl, leavingEl);
+    fireDidEvents(enteringEl, leavingEl);
+    return {
+        hasCompleted: true,
+    };
+};
+const waitForReady = async (opts, defaultDeep) => {
+    const deep = opts.deepWait !== undefined ? opts.deepWait : defaultDeep;
+    if (deep) {
+        await Promise.all([deepReady(opts.enteringEl), deepReady(opts.leavingEl)]);
+    }
+    await notifyViewReady(opts.viewIsReady, opts.enteringEl);
+};
+const notifyViewReady = async (viewIsReady, enteringEl) => {
+    if (viewIsReady) {
+        await viewIsReady(enteringEl);
+    }
+};
+const playTransition = (trans, opts) => {
+    const progressCallback = opts.progressCallback;
+    const promise = new Promise((resolve) => {
+        trans.onFinish((currentStep) => resolve(currentStep === 1));
+    });
+    if (progressCallback) {
+        trans.progressStart(true);
+        progressCallback(trans);
+    }
+    else {
+        trans.play();
+    }
+    return promise;
+};
+const fireWillEvents = (enteringEl, leavingEl) => {
+    lifecycle(leavingEl, LIFECYCLE_WILL_LEAVE);
+    lifecycle(enteringEl, LIFECYCLE_WILL_ENTER);
+};
+const fireDidEvents = (enteringEl, leavingEl) => {
+    lifecycle(enteringEl, LIFECYCLE_DID_ENTER);
+    lifecycle(leavingEl, LIFECYCLE_DID_LEAVE);
+};
+export const lifecycle = (el, eventName) => {
+    if (el) {
+        const ev = new CustomEvent(eventName, {
+            bubbles: false,
+            cancelable: false,
+        });
+        el.dispatchEvent(ev);
+    }
+};
+export const waitForMount = () => {
+    return new Promise((resolve) => raf(() => raf(() => resolve())));
+};
+export const deepReady = async (el) => {
+    const element = el;
+    if (element) {
+        if (element.componentOnReady != null) {
+            const stencilEl = await element.componentOnReady();
+            if (stencilEl != null) {
+                return;
+            }
+        }
+        else if (element.__registerHost != null) {
+            const waitForCustomElement = new Promise((resolve) => raf(resolve));
+            await waitForCustomElement;
+            return;
+        }
+        await Promise.all(Array.from(element.children).map(deepReady));
+    }
+};
+export const setPageHidden = (el, hidden) => {
+    if (hidden) {
+        el.setAttribute('aria-hidden', 'true');
+        el.classList.add('ion-page-hidden');
+    }
+    else {
+        el.hidden = false;
+        el.removeAttribute('aria-hidden');
+        el.classList.remove('ion-page-hidden');
+    }
+};
+const setZIndex = (enteringEl, leavingEl, direction) => {
+    if (enteringEl !== undefined) {
+        enteringEl.style.zIndex = direction === 'back' ? '99' : '101';
+    }
+    if (leavingEl !== undefined) {
+        leavingEl.style.zIndex = '100';
+    }
+};
+const setHeaderTransitionClass = (header, isTransitioning) => {
+    if (!header) {
+        return;
+    }
+    const transitionClass = 'header-transitioning';
+    if (isTransitioning) {
+        header.classList.add(transitionClass);
+    }
+    else {
+        header.classList.remove(transitionClass);
+    }
+};
+export const getIonPageElement = (element) => {
+    if (element.classList.contains('ion-page')) {
+        return element;
+    }
+    const ionPage = element.querySelector(':scope > .ion-page, :scope > ion-nav, :scope > ion-tabs');
+    if (ionPage) {
+        return ionPage;
+    }
+    return element;
+};
+const getIosIonHeader = (opts) => {
+    const enteringEl = opts.enteringEl;
+    const leavingEl = opts.leavingEl;
+    const direction = opts.direction;
+    const mode = opts.mode;
+    if (mode !== 'ios') {
+        return null;
+    }
+    const element = direction === 'back' ? leavingEl : enteringEl;
+    if (!element) {
+        return null;
+    }
+    return element.querySelector('ion-header');
+};

package/dist/transition/ios.transition.d.ts

@@ -0,0 +1,5 @@
+import type { Animation } from '@ionic/core/dist/types/utils/animation/animation-interface';
+import type { TransitionOptions } from './index';
+export declare const shadow: <T extends Element>(el: T) => ShadowRoot | T;
+export declare const iosTransitionAnimation: (navEl: HTMLElement, opts: TransitionOptions) => Animation;
+//# sourceMappingURL=ios.transition.d.ts.map

package/dist/transition/ios.transition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ios.transition.d.ts","sourceRoot":"","sources":["../../src/transition/ios.transition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,4DAA4D,CAAC;AAE5F,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAWjD,eAAO,MAAM,MAAM,GAAI,CAAC,SAAS,OAAO,EAAE,IAAI,CAAC,KAAG,UAAU,GAAG,CAE9D,CAAC;AA4dF,eAAO,MAAM,sBAAsB,GAAI,OAAO,WAAW,EAAE,MAAM,iBAAiB,KAAG,SA2UpF,CAAC"}