zumly 0.92.2 → 0.92.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +4 -2
- package/dist/zumly.css +1 -0
- package/dist/zumly.js +2 -2
- package/dist/zumly.min.css +1 -1
- package/dist/zumly.mjs +2 -2
- package/package.json +3 -2
- package/src/drivers/driver-helpers.js +11 -3
- package/types/zumly.d.ts +312 -0
package/README.md
CHANGED
|
@@ -8,9 +8,11 @@
|
|
|
8
8
|
<h1 align="center">ZUMLY</h1>
|
|
9
9
|
<p align="center"><em>Z over XY</em></p>
|
|
10
10
|
|
|
11
|
-
<p align="center"><strong>Focus-driven navigation.</strong></p>
|
|
12
|
-
<p align="center"><strong>Zoom into what matters.</strong></p>
|
|
11
|
+
<p align="center"><strong>Focus-driven navigation. Zoom into what matters.</strong></p>
|
|
13
12
|
|
|
13
|
+
<p align="center">
|
|
14
|
+
<a href="https://zumerlab.github.io/zumly/"><strong>Live Demo</strong></a>
|
|
15
|
+
</p>
|
|
14
16
|
<p align="center">
|
|
15
17
|
<a href="https://www.npmjs.com/package/zumly"><img src="https://img.shields.io/npm/v/zumly.svg" alt="npm version"></a>
|
|
16
18
|
</p>
|
package/dist/zumly.css
CHANGED
package/dist/zumly.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*
|
|
2
2
|
* zumly
|
|
3
|
-
* v.0.92.
|
|
3
|
+
* v.0.92.3
|
|
4
4
|
* Author Juan Martin Muda - Zumerlab
|
|
5
5
|
* License MIT
|
|
6
6
|
*/
|
|
7
|
-
var Xt=s=>{throw TypeError(s)};var kt=(s,t,e)=>t.has(s)||Xt("Cannot "+e);var S=(s,t,e)=>(kt(s,t,"read from private field"),e?e.call(s):t.get(s)),P=(s,t,e)=>t.has(s)?Xt("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(s):t.set(s,e),W=(s,t,e,r)=>(kt(s,t,"write to private field"),r?r.call(s,e):t.set(s,e),e),it=(s,t,e)=>(kt(s,t,"access private method"),e);var K,vt,Yt,pt=class{constructor(t={}){P(this,vt);P(this,K,{});W(this,K,t)}async resolve(t,e=null){if(typeof t=="string"&&Object.prototype.hasOwnProperty.call(S(this,K),t)){let o=S(this,K)[t];return this.resolve(o,e)}switch(it(this,vt,Yt).call(this,t)){case"html":{let o=document.createElement("div");o.innerHTML=t.trim();let n=o.firstElementChild;if(!n)throw new Error("Zumly: view produced no element (html)");return n}case"url":{let o=new AbortController,n=setTimeout(()=>o.abort(),1e4),i;try{i=await fetch(t,{signal:o.signal})}finally{clearTimeout(n)}if(!i.ok)throw new Error(`Zumly: fetch failed for "${t}" (${i.status})`);let a=await i.text(),c=document.createElement("div");c.innerHTML=a.trim();let l=c.firstElementChild;if(!l)throw new Error("Zumly: view produced no element (url)");return l}case"function":{let o=e&&e.target||document.createElement("div"),n=await t({...e,target:o});if(typeof n=="string")return this.resolve(n,e);if(n instanceof HTMLElement)return n;let i=o.firstElementChild||o;return i.classList.contains("z-view")||i.classList.add("z-view"),i}case"object":{let o=await t.render(e);if(typeof o!="string")throw new Error("Zumly: view render() must return string");return this.resolve(o,e)}case"element":return t.cloneNode(!0);case"webcomponent":return await customElements.whenDefined(t),document.createElement(t);default:throw new Error("Zumly: unknown view type for source")}}};K=new WeakMap,vt=new WeakSet,Yt=function(t){return typeof t=="function"?"function":t instanceof HTMLElement?"element":typeof t=="object"&&t!==null&&typeof t.render=="function"?"object":typeof t!="string"?"unknown":/^https?:\/\/|^\/|\.html$|\.php$/i.test(t)?"url":t.includes("<")?"html":t.includes("-")?"webcomponent":"unknown"};async function at(s,t,e,r,o,n){if(!s||!s.classList){let i=document.createElement("div");i.classList.add("z-view"),s&&i.appendChild(s),s=i}else s.classList.contains("z-view")||s.classList.add("z-view");return s.dataset.viewName=t,s.getAttribute("aria-label")||s.setAttribute("aria-label",`View: ${t}`),s.style.transformOrigin="0 0",s.style.position="absolute",r?s.classList.add("is-current-view"):s.classList.add("is-new-current-view","has-no-events","hide"),e.append(s),typeof o[t]=="object"&&typeof o[t].mounted=="function"&&await o[t].mounted(),s}function k(s,t,e){t&&e==="welcome"&&console.info(`%c Zumly %c ${t}`,"background: #424085; color: white; border-radius: 3px;","color: #424085"),t&&s&&(e==="info"||e===void 0)&&console.info(`%c Zumly %c ${t}`,"background: #6679A3; color: #304157; border-radius: 3px;","color: #6679A3"),t&&e==="warn"&&console.warn(`%c Zumly %c ${t}`,"background: #DCBF53; color: #424085; border-radius: 3px;","color: #424085"),t&&e==="error"&&console.error(`%c Zumly %c ${t}`,"background: #BE4747; color: white; border-radius: 3px;","color: #424085")}function Ut(s,t){if(t.isValid=!1,!s||typeof s!="object"){k(!1,"'options' object has to be provided when instance is defined","error");return}if(typeof s.mount!="string"){k(!1,"'mount' must be a string selector","error");return}if(t.mount=s.mount,typeof s.initialView!="string"){k(!1,"'initialView' must be a string","error");return}if(t.initialView=s.initialView,!s.views||typeof s.views!="object"){k(!1,"'views' must be an object","error");return}t.views=s.views,t.isValid=!0,t.preload=Array.isArray(s.preload)?s.preload:[],t.debug=typeof s.debug=="boolean"?s.debug:!1,t.componentContext=s.componentContext&&typeof s.componentContext=="object"?s.componentContext:new Map;let e=s.transitions&&typeof s.transitions=="object"?s.transitions:null,r=e&&e.cover,o=typeof r=="string"?r.toLowerCase():null,n=o==="width"||o==="height";t.cover=n?o:"width",!n&&e&&r!==void 0&&k(!1,`'transitions.cover' must be either "width" or "height". Falling back to "width".`,"warn"),t.duration=e&&typeof e.duration=="string"?e.duration:"1s",t.ease=e&&typeof e.ease=="string"?e.ease:"ease-in-out",t.deferred=typeof s.deferred=="boolean"?s.deferred:!1;let i=e&&e.hideTrigger;i===!0||i==="fade"?t.hideTrigger=i:(t.hideTrigger=!1,i!=null&&i!==!1&&k(!1,`'transitions.hideTrigger' must be true or "fade". Falling back to false.`,"warn"));let a=e&&e.effects;Array.isArray(a)&&a.length>=2&&typeof a[0]=="string"&&typeof a[1]=="string"?t.effects=[a[0],a[1]]:Array.isArray(a)&&a.length===1&&typeof a[0]=="string"?t.effects=[a[0],a[0]]:(t.effects=["none","none"],a!=null&&k(!1,`'transitions.effects' must be an array of 1-2 CSS filter strings (e.g. ["blur(3px)", "blur(8px) saturate(0)"]). Falling back to no effects.`,"warn"));let c=e&&e.driver,l=typeof c=="string"?c.toLowerCase():null,u=typeof c=="function"?c:null;if(l!==null){let y=["css","waapi","none","anime","gsap","motion"];t.transitionDriver=y.includes(l)?l:"css",y.includes(l)||k(!1,`'transitions.driver' must be "css", "waapi", "none", "anime", "gsap", "motion", or a function. Got "${c}". Falling back to "css".`,"warn")}else u!==null?t.transitionDriver=u:t.transitionDriver="css";let f=e&&e.stagger;typeof f=="number"&&f>0?t.stagger=f:(t.stagger=0,f!=null&&f!==0&&k(!1,"'transitions.stagger' must be a positive number (ms). Falling back to 0 (disabled).","warn")),t.parallax=0,t.threshold=null;let h=e&&e.threshold;h&&typeof h=="object"&&h.enabled&&(t.threshold={duration:typeof h.duration=="number"&&h.duration>0?h.duration:300,commitAt:typeof h.commitAt=="number"&&h.commitAt>0&&h.commitAt<=1?h.commitAt:.5});let d=s.lateralNav;if(d===!1)t.lateralNav=!1;else if(d&&typeof d=="object"){let y=typeof d.mode=="string"?d.mode.toLowerCase():null,g=y==="auto"||y==="always";y&&!g&&k(!1,`'lateralNav.mode' must be "auto" or "always". Falling back to "auto".`,"warn"),t.lateralNav={mode:g?y:"auto",arrows:typeof d.arrows=="boolean"?d.arrows:!0,dots:typeof d.dots=="boolean"?d.dots:!0,keepAlive:d.keepAlive===!0||d.keepAlive==="visible"?d.keepAlive:!1}}else t.lateralNav={mode:"auto",arrows:!0,dots:!0,keepAlive:!1};let m=s.depthNav;if(m===!1)t.depthNav=!1;else if(m&&typeof m=="object"){let y=typeof m.position=="string"?m.position.toLowerCase():null,g=y==="bottom-left"||y==="top-left";y&&!g&&k(!1,`'depthNav.position' must be "bottom-left" or "top-left". Falling back to "bottom-left".`,"warn"),t.depthNav={position:g?y:"bottom-left"}}else t.depthNav={position:"bottom-left"};let p=s.lateralNav&&typeof s.lateralNav=="object"?s.lateralNav.position:void 0;if(t.lateralNav&&typeof t.lateralNav=="object"){let y=p==="bottom-center"||p==="top-center";p&&!y&&k(!1,`'lateralNav.position' must be "bottom-center" or "top-center". Falling back to "bottom-center".`,"warn"),t.lateralNav.position=y?p:"bottom-center"}let v=s.inputs;v&&typeof v=="object"?t.inputs={wheel:typeof v.wheel=="boolean"?v.wheel:!0,keyboard:typeof v.keyboard=="boolean"?v.keyboard:!0,click:typeof v.click=="boolean"?v.click:!0,touch:typeof v.touch=="boolean"?v.touch:!0}:t.inputs={wheel:!0,keyboard:!0,click:!0,touch:!0}}function Wt(s,t,e,r,o){let n=e/s,i=r/t;return o==="height"?{scale:i,scaleInv:1/i}:{scale:n,scaleInv:1/n}}function Kt(s,t,e,r){let o=t.left,n=t.top,i=s.x-o+(s.width-e.width*r)/2,a=s.y-n+(s.height-e.height*r)/2;return`translate(${i}px, ${a}px) scale(${r})`}function Gt(s,t,e){let r=t.left,o=t.top,n=s.x-r+(s.width-e.width)/2,i=s.y-o+(s.height-e.height)/2;return`translate(${n}px, ${i}px)`}function Qt(s,t){let e=s.x+s.width/2-t.x,r=s.y+s.height/2-t.y;return`${e}px ${r}px`}function Jt(s,t,e,r,o=0){let n=s.width/2-t.width/2-t.x+e.x,i=s.height/2-t.height/2-t.y+e.y,a=1-o,c=n*a,l=i*a;return{x:n,y:i,transform:`translate(${c}px, ${l}px) scale(${r})`}}function te({canvasRect:s,canvasOffset:t,triggerRect:e,previousViewRectAtBaseTransform:r,lastViewZoomedElementRect:o,previousViewRectWithPreviousAtEndTransform:n,scale:i,preScale:a,parallax:c=0}){let l=t.left,u=t.top,f=s.width/2-e.width/2-e.x,h=s.height/2-e.height/2-e.y,d=f+(r.x-o.x)+n.x-l+(n.width-o.width)/2,m=h+(r.y-o.y)+n.y-u+(n.height-o.height)/2,p=1-Math.min(c*2,.9);return`translate(${d*p}px, ${m*p}px) scale(${i*a})`}function ee(s,t,e,r,o){return`translate(${s-e.left}px, ${t-e.top}px) scale(${r*o})`}function yt(s){let t=s.split(/\s+/);return{x:parseFloat(t[0])||0,y:parseFloat(t[1])||0}}function lt(s){let t=s.match(/translate\(\s*([-\d.]+)px[,\s]+([-\d.]+)px\s*\)/),e=s.match(/scale\(\s*([-\d.]+)\s*\)/);return{tx:t?parseFloat(t[1]):0,ty:t?parseFloat(t[2]):0,scale:e?parseFloat(e[1]):1}}function wt(s,t,e,r,o,n,i,a,c,l){let u=t.x-e.x*(1-n)-r,f=t.y-e.y*(1-n)-o,h=t.width/n,d=t.height/n,m=u+e.x+(s.x-u-e.x-r)/n,p=f+e.y+(s.y-f-e.y-o)/n,v=s.width/n,y=s.height/n,g=u+i.x+a+l*(m-u-i.x),w=f+i.y+c+l*(p-f-i.y),b=v*l,T=y*l;return{x:g,y:w,width:b,height:T,left:g,top:w,right:g+b,bottom:w+T}}function ct(s,t,e){return{viewName:s,backwardState:t,forwardState:e}}function se(s){return{detachedNode:s}}function re(s,t,e,r,o){let n=[];return t!==null&&n.push(t),e!==null&&n.push(e),r!==null&&n.push(r),o!==null&&n.push(o),{zoomLevel:s,views:n}}function oe(s){let t=s.views?.[3];if(!(!t||!(t.detachedNode instanceof Node)))return t.detachedNode}var Z,gt=class{constructor(){P(this,Z,new Map)}set(t,e,r=null){S(this,Z).set(t,{node:e,expires:r?Date.now()+r:null})}get(t){let e=S(this,Z).get(t);return e?e.expires!==null&&Date.now()>e.expires?(S(this,Z).delete(t),null):e.node.cloneNode(!0):null}has(t){let e=S(this,Z).get(t);return e?e.expires!==null&&Date.now()>e.expires?(S(this,Z).delete(t),!1):!0:!1}invalidate(t){S(this,Z).delete(t)}clear(){S(this,Z).clear()}};Z=new WeakMap;var De=300*1e3,He=/^https?:\/\/|^\/|\.html$|\.php$/i,G,Q,J,V,tt,ne,ie,bt=class{constructor(t={}){P(this,tt);P(this,G);P(this,Q);P(this,J);P(this,V,new Map);W(this,J,t),W(this,G,new pt(t)),W(this,Q,new gt)}async get(t,e=null){if(it(this,tt,ne).call(this,t)){let r=S(this,Q).get(t);if(r)return r;if(S(this,V).has(t))return S(this,V).get(t);let o=(async()=>{let n=await S(this,G).resolve(t,e),i=S(this,J)[t],a=it(this,tt,ie).call(this,i);return S(this,Q).set(t,n,a),S(this,V).delete(t),n})();return S(this,V).set(t,o),o}return S(this,G).resolve(t,e)}async preloadEager(t,e=null){!Array.isArray(t)||t.length===0||await Promise.all(t.map(r=>this.get(r,e)))}prefetch(t,e=null){this.get(t,e).catch(()=>{})}prefetchOnHover(t,e=null){this.prefetch(t,e)}scanAndPrefetch(t,e=null){if(!t||!t.querySelectorAll)return;t.querySelectorAll(".zoom-me[data-to]").forEach(o=>{let n=o.dataset.to;n&&(o.hasAttribute("role")||o.setAttribute("role","button"),o.hasAttribute("aria-label")||o.setAttribute("aria-label",`Zoom to ${n}`),this.prefetch(n,e))})}};G=new WeakMap,Q=new WeakMap,J=new WeakMap,V=new WeakMap,tt=new WeakSet,ne=function(t){return typeof S(this,J)[t]=="string"},ie=function(t){return He.test(t)?De:null};function et(s){s&&(s.style.contentVisibility="hidden")}function X(s){s&&(s.style.contentVisibility="visible")}function F(s){if(typeof s=="number"&&!Number.isNaN(s))return Math.max(0,s);let e=String(s).match(/^(\d+(?:\.\d+)?)\s*(ms|s)?$/i);if(!e)return 500;let r=parseFloat(e[1]);return(e[2]||"s").toLowerCase()==="ms"?Math.max(0,r):Math.max(0,r*1e3)}function St(s){return F(s)/1e3}function E(s,t){if(s.classList.contains("is-new-current-view")){let e=t.views[0].forwardState;s.classList.replace("is-new-current-view","is-current-view"),s.classList.remove("zoom-current-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform;return}if(s.classList.contains("is-previous-view")){let e=t.views[1].forwardState;s.classList.remove("zoom-previous-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform;return}if(s.classList.contains("is-last-view")){let e=t.views[2].forwardState;s.classList.remove("zoom-last-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform}}function C(s,t){s.classList.remove("zoom-previous-view-reverse","has-no-events","has-effect","has-effect-reverse"),s.style.removeProperty("--z-effect-filter"),s.style.transformOrigin="0 0",s.style.transform=t.transform}function O(s,t){s.classList.remove("zoom-last-view-reverse","has-no-events","has-effect","has-effect-reverse"),s.style.removeProperty("--z-effect-filter"),s.style.transformOrigin=t.origin,s.style.transform=t.transform}function z(s,t){try{t&&t.removeChild(s)}catch{try{s.parentElement&&t.removeChild(s.parentElement)}catch{}}}function L(...s){for(let t of s)t&&(t.classList.remove("hide"),X(t))}function H(s,t){let{currentView:e,previousView:r,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformEnd:c,currentStage:l,canvas:u}=s,f=l.views[0];L(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=f.forwardState.origin,e.style.transform=c||f.forwardState.transform,o&&n&&(o.style.transform=n.transformEnd),i&&a&&(i.style.transform=a.transformEnd),s.keepAlive||z(r,u),t()}var j=150;function R(s,t){let e=!1,r=setTimeout(()=>{e||(e=!0,s())},t);return{finish(){e||(e=!0,clearTimeout(r),s())},safetyTimer:r}}function ae(){return{a:1,b:0,c:0,d:1,e:0,f:0}}function je(s){if(!s||s==="none")return ae();let t=String(s).match(/matrix\(([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+)\)/);return t?{a:parseFloat(t[1])||1,b:parseFloat(t[2])||0,c:parseFloat(t[3])||0,d:parseFloat(t[4])||1,e:parseFloat(t[5])||0,f:parseFloat(t[6])||0}:ae()}function rt(s){return`matrix(${s.a}, ${s.b}, ${s.c}, ${s.d}, ${s.e}, ${s.f})`}function st(s,t,e){return s+(t-s)*e}function ot(s,t,e){let r=Math.max(0,Math.min(1,e));return{a:st(s.a,t.a,r),b:st(s.b,t.b,r),c:st(s.c,t.c,r),d:st(s.d,t.d,r),e:st(s.e,t.e,r),f:st(s.f,t.f,r)}}function $(s,t,e){s.style.transformOrigin=t,s.style.transform=e;try{s.getBoundingClientRect()}catch{}return je(getComputedStyle(s).transform)}function le(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,duration:a,ease:c,canvas:l}=s;if(!r||!o||!i){t();return}e==="lateral"?Re(s,t):e==="zoomIn"?qe(r,o,n,i,a,c,t):e==="zoomOut"?Be(r,o,n,i,a,c,l,t):t()}function Re(s,t){let{currentView:e,previousView:r,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformStart:c,incomingTransformEnd:l,outgoingTransform:u,outgoingTransformEnd:f,currentStage:h,duration:d,ease:m,canvas:p}=s,v=F(d),y=h.views[0];L(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=y.forwardState.origin,o&&n&&(N(o,d,m,{"--lateral-from":n.transformStart,"--lateral-to":n.transformEnd}),o.classList.add("zoom-lateral-back")),i&&a&&(N(i,d,m,{"--lateral-from":a.transformStart,"--lateral-to":a.transformEnd}),i.classList.add("zoom-lateral-back")),s.keepAlive!=="visible"&&(N(r,d,m,{"--lateral-out-from":u,"--lateral-out-to":f}),r.classList.add("zoom-lateral-out")),N(e,d,m,{"--lateral-in-from":c,"--lateral-in-to":l}),e.classList.add("zoom-lateral-in");let g=s.keepAlive==="visible"?[e]:[r,e];o&&n&&g.push(o),i&&a&&g.push(i);let w=g.length,{finish:b}=R(()=>{Ct(g,T),s.keepAlive?(r.classList.remove("zoom-lateral-out"),r.style.opacity=""):z(r,p),o&&(o.classList.remove("zoom-lateral-back"),o.style.transform=n?.transformEnd||o.style.transform),i&&(i.classList.remove("zoom-lateral-back"),i.style.transform=a?.transformEnd||i.style.transform),e.classList.remove("zoom-lateral-in"),e.style.transform=l,t()},v+j);function T(M){let q=M?.target;q&&q.removeEventListener("animationend",T),w--,w<=0&&b()}g.forEach(M=>M.addEventListener("animationend",T))}function qe(s,t,e,r,o,n,i){L(s,t,e);let a=r.stagger||0;N(s,o,n,{"--current-view-transform-start":r.views[0].backwardState.transform,"--current-view-transform-end":r.views[0].forwardState.transform}),a>0&&s.style.setProperty("animation-delay","0ms"),N(t,o,n,{"--previous-view-transform-start":r.views[1].backwardState.transform,"--previous-view-transform-end":r.views[1].forwardState.transform}),a>0&&t.style.setProperty("animation-delay",`${a}ms`),e&&(N(e,o,n,{"--last-view-transform-start":r.views[2].backwardState.transform,"--last-view-transform-end":r.views[2].forwardState.transform}),a>0&&e.style.setProperty("animation-delay",`${a*2}ms`)),s.classList.add("zoom-current-view"),t.classList.add("zoom-previous-view"),e&&e.classList.add("zoom-last-view");let c=e?[s,t,e]:[s,t],l=c.length,u=F(o),f=e?a*2:a,{finish:h}=R(()=>{Ct(c,d),c.forEach(m=>m.style.removeProperty("animation-delay")),i()},u+f+j);function d(m){let p=m?.target;if(p&&p.removeEventListener("animationend",d),p?.isConnected)try{E(p,r)}catch{}l--,l<=0&&h()}c.forEach(m=>m.addEventListener("animationend",d))}function Be(s,t,e,r,o,n,i,a){let c=r.views[0],l=r.views[1],u=e&&r.views[2]?r.views[2]:null,f=r.stagger||0;N(s,o,n,{"--current-view-transform-start":c.backwardState.transform,"--current-view-transform-end":c.forwardState.transform}),f>0&&s.style.setProperty("animation-delay","0ms"),N(t,o,n,{"--previous-view-transform-start":l.backwardState.transform,"--previous-view-transform-end":l.forwardState.transform}),f>0&&t.style.setProperty("animation-delay",`${f}ms`),e&&u&&(N(e,o,n,{"--last-view-transform-start":u.backwardState.transform,"--last-view-transform-end":u.forwardState.transform}),f>0&&e.style.setProperty("animation-delay",`${f*2}ms`)),s.classList.add("zoom-current-view-reverse"),t.classList.add("zoom-previous-view-reverse"),e&&e.classList.add("zoom-last-view-reverse");let h=e?[s,t,e]:[s,t],d=h.length,m=F(o),p=e?f*2:f,{finish:v}=R(()=>{Ct(h,y),h.forEach(g=>g.style.removeProperty("animation-delay")),a()},m+p+j);function y(g){let w=g?.target;if(w&&w.removeEventListener("animationend",y),w?.isConnected)try{Ve(w,r,i)}catch{}d--,d<=0&&v()}h.forEach(g=>g.addEventListener("animationend",y))}function Ve(s,t,e){if(s.classList.contains("zoom-current-view-reverse")){z(s,e);return}if(s.classList.contains("zoom-previous-view-reverse")){C(s,t.views[1].backwardState);return}s.classList.contains("zoom-last-view-reverse")&&O(s,t.views[2].backwardState)}function N(s,t,e,r){s.style.setProperty("--zoom-duration",t),s.style.setProperty("--zoom-ease",e);for(let[o,n]of Object.entries(r))s.style.setProperty(o,n)}function Ct(s,t){for(let e of s)e?.removeEventListener&&e.removeEventListener("animationend",t)}function ce(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,canvas:a}=s;if(!r||!o||!i){t();return}if(e==="lateral"){H(s,t);return}if(e==="zoomIn"){L(r,o,n),E(r,i),E(o,i),n&&E(n,i),t();return}if(e==="zoomOut"){z(r,a),L(o,n),C(o,i.views[1].backwardState),n&&O(n,i.views[2].backwardState),t();return}t()}function fe(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,duration:a,ease:c,canvas:l}=s;if(!r||!o||!i){t();return}let u=F(a);if(e==="lateral"){Ue(s,u,c,t);return}if(e==="zoomIn"){Xe(r,o,n,i,u,c,t);return}if(e==="zoomOut"){Ye(r,o,n,i,u,c,l,t);return}t()}function Xe(s,t,e,r,o,n,i){L(s,t,e);let a=r.views[0],c=r.views[1],l=e&&r.views[2]?r.views[2]:null;s.style.transformOrigin=a.backwardState.origin,s.style.transform=a.backwardState.transform,t.style.transformOrigin=c.backwardState.origin,t.style.transform=c.backwardState.transform,l&&(e.style.transformOrigin=l.backwardState.origin,e.style.transform=l.backwardState.transform);let u=r.stagger||0,f=[];f.push(s.animate([{transform:a.backwardState.transform},{transform:a.forwardState.transform}],{duration:o,easing:n,fill:"forwards"})),f.push(t.animate([{transform:c.backwardState.transform},{transform:c.forwardState.transform}],{duration:o,delay:u,easing:n,fill:"forwards"})),l&&f.push(e.animate([{transform:l.backwardState.transform},{transform:l.forwardState.transform}],{duration:o,delay:u*2,easing:n,fill:"forwards"}));let h=l?u*2:u,{finish:d}=R(()=>{Ot(f);try{E(s,r),E(t,r),e&&E(e,r)}catch{}i()},o+h+j);Promise.all(f.map(m=>m.finished)).then(d).catch(d)}function Ye(s,t,e,r,o,n,i,a){let c=r.views[0],l=r.views[1],u=e&&r.views[2]?r.views[2]:null,f=l.backwardState,h=u?u.backwardState:null;s.style.transformOrigin=c.forwardState.origin,s.style.transform=c.forwardState.transform,requestAnimationFrame(()=>{requestAnimationFrame(()=>{t.style.transformOrigin=l.forwardState.origin,e&&u&&(e.style.transformOrigin=u.forwardState.origin);let d=t.style.transform||getComputedStyle(t).transform||l.forwardState.transform,m=e&&u?e.style.transform||getComputedStyle(e).transform||u.forwardState.transform:null,p=r.stagger||0,v=[];v.push(s.animate([{transform:c.forwardState.transform},{transform:c.backwardState.transform}],{duration:o,easing:n,fill:"forwards"})),v.push(t.animate([{transform:d},{transform:f.transform}],{duration:o,delay:p,easing:n,fill:"both"})),e&&h&&v.push(e.animate([{transform:m},{transform:h.transform}],{duration:o,delay:p*2,easing:n,fill:"both"})),t.style.removeProperty("transform"),e&&e.style.removeProperty("transform");let y=e&&h?p*2:p,{finish:g}=R(()=>{Ot(v);try{z(s,i),C(t,f),e&&h&&O(e,h)}catch{}a()},o+y+j);Promise.all(v.map(w=>w.finished)).then(g).catch(g)})})}function Ue(s,t,e,r){let{currentView:o,previousView:n,backView:i,backViewState:a,lastView:c,lastViewState:l,incomingTransformStart:u,incomingTransformEnd:f,outgoingTransform:h,outgoingTransformEnd:d,currentStage:m,canvas:p}=s,v=m.views[0];L(o),o.classList.replace("is-new-current-view","is-current-view"),o.classList.remove("zoom-current-view","has-no-events"),o.style.transformOrigin=v.forwardState.origin;let y=[];y.push(o.animate([{transform:u,opacity:0},{transform:f,opacity:1}],{duration:t,easing:e,fill:"forwards"})),s.keepAlive!=="visible"&&y.push(n.animate([{transform:h,opacity:1},{transform:d,opacity:0}],{duration:t,easing:e,fill:"forwards"})),i&&a&&y.push(i.animate([{transform:a.transformStart},{transform:a.transformEnd}],{duration:t,easing:e,fill:"forwards"})),c&&l&&y.push(c.animate([{transform:l.transformStart},{transform:l.transformEnd}],{duration:t,easing:e,fill:"forwards"}));let{finish:g}=R(()=>{Ot(y),o.style.transform=f||v.forwardState.transform,i&&a&&(i.style.transform=a.transformEnd),c&&l&&(c.style.transform=l.transformEnd),s.keepAlive?(n.style.opacity="",n.style.transform=d):z(n,p),r()},t+j);Promise.all(y.map(w=>w.finished)).then(g).catch(g)}function Ot(s){for(let t of s)try{t.cancel()}catch{}}function ue(s,t){let e=typeof globalThis<"u"&&globalThis.anime;if(!e||typeof e!="function"){console.warn('Zumly anime driver: Anime.js not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.2/anime.min.js"></script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:c,ease:l,canvas:u}=s;if(!o||!n||!a){t();return}let f=F(c);r==="lateral"?H(s,t):r==="zoomIn"?We(e,o,n,i,a,f,l,t):r==="zoomOut"?Ke(e,o,n,i,a,f,l,u,t):t()}function We(s,t,e,r,o,n,i,a){L(t,e,r);let c=o.views[0],l=o.views[1],u=r&&o.views[2]?o.views[2]:null,f=he([{el:t,backward:c.backwardState,forward:c.forwardState},{el:e,backward:l.backwardState,forward:l.forwardState},...u?[{el:r,backward:u.backwardState,forward:u.forwardState}]:[]],"forward");de(f,0);let h=o.stagger||0,d=n+(u?h*2:h),m={value:0};s({targets:m,value:1,duration:d,easing:pe(i),update:()=>{let p=m.value*d;me(f,p,n,h)},complete:()=>{E(t,o),E(e,o),r&&E(r,o),a()}})}function Ke(s,t,e,r,o,n,i,a,c){let l=o.views[0],u=o.views[1],f=r&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null,m=he([{el:t,backward:l.backwardState,forward:l.forwardState},{el:e,backward:u.backwardState,forward:u.forwardState},...f?[{el:r,backward:f.backwardState,forward:f.forwardState}]:[]],"backward");de(m,0);let p=o.stagger||0,v=n+(f?p*2:p),y={value:0};s({targets:y,value:1,duration:v,easing:pe(i),update:()=>{let g=y.value*v;me(m,g,n,p)},complete:()=>{z(t,a),C(e,h),r&&d&&O(r,d),c()}})}function he(s,t){return s.map(({el:e,backward:r,forward:o})=>{if(t==="forward"){let n=$(e,r.origin,r.transform),i=$(e,r.origin,o.transform);return{el:e,from:n,to:i}}else{let n=$(e,o.origin,o.transform),i=$(e,o.origin,r.transform);return{el:e,from:n,to:i}}})}function de(s,t){for(let{el:e,from:r,to:o}of s)e.style.transform=rt(ot(r,o,t))}function me(s,t,e,r){for(let o=0;o<s.length;o++){let{el:n,from:i,to:a}=s[o],c=o*r,l=Math.max(0,t-c),u=e>0?Math.min(1,l/e):1;n.style.transform=rt(ot(i,a,u))}}function pe(s){if(typeof s!="string")return"easeInOutQuad";let t=s.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOutQuad":t.includes("ease-in")?"easeInQuad":t.includes("ease-out")?"easeOutQuad":t}function ve(s,t){let e=typeof globalThis<"u"&&globalThis.gsap;if(!e||typeof e.to!="function"){console.warn('Zumly GSAP driver: GSAP not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"></script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:c,ease:l,canvas:u}=s;if(!o||!n||!a){t();return}let f=St(c);r==="lateral"?H(s,t):r==="zoomIn"?Ge(e,o,n,i,a,f,l,t):r==="zoomOut"?Qe(e,o,n,i,a,f,l,u,t):t()}function Ge(s,t,e,r,o,n,i,a){L(t,e,r);let c=o.views[0],l=o.views[1],u=r&&o.views[2]?o.views[2]:null;Et(t,c.backwardState),Et(e,l.backwardState),u&&Et(r,u.backwardState);let f=s.timeline({onComplete:()=>{E(t,o),E(e,o),r&&E(r,o),a()}}),h=ye(i),d=(o.stagger||0)/1e3;f.to(t,{transform:c.forwardState.transform,duration:n,ease:h},0),f.to(e,{transform:l.forwardState.transform,duration:n,ease:h},d),u&&f.to(r,{transform:u.forwardState.transform,duration:n,ease:h},d*2)}function Qe(s,t,e,r,o,n,i,a,c){let l=o.views[0],u=o.views[1],f=r&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null;Et(t,l.forwardState);let m=e.style.transform||getComputedStyle(e).transform||u.forwardState.transform,p=r&&f?r.style.transform||getComputedStyle(r).transform||f.forwardState.transform:null;e.style.transformOrigin=u.forwardState.origin,r&&f&&(r.style.transformOrigin=f.forwardState.origin);let v=ye(i),y=s.timeline({onComplete:()=>{z(t,a),C(e,h),r&&d&&O(r,d),c()}}),g=(o.stagger||0)/1e3;s.set(e,{transform:m}),r&&p&&s.set(r,{transform:p}),y.fromTo(t,{transform:l.forwardState.transform},{transform:l.backwardState.transform,duration:n,ease:v},0),y.fromTo(e,{transform:m},{transform:h.transform,duration:n,ease:v},g),r&&d&&y.fromTo(r,{transform:p},{transform:d.transform,duration:n,ease:v},g*2)}function Et(s,t){s.style.transformOrigin=t.origin,s.style.transform=t.transform}function ye(s){if(typeof s!="string")return"power2.inOut";let t=s.toLowerCase();return t==="linear"?"none":t.includes("ease-in-out")?"power2.inOut":t.includes("ease-in")?"power2.in":t.includes("ease-out")?"power2.out":t}function we(s,t){let e=es();if(!e||typeof e!="function"){console.warn('Zumly Motion driver: Motion not loaded. Add <script src="https://cdn.jsdelivr.net/npm/motion@11/dist/motion.min.js"></script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:c,ease:l,canvas:u}=s;if(!o||!n||!a){t();return}let f=St(c);r==="lateral"?H(s,t):r==="zoomIn"?Je(e,o,n,i,a,f,l,t):r==="zoomOut"?ts(e,o,n,i,a,f,l,u,t):t()}function Je(s,t,e,r,o,n,i,a){L(t,e,r);let c=ge(t,e,r,o,"forward");be(c,0);let l=o.stagger||0,u=l/1e3,f=n*1e3,h=n+(c.length>2?u*2:u);s(0,1,{duration:h,ease:Ee(i),onUpdate:m=>{let p=m*h*1e3;Se(c,p,f,l)}}).then(()=>{E(t,o),E(e,o),r&&E(r,o),a()}).catch(()=>a())}function ts(s,t,e,r,o,n,i,a,c){let l=o.views[1],u=r&&o.views[2]?o.views[2]:null,f=l.backwardState,h=u?u.backwardState:null,d=ge(t,e,r,o,"backward");be(d,0);let m=o.stagger||0,p=m/1e3,v=n*1e3,y=n+(d.length>2?p*2:p);s(0,1,{duration:y,ease:Ee(i),onUpdate:w=>{let b=w*y*1e3;Se(d,b,v,m)}}).then(()=>{z(t,a),C(e,f),r&&h&&O(r,h),c()}).catch(()=>c())}function ge(s,t,e,r,o){let n=r.views[0],i=r.views[1],a=e&&r.views[2]?r.views[2]:null,c=[{el:s,backward:n.backwardState,forward:n.forwardState},{el:t,backward:i.backwardState,forward:i.forwardState}];return a&&c.push({el:e,backward:a.backwardState,forward:a.forwardState}),c.map(({el:l,backward:u,forward:f})=>o==="forward"?{el:l,from:$(l,u.origin,u.transform),to:$(l,u.origin,f.transform)}:{el:l,from:$(l,f.origin,f.transform),to:$(l,f.origin,u.transform)})}function be(s,t){for(let{el:e,from:r,to:o}of s)e.style.transform=rt(ot(r,o,t))}function Se(s,t,e,r){for(let o=0;o<s.length;o++){let{el:n,from:i,to:a}=s[o],c=o*r,l=Math.max(0,t-c),u=e>0?Math.min(1,l/e):1;n.style.transform=rt(ot(i,a,u))}}function es(){let s=typeof globalThis<"u"?globalThis:typeof window<"u"?window:{};return s.motion?.animate||s.Motion?.animate||s.animate}function Ee(s){if(typeof s!="string")return"easeInOut";let t=s.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOut":t.includes("ease-in")?"easeIn":t.includes("ease-out")?"easeOut":s}var _e={css:le,waapi:fe,none:ce,anime:ue,gsap:ve,motion:we};function xe(s){if(typeof s=="function")return{runTransition(r,o){s(r,o)}};let t=typeof s=="string"?s.toLowerCase():"css";return{runTransition:_e[t]||_e.css}}function ss(s){if(typeof s!="string"||s.trim()==="")return{tx:0,ty:0,rest:""};let t=s.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(!t)return null;let e=parseFloat(t[1]),r=parseFloat(t[2]),o=s.replace(/translate\s*\([^)]+\)\s*/,"").trim();return{tx:e,ty:r,rest:o}}function At(s,t,e){let r=ss(s);if(r===null)return s;let o=r.tx*t,n=r.ty*e,i=r.rest?` ${r.rest}`:"";return`translate(${o}px, ${n}px)${i}`.trim()}function rs(s){if(typeof s!="string"||!s.trim())return null;let t=s.trim().match(/^([-\d.eE]+)px\s+([-\d.eE]+)px$/);return t?{x:parseFloat(t[1]),y:parseFloat(t[2])}:null}function Pt(s,t,e){let r=rs(s);return r===null?s:`${r.x*t}px ${r.y*e}px`}function It(s,t,e,r,o){if(!s.storedViews?.length||!s.canvas||t<=0||e<=0)return;let n=r/t,i=o/e;for(let d of s.storedViews){let m=d.views;if(Array.isArray(m))for(let p=0;p<m.length;p++){let v=m[p];!v||v.detachedNode||(v.backwardState&&(v.backwardState.transform=At(v.backwardState.transform,n,i),v.backwardState.origin!=null&&(v.backwardState.origin=Pt(v.backwardState.origin,n,i))),v.forwardState&&(v.forwardState.transform=At(v.forwardState.transform,n,i),v.forwardState.origin!=null&&(v.forwardState.origin=Pt(v.forwardState.origin,n,i))))}}let a=s.canvas,c=a.querySelector(".is-current-view"),l=a.querySelector(".is-previous-view"),u=a.querySelector(".is-last-view"),f=a.querySelector(".is-new-current-view"),h=[c,l,u,f].filter(Boolean);for(let d of h){if(!d.style)continue;let m=d.style.transform;m!=null&&m!==""&&(d.style.transform=At(m,n,i));let p=d.style.transformOrigin;p!=null&&p!==""&&(d.style.transformOrigin=Pt(p,n,i))}}var os=8e3,ut=class{constructor(t){if(this.storedViews=[],this.currentStage=null,this.debug=!1,this.trace=[],this.blockEvents=!1,this._blockEventsSafetyTimer=null,this.touchstartX=0,this.touchstartY=0,this.touchendX=0,this.touchendY=0,this.touching=!1,this.lateralHistory=[],this._lastCanvasWidth=0,this._lastCanvasHeight=0,this._pendingResizeCorrection=!1,this._destroyed=!1,this._hooks={},this._plugins=[],Ut(t,this),!this.isValid){this.notify("is unable to start: invalid or missing required options (mount, initialView, views).","error");return}if(this.canvas=document.querySelector(this.mount),!this.canvas){this.notify(`mount selector "${this.mount}" did not match any element.`,"error"),this.isValid=!1;return}this.transitionDriver=xe(this.transitionDriver),this._onZoom=this.onZoom.bind(this),this._onTouchStart=this.onTouchStart.bind(this),this._onTouchEnd=this.onTouchEnd.bind(this),this._onKeyUp=this.onKeyUp.bind(this),this._onWheel=this.onWheel.bind(this),this._wheelCooldown=!1,this._onPrefetchTrigger=e=>{e.target.classList.contains("zoom-me")&&e.target.dataset.to&&this.prefetcher.prefetch(e.target.dataset.to,{trigger:e.target,...e.target.dataset})},this._onResize=this._handleResize.bind(this),this._resizeDebounceTimer=null,this._RESIZE_DEBOUNCE_MS=80,this.prefetcher=new bt(this.views),this._bindEvents()}_bindEvents(){let t=this.canvas;t&&(t.setAttribute("tabindex","0"),t.setAttribute("role","application"),t.setAttribute("aria-roledescription","zoomable interface"),t.setAttribute("aria-live","polite"),t.addEventListener("mouseup",this._onZoom,!1),t.addEventListener("touchend",this._onZoom,!1),t.addEventListener("touchstart",this._onTouchStart,{passive:!0}),t.addEventListener("touchend",this._onTouchEnd,!1),t.addEventListener("keyup",this._onKeyUp,!1),t.addEventListener("wheel",this._onWheel,{passive:!1}),t.addEventListener("mouseover",this._onPrefetchTrigger,{passive:!0}),t.addEventListener("focusin",this._onPrefetchTrigger,{passive:!0}),window.addEventListener("resize",this._onResize,{passive:!0}),typeof ResizeObserver<"u"&&(this._resizeObserver=new ResizeObserver(()=>this._handleResize()),this._resizeObserver.observe(t)))}_unbindEvents(){let t=this.canvas;t&&(t.removeEventListener("mouseup",this._onZoom,!1),t.removeEventListener("touchend",this._onZoom,!1),t.removeEventListener("touchstart",this._onTouchStart),t.removeEventListener("touchend",this._onTouchEnd,!1),t.removeEventListener("keyup",this._onKeyUp,!1),t.removeEventListener("wheel",this._onWheel),t.removeEventListener("mouseover",this._onPrefetchTrigger),t.removeEventListener("focusin",this._onPrefetchTrigger)),window.removeEventListener("resize",this._onResize),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}_setBlockEvents(){this.blockEvents=!0,this._clearBlockEventsSafety(),this._blockEventsSafetyTimer=setTimeout(()=>{this.blockEvents&&!this._destroyed&&(this.notify("blockEvents safety timeout: driver did not call onComplete. Force-resetting.","warn"),this.blockEvents=!1,this._onTransitionComplete())},os)}_clearBlockEventsSafety(){this._blockEventsSafetyTimer!==null&&(clearTimeout(this._blockEventsSafetyTimer),this._blockEventsSafetyTimer=null)}storeViews(t){this.tracing("storedViews()"),this.storedViews.push(t),this.debug&&console.debug("Zumly storedViews",t)}tracing(t){if(this.debug)if(t==="ended"){let e=this.trace.map((r,o)=>`${o===0?`Instance ${this.instance}: ${r}`:`${r}`}`).join(" > ");this.notify(e),this.trace=[]}else this.trace.push(t)}notify(t,e){return k(this.debug,t,e)}_recordCanvasSize(){if(!this.canvas)return;let t=this.canvas.getBoundingClientRect();this._lastCanvasWidth=t.width,this._lastCanvasHeight=t.height}_handleResize(){this._destroyed||(this._resizeDebounceTimer&&clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=setTimeout(()=>{if(this._resizeDebounceTimer=null,!this.isValid||!this.canvas||this._lastCanvasWidth===0)return;let t=this.canvas.getBoundingClientRect(),e=t.width,r=t.height;if(!(e===this._lastCanvasWidth&&r===this._lastCanvasHeight)){if(this.blockEvents){this._pendingResizeCorrection=!0;return}It(this,this._lastCanvasWidth,this._lastCanvasHeight,e,r),this._lastCanvasWidth=e,this._lastCanvasHeight=r}},this._RESIZE_DEBOUNCE_MS))}_onTransitionComplete(){if(this._clearBlockEventsSafety(),this._pendingResizeCorrection&&!this.blockEvents){this._pendingResizeCorrection=!1;let t=this.canvas?.getBoundingClientRect();if(t&&this._lastCanvasWidth>0){let e=t.width,r=t.height;(e!==this._lastCanvasWidth||r!==this._lastCanvasHeight)&&It(this,this._lastCanvasWidth,this._lastCanvasHeight,e,r),this._lastCanvasWidth=e,this._lastCanvasHeight=r}}else this._recordCanvasSize();this._manageFocus()}_manageFocus(){if(!this.canvas)return;let t=this.canvas.querySelector(".is-current-view");if(!t)return;let e=t.querySelector('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])');e?e.focus({preventScroll:!0}):(t.setAttribute("tabindex","-1"),t.focus({preventScroll:!0}))}_resolveEffects(t){let e=t?.dataset?.withEffects;if(e&&typeof e=="string"){let r=e.split("|").map(o=>o.trim());return[r[0]||"none",r[1]||r[0]||"none"]}return this.effects}_applyEffects(t,e,r,o,n){!r||r[0]==="none"&&r[1]==="none"||(t&&r[0]!=="none"&&(t.style.setProperty("--z-effect-filter",r[0]),t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("has-effect")),e&&r[1]!=="none"&&(e.style.setProperty("--z-effect-filter",r[1]),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("has-effect")))}_removeEffect(t){if(!t||!t.classList.contains("has-effect"))return;t.classList.remove("has-effect"),t.classList.add("has-effect-reverse");let e=()=>{t.classList.remove("has-effect-reverse"),t.style.removeProperty("--z-effect-filter"),t.removeEventListener("transitionend",e)};t.addEventListener("transitionend",e,{once:!0});let r=t.style.getPropertyValue("--zoom-duration");setTimeout(e,r?parseFloat(r)*(r.includes("ms")?1:1e3)+100:1100)}_resolveHideTrigger(t){return t?.dataset?.hideTrigger!==void 0?t.dataset.hideTrigger==="fade"?"fade":!0:this.hideTrigger}_applyHideTrigger(t,e,r,o,n){!r||!t||(r==="fade"?(t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("z-trigger-fade"),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("z-view-fade-in"),e.offsetHeight,e.classList.remove("hide")):t.classList.add("z-trigger-hidden"))}_restoreHideTrigger(t,e,r,o){if(!(!e||!t))if(e==="fade"){t.classList.remove("z-trigger-fade"),t.style.setProperty("--zoom-duration",r),t.style.setProperty("--zoom-ease",o),t.classList.add("z-trigger-fade-reverse");let n=()=>{t.classList.remove("z-trigger-fade-reverse"),t.style.removeProperty("--zoom-duration"),t.style.removeProperty("--zoom-ease"),t.removeEventListener("transitionend",n)};t.addEventListener("transitionend",n,{once:!0}),setTimeout(n,parseFloat(r)*(r.includes("ms")?1:1e3)+100)}else t.classList.remove("z-trigger-hidden")}on(t,e){var r;return typeof e!="function"?this:(((r=this._hooks)[t]||(r[t]=[])).push(e),this)}use(t,e){if(!t)return this;let r={plugin:t,options:e};return this._plugins.push(r),this._initialized&&this._installPlugin(r),this}_installPlugin(t){let{plugin:e,options:r}=t;try{typeof e=="function"?e(this,r):typeof e.install=="function"&&e.install(this,r)}catch(o){this.notify(`plugin install error: ${o.message}`,"error")}}off(t,e){return e?this._hooks[t]&&(this._hooks[t]=this._hooks[t].filter(r=>r!==e)):delete this._hooks[t],this}_emit(t,e={}){let r=this._hooks[t];if(!(!r||r.length===0))for(let o of r)try{o(e)}catch(n){this.debug&&console.error(`Zumly hook "${t}" threw:`,n)}}zoomLevel(){return this.storedViews.length}getZoomLevel(){return this.zoomLevel()}getCurrentViewName(){return!this.storedViews||this.storedViews.length===0?null:this.storedViews[this.storedViews.length-1]?.views?.[0]?.viewName??null}back(){if(!this._destroyed){if(this.lateralHistory&&this.lateralHistory.length>0){let t=this.lateralHistory.pop(),e=t&&typeof t=="object"?t.name:t,r=t&&typeof t=="object"?t.entry:void 0,o=t&&typeof t=="object"?t.node:void 0;return this._doLateral(e,!0,{savedEntry:r,keepAliveNode:o})}this.zoomOut()}}async goTo(t,e={}){return this._destroyed?void 0:(e.mode==="lateral"?"lateral":"depth")==="depth"?this.zoomTo(t,e):this._doLateral(t,!1,e)}async zoomTo(t,e={}){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("zoomTo() cannot run: instance is invalid or canvas not found.","error");return}if(typeof t!="string"||!t){this.notify("zoomTo() requires a non-empty view name.","warn");return}if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`zoomTo("${t}"): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}if(this.getCurrentViewName()===t)return;let o=this.canvas.getBoundingClientRect(),n=Math.max(40,o.width*.1),i=Math.max(40,o.height*.1),c={rect:{x:o.left+(o.width-n)/2,y:o.top+(o.height-i)/2,width:n,height:i},duration:e.duration??this.duration,ease:e.ease??this.ease,props:e.props??{}};await this._doZoomIn(t,c)}async init(){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("init() cannot run: instance is invalid or canvas element was not found.","error");return}this.tracing("init()"),this.preload&&this.preload.length&&await this.prefetcher.preloadEager(this.preload,null);let t=await this.prefetcher.get(this.initialView,null),e=await at(t,this.initialView,this.canvas,!0,this.views,this.componentContext);this._emit("viewMounted",{viewName:this.initialView,node:e}),this.prefetcher.scanAndPrefetch(e,null),this.storeViews({zoomLevel:this.storedViews.length,scale:1,views:[{viewName:this.initialView,backwardState:{origin:"0 0",transform:""}}]}),this.currentStage=this.storedViews[this.storedViews.length-1],this._recordCanvasSize(),this._initialized=!0;for(let r of this._plugins)this._installPlugin(r)}destroy(){this._destroyed||(this._emit("destroy"),this._destroyed=!0,this._clearBlockEventsSafety(),this._resizeDebounceTimer&&(clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=null),this._unbindEvents(),this._removeNav(),this._cleanupLateralKeepAlive(),this.blockEvents=!1,this.storedViews=[],this.currentStage=null,this.lateralHistory=[],this.trace=[],this._hooks={},this.prefetcher=null,this.transitionDriver=null,this.canvas&&(this.canvas.removeAttribute("tabindex"),this.canvas.removeAttribute("role"),this.canvas.removeAttribute("aria-roledescription"),this.canvas.removeAttribute("aria-live")),this.isValid=!1)}async _doZoomIn(t,e){if(this._destroyed)return;this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomIn",{viewName:t}),this.tracing("zoomIn()");let r=this.canvas,o=e.el,n=r.getBoundingClientRect(),i=n.left,a=n.top,l=(this.storedViews.length>0?this.storedViews[this.storedViews.length-1]:null)?.scale??1;this.tracing("getView()");let u=o?{trigger:o,target:document.createElement("div"),context:this.componentContext,props:Object.assign({},o.dataset)}:{target:document.createElement("div"),context:this.componentContext,props:e.props??{}},f=o?.dataset?.deferred!==void 0?!0:this.deferred,h,d=null;if(f){let _=await this.prefetcher.get(t,u);if(this._destroyed)return;for(d=document.createDocumentFragment();_.firstChild;)d.appendChild(_.firstChild);h=await at(_,t,r,!1,{},this.componentContext)}else{let _=await this.prefetcher.get(t,u);if(this._destroyed)return;this.prefetcher.scanAndPrefetch(_,u),h=await at(_,t,r,!1,this.views,this.componentContext)}if(!h)return;f||this._emit("viewMounted",{viewName:t,node:h}),o&&o.classList.add("zoomed");let m=o?(()=>{let _=o.getBoundingClientRect();return{x:_.x,y:_.y,width:_.width,height:_.height}})():e.rect,p=o?o.dataset.withDuration||this.duration:e.duration??this.duration,v=o?o.dataset.withEase||this.ease:e.ease??this.ease,y=o?o.dataset.withCover||this.cover:e.cover??this.cover,g=o?parseInt(o.dataset.withStagger,10)||this.stagger:e.stagger??this.stagger,w=r.querySelector(".is-current-view"),b=r.querySelector(".is-previous-view"),T=r.querySelector(".is-last-view");et(h),et(w),et(b),T&&(et(T),r.removeChild(T));let M,q,nt,x,A,D,I,ze=w.style.transform,$t=w.style.transformOrigin,ke=b?b.style.transform:null,Nt=b?b.style.transformOrigin:null;try{w.classList.replace("is-current-view","is-previous-view"),b&&b.classList.replace("is-previous-view","is-last-view");let _=h.getBoundingClientRect(),B=w.getBoundingClientRect(),Lt=null,Mt=null,dt=null;b&&(Lt=b.getBoundingClientRect(),dt=b.querySelector(".zoomed"),Mt=dt&&dt.getBoundingClientRect?dt.getBoundingClientRect():Lt);let mt={left:i,top:a},Ft={width:n.width,height:n.height},Dt={width:_.width,height:_.height},Ht=Wt(m.width,m.height,_.width,_.height,y);I=Ht.scale;let $e=Ht.scaleInv;M=Kt(m,mt,Dt,$e),nt=w.style.transform;let jt=Qt(m,B);x=Jt(Ft,m,B,I,this.parallax);let Rt=yt($t||"0 0"),Y=lt(nt||""),qt=yt(jt),U=lt(x.transform),Bt=m;if(o&&(Bt=wt(m,B,Rt,Y.tx,Y.ty,Y.scale,qt,U.tx,U.ty,U.scale)),q=Gt(Bt,mt,Dt),b){A=b.style.transform;let Ne=wt(B,B,Rt,Y.tx,Y.ty,Y.scale,qt,U.tx,U.ty,U.scale),Me=ee(x.x,x.y,mt,I,l),Vt=yt(Nt||"0 0"),Tt=lt(A||""),zt=lt(Me),Fe=wt(Mt,Lt,Vt,Tt.tx,Tt.ty,Tt.scale,Vt,zt.tx,zt.ty,zt.scale);D=te({canvasRect:Ft,canvasOffset:mt,triggerRect:m,previousViewRectAtBaseTransform:B,lastViewZoomedElementRect:Fe,previousViewRectWithPreviousAtEndTransform:Ne,scale:I,preScale:l,parallax:this.parallax})}h.style.transform=M,w.style.transformOrigin=jt}catch(_){this.notify(`zoomIn geometry computation failed: ${_.message}. Aborting zoom.`,"error"),this.debug&&console.error("Zumly _doZoomIn error:",_),w.style.transform=ze,w.style.transformOrigin=$t,w.classList.contains("is-previous-view")&&w.classList.replace("is-previous-view","is-current-view"),b&&(b.style.transform=ke,b.style.transformOrigin=Nt,b.classList.contains("is-last-view")&&b.classList.replace("is-last-view","is-previous-view"));try{r.removeChild(h)}catch{}X(w),X(b);return}let Ce=ct(h.dataset.viewName,{origin:h.style.transformOrigin,duration:p,ease:v,transform:M},{origin:h.style.transformOrigin,duration:p,ease:v,transform:q}),Oe=ct(w.dataset.viewName,{origin:w.style.transformOrigin,duration:p,ease:v,transform:nt},{origin:w.style.transformOrigin,duration:p,ease:v,transform:x.transform}),Ae=b?ct(b.dataset.viewName,{origin:b.style.transformOrigin,duration:p,ease:v,transform:A},{origin:b.style.transformOrigin,duration:p,ease:v,transform:D}):null,Pe=T?se(T):null,ht=re(this.storedViews.length,Ce,Oe,Ae,Pe);ht.scale=I,ht.stagger=g||0,this.storeViews(ht),this.currentStage=this.storedViews[this.storedViews.length-1],this.tracing("setCSSVariables()");let Ie=this._resolveEffects(o);this._applyEffects(w,b,Ie,p,v);let xt=this._resolveHideTrigger(o);this._applyHideTrigger(o,h,xt,p,v),xt&&(ht.hideTriggerMode=xt),this._setBlockEvents();let Ze={type:"zoomIn",currentView:h,previousView:w,lastView:b,currentStage:this.currentStage,duration:p,ease:v};this.transitionDriver.runTransition(Ze,async()=>{f&&d&&h&&!this._destroyed&&(h.appendChild(d),this.prefetcher.scanAndPrefetch(h,u),typeof this.views[t]=="object"&&typeof this.views[t].mounted=="function"&&await this.views[t].mounted(),this._emit("viewMounted",{viewName:t,node:h})),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterZoomIn",{viewName:t,zoomLevel:this.zoomLevel()}),this.tracing("ended")})}async zoomIn(t){this._destroyed||t?.dataset?.to&&await this._doZoomIn(t.dataset.to,{el:t})}async _doLateral(t,e=!1,r={}){if(this._destroyed||!this.isValid||!this.canvas)return;if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`goTo("${t}", { mode: 'lateral' }): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}let o=this.canvas.querySelector(".is-current-view");if(!o)return;let n=o.dataset?.viewName;if(n===t)return;this._emit("beforeLateral",{viewName:t,from:n,isBack:e});let i=this.lateralNav&&this.lateralNav.keepAlive;if(!e){this.lateralHistory=this.lateralHistory||[];let x=this.storedViews[this.storedViews.length-1];this.lateralHistory.push({name:n,entry:x.views[0],node:i?o:null})}this.tracing("lateral()");let a=r.duration??this.duration,c=r.ease??this.ease,l=this.canvas.querySelector(".is-previous-view"),u=this.canvas.querySelector(".is-last-view"),f=0,h=0;if(l){let x=l.querySelector(`.zoom-me[data-to="${n}"]`),A=l.querySelector(`.zoom-me[data-to="${t}"]`);if(x&&A){let D=x.getBoundingClientRect(),I=A.getBoundingClientRect();f=D.left+D.width/2-(I.left+I.width/2),h=D.top+D.height/2-(I.top+I.height/2)}else f=this.canvas.getBoundingClientRect().width*.15}let d=null,m=null;if(i&&(e&&r.keepAliveNode?m=r.keepAliveNode:m=this.canvas.querySelector(`.is-lateral-hidden[data-view-name="${t}"]`)),m){if(m.style.display="",m.style.opacity="",m.classList.remove("is-lateral-hidden","zoom-lateral-out"),m.classList.add("is-new-current-view","has-no-events"),d=m,!e&&this.lateralHistory){let x=this.lateralHistory.findIndex(A=>A.node===m);x!==-1&&this.lateralHistory.splice(x,1)}}else{let x={target:document.createElement("div"),context:this.componentContext,props:r.props??{}},A=await this.prefetcher.get(t,x);if(this._destroyed||(this.prefetcher.scanAndPrefetch(A,x),d=await at(A,t,this.canvas,!1,this.views,this.componentContext),!d))return;this._emit("viewMounted",{viewName:t,node:d})}et(d);let p=o.style.transform||"",v=o.style.transformOrigin||"0 0";d.style.transform=p,d.style.transformOrigin=v;let y=this.storedViews[this.storedViews.length-1],g=e&&r.savedEntry?{...r.savedEntry,viewName:t}:ct(t,{origin:v,duration:a,ease:c,transform:p},{origin:v,duration:a,ease:c,transform:p});y.views[0]=g,this.currentStage=y;let w=l?{transformStart:l.style.transform||"",transformEnd:this._computeLateralBackTransform(l.style.transform||"",f,h)}:null,b=u&&y.views[2]?{transformStart:u.style.transform||"",transformEnd:this._computeLateralBackTransform(u.style.transform||"",f*.7,h*.7)}:null;w&&y.views[1]&&(y.views[1].forwardState={...y.views[1].forwardState,transform:w.transformEnd}),b&&y.views[2]&&(y.views[2].forwardState={...y.views[2].forwardState,transform:b.transformEnd});let T=p,M=this._computeLateralBackTransform(T,-f,-h),q=this._computeLateralBackTransform(p,f,h);this._setBlockEvents();let nt={type:"lateral",currentView:d,previousView:o,lastView:u||null,backView:l||null,backViewState:w,lastViewState:b,incomingTransformStart:M,incomingTransformEnd:T,outgoingTransform:p,outgoingTransformEnd:q,currentStage:this.currentStage,duration:a,ease:c,canvas:this.canvas,slideDeltaX:f,slideDeltaY:h,keepAlive:i&&!e?i:!1};this.transitionDriver.runTransition(nt,()=>{i&&!e&&(o.classList.remove("is-current-view","is-new-current-view","has-no-events"),o.classList.add("is-lateral-hidden"),i!=="visible"?o.style.display="none":(o.style.transform=p,o.style.opacity="")),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterLateral",{viewName:t,from:n,isBack:e}),this.tracing("ended")})}_computeLateralBackTransform(t,e,r){let o=t.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(o){let n=parseFloat(o[1])+e,i=parseFloat(o[2])+r,a=t.replace(/translate\s*\([^)]+\)\s*/,"");return`translate(${n}px, ${i}px) ${a}`.trim()}return`translate(${e}px, ${r}px) ${t}`.trim()}zoomOut(){if(this._destroyed)return;this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("zoomOut()");let t=this.canvas,e=t.querySelector(".is-current-view"),r=t.querySelector(".is-previous-view");if(!e||!r){this.notify("zoomOut: current or previous view not found (animation may still be running)","warn");return}this._setBlockEvents(),this.currentStage=this.storedViews[this.storedViews.length-1];let o=t.querySelector(".is-last-view");this.tracing("setCSSVariables()");let n=this.currentStage.views[0]?.forwardState?.duration??this.duration,i=this.currentStage.views[0]?.forwardState?.ease??this.ease,a=r.querySelector(".zoomed");a&&a.classList.remove("zoomed");let c=this.currentStage.hideTriggerMode;c&&a&&this._restoreHideTrigger(a,c,n,i),c==="fade"?(e.classList.remove("z-view-fade-in"),e.style.setProperty("--zoom-duration",n),e.style.setProperty("--zoom-ease",i),e.classList.add("z-view-fade-out")):(e.classList.remove("z-view-fade-in"),e.style.removeProperty("opacity")),this._removeEffect(r),r.classList.replace("is-previous-view","is-current-view"),o!==null&&(o.classList.contains("has-effect")&&this.effects[0]!=="none"&&o.style.setProperty("--z-effect-filter",this.effects[0]),o.classList.replace("is-last-view","is-previous-view"),o.classList.remove("hide"),X(o));let l=oe(this.currentStage);if(l){t.prepend(l);let f=t.querySelector(".z-view:first-child");f&&(X(f),f.classList.add("hide"))}let u={type:"zoomOut",currentView:e,previousView:r,lastView:o,currentStage:this.currentStage,duration:n,ease:i,canvas:t};this.transitionDriver.runTransition(u,()=>{this.blockEvents=!1,this._onTransitionComplete(),this.storedViews.pop(),this._updateNav(),this._emit("afterZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("ended")})}onZoom(t){if(this._destroyed||t.type==="mouseup"&&!this.inputs.click||t.type==="touchend"&&!this.inputs.touch)return;let e=t.target;if(e.closest(".z-depth-nav")||e.closest(".z-lateral-nav"))return;let r=e.classList.contains("zoom-me")||e.closest(".zoom-me");if(!this.blockEvents&&r&&!this.touching){this.tracing("onZoom() \u2192 zoomIn"),t.stopPropagation();let o=e.classList.contains("zoom-me")?e:e.closest(".zoom-me");this.zoomIn(o);return}if(this.storedViews.length>1&&!this.blockEvents&&!r&&!this.touching){let o=this.canvas.querySelector(".is-current-view");if(o&&o.contains(e))return;let n=this._findSiblingTriggerAtPoint(t.clientX,t.clientY);if(n){this.tracing("onZoom() \u2192 lateral"),t.stopPropagation(),this._doLateral(n.dataset.to);return}this.tracing("onZoom() \u2192 zoomOut"),t.stopPropagation(),this.zoomOut()}}_findSiblingTriggerAtPoint(t,e){let r=this.canvas.querySelector(".is-previous-view");if(!r)return null;let n=this.canvas.querySelector(".is-current-view")?.dataset?.viewName;if(!n)return null;let i=r.querySelectorAll(".zoom-me[data-to]");for(let a of i){if(a.dataset.to===n)continue;let c=a.getBoundingClientRect();if(t>=c.left&&t<=c.right&&e>=c.top&&e<=c.bottom)return a}return null}_getSiblings(){let t=this.canvas.querySelector(".is-previous-view");if(!t)return{siblings:[],currentIndex:-1};let r=this.canvas.querySelector(".is-current-view")?.dataset?.viewName,o=t.querySelectorAll(".zoom-me[data-to]"),n=[];for(let a of o)a.dataset.to&&n.push(a.dataset.to);let i=n.indexOf(r);return{siblings:n,currentIndex:i}}_updateNav(){this._destroyed||(this._removeNav(),this._updateDepthNav(),this._updateLateralNav())}_updateDepthNav(){if(!this.depthNav||this.storedViews.length-1<1)return;let e=this.canvas.querySelector(".z-view.is-current-view");if(e&&e.querySelector(".z-depth-nav"))return;let r=this.depthNav.position||"bottom-left",o=document.createElement("div");o.className="z-depth-nav z-depth-nav--"+r;let n=document.createElement("button");n.className="z-nav-back",n.setAttribute("aria-label","Zoom out (go back)"),n.innerHTML="‹",n.addEventListener("mouseup",i=>{i.stopPropagation(),!this.blockEvents&&this.storedViews.length>1&&this.zoomOut()}),o.appendChild(n),this.canvas.appendChild(o)}_updateLateralNav(){if(!this.lateralNav)return;let t=this.storedViews.length-1,e=this._getSiblings();if(e.siblings.length<2)return;if(this.lateralNav.mode==="auto"&&t>=1){let a=this.canvas.querySelector(".z-view.is-current-view");if(a&&a.offsetWidth>=this.canvas.offsetWidth&&a.offsetHeight>=this.canvas.offsetHeight)return}let{siblings:r,currentIndex:o}=e,n=this.lateralNav.position||"bottom-center",i=document.createElement("div");if(i.className="z-lateral-nav z-lateral-nav--"+n,this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-prev",a.setAttribute("aria-label","Previous sibling view"),a.innerHTML="‹",a.disabled=o<=0,a.addEventListener("mouseup",c=>{c.stopPropagation(),o>0&&this._doLateral(r[o-1])}),i.appendChild(a)}if(this.lateralNav.dots){let a=document.createElement("div");a.className="z-nav-lateral-dots";for(let c=0;c<r.length;c++){let l=document.createElement("button");l.className="z-nav-dot z-nav-lat-dot"+(c===o?" is-active":""),l.setAttribute("aria-label",`Go to ${r[c]}`),l.dataset.to=r[c],l.addEventListener("mouseup",(u=>f=>{f.stopPropagation(),u!==o&&this._doLateral(r[u])})(c)),a.appendChild(l)}i.appendChild(a)}if(this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-next",a.setAttribute("aria-label","Next sibling view"),a.innerHTML="›",a.disabled=o>=r.length-1,a.addEventListener("mouseup",c=>{c.stopPropagation(),o<r.length-1&&this._doLateral(r[o+1])}),i.appendChild(a)}this.canvas.appendChild(i)}_removeNav(){this.canvas&&this.canvas.querySelectorAll(".z-depth-nav, .z-lateral-nav").forEach(t=>t.remove())}_cleanupLateralKeepAlive(){if(!this.canvas)return;let t=this.canvas.querySelectorAll(".is-lateral-hidden");for(let e of t)e.remove()}onKeyUp(t){this._destroyed||this.inputs.keyboard&&(this.tracing("onKeyUp()"),(t.key==="ArrowLeft"||t.key==="ArrowDown")&&(t.preventDefault(),this.storedViews.length>1&&!this.blockEvents?this.zoomOut():this.notify(`is on level zero. Can't zoom out. Trigger: ${t.key}`,"warn")),(t.key==="ArrowRight"||t.key==="ArrowUp")&&(t.preventDefault(),this.notify(t.key+" has no actions defined")))}onWheel(t){this._destroyed||this.inputs.wheel&&(this._isInsideScrollable(t.target,t.deltaY)||(t.preventDefault(),!(this.blockEvents||this._wheelCooldown)&&t.deltaY>0&&this.storedViews.length>1&&(this.tracing("onWheel() \u2192 zoomOut"),this._wheelCooldown=!0,setTimeout(()=>{this._wheelCooldown=!1},500),this.zoomOut())))}_isInsideScrollable(t,e){let r=t,o=this.canvas.querySelector(".is-current-view");for(;r&&r!==this.canvas;){if(r===o||o&&o.contains(r)){let{overflowY:n}=window.getComputedStyle(r);if((n==="auto"||n==="scroll")&&(e>0?r.scrollTop+r.clientHeight<r.scrollHeight-1:r.scrollTop>0))return!0}r=r.parentElement}return!1}onTouchStart(t){this._destroyed||this.inputs.touch&&(this.tracing("onTouchStart()"),this.touching=!0,this.touchstartX=t.changedTouches[0].screenX,this.touchstartY=t.changedTouches[0].screenY)}onTouchEnd(t){this._destroyed||this.inputs.touch&&(this.blockEvents||(this.tracing("onTouchEnd()"),this.touchendX=t.changedTouches[0].screenX,this.touchendY=t.changedTouches[0].screenY,this.handleGesture(t)))}handleGesture(t){t.stopPropagation(),this.tracing("handleGesture()");let e=this.touchendX-this.touchstartX,r=this.touchendY-this.touchstartY,o=Math.abs(e)<10&&Math.abs(r)<10;e<-30&&(this.storedViews.length>1&&!this.blockEvents?(this.tracing("swipe left"),this.zoomOut()):this.notify("is on level zero. Can't zoom out. Trigger: Swipe left","warn"));let n=t.target.classList.contains("zoom-me")?t.target:t.target.closest(".zoom-me");o&&!this.blockEvents&&n&&this.touching&&(this.touching=!1,this.tracing("tap"),t.preventDefault(),this.zoomIn(n)),o&&this.storedViews.length>1&&!this.blockEvents&&!n&&t.target.closest(".is-current-view")===null&&this.touching&&(this.touching=!1,this.tracing("tap"),this.zoomOut())}};var ns={separator:"/",prefix:"/"};function Le(s,t){let e=[];for(let r of s.storedViews){let o=r.views&&r.views[0];o&&o.viewName&&e.push(o.viewName)}return e.join(t)}function is(s,t){let e=window.location.hash.slice(1);return e.startsWith(s)&&(e=e.slice(s.length)),e?e.split(t).filter(Boolean):[]}var Te={install(s,t){let e=Object.assign({},ns,t),r=e.separator,o=e.prefix,n=!1;function i(u){if(n)return;let f=Le(s,r),h="#"+o+f;window.location.hash!==h&&(n=!0,window.history[u](null,"",h),n=!1)}function a(){i("pushState")}function c(){i("replaceState")}s.on("afterZoomIn",a),s.on("afterLateral",a),s.on("afterZoomOut",c);function l(){if(n)return;n=!0;let u=is(o,r),f=Le(s,r).split(r).filter(Boolean);if(u.join(r)===f.join(r)){n=!1;return}if(u.length<f.length){let h=f.length-u.length;for(let d=0;d<h;d++)s.zoomOut()}else if(u.length===f.length&&u.length>0){let h=u[u.length-1];h!==f[f.length-1]&&s.goTo(h,{mode:"lateral"})}else u.length>f.length&&window.history.back();n=!1}window.addEventListener("popstate",l),c(),s.on("destroy",function(){s.off("afterZoomIn",a),s.off("afterLateral",a),s.off("afterZoomOut",c),window.removeEventListener("popstate",l)})}};ut.Router=Te;window.Zumly=ut;
|
|
7
|
+
(()=>{var Ut=s=>{throw TypeError(s)};var At=(s,t,e)=>t.has(s)||Ut("Cannot "+e);var S=(s,t,e)=>(At(s,t,"read from private field"),e?e.call(s):t.get(s)),I=(s,t,e)=>t.has(s)?Ut("Cannot add the same private member more than once"):t instanceof WeakSet?t.add(s):t.set(s,e),G=(s,t,e,r)=>(At(s,t,"write to private field"),r?r.call(s,e):t.set(s,e),e),lt=(s,t,e)=>(At(s,t,"access private method"),e);var Q,gt,Wt,wt=class{constructor(t={}){I(this,gt);I(this,Q,{});G(this,Q,t)}async resolve(t,e=null){if(typeof t=="string"&&Object.prototype.hasOwnProperty.call(S(this,Q),t)){let o=S(this,Q)[t];return this.resolve(o,e)}switch(lt(this,gt,Wt).call(this,t)){case"html":{let o=document.createElement("div");o.innerHTML=t.trim();let n=o.firstElementChild;if(!n)throw new Error("Zumly: view produced no element (html)");return n}case"url":{let o=new AbortController,n=setTimeout(()=>o.abort(),1e4),i;try{i=await fetch(t,{signal:o.signal})}finally{clearTimeout(n)}if(!i.ok)throw new Error(`Zumly: fetch failed for "${t}" (${i.status})`);let a=await i.text(),l=document.createElement("div");l.innerHTML=a.trim();let c=l.firstElementChild;if(!c)throw new Error("Zumly: view produced no element (url)");return c}case"function":{let o=e&&e.target||document.createElement("div"),n=await t({...e,target:o});if(typeof n=="string")return this.resolve(n,e);if(n instanceof HTMLElement)return n;let i=o.firstElementChild||o;return i.classList.contains("z-view")||i.classList.add("z-view"),i}case"object":{let o=await t.render(e);if(typeof o!="string")throw new Error("Zumly: view render() must return string");return this.resolve(o,e)}case"element":return t.cloneNode(!0);case"webcomponent":return await customElements.whenDefined(t),document.createElement(t);default:throw new Error("Zumly: unknown view type for source")}}};Q=new WeakMap,gt=new WeakSet,Wt=function(t){return typeof t=="function"?"function":t instanceof HTMLElement?"element":typeof t=="object"&&t!==null&&typeof t.render=="function"?"object":typeof t!="string"?"unknown":/^https?:\/\/|^\/|\.html$|\.php$/i.test(t)?"url":t.includes("<")?"html":t.includes("-")?"webcomponent":"unknown"};async function ct(s,t,e,r,o,n){if(!s||!s.classList){let i=document.createElement("div");i.classList.add("z-view"),s&&i.appendChild(s),s=i}else s.classList.contains("z-view")||s.classList.add("z-view");return s.dataset.viewName=t,s.getAttribute("aria-label")||s.setAttribute("aria-label",`View: ${t}`),s.style.transformOrigin="0 0",s.style.position="absolute",r?s.classList.add("is-current-view"):s.classList.add("is-new-current-view","has-no-events","hide"),e.append(s),typeof o[t]=="object"&&typeof o[t].mounted=="function"&&await o[t].mounted(),s}function T(s,t,e){t&&e==="welcome"&&console.info(`%c Zumly %c ${t}`,"background: #424085; color: white; border-radius: 3px;","color: #424085"),t&&s&&(e==="info"||e===void 0)&&console.info(`%c Zumly %c ${t}`,"background: #6679A3; color: #304157; border-radius: 3px;","color: #6679A3"),t&&e==="warn"&&console.warn(`%c Zumly %c ${t}`,"background: #DCBF53; color: #424085; border-radius: 3px;","color: #424085"),t&&e==="error"&&console.error(`%c Zumly %c ${t}`,"background: #BE4747; color: white; border-radius: 3px;","color: #424085")}function Kt(s,t){if(t.isValid=!1,!s||typeof s!="object"){T(!1,"'options' object has to be provided when instance is defined","error");return}if(typeof s.mount!="string"){T(!1,"'mount' must be a string selector","error");return}if(t.mount=s.mount,typeof s.initialView!="string"){T(!1,"'initialView' must be a string","error");return}if(t.initialView=s.initialView,!s.views||typeof s.views!="object"){T(!1,"'views' must be an object","error");return}t.views=s.views,t.isValid=!0,t.preload=Array.isArray(s.preload)?s.preload:[],t.debug=typeof s.debug=="boolean"?s.debug:!1,t.componentContext=s.componentContext&&typeof s.componentContext=="object"?s.componentContext:new Map;let e=s.transitions&&typeof s.transitions=="object"?s.transitions:null,r=e&&e.cover,o=typeof r=="string"?r.toLowerCase():null,n=o==="width"||o==="height";t.cover=n?o:"width",!n&&e&&r!==void 0&&T(!1,`'transitions.cover' must be either "width" or "height". Falling back to "width".`,"warn"),t.duration=e&&typeof e.duration=="string"?e.duration:"1s",t.ease=e&&typeof e.ease=="string"?e.ease:"ease-in-out",t.deferred=typeof s.deferred=="boolean"?s.deferred:!1;let i=e&&e.hideTrigger;i===!0||i==="fade"?t.hideTrigger=i:(t.hideTrigger=!1,i!=null&&i!==!1&&T(!1,`'transitions.hideTrigger' must be true or "fade". Falling back to false.`,"warn"));let a=e&&e.effects;Array.isArray(a)&&a.length>=2&&typeof a[0]=="string"&&typeof a[1]=="string"?t.effects=[a[0],a[1]]:Array.isArray(a)&&a.length===1&&typeof a[0]=="string"?t.effects=[a[0],a[0]]:(t.effects=["none","none"],a!=null&&T(!1,`'transitions.effects' must be an array of 1-2 CSS filter strings (e.g. ["blur(3px)", "blur(8px) saturate(0)"]). Falling back to no effects.`,"warn"));let l=e&&e.driver,c=typeof l=="string"?l.toLowerCase():null,u=typeof l=="function"?l:null;if(c!==null){let y=["css","waapi","none","anime","gsap","motion"];t.transitionDriver=y.includes(c)?c:"css",y.includes(c)||T(!1,`'transitions.driver' must be "css", "waapi", "none", "anime", "gsap", "motion", or a function. Got "${l}". Falling back to "css".`,"warn")}else u!==null?t.transitionDriver=u:t.transitionDriver="css";let f=e&&e.stagger;typeof f=="number"&&f>0?t.stagger=f:(t.stagger=0,f!=null&&f!==0&&T(!1,"'transitions.stagger' must be a positive number (ms). Falling back to 0 (disabled).","warn")),t.parallax=0,t.threshold=null;let h=e&&e.threshold;h&&typeof h=="object"&&h.enabled&&(t.threshold={duration:typeof h.duration=="number"&&h.duration>0?h.duration:300,commitAt:typeof h.commitAt=="number"&&h.commitAt>0&&h.commitAt<=1?h.commitAt:.5});let d=s.lateralNav;if(d===!1)t.lateralNav=!1;else if(d&&typeof d=="object"){let y=typeof d.mode=="string"?d.mode.toLowerCase():null,b=y==="auto"||y==="always";y&&!b&&T(!1,`'lateralNav.mode' must be "auto" or "always". Falling back to "auto".`,"warn");let w=null;if(Array.isArray(d.siblings))w=d.siblings.filter(g=>typeof g=="string"&&g),w.length<2&&(T(!1,"'lateralNav.siblings' needs at least 2 view names. Ignoring.","warn"),w=null);else if(d.siblings&&typeof d.siblings=="object"){w={};for(let[g,L]of Object.entries(d.siblings))if(Array.isArray(L)){let C=L.filter(O=>typeof O=="string"&&O);C.length>=2&&(w[g]=C)}Object.keys(w).length===0&&(w=null)}else d.siblings!==void 0&&T(!1,"'lateralNav.siblings' must be an array of view names or a { parentView: [...] } map. Ignoring.","warn");t.lateralNav={mode:b?y:"auto",arrows:typeof d.arrows=="boolean"?d.arrows:!0,dots:typeof d.dots=="boolean"?d.dots:!0,keepAlive:d.keepAlive===!0||d.keepAlive==="visible"?d.keepAlive:!1,siblings:w}}else t.lateralNav={mode:"auto",arrows:!0,dots:!0,keepAlive:!1,siblings:null};let p=s.depthNav;if(p===!1)t.depthNav=!1;else if(p&&typeof p=="object"){let y=typeof p.position=="string"?p.position.toLowerCase():null,b=y==="bottom-left"||y==="top-left";y&&!b&&T(!1,`'depthNav.position' must be "bottom-left" or "top-left". Falling back to "bottom-left".`,"warn"),t.depthNav={position:b?y:"bottom-left"}}else t.depthNav={position:"bottom-left"};let v=s.lateralNav&&typeof s.lateralNav=="object"?s.lateralNav.position:void 0;if(t.lateralNav&&typeof t.lateralNav=="object"){let y=v==="bottom-center"||v==="top-center";v&&!y&&T(!1,`'lateralNav.position' must be "bottom-center" or "top-center". Falling back to "bottom-center".`,"warn"),t.lateralNav.position=y?v:"bottom-center"}let m=s.inputs;m&&typeof m=="object"?t.inputs={wheel:typeof m.wheel=="boolean"?m.wheel:!0,keyboard:typeof m.keyboard=="boolean"?m.keyboard:!0,click:typeof m.click=="boolean"?m.click:!0,touch:typeof m.touch=="boolean"?m.touch:!0}:t.inputs={wheel:!0,keyboard:!0,click:!0,touch:!0}}function Gt(s,t,e,r,o){let n=e/s,i=r/t;return o==="height"?{scale:i,scaleInv:1/i}:{scale:n,scaleInv:1/n}}function Qt(s,t,e,r){let o=t.left,n=t.top,i=s.x-o+(s.width-e.width*r)/2,a=s.y-n+(s.height-e.height*r)/2;return`translate(${i}px, ${a}px) scale(${r})`}function Jt(s,t,e){let r=t.left,o=t.top,n=s.x-r+(s.width-e.width)/2,i=s.y-o+(s.height-e.height)/2;return`translate(${n}px, ${i}px)`}function te(s,t){let e=s.x+s.width/2-t.x,r=s.y+s.height/2-t.y;return`${e}px ${r}px`}function ee(s,t,e,r,o=0){let n=s.width/2-t.width/2-t.x+e.x,i=s.height/2-t.height/2-t.y+e.y,a=1-o,l=n*a,c=i*a;return{x:n,y:i,transform:`translate(${l}px, ${c}px) scale(${r})`}}function se({canvasRect:s,canvasOffset:t,triggerRect:e,previousViewRectAtBaseTransform:r,lastViewZoomedElementRect:o,previousViewRectWithPreviousAtEndTransform:n,scale:i,preScale:a,parallax:l=0}){let c=t.left,u=t.top,f=s.width/2-e.width/2-e.x,h=s.height/2-e.height/2-e.y,d=f+(r.x-o.x)+n.x-c+(n.width-o.width)/2,p=h+(r.y-o.y)+n.y-u+(n.height-o.height)/2,v=1-Math.min(l*2,.9);return`translate(${d*v}px, ${p*v}px) scale(${i*a})`}function re(s,t,e,r,o){return`translate(${s-e.left}px, ${t-e.top}px) scale(${r*o})`}function bt(s){let t=s.split(/\s+/);return{x:parseFloat(t[0])||0,y:parseFloat(t[1])||0}}function ft(s){let t=s.match(/translate\(\s*([-\d.]+)px[,\s]+([-\d.]+)px\s*\)/),e=s.match(/scale\(\s*([-\d.]+)\s*\)/);return{tx:t?parseFloat(t[1]):0,ty:t?parseFloat(t[2]):0,scale:e?parseFloat(e[1]):1}}function St(s,t,e,r,o,n,i,a,l,c){let u=t.x-e.x*(1-n)-r,f=t.y-e.y*(1-n)-o,h=t.width/n,d=t.height/n,p=u+e.x+(s.x-u-e.x-r)/n,v=f+e.y+(s.y-f-e.y-o)/n,m=s.width/n,y=s.height/n,b=u+i.x+a+c*(p-u-i.x),w=f+i.y+l+c*(v-f-i.y),g=m*c,L=y*c;return{x:b,y:w,width:g,height:L,left:b,top:w,right:b+g,bottom:w+L}}function ut(s,t,e){return{viewName:s,backwardState:t,forwardState:e}}function oe(s){return{detachedNode:s}}function ne(s,t,e,r,o){let n=[];return t!==null&&n.push(t),e!==null&&n.push(e),r!==null&&n.push(r),o!==null&&n.push(o),{zoomLevel:s,views:n}}function ie(s){let t=s.views?.[3];if(!(!t||!(t.detachedNode instanceof Node)))return t.detachedNode}var N,Et=class{constructor(){I(this,N,new Map)}set(t,e,r=null){S(this,N).set(t,{node:e,expires:r?Date.now()+r:null})}get(t){let e=S(this,N).get(t);return e?e.expires!==null&&Date.now()>e.expires?(S(this,N).delete(t),null):e.node.cloneNode(!0):null}has(t){let e=S(this,N).get(t);return e?e.expires!==null&&Date.now()>e.expires?(S(this,N).delete(t),!1):!0:!1}invalidate(t){S(this,N).delete(t)}clear(){S(this,N).clear()}};N=new WeakMap;var De=300*1e3,He=/^https?:\/\/|^\/|\.html$|\.php$/i,J,tt,et,V,st,ae,le,_t=class{constructor(t={}){I(this,st);I(this,J);I(this,tt);I(this,et);I(this,V,new Map);G(this,et,t),G(this,J,new wt(t)),G(this,tt,new Et)}async get(t,e=null){if(lt(this,st,ae).call(this,t)){let r=S(this,tt).get(t);if(r)return r;if(S(this,V).has(t))return S(this,V).get(t);let o=(async()=>{let n=await S(this,J).resolve(t,e),i=S(this,et)[t],a=lt(this,st,le).call(this,i);return S(this,tt).set(t,n,a),S(this,V).delete(t),n})();return S(this,V).set(t,o),o}return S(this,J).resolve(t,e)}async preloadEager(t,e=null){!Array.isArray(t)||t.length===0||await Promise.all(t.map(r=>this.get(r,e)))}prefetch(t,e=null){this.get(t,e).catch(()=>{})}prefetchOnHover(t,e=null){this.prefetch(t,e)}scanAndPrefetch(t,e=null){if(!t||!t.querySelectorAll)return;t.querySelectorAll(".zoom-me[data-to]").forEach(o=>{let n=o.dataset.to;n&&(o.hasAttribute("role")||o.setAttribute("role","button"),o.hasAttribute("aria-label")||o.setAttribute("aria-label",`Zoom to ${n}`),this.prefetch(n,e))})}};J=new WeakMap,tt=new WeakMap,et=new WeakMap,V=new WeakMap,st=new WeakSet,ae=function(t){return typeof S(this,et)[t]=="string"},le=function(t){return He.test(t)?De:null};function rt(s){s&&(s.style.contentVisibility="hidden")}function X(s){s&&(s.style.contentVisibility="visible")}function M(s){if(typeof s=="number"&&!Number.isNaN(s))return Math.max(0,s);let t=String(s).trim(),e=t.match(/^(\d*\.?\d+)\s*(ms|s)?$/i);if(!e)return typeof console<"u"&&console.warn(`[zumly] Could not parse duration "${t}" \u2014 falling back to 500ms.`),500;let r=parseFloat(e[1]);return(e[2]||"s").toLowerCase()==="ms"?Math.max(0,r):Math.max(0,r*1e3)}function xt(s){return M(s)/1e3}function E(s,t){if(s.classList.contains("is-new-current-view")){let e=t.views[0].forwardState;s.classList.replace("is-new-current-view","is-current-view"),s.classList.remove("zoom-current-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform;return}if(s.classList.contains("is-previous-view")){let e=t.views[1].forwardState;s.classList.remove("zoom-previous-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform;return}if(s.classList.contains("is-last-view")){let e=t.views[2].forwardState;s.classList.remove("zoom-last-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform}}function A(s,t){s.classList.remove("zoom-previous-view-reverse","has-no-events","has-effect","has-effect-reverse"),s.style.removeProperty("--z-effect-filter"),s.style.transformOrigin="0 0",s.style.transform=t.transform}function P(s,t){s.classList.remove("zoom-last-view-reverse","has-no-events","has-effect","has-effect-reverse"),s.style.removeProperty("--z-effect-filter"),s.style.transformOrigin=t.origin,s.style.transform=t.transform}function k(s,t){try{t&&t.removeChild(s)}catch{try{s.parentElement&&t.removeChild(s.parentElement)}catch{}}}function z(...s){for(let t of s)t&&(t.classList.remove("hide"),X(t))}function H(s,t){let{currentView:e,previousView:r,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformEnd:l,currentStage:c,canvas:u}=s,f=c.views[0];z(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=f.forwardState.origin,e.style.transform=l||f.forwardState.transform,o&&n&&(o.style.transform=n.transformEnd),i&&a&&(i.style.transform=a.transformEnd),s.keepAlive||k(r,u),t()}var j=150;function R(s,t){let e=!1,r=setTimeout(()=>{e||(e=!0,s())},t);return{finish(){e||(e=!0,clearTimeout(r),s())},safetyTimer:r}}function ce(){return{a:1,b:0,c:0,d:1,e:0,f:0}}function je(s){if(!s||s==="none")return ce();let t=String(s).match(/matrix\(([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+)\)/);return t?{a:parseFloat(t[1])||1,b:parseFloat(t[2])||0,c:parseFloat(t[3])||0,d:parseFloat(t[4])||1,e:parseFloat(t[5])||0,f:parseFloat(t[6])||0}:ce()}function nt(s){return`matrix(${s.a}, ${s.b}, ${s.c}, ${s.d}, ${s.e}, ${s.f})`}function ot(s,t,e){return s+(t-s)*e}function it(s,t,e){let r=Math.max(0,Math.min(1,e));return{a:ot(s.a,t.a,r),b:ot(s.b,t.b,r),c:ot(s.c,t.c,r),d:ot(s.d,t.d,r),e:ot(s.e,t.e,r),f:ot(s.f,t.f,r)}}function Z(s,t,e){s.style.transformOrigin=t,s.style.transform=e;try{s.getBoundingClientRect()}catch{}return je(getComputedStyle(s).transform)}function fe(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,duration:a,ease:l,canvas:c}=s;if(!r||!o||!i){t();return}e==="lateral"?Re(s,t):e==="zoomIn"?qe(r,o,n,i,a,l,t):e==="zoomOut"?Be(r,o,n,i,a,l,c,t):t()}function Re(s,t){let{currentView:e,previousView:r,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformStart:l,incomingTransformEnd:c,outgoingTransform:u,outgoingTransformEnd:f,currentStage:h,duration:d,ease:p,canvas:v}=s,m=M(d),y=h.views[0];z(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=y.forwardState.origin,o&&n&&($(o,d,p,{"--lateral-from":n.transformStart,"--lateral-to":n.transformEnd}),o.classList.add("zoom-lateral-back")),i&&a&&($(i,d,p,{"--lateral-from":a.transformStart,"--lateral-to":a.transformEnd}),i.classList.add("zoom-lateral-back")),s.keepAlive!=="visible"&&($(r,d,p,{"--lateral-out-from":u,"--lateral-out-to":f}),r.classList.add("zoom-lateral-out")),$(e,d,p,{"--lateral-in-from":l,"--lateral-in-to":c}),e.classList.add("zoom-lateral-in");let b=s.keepAlive==="visible"?[e]:[r,e];o&&n&&b.push(o),i&&a&&b.push(i);let w=b.length,{finish:g}=R(()=>{Pt(b,L),s.keepAlive?(r.classList.remove("zoom-lateral-out"),r.style.opacity=""):k(r,v),o&&(o.classList.remove("zoom-lateral-back"),o.style.transform=n?.transformEnd||o.style.transform),i&&(i.classList.remove("zoom-lateral-back"),i.style.transform=a?.transformEnd||i.style.transform),e.classList.remove("zoom-lateral-in"),e.style.transform=c,t()},m+j);function L(C){let O=C?.target;O&&O.removeEventListener("animationend",L),w--,w<=0&&g()}b.forEach(C=>C.addEventListener("animationend",L))}function qe(s,t,e,r,o,n,i){z(s,t,e);let a=r.stagger||0;$(s,o,n,{"--current-view-transform-start":r.views[0].backwardState.transform,"--current-view-transform-end":r.views[0].forwardState.transform}),a>0&&s.style.setProperty("animation-delay","0ms"),$(t,o,n,{"--previous-view-transform-start":r.views[1].backwardState.transform,"--previous-view-transform-end":r.views[1].forwardState.transform}),a>0&&t.style.setProperty("animation-delay",`${a}ms`),e&&($(e,o,n,{"--last-view-transform-start":r.views[2].backwardState.transform,"--last-view-transform-end":r.views[2].forwardState.transform}),a>0&&e.style.setProperty("animation-delay",`${a*2}ms`)),s.classList.add("zoom-current-view"),t.classList.add("zoom-previous-view"),e&&e.classList.add("zoom-last-view");let l=e?[s,t,e]:[s,t],c=l.length,u=M(o),f=e?a*2:a,{finish:h}=R(()=>{Pt(l,d),l.forEach(p=>p.style.removeProperty("animation-delay")),i()},u+f+j);function d(p){let v=p?.target;if(v&&v.removeEventListener("animationend",d),v?.isConnected)try{E(v,r)}catch{}c--,c<=0&&h()}l.forEach(p=>p.addEventListener("animationend",d))}function Be(s,t,e,r,o,n,i,a){let l=r.views[0],c=r.views[1],u=e&&r.views[2]?r.views[2]:null,f=r.stagger||0;$(s,o,n,{"--current-view-transform-start":l.backwardState.transform,"--current-view-transform-end":l.forwardState.transform}),f>0&&s.style.setProperty("animation-delay","0ms"),$(t,o,n,{"--previous-view-transform-start":c.backwardState.transform,"--previous-view-transform-end":c.forwardState.transform}),f>0&&t.style.setProperty("animation-delay",`${f}ms`),e&&u&&($(e,o,n,{"--last-view-transform-start":u.backwardState.transform,"--last-view-transform-end":u.forwardState.transform}),f>0&&e.style.setProperty("animation-delay",`${f*2}ms`)),s.classList.add("zoom-current-view-reverse"),t.classList.add("zoom-previous-view-reverse"),e&&e.classList.add("zoom-last-view-reverse");let h=e?[s,t,e]:[s,t],d=h.length,p=M(o),v=e?f*2:f,{finish:m}=R(()=>{Pt(h,y),h.forEach(b=>b.style.removeProperty("animation-delay")),a()},p+v+j);function y(b){let w=b?.target;if(w&&w.removeEventListener("animationend",y),w?.isConnected)try{Ve(w,r,i)}catch{}d--,d<=0&&m()}h.forEach(b=>b.addEventListener("animationend",y))}function Ve(s,t,e){if(s.classList.contains("zoom-current-view-reverse")){k(s,e);return}if(s.classList.contains("zoom-previous-view-reverse")){A(s,t.views[1].backwardState);return}s.classList.contains("zoom-last-view-reverse")&&P(s,t.views[2].backwardState)}function $(s,t,e,r){s.style.setProperty("--zoom-duration",t),s.style.setProperty("--zoom-ease",e);for(let[o,n]of Object.entries(r))s.style.setProperty(o,n)}function Pt(s,t){for(let e of s)e?.removeEventListener&&e.removeEventListener("animationend",t)}function ue(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,canvas:a}=s;if(!r||!o||!i){t();return}if(e==="lateral"){H(s,t);return}if(e==="zoomIn"){z(r,o,n),E(r,i),E(o,i),n&&E(n,i),t();return}if(e==="zoomOut"){k(r,a),z(o,n),A(o,i.views[1].backwardState),n&&P(n,i.views[2].backwardState),t();return}t()}function he(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,duration:a,ease:l,canvas:c}=s;if(!r||!o||!i){t();return}let u=M(a);if(e==="lateral"){Ue(s,u,l,t);return}if(e==="zoomIn"){Xe(r,o,n,i,u,l,t);return}if(e==="zoomOut"){Ye(r,o,n,i,u,l,c,t);return}t()}function Xe(s,t,e,r,o,n,i){z(s,t,e);let a=r.views[0],l=r.views[1],c=e&&r.views[2]?r.views[2]:null;s.style.transformOrigin=a.backwardState.origin,s.style.transform=a.backwardState.transform,t.style.transformOrigin=l.backwardState.origin,t.style.transform=l.backwardState.transform,c&&(e.style.transformOrigin=c.backwardState.origin,e.style.transform=c.backwardState.transform);let u=r.stagger||0,f=[];f.push(s.animate([{transform:a.backwardState.transform},{transform:a.forwardState.transform}],{duration:o,easing:n,fill:"forwards"})),f.push(t.animate([{transform:l.backwardState.transform},{transform:l.forwardState.transform}],{duration:o,delay:u,easing:n,fill:"forwards"})),c&&f.push(e.animate([{transform:c.backwardState.transform},{transform:c.forwardState.transform}],{duration:o,delay:u*2,easing:n,fill:"forwards"}));let h=c?u*2:u,{finish:d}=R(()=>{It(f);try{E(s,r),E(t,r),e&&E(e,r)}catch{}i()},o+h+j);Promise.all(f.map(p=>p.finished)).then(d).catch(d)}function Ye(s,t,e,r,o,n,i,a){let l=r.views[0],c=r.views[1],u=e&&r.views[2]?r.views[2]:null,f=c.backwardState,h=u?u.backwardState:null;s.style.transformOrigin=l.forwardState.origin,s.style.transform=l.forwardState.transform,requestAnimationFrame(()=>{requestAnimationFrame(()=>{t.style.transformOrigin=c.forwardState.origin,e&&u&&(e.style.transformOrigin=u.forwardState.origin);let d=t.style.transform||getComputedStyle(t).transform||c.forwardState.transform,p=e&&u?e.style.transform||getComputedStyle(e).transform||u.forwardState.transform:null,v=r.stagger||0,m=[];m.push(s.animate([{transform:l.forwardState.transform},{transform:l.backwardState.transform}],{duration:o,easing:n,fill:"forwards"})),m.push(t.animate([{transform:d},{transform:f.transform}],{duration:o,delay:v,easing:n,fill:"both"})),e&&h&&m.push(e.animate([{transform:p},{transform:h.transform}],{duration:o,delay:v*2,easing:n,fill:"both"})),t.style.removeProperty("transform"),e&&e.style.removeProperty("transform");let y=e&&h?v*2:v,{finish:b}=R(()=>{It(m);try{k(s,i),A(t,f),e&&h&&P(e,h)}catch{}a()},o+y+j);Promise.all(m.map(w=>w.finished)).then(b).catch(b)})})}function Ue(s,t,e,r){let{currentView:o,previousView:n,backView:i,backViewState:a,lastView:l,lastViewState:c,incomingTransformStart:u,incomingTransformEnd:f,outgoingTransform:h,outgoingTransformEnd:d,currentStage:p,canvas:v}=s,m=p.views[0];z(o),o.classList.replace("is-new-current-view","is-current-view"),o.classList.remove("zoom-current-view","has-no-events"),o.style.transformOrigin=m.forwardState.origin;let y=[];y.push(o.animate([{transform:u,opacity:0},{transform:f,opacity:1}],{duration:t,easing:e,fill:"forwards"})),s.keepAlive!=="visible"&&y.push(n.animate([{transform:h,opacity:1},{transform:d,opacity:0}],{duration:t,easing:e,fill:"forwards"})),i&&a&&y.push(i.animate([{transform:a.transformStart},{transform:a.transformEnd}],{duration:t,easing:e,fill:"forwards"})),l&&c&&y.push(l.animate([{transform:c.transformStart},{transform:c.transformEnd}],{duration:t,easing:e,fill:"forwards"}));let{finish:b}=R(()=>{It(y),o.style.transform=f||m.forwardState.transform,i&&a&&(i.style.transform=a.transformEnd),l&&c&&(l.style.transform=c.transformEnd),s.keepAlive?(n.style.opacity="",n.style.transform=d):k(n,v),r()},t+j);Promise.all(y.map(w=>w.finished)).then(b).catch(b)}function It(s){for(let t of s)try{t.cancel()}catch{}}function de(s,t){let e=typeof globalThis<"u"&&globalThis.anime;if(!e||typeof e!="function"){console.warn('Zumly anime driver: Anime.js not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.2/anime.min.js"><\/script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:l,ease:c,canvas:u}=s;if(!o||!n||!a){t();return}let f=M(l);r==="lateral"?H(s,t):r==="zoomIn"?We(e,o,n,i,a,f,c,t):r==="zoomOut"?Ke(e,o,n,i,a,f,c,u,t):t()}function We(s,t,e,r,o,n,i,a){z(t,e,r);let l=o.views[0],c=o.views[1],u=r&&o.views[2]?o.views[2]:null,f=me([{el:t,backward:l.backwardState,forward:l.forwardState},{el:e,backward:c.backwardState,forward:c.forwardState},...u?[{el:r,backward:u.backwardState,forward:u.forwardState}]:[]],"forward");pe(f,0);let h=o.stagger||0,d=n+(u?h*2:h),p={value:0};s({targets:p,value:1,duration:d,easing:ye(i),update:()=>{let v=p.value*d;ve(f,v,n,h)},complete:()=>{E(t,o),E(e,o),r&&E(r,o),a()}})}function Ke(s,t,e,r,o,n,i,a,l){let c=o.views[0],u=o.views[1],f=r&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null,p=me([{el:t,backward:c.backwardState,forward:c.forwardState},{el:e,backward:u.backwardState,forward:u.forwardState},...f?[{el:r,backward:f.backwardState,forward:f.forwardState}]:[]],"backward");pe(p,0);let v=o.stagger||0,m=n+(f?v*2:v),y={value:0};s({targets:y,value:1,duration:m,easing:ye(i),update:()=>{let b=y.value*m;ve(p,b,n,v)},complete:()=>{k(t,a),A(e,h),r&&d&&P(r,d),l()}})}function me(s,t){return s.map(({el:e,backward:r,forward:o})=>{if(t==="forward"){let n=Z(e,r.origin,r.transform),i=Z(e,r.origin,o.transform);return{el:e,from:n,to:i}}else{let n=Z(e,o.origin,o.transform),i=Z(e,o.origin,r.transform);return{el:e,from:n,to:i}}})}function pe(s,t){for(let{el:e,from:r,to:o}of s)e.style.transform=nt(it(r,o,t))}function ve(s,t,e,r){for(let o=0;o<s.length;o++){let{el:n,from:i,to:a}=s[o],l=o*r,c=Math.max(0,t-l),u=e>0?Math.min(1,c/e):1;n.style.transform=nt(it(i,a,u))}}function ye(s){if(typeof s!="string")return"easeInOutQuad";let t=s.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOutQuad":t.includes("ease-in")?"easeInQuad":t.includes("ease-out")?"easeOutQuad":t}function we(s,t){let e=typeof globalThis<"u"&&globalThis.gsap;if(!e||typeof e.to!="function"){console.warn('Zumly GSAP driver: GSAP not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"><\/script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:l,ease:c,canvas:u}=s;if(!o||!n||!a){t();return}let f=xt(l);r==="lateral"?H(s,t):r==="zoomIn"?Ge(e,o,n,i,a,f,c,t):r==="zoomOut"?Qe(e,o,n,i,a,f,c,u,t):t()}function Ge(s,t,e,r,o,n,i,a){z(t,e,r);let l=o.views[0],c=o.views[1],u=r&&o.views[2]?o.views[2]:null;Lt(t,l.backwardState),Lt(e,c.backwardState),u&&Lt(r,u.backwardState);let f=s.timeline({onComplete:()=>{E(t,o),E(e,o),r&&E(r,o),a()}}),h=ge(i),d=(o.stagger||0)/1e3;f.to(t,{transform:l.forwardState.transform,duration:n,ease:h},0),f.to(e,{transform:c.forwardState.transform,duration:n,ease:h},d),u&&f.to(r,{transform:u.forwardState.transform,duration:n,ease:h},d*2)}function Qe(s,t,e,r,o,n,i,a,l){let c=o.views[0],u=o.views[1],f=r&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null;Lt(t,c.forwardState);let p=e.style.transform||getComputedStyle(e).transform||u.forwardState.transform,v=r&&f?r.style.transform||getComputedStyle(r).transform||f.forwardState.transform:null;e.style.transformOrigin=u.forwardState.origin,r&&f&&(r.style.transformOrigin=f.forwardState.origin);let m=ge(i),y=s.timeline({onComplete:()=>{k(t,a),A(e,h),r&&d&&P(r,d),l()}}),b=(o.stagger||0)/1e3;s.set(e,{transform:p}),r&&v&&s.set(r,{transform:v}),y.fromTo(t,{transform:c.forwardState.transform},{transform:c.backwardState.transform,duration:n,ease:m},0),y.fromTo(e,{transform:p},{transform:h.transform,duration:n,ease:m},b),r&&d&&y.fromTo(r,{transform:v},{transform:d.transform,duration:n,ease:m},b*2)}function Lt(s,t){s.style.transformOrigin=t.origin,s.style.transform=t.transform}function ge(s){if(typeof s!="string")return"power2.inOut";let t=s.toLowerCase();return t==="linear"?"none":t.includes("ease-in-out")?"power2.inOut":t.includes("ease-in")?"power2.in":t.includes("ease-out")?"power2.out":t}function be(s,t){let e=es();if(!e||typeof e!="function"){console.warn('Zumly Motion driver: Motion not loaded. Add <script src="https://cdn.jsdelivr.net/npm/motion@11/dist/motion.min.js"><\/script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:l,ease:c,canvas:u}=s;if(!o||!n||!a){t();return}let f=xt(l);r==="lateral"?H(s,t):r==="zoomIn"?Je(e,o,n,i,a,f,c,t):r==="zoomOut"?ts(e,o,n,i,a,f,c,u,t):t()}function Je(s,t,e,r,o,n,i,a){z(t,e,r);let l=Se(t,e,r,o,"forward");Ee(l,0);let c=o.stagger||0,u=c/1e3,f=n*1e3,h=n+(l.length>2?u*2:u);s(0,1,{duration:h,ease:xe(i),onUpdate:p=>{let v=p*h*1e3;_e(l,v,f,c)}}).then(()=>{E(t,o),E(e,o),r&&E(r,o),a()}).catch(()=>a())}function ts(s,t,e,r,o,n,i,a,l){let c=o.views[1],u=r&&o.views[2]?o.views[2]:null,f=c.backwardState,h=u?u.backwardState:null,d=Se(t,e,r,o,"backward");Ee(d,0);let p=o.stagger||0,v=p/1e3,m=n*1e3,y=n+(d.length>2?v*2:v);s(0,1,{duration:y,ease:xe(i),onUpdate:w=>{let g=w*y*1e3;_e(d,g,m,p)}}).then(()=>{k(t,a),A(e,f),r&&h&&P(r,h),l()}).catch(()=>l())}function Se(s,t,e,r,o){let n=r.views[0],i=r.views[1],a=e&&r.views[2]?r.views[2]:null,l=[{el:s,backward:n.backwardState,forward:n.forwardState},{el:t,backward:i.backwardState,forward:i.forwardState}];return a&&l.push({el:e,backward:a.backwardState,forward:a.forwardState}),l.map(({el:c,backward:u,forward:f})=>o==="forward"?{el:c,from:Z(c,u.origin,u.transform),to:Z(c,u.origin,f.transform)}:{el:c,from:Z(c,f.origin,f.transform),to:Z(c,f.origin,u.transform)})}function Ee(s,t){for(let{el:e,from:r,to:o}of s)e.style.transform=nt(it(r,o,t))}function _e(s,t,e,r){for(let o=0;o<s.length;o++){let{el:n,from:i,to:a}=s[o],l=o*r,c=Math.max(0,t-l),u=e>0?Math.min(1,c/e):1;n.style.transform=nt(it(i,a,u))}}function es(){let s=typeof globalThis<"u"?globalThis:typeof window<"u"?window:{};return s.motion?.animate||s.Motion?.animate||s.animate}function xe(s){if(typeof s!="string")return"easeInOut";let t=s.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOut":t.includes("ease-in")?"easeIn":t.includes("ease-out")?"easeOut":s}var Le={css:fe,waapi:he,none:ue,anime:de,gsap:we,motion:be};function Te(s){if(typeof s=="function")return{runTransition(r,o){s(r,o)}};let t=typeof s=="string"?s.toLowerCase():"css";return{runTransition:Le[t]||Le.css}}function ss(s){if(typeof s!="string"||s.trim()==="")return{tx:0,ty:0,rest:""};let t=s.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(!t)return null;let e=parseFloat(t[1]),r=parseFloat(t[2]),o=s.replace(/translate\s*\([^)]+\)\s*/,"").trim();return{tx:e,ty:r,rest:o}}function Nt(s,t,e){let r=ss(s);if(r===null)return s;let o=r.tx*t,n=r.ty*e,i=r.rest?` ${r.rest}`:"";return`translate(${o}px, ${n}px)${i}`.trim()}function rs(s){if(typeof s!="string"||!s.trim())return null;let t=s.trim().match(/^([-\d.eE]+)px\s+([-\d.eE]+)px$/);return t?{x:parseFloat(t[1]),y:parseFloat(t[2])}:null}function Zt(s,t,e){let r=rs(s);return r===null?s:`${r.x*t}px ${r.y*e}px`}function $t(s,t,e,r,o){if(!s.storedViews?.length||!s.canvas||t<=0||e<=0)return;let n=r/t,i=o/e;for(let d of s.storedViews){let p=d.views;if(Array.isArray(p))for(let v=0;v<p.length;v++){let m=p[v];!m||m.detachedNode||(m.backwardState&&(m.backwardState.transform=Nt(m.backwardState.transform,n,i),m.backwardState.origin!=null&&(m.backwardState.origin=Zt(m.backwardState.origin,n,i))),m.forwardState&&(m.forwardState.transform=Nt(m.forwardState.transform,n,i),m.forwardState.origin!=null&&(m.forwardState.origin=Zt(m.forwardState.origin,n,i))))}}let a=s.canvas,l=a.querySelector(".is-current-view"),c=a.querySelector(".is-previous-view"),u=a.querySelector(".is-last-view"),f=a.querySelector(".is-new-current-view"),h=[l,c,u,f].filter(Boolean);for(let d of h){if(!d.style)continue;let p=d.style.transform;p!=null&&p!==""&&(d.style.transform=Nt(p,n,i));let v=d.style.transformOrigin;v!=null&&v!==""&&(d.style.transformOrigin=Zt(v,n,i))}}var os=8e3,dt=class{constructor(t){if(this.storedViews=[],this.currentStage=null,this.debug=!1,this.trace=[],this.blockEvents=!1,this._blockEventsSafetyTimer=null,this.touchstartX=0,this.touchstartY=0,this.touchendX=0,this.touchendY=0,this.touching=!1,this.lateralHistory=[],this._lastCanvasWidth=0,this._lastCanvasHeight=0,this._pendingResizeCorrection=!1,this._destroyed=!1,this._hooks={},this._plugins=[],Kt(t,this),!this.isValid){this.notify("is unable to start: invalid or missing required options (mount, initialView, views).","error");return}if(this.canvas=document.querySelector(this.mount),!this.canvas){this.notify(`mount selector "${this.mount}" did not match any element.`,"error"),this.isValid=!1;return}this.transitionDriver=Te(this.transitionDriver),this._onZoom=this.onZoom.bind(this),this._onTouchStart=this.onTouchStart.bind(this),this._onTouchEnd=this.onTouchEnd.bind(this),this._onKeyUp=this.onKeyUp.bind(this),this._onWheel=this.onWheel.bind(this),this._wheelCooldown=!1,this._onPrefetchTrigger=e=>{e.target.classList.contains("zoom-me")&&e.target.dataset.to&&this.prefetcher.prefetch(e.target.dataset.to,{trigger:e.target,...e.target.dataset})},this._onResize=this._handleResize.bind(this),this._resizeDebounceTimer=null,this._RESIZE_DEBOUNCE_MS=80,this.prefetcher=new _t(this.views),this._bindEvents()}_bindEvents(){let t=this.canvas;t&&(t.setAttribute("tabindex","0"),t.setAttribute("role","application"),t.setAttribute("aria-roledescription","zoomable interface"),t.setAttribute("aria-live","polite"),t.addEventListener("mouseup",this._onZoom,!1),t.addEventListener("touchend",this._onZoom,!1),t.addEventListener("touchstart",this._onTouchStart,{passive:!0}),t.addEventListener("touchend",this._onTouchEnd,!1),t.addEventListener("keyup",this._onKeyUp,!1),t.addEventListener("wheel",this._onWheel,{passive:!1}),t.addEventListener("mouseover",this._onPrefetchTrigger,{passive:!0}),t.addEventListener("focusin",this._onPrefetchTrigger,{passive:!0}),window.addEventListener("resize",this._onResize,{passive:!0}),typeof ResizeObserver<"u"&&(this._resizeObserver=new ResizeObserver(()=>this._handleResize()),this._resizeObserver.observe(t)))}_unbindEvents(){let t=this.canvas;t&&(t.removeEventListener("mouseup",this._onZoom,!1),t.removeEventListener("touchend",this._onZoom,!1),t.removeEventListener("touchstart",this._onTouchStart),t.removeEventListener("touchend",this._onTouchEnd,!1),t.removeEventListener("keyup",this._onKeyUp,!1),t.removeEventListener("wheel",this._onWheel),t.removeEventListener("mouseover",this._onPrefetchTrigger),t.removeEventListener("focusin",this._onPrefetchTrigger)),window.removeEventListener("resize",this._onResize),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}_resetCanvasScroll(t){if(t&&((t.scrollLeft!==0||t.scrollTop!==0)&&(this.notify(`canvas had a residual scroll (${t.scrollLeft}, ${t.scrollTop}) \u2014 resetting. Something scrolled the canvas mid-transition.`,"warn"),t.scrollLeft=0,t.scrollTop=0),!this._warnedScrolledAncestor)){for(let e=t.parentElement;e&&e!==document.body;e=e.parentElement)if(e.scrollLeft!==0||e.scrollTop!==0){let r=e.className?`.${String(e.className).trim().split(/\s+/).join(".")}`:e.tagName.toLowerCase();this.notify(`an ancestor of the canvas (${r}) is scrolled (${e.scrollLeft}, ${e.scrollTop}): all zooms will land displaced. Use 'overflow: clip' (not 'hidden') on containers around the canvas.`,"warn"),this._warnedScrolledAncestor=!0;break}}}_setBlockEvents(){this.blockEvents=!0,this._clearBlockEventsSafety(),this._blockEventsSafetyTimer=setTimeout(()=>{this.blockEvents&&!this._destroyed&&(this.notify("blockEvents safety timeout: driver did not call onComplete. Force-resetting.","warn"),this.blockEvents=!1,this._onTransitionComplete())},os)}_clearBlockEventsSafety(){this._blockEventsSafetyTimer!==null&&(clearTimeout(this._blockEventsSafetyTimer),this._blockEventsSafetyTimer=null)}storeViews(t){this.tracing("storedViews()"),this.storedViews.push(t),this.debug&&console.debug("Zumly storedViews",t)}tracing(t){if(this.debug)if(t==="ended"){let e=this.trace.map((r,o)=>`${o===0?`Instance ${this.instance}: ${r}`:`${r}`}`).join(" > ");this.notify(e),this.trace=[]}else this.trace.push(t)}notify(t,e){return T(this.debug,t,e)}_recordCanvasSize(){if(!this.canvas)return;let t=this.canvas.getBoundingClientRect();this._lastCanvasWidth=t.width,this._lastCanvasHeight=t.height}_handleResize(){this._destroyed||(this._resizeDebounceTimer&&clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=setTimeout(()=>{if(this._resizeDebounceTimer=null,!this.isValid||!this.canvas||this._lastCanvasWidth===0)return;let t=this.canvas.getBoundingClientRect(),e=t.width,r=t.height;if(!(e===this._lastCanvasWidth&&r===this._lastCanvasHeight)){if(this.blockEvents){this._pendingResizeCorrection=!0;return}$t(this,this._lastCanvasWidth,this._lastCanvasHeight,e,r),this._lastCanvasWidth=e,this._lastCanvasHeight=r}},this._RESIZE_DEBOUNCE_MS))}_onTransitionComplete(){if(this._clearBlockEventsSafety(),this._pendingResizeCorrection&&!this.blockEvents){this._pendingResizeCorrection=!1;let t=this.canvas?.getBoundingClientRect();if(t&&this._lastCanvasWidth>0){let e=t.width,r=t.height;(e!==this._lastCanvasWidth||r!==this._lastCanvasHeight)&&$t(this,this._lastCanvasWidth,this._lastCanvasHeight,e,r),this._lastCanvasWidth=e,this._lastCanvasHeight=r}}else this._recordCanvasSize();this._manageFocus()}_manageFocus(){if(!this.canvas)return;let t=this.canvas.querySelector(".is-current-view");if(!t)return;let e=t.querySelector('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])');e?e.focus({preventScroll:!0}):(t.setAttribute("tabindex","-1"),t.focus({preventScroll:!0}))}_resolveEffects(t){let e=t?.dataset?.withEffects;if(e&&typeof e=="string"){let r=e.split("|").map(o=>o.trim());return[r[0]||"none",r[1]||r[0]||"none"]}return this.effects}_applyEffects(t,e,r,o,n){!r||r[0]==="none"&&r[1]==="none"||(t&&r[0]!=="none"&&(t.style.setProperty("--z-effect-filter",r[0]),t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("has-effect")),e&&r[1]!=="none"&&(e.style.setProperty("--z-effect-filter",r[1]),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("has-effect")))}_removeEffect(t){if(!t||!t.classList.contains("has-effect"))return;t.classList.remove("has-effect"),t.classList.add("has-effect-reverse");let e=()=>{t.classList.remove("has-effect-reverse"),t.style.removeProperty("--z-effect-filter"),t.removeEventListener("transitionend",e)};t.addEventListener("transitionend",e,{once:!0});let r=t.style.getPropertyValue("--zoom-duration");setTimeout(e,r?parseFloat(r)*(r.includes("ms")?1:1e3)+100:1100)}_resolveHideTrigger(t){return t?.dataset?.hideTrigger!==void 0?t.dataset.hideTrigger==="fade"?"fade":!0:this.hideTrigger}_applyHideTrigger(t,e,r,o,n){!r||!t||(r==="fade"?(t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("z-trigger-fade"),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("z-view-fade-in"),e.offsetHeight,e.classList.remove("hide")):t.classList.add("z-trigger-hidden"))}_restoreHideTrigger(t,e,r,o){if(!(!e||!t))if(e==="fade"){t.classList.remove("z-trigger-fade"),t.style.setProperty("--zoom-duration",r),t.style.setProperty("--zoom-ease",o),t.classList.add("z-trigger-fade-reverse");let n=()=>{t.classList.remove("z-trigger-fade-reverse"),t.style.removeProperty("--zoom-duration"),t.style.removeProperty("--zoom-ease"),t.removeEventListener("transitionend",n)};t.addEventListener("transitionend",n,{once:!0}),setTimeout(n,parseFloat(r)*(r.includes("ms")?1:1e3)+100)}else t.classList.remove("z-trigger-hidden")}on(t,e){var r;return typeof e!="function"?this:(((r=this._hooks)[t]||(r[t]=[])).push(e),this)}use(t,e){if(!t)return this;let r={plugin:t,options:e};return this._plugins.push(r),this._initialized&&this._installPlugin(r),this}_installPlugin(t){let{plugin:e,options:r}=t;try{typeof e=="function"?e(this,r):typeof e.install=="function"&&e.install(this,r)}catch(o){this.notify(`plugin install error: ${o.message}`,"error")}}off(t,e){return e?this._hooks[t]&&(this._hooks[t]=this._hooks[t].filter(r=>r!==e)):delete this._hooks[t],this}_emit(t,e={}){let r=this._hooks[t];if(!(!r||r.length===0))for(let o of r)try{o(e)}catch(n){this.debug&&console.error(`Zumly hook "${t}" threw:`,n)}}zoomLevel(){return this.storedViews.length}getZoomLevel(){return this.zoomLevel()}getCurrentViewName(){return!this.storedViews||this.storedViews.length===0?null:this.storedViews[this.storedViews.length-1]?.views?.[0]?.viewName??null}back(){if(!this._destroyed){if(this.blockEvents){this.notify("back ignored: a transition is already running.","warn");return}if(this.lateralHistory&&this.lateralHistory.length>0){let t=this.lateralHistory.pop(),e=t&&typeof t=="object"?t.name:t,r=t&&typeof t=="object"?t.entry:void 0,o=t&&typeof t=="object"?t.node:void 0;return this._doLateral(e,!0,{savedEntry:r,keepAliveNode:o})}this.zoomOut()}}async goTo(t,e={}){return this._destroyed?void 0:(e.mode==="lateral"?"lateral":"depth")==="depth"?this.zoomTo(t,e):this._doLateral(t,!1,e)}async zoomTo(t,e={}){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("zoomTo() cannot run: instance is invalid or canvas not found.","error");return}if(typeof t!="string"||!t){this.notify("zoomTo() requires a non-empty view name.","warn");return}if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`zoomTo("${t}"): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}if(this.getCurrentViewName()===t)return;let o=this.canvas.getBoundingClientRect(),n=Math.max(40,o.width*.1),i=Math.max(40,o.height*.1),l={rect:{x:o.left+(o.width-n)/2,y:o.top+(o.height-i)/2,width:n,height:i},duration:e.duration??this.duration,ease:e.ease??this.ease,props:e.props??{}};await this._doZoomIn(t,l)}async init(){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("init() cannot run: instance is invalid or canvas element was not found.","error");return}this.tracing("init()"),this.preload&&this.preload.length&&await this.prefetcher.preloadEager(this.preload,null);let t=await this.prefetcher.get(this.initialView,null),e=await ct(t,this.initialView,this.canvas,!0,this.views,this.componentContext);this._emit("viewMounted",{viewName:this.initialView,node:e}),this.prefetcher.scanAndPrefetch(e,null),this.storeViews({zoomLevel:this.storedViews.length,scale:1,views:[{viewName:this.initialView,backwardState:{origin:"0 0",transform:""}}]}),this.currentStage=this.storedViews[this.storedViews.length-1],this._recordCanvasSize(),this._initialized=!0;for(let r of this._plugins)this._installPlugin(r)}destroy(){this._destroyed||(this._emit("destroy"),this._destroyed=!0,this._clearBlockEventsSafety(),this._resizeDebounceTimer&&(clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=null),this._unbindEvents(),this._removeNav(),this._cleanupLateralKeepAlive(),this.blockEvents=!1,this.storedViews=[],this.currentStage=null,this.lateralHistory=[],this.trace=[],this._hooks={},this.prefetcher=null,this.transitionDriver=null,this.canvas&&(this.canvas.removeAttribute("tabindex"),this.canvas.removeAttribute("role"),this.canvas.removeAttribute("aria-roledescription"),this.canvas.removeAttribute("aria-live")),this.isValid=!1)}async _doZoomIn(t,e){if(this._destroyed)return;if(this.blockEvents){this.notify("zoomIn ignored: a transition is already running.","warn");return}this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomIn",{viewName:t}),this.tracing("zoomIn()");let r=this.canvas,o=e.el;this._resetCanvasScroll(r);let n=r.getBoundingClientRect(),i=n.left,a=n.top,c=(this.storedViews.length>0?this.storedViews[this.storedViews.length-1]:null)?.scale??1;this.tracing("getView()");let u=o?{trigger:o,target:document.createElement("div"),context:this.componentContext,props:Object.assign({},o.dataset)}:{target:document.createElement("div"),context:this.componentContext,props:e.props??{}},f=o?.dataset?.deferred!==void 0?!0:this.deferred,h,d=null;if(f){let _=await this.prefetcher.get(t,u);if(this._destroyed)return;for(d=document.createDocumentFragment();_.firstChild;)d.appendChild(_.firstChild);h=await ct(_,t,r,!1,{},this.componentContext)}else{let _=await this.prefetcher.get(t,u);if(this._destroyed)return;this.prefetcher.scanAndPrefetch(_,u),h=await ct(_,t,r,!1,this.views,this.componentContext)}if(!h)return;f||this._emit("viewMounted",{viewName:t,node:h}),o&&o.classList.add("zoomed");let p=o?(()=>{let _=o.getBoundingClientRect();return{x:_.x,y:_.y,width:_.width,height:_.height}})():e.rect,v=o?o.dataset.withDuration||this.duration:e.duration??this.duration,m=o?o.dataset.withEase||this.ease:e.ease??this.ease,y=o?o.dataset.withCover||this.cover:e.cover??this.cover,b=o?parseInt(o.dataset.withStagger,10)||this.stagger:e.stagger??this.stagger,w=r.querySelector(".is-current-view"),g=r.querySelector(".is-previous-view"),L=r.querySelector(".is-last-view");rt(h),rt(w),rt(g),L&&(rt(L),r.removeChild(L));let C,O,Y,q,at,mt,x,F=w.style.transform,D=w.style.transformOrigin,U=g?g.style.transform:null,Mt=g?g.style.transformOrigin:null;try{w.classList.replace("is-current-view","is-previous-view"),g&&g.classList.replace("is-previous-view","is-last-view");let _=h.getBoundingClientRect(),B=w.getBoundingClientRect(),kt=null,Dt=null,vt=null;g&&(kt=g.getBoundingClientRect(),vt=g.querySelector(".zoomed"),Dt=vt&&vt.getBoundingClientRect?vt.getBoundingClientRect():kt);let yt={left:i,top:a},Ht={width:n.width,height:n.height},jt={width:_.width,height:_.height},Rt=Gt(p.width,p.height,_.width,_.height,y);x=Rt.scale;let Ze=Rt.scaleInv;C=Qt(p,yt,jt,Ze),Y=w.style.transform;let qt=te(p,B);q=ee(Ht,p,B,x,this.parallax);let Bt=bt(D||"0 0"),W=ft(Y||""),Vt=bt(qt),K=ft(q.transform),Xt=p;if(o&&(Xt=St(p,B,Bt,W.tx,W.ty,W.scale,Vt,K.tx,K.ty,K.scale)),O=Jt(Xt,yt,jt),g){at=g.style.transform;let $e=St(B,B,Bt,W.tx,W.ty,W.scale,Vt,K.tx,K.ty,K.scale),Fe=re(q.x,q.y,yt,x,c),Yt=bt(Mt||"0 0"),Ct=ft(at||""),Ot=ft(Fe),Me=St(Dt,kt,Yt,Ct.tx,Ct.ty,Ct.scale,Yt,Ot.tx,Ot.ty,Ot.scale);mt=se({canvasRect:Ht,canvasOffset:yt,triggerRect:p,previousViewRectAtBaseTransform:B,lastViewZoomedElementRect:Me,previousViewRectWithPreviousAtEndTransform:$e,scale:x,preScale:c,parallax:this.parallax})}h.style.transform=C,w.style.transformOrigin=qt}catch(_){this.notify(`zoomIn geometry computation failed: ${_.message}. Aborting zoom.`,"error"),this.debug&&console.error("Zumly _doZoomIn error:",_),w.style.transform=F,w.style.transformOrigin=D,w.classList.contains("is-previous-view")&&w.classList.replace("is-previous-view","is-current-view"),g&&(g.style.transform=U,g.style.transformOrigin=Mt,g.classList.contains("is-last-view")&&g.classList.replace("is-last-view","is-previous-view"));try{r.removeChild(h)}catch{}X(w),X(g);return}let Ce=ut(h.dataset.viewName,{origin:h.style.transformOrigin,duration:v,ease:m,transform:C},{origin:h.style.transformOrigin,duration:v,ease:m,transform:O}),Oe=ut(w.dataset.viewName,{origin:w.style.transformOrigin,duration:v,ease:m,transform:Y},{origin:w.style.transformOrigin,duration:v,ease:m,transform:q.transform}),Ae=g?ut(g.dataset.viewName,{origin:g.style.transformOrigin,duration:v,ease:m,transform:at},{origin:g.style.transformOrigin,duration:v,ease:m,transform:mt}):null,Pe=L?oe(L):null,pt=ne(this.storedViews.length,Ce,Oe,Ae,Pe);pt.scale=x,pt.stagger=b||0,this.storeViews(pt),this.currentStage=this.storedViews[this.storedViews.length-1],this.tracing("setCSSVariables()");let Ie=this._resolveEffects(o);this._applyEffects(w,g,Ie,v,m);let zt=this._resolveHideTrigger(o);this._applyHideTrigger(o,h,zt,v,m),zt&&(pt.hideTriggerMode=zt),this._setBlockEvents();let Ne={type:"zoomIn",currentView:h,previousView:w,lastView:g,currentStage:this.currentStage,duration:v,ease:m};this.transitionDriver.runTransition(Ne,async()=>{f&&d&&h&&!this._destroyed&&(h.appendChild(d),this.prefetcher.scanAndPrefetch(h,u),typeof this.views[t]=="object"&&typeof this.views[t].mounted=="function"&&await this.views[t].mounted(),this._emit("viewMounted",{viewName:t,node:h})),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterZoomIn",{viewName:t,zoomLevel:this.zoomLevel()}),this.tracing("ended")})}async zoomIn(t){this._destroyed||t?.dataset?.to&&await this._doZoomIn(t.dataset.to,{el:t})}async _doLateral(t,e=!1,r={}){if(this._destroyed)return;if(this.blockEvents){this.notify("lateral navigation ignored: a transition is already running.","warn");return}if(!this.isValid||!this.canvas)return;if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`goTo("${t}", { mode: 'lateral' }): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}let o=this.canvas.querySelector(".is-current-view");if(!o)return;let n=o.dataset?.viewName;if(n===t)return;this._emit("beforeLateral",{viewName:t,from:n,isBack:e});let i=this.lateralNav&&this.lateralNav.keepAlive;if(!e){this.lateralHistory=this.lateralHistory||[];let x=this.storedViews[this.storedViews.length-1];this.lateralHistory.push({name:n,entry:x.views[0],node:i?o:null})}this.tracing("lateral()");let a=r.duration??this.duration,l=r.ease??this.ease,c=this.canvas.querySelector(".is-previous-view"),u=this.canvas.querySelector(".is-last-view"),f=0,h=0,d=this._declaredSiblings(),p=d?d.indexOf(n):-1,v=d?d.indexOf(t):-1;if(p!==-1&&v!==-1){let x=this.canvas.getBoundingClientRect();f=(p-v)*x.width*.15}else if(c){let x=c.querySelector(`.zoom-me[data-to="${n}"]`),F=c.querySelector(`.zoom-me[data-to="${t}"]`);if(x&&F){let D=x.getBoundingClientRect(),U=F.getBoundingClientRect();f=D.left+D.width/2-(U.left+U.width/2),h=D.top+D.height/2-(U.top+U.height/2)}else f=this.canvas.getBoundingClientRect().width*.15}let m=null,y=null;if(i&&(e&&r.keepAliveNode?y=r.keepAliveNode:y=this.canvas.querySelector(`.is-lateral-hidden[data-view-name="${t}"]`)),y){if(y.style.display="",y.style.opacity="",y.classList.remove("is-lateral-hidden","zoom-lateral-out"),y.classList.add("is-new-current-view","has-no-events"),m=y,!e&&this.lateralHistory){let x=this.lateralHistory.findIndex(F=>F.node===y);x!==-1&&this.lateralHistory.splice(x,1)}}else{let x={target:document.createElement("div"),context:this.componentContext,props:r.props??{}},F=await this.prefetcher.get(t,x);if(this._destroyed||(this.prefetcher.scanAndPrefetch(F,x),m=await ct(F,t,this.canvas,!1,this.views,this.componentContext),!m))return;this._emit("viewMounted",{viewName:t,node:m})}rt(m);let b=o.style.transform||"",w=o.style.transformOrigin||"0 0";m.style.transform=b,m.style.transformOrigin=w;let g=this.storedViews[this.storedViews.length-1],L=e&&r.savedEntry?{...r.savedEntry,viewName:t}:ut(t,{origin:w,duration:a,ease:l,transform:b},{origin:w,duration:a,ease:l,transform:b});g.views[0]=L,this.currentStage=g;let C=c?{transformStart:c.style.transform||"",transformEnd:this._computeLateralBackTransform(c.style.transform||"",f,h)}:null,O=u&&g.views[2]?{transformStart:u.style.transform||"",transformEnd:this._computeLateralBackTransform(u.style.transform||"",f*.7,h*.7)}:null;C&&g.views[1]&&(g.views[1].forwardState={...g.views[1].forwardState,transform:C.transformEnd}),O&&g.views[2]&&(g.views[2].forwardState={...g.views[2].forwardState,transform:O.transformEnd});let Y=b,q=this._computeLateralBackTransform(Y,-f,-h),at=this._computeLateralBackTransform(b,f,h);this._setBlockEvents();let mt={type:"lateral",currentView:m,previousView:o,lastView:u||null,backView:c||null,backViewState:C,lastViewState:O,incomingTransformStart:q,incomingTransformEnd:Y,outgoingTransform:b,outgoingTransformEnd:at,currentStage:this.currentStage,duration:a,ease:l,canvas:this.canvas,slideDeltaX:f,slideDeltaY:h,keepAlive:i&&!e?i:!1};this.transitionDriver.runTransition(mt,()=>{i&&!e&&(o.classList.remove("is-current-view","is-new-current-view","has-no-events"),o.classList.add("is-lateral-hidden"),i!=="visible"?o.style.display="none":(o.style.transform=b,o.style.opacity="")),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterLateral",{viewName:t,from:n,isBack:e}),this.tracing("ended")})}_computeLateralBackTransform(t,e,r){let o=t.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(o){let n=parseFloat(o[1])+e,i=parseFloat(o[2])+r,a=t.replace(/translate\s*\([^)]+\)\s*/,"");return`translate(${n}px, ${i}px) ${a}`.trim()}return`translate(${e}px, ${r}px) ${t}`.trim()}zoomOut(){if(this._destroyed)return;if(this.blockEvents){this.notify("zoomOut ignored: a transition is already running.","warn");return}this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("zoomOut()");let t=this.canvas;this._resetCanvasScroll(t);let e=t.querySelector(".is-current-view"),r=t.querySelector(".is-previous-view");if(!e||!r){this.notify("zoomOut: current or previous view not found (animation may still be running)","warn");return}this._setBlockEvents(),this.currentStage=this.storedViews[this.storedViews.length-1];let o=t.querySelector(".is-last-view");this.tracing("setCSSVariables()");let n=this.currentStage.views[0]?.forwardState?.duration??this.duration,i=this.currentStage.views[0]?.forwardState?.ease??this.ease,a=r.querySelector(".zoomed");a&&a.classList.remove("zoomed");let l=this.currentStage.hideTriggerMode;l&&a&&this._restoreHideTrigger(a,l,n,i),l==="fade"?(e.classList.remove("z-view-fade-in"),e.style.setProperty("--zoom-duration",n),e.style.setProperty("--zoom-ease",i),e.classList.add("z-view-fade-out")):(e.classList.remove("z-view-fade-in"),e.style.removeProperty("opacity")),this._removeEffect(r),r.classList.replace("is-previous-view","is-current-view"),o!==null&&(o.classList.contains("has-effect")&&this.effects[0]!=="none"&&o.style.setProperty("--z-effect-filter",this.effects[0]),o.classList.replace("is-last-view","is-previous-view"),o.classList.remove("hide"),X(o));let c=ie(this.currentStage);if(c){t.prepend(c);let f=t.querySelector(".z-view:first-child");f&&(X(f),f.classList.add("hide"))}let u={type:"zoomOut",currentView:e,previousView:r,lastView:o,currentStage:this.currentStage,duration:n,ease:i,canvas:t};this.transitionDriver.runTransition(u,()=>{this.blockEvents=!1,this._onTransitionComplete(),this.storedViews.pop(),this._updateNav(),this._emit("afterZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("ended")})}onZoom(t){if(this._destroyed||t.type==="mouseup"&&!this.inputs.click||t.type==="touchend"&&!this.inputs.touch)return;let e=t.target;if(e.closest(".z-depth-nav")||e.closest(".z-lateral-nav"))return;let r=e.classList.contains("zoom-me")||e.closest(".zoom-me");if(!this.blockEvents&&r&&!this.touching){this.tracing("onZoom() \u2192 zoomIn"),t.stopPropagation();let o=e.classList.contains("zoom-me")?e:e.closest(".zoom-me");this.zoomIn(o);return}if(this.storedViews.length>1&&!this.blockEvents&&!r&&!this.touching){let o=this.canvas.querySelector(".is-current-view");if(o&&o.contains(e))return;let n=this._findSiblingTriggerAtPoint(t.clientX,t.clientY);if(n){this.tracing("onZoom() \u2192 lateral"),t.stopPropagation(),this._doLateral(n.dataset.to);return}this.tracing("onZoom() \u2192 zoomOut"),t.stopPropagation(),this.zoomOut()}}_findSiblingTriggerAtPoint(t,e){let r=this.canvas.querySelector(".is-previous-view");if(!r)return null;let n=this.canvas.querySelector(".is-current-view")?.dataset?.viewName;if(!n)return null;let i=r.querySelectorAll(".zoom-me[data-to]");for(let a of i){if(a.dataset.to===n)continue;let l=a.getBoundingClientRect();if(t>=l.left&&t<=l.right&&e>=l.top&&e<=l.bottom)return a}return null}_getSiblings(){let e=this.canvas.querySelector(".is-current-view")?.dataset?.viewName,r=this._declaredSiblings();if(r&&r.indexOf(e)!==-1)return{siblings:r,currentIndex:r.indexOf(e)};let o=this.canvas.querySelector(".is-previous-view");if(!o)return{siblings:[],currentIndex:-1};let n=o.querySelectorAll(".zoom-me[data-to]"),i=[];for(let l of n)l.dataset.to&&i.push(l.dataset.to);let a=i.indexOf(e);return{siblings:i,currentIndex:a}}_declaredSiblings(){let t=this.lateralNav&&typeof this.lateralNav=="object"?this.lateralNav.siblings:null;if(!t)return null;if(Array.isArray(t))return t;let e=this.canvas.querySelector(".is-previous-view")?.dataset?.viewName;return e&&Array.isArray(t[e])?t[e]:null}_updateNav(){this._destroyed||(this._removeNav(),this._updateDepthNav(),this._updateLateralNav())}_updateDepthNav(){if(!this.depthNav||this.storedViews.length-1<1)return;let e=this.canvas.querySelector(".z-view.is-current-view");if(e&&e.querySelector(".z-depth-nav"))return;let r=this.depthNav.position||"bottom-left",o=document.createElement("div");o.className="z-depth-nav z-depth-nav--"+r;let n=document.createElement("button");n.className="z-nav-back",n.setAttribute("aria-label","Zoom out (go back)"),n.innerHTML="‹",n.addEventListener("mouseup",i=>{i.stopPropagation(),!this.blockEvents&&this.storedViews.length>1&&this.zoomOut()}),o.appendChild(n),this.canvas.appendChild(o)}_updateLateralNav(){if(!this.lateralNav)return;let t=this.storedViews.length-1,e=this._getSiblings();if(e.siblings.length<2)return;if(this.lateralNav.mode==="auto"&&t>=1){let a=this.canvas.querySelector(".z-view.is-current-view");if(a&&a.offsetWidth>=this.canvas.offsetWidth&&a.offsetHeight>=this.canvas.offsetHeight)return}let{siblings:r,currentIndex:o}=e,n=this.lateralNav.position||"bottom-center",i=document.createElement("div");if(i.className="z-lateral-nav z-lateral-nav--"+n,this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-prev",a.setAttribute("aria-label","Previous sibling view"),a.innerHTML="‹",a.disabled=o<=0,a.addEventListener("mouseup",l=>{l.stopPropagation(),o>0&&this._doLateral(r[o-1])}),i.appendChild(a)}if(this.lateralNav.dots){let a=document.createElement("div");a.className="z-nav-lateral-dots";for(let l=0;l<r.length;l++){let c=document.createElement("button");c.className="z-nav-dot z-nav-lat-dot"+(l===o?" is-active":""),c.setAttribute("aria-label",`Go to ${r[l]}`),c.dataset.to=r[l],c.addEventListener("mouseup",(u=>f=>{f.stopPropagation(),u!==o&&this._doLateral(r[u])})(l)),a.appendChild(c)}i.appendChild(a)}if(this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-next",a.setAttribute("aria-label","Next sibling view"),a.innerHTML="›",a.disabled=o>=r.length-1,a.addEventListener("mouseup",l=>{l.stopPropagation(),o<r.length-1&&this._doLateral(r[o+1])}),i.appendChild(a)}this.canvas.appendChild(i)}_removeNav(){this.canvas&&this.canvas.querySelectorAll(".z-depth-nav, .z-lateral-nav").forEach(t=>t.remove())}_cleanupLateralKeepAlive(){if(!this.canvas)return;let t=this.canvas.querySelectorAll(".is-lateral-hidden");for(let e of t)e.remove()}onKeyUp(t){this._destroyed||this.inputs.keyboard&&(this.tracing("onKeyUp()"),(t.key==="ArrowLeft"||t.key==="ArrowDown")&&(t.preventDefault(),this.storedViews.length>1&&!this.blockEvents?this.zoomOut():this.notify(`is on level zero. Can't zoom out. Trigger: ${t.key}`,"warn")),(t.key==="ArrowRight"||t.key==="ArrowUp")&&(t.preventDefault(),this.notify(t.key+" has no actions defined")))}onWheel(t){this._destroyed||this.inputs.wheel&&(this._isInsideScrollable(t.target,t.deltaY)||(t.preventDefault(),!(this.blockEvents||this._wheelCooldown)&&t.deltaY>0&&this.storedViews.length>1&&(this.tracing("onWheel() \u2192 zoomOut"),this._wheelCooldown=!0,setTimeout(()=>{this._wheelCooldown=!1},500),this.zoomOut())))}_isInsideScrollable(t,e){let r=t,o=this.canvas.querySelector(".is-current-view");for(;r&&r!==this.canvas;){if(r===o||o&&o.contains(r)){let{overflowY:n}=window.getComputedStyle(r);if((n==="auto"||n==="scroll")&&(e>0?r.scrollTop+r.clientHeight<r.scrollHeight-1:r.scrollTop>0))return!0}r=r.parentElement}return!1}onTouchStart(t){this._destroyed||this.inputs.touch&&(this.tracing("onTouchStart()"),this.touching=!0,this.touchstartX=t.changedTouches[0].screenX,this.touchstartY=t.changedTouches[0].screenY)}onTouchEnd(t){this._destroyed||this.inputs.touch&&(this.blockEvents||(this.tracing("onTouchEnd()"),this.touchendX=t.changedTouches[0].screenX,this.touchendY=t.changedTouches[0].screenY,this.handleGesture(t)))}handleGesture(t){t.stopPropagation(),this.tracing("handleGesture()");let e=this.touchendX-this.touchstartX,r=this.touchendY-this.touchstartY,o=Math.abs(e)<10&&Math.abs(r)<10;e<-30&&(this.storedViews.length>1&&!this.blockEvents?(this.tracing("swipe left"),this.zoomOut()):this.notify("is on level zero. Can't zoom out. Trigger: Swipe left","warn"));let n=t.target.classList.contains("zoom-me")?t.target:t.target.closest(".zoom-me");o&&!this.blockEvents&&n&&this.touching&&(this.touching=!1,this.tracing("tap"),t.preventDefault(),this.zoomIn(n)),o&&this.storedViews.length>1&&!this.blockEvents&&!n&&t.target.closest(".is-current-view")===null&&this.touching&&(this.touching=!1,this.tracing("tap"),this.zoomOut())}};var ns={separator:"/",prefix:"/"};function ze(s,t){let e=[];for(let r of s.storedViews){let o=r.views&&r.views[0];o&&o.viewName&&e.push(o.viewName)}return e.join(t)}function is(s,t){let e=window.location.hash.slice(1);return e.startsWith(s)&&(e=e.slice(s.length)),e?e.split(t).filter(Boolean):[]}var ke={install(s,t){let e=Object.assign({},ns,t),r=e.separator,o=e.prefix,n=!1;function i(u){if(n)return;let f=ze(s,r),h="#"+o+f;window.location.hash!==h&&(n=!0,window.history[u](null,"",h),n=!1)}function a(){i("pushState")}function l(){i("replaceState")}s.on("afterZoomIn",a),s.on("afterLateral",a),s.on("afterZoomOut",l);function c(){if(n)return;n=!0;let u=is(o,r),f=ze(s,r).split(r).filter(Boolean);if(u.join(r)===f.join(r)){n=!1;return}if(u.length<f.length){let h=f.length-u.length;for(let d=0;d<h;d++)s.zoomOut()}else if(u.length===f.length&&u.length>0){let h=u[u.length-1];h!==f[f.length-1]&&s.goTo(h,{mode:"lateral"})}else u.length>f.length&&window.history.back();n=!1}window.addEventListener("popstate",c),l(),s.on("destroy",function(){s.off("afterZoomIn",a),s.off("afterLateral",a),s.off("afterZoomOut",l),window.removeEventListener("popstate",c)})}};dt.Router=ke;window.Zumly=dt;})();
|
package/dist/zumly.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.zumly-canvas{position:absolute;width:100%;height:100%;overflow:hidden;margin:0;padding:0;perspective:1000px;cursor:zoom-out;contain:strict}.zumly-canvas:focus{outline:none}.z-view{position:absolute;contain:strict}.z-view.is-current-view{cursor:default}.z-view.is-previous-view,.z-view.is-last-view,.z-view.has-no-events{pointer-events:none;user-select:none}.z-view{content-visibility:auto}.zoom-current-view,.zoom-current-view-reverse,.zoom-previous-view,.zoom-previous-view-reverse,.zoom-last-view,.zoom-last-view-reverse,.zoom-lateral-back,.zoom-lateral-out,.zoom-lateral-in{will-change:transform,opacity,filter}.z-view.has-effect{transition:filter var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);filter:var(--z-effect-filter, none)}.z-view.has-effect-reverse{transition:filter var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);filter:none}.z-view.hide{opacity:0}.zoom-me.z-trigger-hidden{visibility:hidden}.zoom-me.z-trigger-fade{transition:opacity var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);opacity:0}.zoom-me.z-trigger-fade-reverse,.z-view.z-view-fade-in{transition:opacity var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);opacity:1}.z-view.z-view-fade-out{transition:opacity var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);opacity:0}.zoom-me{cursor:zoom-in}.zoom-me[role=button]{-webkit-tap-highlight-color:transparent}.zoom-current-view-reverse{animation-name:zoom-current-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both;animation-direction:reverse}.zoom-current-view{animation-name:zoom-current-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both}@keyframes zoom-current-view{0%{transform:var(--current-view-transform-start)}to{transform:var(--current-view-transform-end)}}.zoom-previous-view{animation-name:zoom-previous-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both}.zoom-previous-view-reverse{animation-name:zoom-previous-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both;animation-direction:reverse}@keyframes zoom-previous-view{0%{transform:var(--previous-view-transform-start)}to{transform:var(--previous-view-transform-end)}}.zoom-last-view-reverse{animation-name:zoom-last-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both;animation-direction:reverse}.zoom-last-view{animation-name:zoom-last-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both}@keyframes zoom-last-view{0%{transform:var(--last-view-transform-start)}to{transform:var(--last-view-transform-end)}}.zoom-lateral-back{animation:zoom-lateral-back var(--zoom-duration) var(--zoom-ease) forwards}@keyframes zoom-lateral-back{0%{transform:var(--lateral-from)}to{transform:var(--lateral-to)}}.zoom-lateral-out{animation:zoom-lateral-out var(--zoom-duration) var(--zoom-ease) forwards}@keyframes zoom-lateral-out{0%{transform:var(--lateral-out-from);opacity:1}to{transform:var(--lateral-out-to);opacity:0}}.zoom-lateral-in{animation:zoom-lateral-in var(--zoom-duration) var(--zoom-ease) forwards}@keyframes zoom-lateral-in{0%{transform:var(--lateral-in-from);opacity:0}to{transform:var(--lateral-in-to);opacity:1}}.z-depth-nav{position:absolute;z-index:10;pointer-events:none}.z-depth-nav>*{pointer-events:auto}.z-depth-nav--bottom-left{bottom:20px;left:20px}.z-depth-nav--top-left{top:20px;left:20px}.z-nav-back{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#00000080;backdrop-filter:blur(12px);color:#fff;font-size:1.1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;padding:0}.z-nav-back:hover{background:#ffffff2e;border-color:#fff6}.z-lateral-nav{position:absolute;z-index:10;display:flex;align-items:center;gap:0;pointer-events:none;background:#00000080;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);border-radius:100px;padding:6px 10px}.z-lateral-nav>*{pointer-events:auto}.z-lateral-nav--bottom-center{bottom:20px;left:50%;transform:translate(-50%)}.z-lateral-nav--top-center{top:20px;left:50%;transform:translate(-50%)}.z-nav-arrow{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#ffffff14;color:#fff;font-size:1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;padding:0}.z-nav-arrow:hover:not(:disabled){background:#ffffff2e;border-color:#fff6}.z-nav-arrow:disabled{opacity:.2;cursor:default}.z-nav-lateral-dots{display:flex;align-items:center;gap:5px}.z-nav-dot{width:7px;height:7px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:#ffffff26;padding:0;cursor:default;transition:background .2s,transform .2s,border-color .2s}.z-nav-lat-dot{cursor:pointer}.z-nav-lat-dot:hover{background:#fff6}.z-nav-dot.is-active{background:#fff;border-color:#fff;transform:scale(1.35)}
|
|
1
|
+
.zumly-canvas{position:absolute;width:100%;height:100%;overflow:hidden;overflow:clip;margin:0;padding:0;perspective:1000px;cursor:zoom-out;contain:strict}.zumly-canvas:focus{outline:none}.z-view{position:absolute;contain:strict}.z-view.is-current-view{cursor:default}.z-view.is-previous-view,.z-view.is-last-view,.z-view.has-no-events{pointer-events:none;user-select:none}.z-view{content-visibility:auto}.zoom-current-view,.zoom-current-view-reverse,.zoom-previous-view,.zoom-previous-view-reverse,.zoom-last-view,.zoom-last-view-reverse,.zoom-lateral-back,.zoom-lateral-out,.zoom-lateral-in{will-change:transform,opacity,filter}.z-view.has-effect{transition:filter var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);filter:var(--z-effect-filter, none)}.z-view.has-effect-reverse{transition:filter var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);filter:none}.z-view.hide{opacity:0}.zoom-me.z-trigger-hidden{visibility:hidden}.zoom-me.z-trigger-fade{transition:opacity var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);opacity:0}.zoom-me.z-trigger-fade-reverse,.z-view.z-view-fade-in{transition:opacity var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);opacity:1}.z-view.z-view-fade-out{transition:opacity var(--zoom-duration, 1s) var(--zoom-ease, ease-in-out);opacity:0}.zoom-me{cursor:zoom-in}.zoom-me[role=button]{-webkit-tap-highlight-color:transparent}.zoom-current-view-reverse{animation-name:zoom-current-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both;animation-direction:reverse}.zoom-current-view{animation-name:zoom-current-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both}@keyframes zoom-current-view{0%{transform:var(--current-view-transform-start)}to{transform:var(--current-view-transform-end)}}.zoom-previous-view{animation-name:zoom-previous-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both}.zoom-previous-view-reverse{animation-name:zoom-previous-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both;animation-direction:reverse}@keyframes zoom-previous-view{0%{transform:var(--previous-view-transform-start)}to{transform:var(--previous-view-transform-end)}}.zoom-last-view-reverse{animation-name:zoom-last-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both;animation-direction:reverse}.zoom-last-view{animation-name:zoom-last-view;animation-duration:var(--zoom-duration);animation-timing-function:var(--zoom-ease);animation-fill-mode:both}@keyframes zoom-last-view{0%{transform:var(--last-view-transform-start)}to{transform:var(--last-view-transform-end)}}.zoom-lateral-back{animation:zoom-lateral-back var(--zoom-duration) var(--zoom-ease) forwards}@keyframes zoom-lateral-back{0%{transform:var(--lateral-from)}to{transform:var(--lateral-to)}}.zoom-lateral-out{animation:zoom-lateral-out var(--zoom-duration) var(--zoom-ease) forwards}@keyframes zoom-lateral-out{0%{transform:var(--lateral-out-from);opacity:1}to{transform:var(--lateral-out-to);opacity:0}}.zoom-lateral-in{animation:zoom-lateral-in var(--zoom-duration) var(--zoom-ease) forwards}@keyframes zoom-lateral-in{0%{transform:var(--lateral-in-from);opacity:0}to{transform:var(--lateral-in-to);opacity:1}}.z-depth-nav{position:absolute;z-index:10;pointer-events:none}.z-depth-nav>*{pointer-events:auto}.z-depth-nav--bottom-left{bottom:20px;left:20px}.z-depth-nav--top-left{top:20px;left:20px}.z-nav-back{width:32px;height:32px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#00000080;backdrop-filter:blur(12px);color:#fff;font-size:1.1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;padding:0}.z-nav-back:hover{background:#ffffff2e;border-color:#fff6}.z-lateral-nav{position:absolute;z-index:10;display:flex;align-items:center;gap:0;pointer-events:none;background:#00000080;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);border-radius:100px;padding:6px 10px}.z-lateral-nav>*{pointer-events:auto}.z-lateral-nav--bottom-center{bottom:20px;left:50%;transform:translate(-50%)}.z-lateral-nav--top-center{top:20px;left:50%;transform:translate(-50%)}.z-nav-arrow{width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#ffffff14;color:#fff;font-size:1rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s;padding:0}.z-nav-arrow:hover:not(:disabled){background:#ffffff2e;border-color:#fff6}.z-nav-arrow:disabled{opacity:.2;cursor:default}.z-nav-lateral-dots{display:flex;align-items:center;gap:5px}.z-nav-dot{width:7px;height:7px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:#ffffff26;padding:0;cursor:default;transition:background .2s,transform .2s,border-color .2s}.z-nav-lat-dot{cursor:pointer}.z-nav-lat-dot:hover{background:#fff6}.z-nav-dot.is-active{background:#fff;border-color:#fff;transform:scale(1.35)}
|
package/dist/zumly.mjs
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*
|
|
2
2
|
* zumly
|
|
3
|
-
* v.0.92.
|
|
3
|
+
* v.0.92.3
|
|
4
4
|
* Author Juan Martin Muda - Zumerlab
|
|
5
5
|
* License MIT
|
|
6
6
|
*/
|
|
7
|
-
var ot=class{#t={};constructor(t={}){this.#t=t}#e(t){return typeof t=="function"?"function":t instanceof HTMLElement?"element":typeof t=="object"&&t!==null&&typeof t.render=="function"?"object":typeof t!="string"?"unknown":/^https?:\/\/|^\/|\.html$|\.php$/i.test(t)?"url":t.includes("<")?"html":t.includes("-")?"webcomponent":"unknown"}async resolve(t,e=null){if(typeof t=="string"&&Object.prototype.hasOwnProperty.call(this.#t,t)){let o=this.#t[t];return this.resolve(o,e)}switch(this.#e(t)){case"html":{let o=document.createElement("div");o.innerHTML=t.trim();let n=o.firstElementChild;if(!n)throw new Error("Zumly: view produced no element (html)");return n}case"url":{let o=new AbortController,n=setTimeout(()=>o.abort(),1e4),i;try{i=await fetch(t,{signal:o.signal})}finally{clearTimeout(n)}if(!i.ok)throw new Error(`Zumly: fetch failed for "${t}" (${i.status})`);let a=await i.text(),c=document.createElement("div");c.innerHTML=a.trim();let l=c.firstElementChild;if(!l)throw new Error("Zumly: view produced no element (url)");return l}case"function":{let o=e&&e.target||document.createElement("div"),n=await t({...e,target:o});if(typeof n=="string")return this.resolve(n,e);if(n instanceof HTMLElement)return n;let i=o.firstElementChild||o;return i.classList.contains("z-view")||i.classList.add("z-view"),i}case"object":{let o=await t.render(e);if(typeof o!="string")throw new Error("Zumly: view render() must return string");return this.resolve(o,e)}case"element":return t.cloneNode(!0);case"webcomponent":return await customElements.whenDefined(t),document.createElement(t);default:throw new Error("Zumly: unknown view type for source")}}};async function K(s,t,e,r,o,n){if(!s||!s.classList){let i=document.createElement("div");i.classList.add("z-view"),s&&i.appendChild(s),s=i}else s.classList.contains("z-view")||s.classList.add("z-view");return s.dataset.viewName=t,s.getAttribute("aria-label")||s.setAttribute("aria-label",`View: ${t}`),s.style.transformOrigin="0 0",s.style.position="absolute",r?s.classList.add("is-current-view"):s.classList.add("is-new-current-view","has-no-events","hide"),e.append(s),typeof o[t]=="object"&&typeof o[t].mounted=="function"&&await o[t].mounted(),s}function z(s,t,e){t&&e==="welcome"&&console.info(`%c Zumly %c ${t}`,"background: #424085; color: white; border-radius: 3px;","color: #424085"),t&&s&&(e==="info"||e===void 0)&&console.info(`%c Zumly %c ${t}`,"background: #6679A3; color: #304157; border-radius: 3px;","color: #6679A3"),t&&e==="warn"&&console.warn(`%c Zumly %c ${t}`,"background: #DCBF53; color: #424085; border-radius: 3px;","color: #424085"),t&&e==="error"&&console.error(`%c Zumly %c ${t}`,"background: #BE4747; color: white; border-radius: 3px;","color: #424085")}function It(s,t){if(t.isValid=!1,!s||typeof s!="object"){z(!1,"'options' object has to be provided when instance is defined","error");return}if(typeof s.mount!="string"){z(!1,"'mount' must be a string selector","error");return}if(t.mount=s.mount,typeof s.initialView!="string"){z(!1,"'initialView' must be a string","error");return}if(t.initialView=s.initialView,!s.views||typeof s.views!="object"){z(!1,"'views' must be an object","error");return}t.views=s.views,t.isValid=!0,t.preload=Array.isArray(s.preload)?s.preload:[],t.debug=typeof s.debug=="boolean"?s.debug:!1,t.componentContext=s.componentContext&&typeof s.componentContext=="object"?s.componentContext:new Map;let e=s.transitions&&typeof s.transitions=="object"?s.transitions:null,r=e&&e.cover,o=typeof r=="string"?r.toLowerCase():null,n=o==="width"||o==="height";t.cover=n?o:"width",!n&&e&&r!==void 0&&z(!1,`'transitions.cover' must be either "width" or "height". Falling back to "width".`,"warn"),t.duration=e&&typeof e.duration=="string"?e.duration:"1s",t.ease=e&&typeof e.ease=="string"?e.ease:"ease-in-out",t.deferred=typeof s.deferred=="boolean"?s.deferred:!1;let i=e&&e.hideTrigger;i===!0||i==="fade"?t.hideTrigger=i:(t.hideTrigger=!1,i!=null&&i!==!1&&z(!1,`'transitions.hideTrigger' must be true or "fade". Falling back to false.`,"warn"));let a=e&&e.effects;Array.isArray(a)&&a.length>=2&&typeof a[0]=="string"&&typeof a[1]=="string"?t.effects=[a[0],a[1]]:Array.isArray(a)&&a.length===1&&typeof a[0]=="string"?t.effects=[a[0],a[0]]:(t.effects=["none","none"],a!=null&&z(!1,`'transitions.effects' must be an array of 1-2 CSS filter strings (e.g. ["blur(3px)", "blur(8px) saturate(0)"]). Falling back to no effects.`,"warn"));let c=e&&e.driver,l=typeof c=="string"?c.toLowerCase():null,u=typeof c=="function"?c:null;if(l!==null){let y=["css","waapi","none","anime","gsap","motion"];t.transitionDriver=y.includes(l)?l:"css",y.includes(l)||z(!1,`'transitions.driver' must be "css", "waapi", "none", "anime", "gsap", "motion", or a function. Got "${c}". Falling back to "css".`,"warn")}else u!==null?t.transitionDriver=u:t.transitionDriver="css";let f=e&&e.stagger;typeof f=="number"&&f>0?t.stagger=f:(t.stagger=0,f!=null&&f!==0&&z(!1,"'transitions.stagger' must be a positive number (ms). Falling back to 0 (disabled).","warn")),t.parallax=0,t.threshold=null;let h=e&&e.threshold;h&&typeof h=="object"&&h.enabled&&(t.threshold={duration:typeof h.duration=="number"&&h.duration>0?h.duration:300,commitAt:typeof h.commitAt=="number"&&h.commitAt>0&&h.commitAt<=1?h.commitAt:.5});let d=s.lateralNav;if(d===!1)t.lateralNav=!1;else if(d&&typeof d=="object"){let y=typeof d.mode=="string"?d.mode.toLowerCase():null,g=y==="auto"||y==="always";y&&!g&&z(!1,`'lateralNav.mode' must be "auto" or "always". Falling back to "auto".`,"warn"),t.lateralNav={mode:g?y:"auto",arrows:typeof d.arrows=="boolean"?d.arrows:!0,dots:typeof d.dots=="boolean"?d.dots:!0,keepAlive:d.keepAlive===!0||d.keepAlive==="visible"?d.keepAlive:!1}}else t.lateralNav={mode:"auto",arrows:!0,dots:!0,keepAlive:!1};let m=s.depthNav;if(m===!1)t.depthNav=!1;else if(m&&typeof m=="object"){let y=typeof m.position=="string"?m.position.toLowerCase():null,g=y==="bottom-left"||y==="top-left";y&&!g&&z(!1,`'depthNav.position' must be "bottom-left" or "top-left". Falling back to "bottom-left".`,"warn"),t.depthNav={position:g?y:"bottom-left"}}else t.depthNav={position:"bottom-left"};let p=s.lateralNav&&typeof s.lateralNav=="object"?s.lateralNav.position:void 0;if(t.lateralNav&&typeof t.lateralNav=="object"){let y=p==="bottom-center"||p==="top-center";p&&!y&&z(!1,`'lateralNav.position' must be "bottom-center" or "top-center". Falling back to "bottom-center".`,"warn"),t.lateralNav.position=y?p:"bottom-center"}let v=s.inputs;v&&typeof v=="object"?t.inputs={wheel:typeof v.wheel=="boolean"?v.wheel:!0,keyboard:typeof v.keyboard=="boolean"?v.keyboard:!0,click:typeof v.click=="boolean"?v.click:!0,touch:typeof v.touch=="boolean"?v.touch:!0}:t.inputs={wheel:!0,keyboard:!0,click:!0,touch:!0}}function Zt(s,t,e,r,o){let n=e/s,i=r/t;return o==="height"?{scale:i,scaleInv:1/i}:{scale:n,scaleInv:1/n}}function $t(s,t,e,r){let o=t.left,n=t.top,i=s.x-o+(s.width-e.width*r)/2,a=s.y-n+(s.height-e.height*r)/2;return`translate(${i}px, ${a}px) scale(${r})`}function Nt(s,t,e){let r=t.left,o=t.top,n=s.x-r+(s.width-e.width)/2,i=s.y-o+(s.height-e.height)/2;return`translate(${n}px, ${i}px)`}function Mt(s,t){let e=s.x+s.width/2-t.x,r=s.y+s.height/2-t.y;return`${e}px ${r}px`}function Ft(s,t,e,r,o=0){let n=s.width/2-t.width/2-t.x+e.x,i=s.height/2-t.height/2-t.y+e.y,a=1-o,c=n*a,l=i*a;return{x:n,y:i,transform:`translate(${c}px, ${l}px) scale(${r})`}}function Dt({canvasRect:s,canvasOffset:t,triggerRect:e,previousViewRectAtBaseTransform:r,lastViewZoomedElementRect:o,previousViewRectWithPreviousAtEndTransform:n,scale:i,preScale:a,parallax:c=0}){let l=t.left,u=t.top,f=s.width/2-e.width/2-e.x,h=s.height/2-e.height/2-e.y,d=f+(r.x-o.x)+n.x-l+(n.width-o.width)/2,m=h+(r.y-o.y)+n.y-u+(n.height-o.height)/2,p=1-Math.min(c*2,.9);return`translate(${d*p}px, ${m*p}px) scale(${i*a})`}function Ht(s,t,e,r,o){return`translate(${s-e.left}px, ${t-e.top}px) scale(${r*o})`}function nt(s){let t=s.split(/\s+/);return{x:parseFloat(t[0])||0,y:parseFloat(t[1])||0}}function G(s){let t=s.match(/translate\(\s*([-\d.]+)px[,\s]+([-\d.]+)px\s*\)/),e=s.match(/scale\(\s*([-\d.]+)\s*\)/);return{tx:t?parseFloat(t[1]):0,ty:t?parseFloat(t[2]):0,scale:e?parseFloat(e[1]):1}}function it(s,t,e,r,o,n,i,a,c,l){let u=t.x-e.x*(1-n)-r,f=t.y-e.y*(1-n)-o,h=t.width/n,d=t.height/n,m=u+e.x+(s.x-u-e.x-r)/n,p=f+e.y+(s.y-f-e.y-o)/n,v=s.width/n,y=s.height/n,g=u+i.x+a+l*(m-u-i.x),w=f+i.y+c+l*(p-f-i.y),b=v*l,L=y*l;return{x:g,y:w,width:b,height:L,left:g,top:w,right:g+b,bottom:w+L}}function Q(s,t,e){return{viewName:s,backwardState:t,forwardState:e}}function jt(s){return{detachedNode:s}}function Rt(s,t,e,r,o){let n=[];return t!==null&&n.push(t),e!==null&&n.push(e),r!==null&&n.push(r),o!==null&&n.push(o),{zoomLevel:s,views:n}}function qt(s){let t=s.views?.[3];if(!(!t||!(t.detachedNode instanceof Node)))return t.detachedNode}var at=class{#t=new Map;set(t,e,r=null){this.#t.set(t,{node:e,expires:r?Date.now()+r:null})}get(t){let e=this.#t.get(t);return e?e.expires!==null&&Date.now()>e.expires?(this.#t.delete(t),null):e.node.cloneNode(!0):null}has(t){let e=this.#t.get(t);return e?e.expires!==null&&Date.now()>e.expires?(this.#t.delete(t),!1):!0:!1}invalidate(t){this.#t.delete(t)}clear(){this.#t.clear()}};var Ee=300*1e3,_e=/^https?:\/\/|^\/|\.html$|\.php$/i,lt=class{#t;#e;#r;#s=new Map;constructor(t={}){this.#r=t,this.#t=new ot(t),this.#e=new at}#o(t){return typeof this.#r[t]=="string"}#n(t){return _e.test(t)?Ee:null}async get(t,e=null){if(this.#o(t)){let r=this.#e.get(t);if(r)return r;if(this.#s.has(t))return this.#s.get(t);let o=(async()=>{let n=await this.#t.resolve(t,e),i=this.#r[t],a=this.#n(i);return this.#e.set(t,n,a),this.#s.delete(t),n})();return this.#s.set(t,o),o}return this.#t.resolve(t,e)}async preloadEager(t,e=null){!Array.isArray(t)||t.length===0||await Promise.all(t.map(r=>this.get(r,e)))}prefetch(t,e=null){this.get(t,e).catch(()=>{})}prefetchOnHover(t,e=null){this.prefetch(t,e)}scanAndPrefetch(t,e=null){if(!t||!t.querySelectorAll)return;t.querySelectorAll(".zoom-me[data-to]").forEach(o=>{let n=o.dataset.to;n&&(o.hasAttribute("role")||o.setAttribute("role","button"),o.hasAttribute("aria-label")||o.setAttribute("aria-label",`Zoom to ${n}`),this.prefetch(n,e))})}};function V(s){s&&(s.style.contentVisibility="hidden")}function R(s){s&&(s.style.contentVisibility="visible")}function $(s){if(typeof s=="number"&&!Number.isNaN(s))return Math.max(0,s);let e=String(s).match(/^(\d+(?:\.\d+)?)\s*(ms|s)?$/i);if(!e)return 500;let r=parseFloat(e[1]);return(e[2]||"s").toLowerCase()==="ms"?Math.max(0,r):Math.max(0,r*1e3)}function ct(s){return $(s)/1e3}function S(s,t){if(s.classList.contains("is-new-current-view")){let e=t.views[0].forwardState;s.classList.replace("is-new-current-view","is-current-view"),s.classList.remove("zoom-current-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform;return}if(s.classList.contains("is-previous-view")){let e=t.views[1].forwardState;s.classList.remove("zoom-previous-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform;return}if(s.classList.contains("is-last-view")){let e=t.views[2].forwardState;s.classList.remove("zoom-last-view","has-no-events"),s.style.transformOrigin=e.origin,s.style.transform=e.transform}}function k(s,t){s.classList.remove("zoom-previous-view-reverse","has-no-events","has-effect","has-effect-reverse"),s.style.removeProperty("--z-effect-filter"),s.style.transformOrigin="0 0",s.style.transform=t.transform}function C(s,t){s.classList.remove("zoom-last-view-reverse","has-no-events","has-effect","has-effect-reverse"),s.style.removeProperty("--z-effect-filter"),s.style.transformOrigin=t.origin,s.style.transform=t.transform}function T(s,t){try{t&&t.removeChild(s)}catch{try{s.parentElement&&t.removeChild(s.parentElement)}catch{}}}function x(...s){for(let t of s)t&&(t.classList.remove("hide"),R(t))}function M(s,t){let{currentView:e,previousView:r,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformEnd:c,currentStage:l,canvas:u}=s,f=l.views[0];x(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=f.forwardState.origin,e.style.transform=c||f.forwardState.transform,o&&n&&(o.style.transform=n.transformEnd),i&&a&&(i.style.transform=a.transformEnd),s.keepAlive||T(r,u),t()}var F=150;function D(s,t){let e=!1,r=setTimeout(()=>{e||(e=!0,s())},t);return{finish(){e||(e=!0,clearTimeout(r),s())},safetyTimer:r}}function Bt(){return{a:1,b:0,c:0,d:1,e:0,f:0}}function xe(s){if(!s||s==="none")return Bt();let t=String(s).match(/matrix\(([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+)\)/);return t?{a:parseFloat(t[1])||1,b:parseFloat(t[2])||0,c:parseFloat(t[3])||0,d:parseFloat(t[4])||1,e:parseFloat(t[5])||0,f:parseFloat(t[6])||0}:Bt()}function Y(s){return`matrix(${s.a}, ${s.b}, ${s.c}, ${s.d}, ${s.e}, ${s.f})`}function X(s,t,e){return s+(t-s)*e}function U(s,t,e){let r=Math.max(0,Math.min(1,e));return{a:X(s.a,t.a,r),b:X(s.b,t.b,r),c:X(s.c,t.c,r),d:X(s.d,t.d,r),e:X(s.e,t.e,r),f:X(s.f,t.f,r)}}function P(s,t,e){s.style.transformOrigin=t,s.style.transform=e;try{s.getBoundingClientRect()}catch{}return xe(getComputedStyle(s).transform)}function Vt(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,duration:a,ease:c,canvas:l}=s;if(!r||!o||!i){t();return}e==="lateral"?Le(s,t):e==="zoomIn"?Te(r,o,n,i,a,c,t):e==="zoomOut"?ze(r,o,n,i,a,c,l,t):t()}function Le(s,t){let{currentView:e,previousView:r,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformStart:c,incomingTransformEnd:l,outgoingTransform:u,outgoingTransformEnd:f,currentStage:h,duration:d,ease:m,canvas:p}=s,v=$(d),y=h.views[0];x(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=y.forwardState.origin,o&&n&&(I(o,d,m,{"--lateral-from":n.transformStart,"--lateral-to":n.transformEnd}),o.classList.add("zoom-lateral-back")),i&&a&&(I(i,d,m,{"--lateral-from":a.transformStart,"--lateral-to":a.transformEnd}),i.classList.add("zoom-lateral-back")),s.keepAlive!=="visible"&&(I(r,d,m,{"--lateral-out-from":u,"--lateral-out-to":f}),r.classList.add("zoom-lateral-out")),I(e,d,m,{"--lateral-in-from":c,"--lateral-in-to":l}),e.classList.add("zoom-lateral-in");let g=s.keepAlive==="visible"?[e]:[r,e];o&&n&&g.push(o),i&&a&&g.push(i);let w=g.length,{finish:b}=D(()=>{vt(g,L),s.keepAlive?(r.classList.remove("zoom-lateral-out"),r.style.opacity=""):T(r,p),o&&(o.classList.remove("zoom-lateral-back"),o.style.transform=n?.transformEnd||o.style.transform),i&&(i.classList.remove("zoom-lateral-back"),i.style.transform=a?.transformEnd||i.style.transform),e.classList.remove("zoom-lateral-in"),e.style.transform=l,t()},v+F);function L(Z){let H=Z?.target;H&&H.removeEventListener("animationend",L),w--,w<=0&&b()}g.forEach(Z=>Z.addEventListener("animationend",L))}function Te(s,t,e,r,o,n,i){x(s,t,e);let a=r.stagger||0;I(s,o,n,{"--current-view-transform-start":r.views[0].backwardState.transform,"--current-view-transform-end":r.views[0].forwardState.transform}),a>0&&s.style.setProperty("animation-delay","0ms"),I(t,o,n,{"--previous-view-transform-start":r.views[1].backwardState.transform,"--previous-view-transform-end":r.views[1].forwardState.transform}),a>0&&t.style.setProperty("animation-delay",`${a}ms`),e&&(I(e,o,n,{"--last-view-transform-start":r.views[2].backwardState.transform,"--last-view-transform-end":r.views[2].forwardState.transform}),a>0&&e.style.setProperty("animation-delay",`${a*2}ms`)),s.classList.add("zoom-current-view"),t.classList.add("zoom-previous-view"),e&&e.classList.add("zoom-last-view");let c=e?[s,t,e]:[s,t],l=c.length,u=$(o),f=e?a*2:a,{finish:h}=D(()=>{vt(c,d),c.forEach(m=>m.style.removeProperty("animation-delay")),i()},u+f+F);function d(m){let p=m?.target;if(p&&p.removeEventListener("animationend",d),p?.isConnected)try{S(p,r)}catch{}l--,l<=0&&h()}c.forEach(m=>m.addEventListener("animationend",d))}function ze(s,t,e,r,o,n,i,a){let c=r.views[0],l=r.views[1],u=e&&r.views[2]?r.views[2]:null,f=r.stagger||0;I(s,o,n,{"--current-view-transform-start":c.backwardState.transform,"--current-view-transform-end":c.forwardState.transform}),f>0&&s.style.setProperty("animation-delay","0ms"),I(t,o,n,{"--previous-view-transform-start":l.backwardState.transform,"--previous-view-transform-end":l.forwardState.transform}),f>0&&t.style.setProperty("animation-delay",`${f}ms`),e&&u&&(I(e,o,n,{"--last-view-transform-start":u.backwardState.transform,"--last-view-transform-end":u.forwardState.transform}),f>0&&e.style.setProperty("animation-delay",`${f*2}ms`)),s.classList.add("zoom-current-view-reverse"),t.classList.add("zoom-previous-view-reverse"),e&&e.classList.add("zoom-last-view-reverse");let h=e?[s,t,e]:[s,t],d=h.length,m=$(o),p=e?f*2:f,{finish:v}=D(()=>{vt(h,y),h.forEach(g=>g.style.removeProperty("animation-delay")),a()},m+p+F);function y(g){let w=g?.target;if(w&&w.removeEventListener("animationend",y),w?.isConnected)try{ke(w,r,i)}catch{}d--,d<=0&&v()}h.forEach(g=>g.addEventListener("animationend",y))}function ke(s,t,e){if(s.classList.contains("zoom-current-view-reverse")){T(s,e);return}if(s.classList.contains("zoom-previous-view-reverse")){k(s,t.views[1].backwardState);return}s.classList.contains("zoom-last-view-reverse")&&C(s,t.views[2].backwardState)}function I(s,t,e,r){s.style.setProperty("--zoom-duration",t),s.style.setProperty("--zoom-ease",e);for(let[o,n]of Object.entries(r))s.style.setProperty(o,n)}function vt(s,t){for(let e of s)e?.removeEventListener&&e.removeEventListener("animationend",t)}function Xt(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,canvas:a}=s;if(!r||!o||!i){t();return}if(e==="lateral"){M(s,t);return}if(e==="zoomIn"){x(r,o,n),S(r,i),S(o,i),n&&S(n,i),t();return}if(e==="zoomOut"){T(r,a),x(o,n),k(o,i.views[1].backwardState),n&&C(n,i.views[2].backwardState),t();return}t()}function Yt(s,t){let{type:e,currentView:r,previousView:o,lastView:n,currentStage:i,duration:a,ease:c,canvas:l}=s;if(!r||!o||!i){t();return}let u=$(a);if(e==="lateral"){Ae(s,u,c,t);return}if(e==="zoomIn"){Ce(r,o,n,i,u,c,t);return}if(e==="zoomOut"){Oe(r,o,n,i,u,c,l,t);return}t()}function Ce(s,t,e,r,o,n,i){x(s,t,e);let a=r.views[0],c=r.views[1],l=e&&r.views[2]?r.views[2]:null;s.style.transformOrigin=a.backwardState.origin,s.style.transform=a.backwardState.transform,t.style.transformOrigin=c.backwardState.origin,t.style.transform=c.backwardState.transform,l&&(e.style.transformOrigin=l.backwardState.origin,e.style.transform=l.backwardState.transform);let u=r.stagger||0,f=[];f.push(s.animate([{transform:a.backwardState.transform},{transform:a.forwardState.transform}],{duration:o,easing:n,fill:"forwards"})),f.push(t.animate([{transform:c.backwardState.transform},{transform:c.forwardState.transform}],{duration:o,delay:u,easing:n,fill:"forwards"})),l&&f.push(e.animate([{transform:l.backwardState.transform},{transform:l.forwardState.transform}],{duration:o,delay:u*2,easing:n,fill:"forwards"}));let h=l?u*2:u,{finish:d}=D(()=>{yt(f);try{S(s,r),S(t,r),e&&S(e,r)}catch{}i()},o+h+F);Promise.all(f.map(m=>m.finished)).then(d).catch(d)}function Oe(s,t,e,r,o,n,i,a){let c=r.views[0],l=r.views[1],u=e&&r.views[2]?r.views[2]:null,f=l.backwardState,h=u?u.backwardState:null;s.style.transformOrigin=c.forwardState.origin,s.style.transform=c.forwardState.transform,requestAnimationFrame(()=>{requestAnimationFrame(()=>{t.style.transformOrigin=l.forwardState.origin,e&&u&&(e.style.transformOrigin=u.forwardState.origin);let d=t.style.transform||getComputedStyle(t).transform||l.forwardState.transform,m=e&&u?e.style.transform||getComputedStyle(e).transform||u.forwardState.transform:null,p=r.stagger||0,v=[];v.push(s.animate([{transform:c.forwardState.transform},{transform:c.backwardState.transform}],{duration:o,easing:n,fill:"forwards"})),v.push(t.animate([{transform:d},{transform:f.transform}],{duration:o,delay:p,easing:n,fill:"both"})),e&&h&&v.push(e.animate([{transform:m},{transform:h.transform}],{duration:o,delay:p*2,easing:n,fill:"both"})),t.style.removeProperty("transform"),e&&e.style.removeProperty("transform");let y=e&&h?p*2:p,{finish:g}=D(()=>{yt(v);try{T(s,i),k(t,f),e&&h&&C(e,h)}catch{}a()},o+y+F);Promise.all(v.map(w=>w.finished)).then(g).catch(g)})})}function Ae(s,t,e,r){let{currentView:o,previousView:n,backView:i,backViewState:a,lastView:c,lastViewState:l,incomingTransformStart:u,incomingTransformEnd:f,outgoingTransform:h,outgoingTransformEnd:d,currentStage:m,canvas:p}=s,v=m.views[0];x(o),o.classList.replace("is-new-current-view","is-current-view"),o.classList.remove("zoom-current-view","has-no-events"),o.style.transformOrigin=v.forwardState.origin;let y=[];y.push(o.animate([{transform:u,opacity:0},{transform:f,opacity:1}],{duration:t,easing:e,fill:"forwards"})),s.keepAlive!=="visible"&&y.push(n.animate([{transform:h,opacity:1},{transform:d,opacity:0}],{duration:t,easing:e,fill:"forwards"})),i&&a&&y.push(i.animate([{transform:a.transformStart},{transform:a.transformEnd}],{duration:t,easing:e,fill:"forwards"})),c&&l&&y.push(c.animate([{transform:l.transformStart},{transform:l.transformEnd}],{duration:t,easing:e,fill:"forwards"}));let{finish:g}=D(()=>{yt(y),o.style.transform=f||v.forwardState.transform,i&&a&&(i.style.transform=a.transformEnd),c&&l&&(c.style.transform=l.transformEnd),s.keepAlive?(n.style.opacity="",n.style.transform=d):T(n,p),r()},t+F);Promise.all(y.map(w=>w.finished)).then(g).catch(g)}function yt(s){for(let t of s)try{t.cancel()}catch{}}function Ut(s,t){let e=typeof globalThis<"u"&&globalThis.anime;if(!e||typeof e!="function"){console.warn('Zumly anime driver: Anime.js not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.2/anime.min.js"><\/script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:c,ease:l,canvas:u}=s;if(!o||!n||!a){t();return}let f=$(c);r==="lateral"?M(s,t):r==="zoomIn"?Pe(e,o,n,i,a,f,l,t):r==="zoomOut"?Ie(e,o,n,i,a,f,l,u,t):t()}function Pe(s,t,e,r,o,n,i,a){x(t,e,r);let c=o.views[0],l=o.views[1],u=r&&o.views[2]?o.views[2]:null,f=Wt([{el:t,backward:c.backwardState,forward:c.forwardState},{el:e,backward:l.backwardState,forward:l.forwardState},...u?[{el:r,backward:u.backwardState,forward:u.forwardState}]:[]],"forward");Kt(f,0);let h=o.stagger||0,d=n+(u?h*2:h),m={value:0};s({targets:m,value:1,duration:d,easing:Qt(i),update:()=>{let p=m.value*d;Gt(f,p,n,h)},complete:()=>{S(t,o),S(e,o),r&&S(r,o),a()}})}function Ie(s,t,e,r,o,n,i,a,c){let l=o.views[0],u=o.views[1],f=r&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null,m=Wt([{el:t,backward:l.backwardState,forward:l.forwardState},{el:e,backward:u.backwardState,forward:u.forwardState},...f?[{el:r,backward:f.backwardState,forward:f.forwardState}]:[]],"backward");Kt(m,0);let p=o.stagger||0,v=n+(f?p*2:p),y={value:0};s({targets:y,value:1,duration:v,easing:Qt(i),update:()=>{let g=y.value*v;Gt(m,g,n,p)},complete:()=>{T(t,a),k(e,h),r&&d&&C(r,d),c()}})}function Wt(s,t){return s.map(({el:e,backward:r,forward:o})=>{if(t==="forward"){let n=P(e,r.origin,r.transform),i=P(e,r.origin,o.transform);return{el:e,from:n,to:i}}else{let n=P(e,o.origin,o.transform),i=P(e,o.origin,r.transform);return{el:e,from:n,to:i}}})}function Kt(s,t){for(let{el:e,from:r,to:o}of s)e.style.transform=Y(U(r,o,t))}function Gt(s,t,e,r){for(let o=0;o<s.length;o++){let{el:n,from:i,to:a}=s[o],c=o*r,l=Math.max(0,t-c),u=e>0?Math.min(1,l/e):1;n.style.transform=Y(U(i,a,u))}}function Qt(s){if(typeof s!="string")return"easeInOutQuad";let t=s.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOutQuad":t.includes("ease-in")?"easeInQuad":t.includes("ease-out")?"easeOutQuad":t}function Jt(s,t){let e=typeof globalThis<"u"&&globalThis.gsap;if(!e||typeof e.to!="function"){console.warn('Zumly GSAP driver: GSAP not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"><\/script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:c,ease:l,canvas:u}=s;if(!o||!n||!a){t();return}let f=ct(c);r==="lateral"?M(s,t):r==="zoomIn"?Ze(e,o,n,i,a,f,l,t):r==="zoomOut"?$e(e,o,n,i,a,f,l,u,t):t()}function Ze(s,t,e,r,o,n,i,a){x(t,e,r);let c=o.views[0],l=o.views[1],u=r&&o.views[2]?o.views[2]:null;ft(t,c.backwardState),ft(e,l.backwardState),u&&ft(r,u.backwardState);let f=s.timeline({onComplete:()=>{S(t,o),S(e,o),r&&S(r,o),a()}}),h=te(i),d=(o.stagger||0)/1e3;f.to(t,{transform:c.forwardState.transform,duration:n,ease:h},0),f.to(e,{transform:l.forwardState.transform,duration:n,ease:h},d),u&&f.to(r,{transform:u.forwardState.transform,duration:n,ease:h},d*2)}function $e(s,t,e,r,o,n,i,a,c){let l=o.views[0],u=o.views[1],f=r&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null;ft(t,l.forwardState);let m=e.style.transform||getComputedStyle(e).transform||u.forwardState.transform,p=r&&f?r.style.transform||getComputedStyle(r).transform||f.forwardState.transform:null;e.style.transformOrigin=u.forwardState.origin,r&&f&&(r.style.transformOrigin=f.forwardState.origin);let v=te(i),y=s.timeline({onComplete:()=>{T(t,a),k(e,h),r&&d&&C(r,d),c()}}),g=(o.stagger||0)/1e3;s.set(e,{transform:m}),r&&p&&s.set(r,{transform:p}),y.fromTo(t,{transform:l.forwardState.transform},{transform:l.backwardState.transform,duration:n,ease:v},0),y.fromTo(e,{transform:m},{transform:h.transform,duration:n,ease:v},g),r&&d&&y.fromTo(r,{transform:p},{transform:d.transform,duration:n,ease:v},g*2)}function ft(s,t){s.style.transformOrigin=t.origin,s.style.transform=t.transform}function te(s){if(typeof s!="string")return"power2.inOut";let t=s.toLowerCase();return t==="linear"?"none":t.includes("ease-in-out")?"power2.inOut":t.includes("ease-in")?"power2.in":t.includes("ease-out")?"power2.out":t}function ee(s,t){let e=Fe();if(!e||typeof e!="function"){console.warn('Zumly Motion driver: Motion not loaded. Add <script src="https://cdn.jsdelivr.net/npm/motion@11/dist/motion.min.js"><\/script>'),t();return}let{type:r,currentView:o,previousView:n,lastView:i,currentStage:a,duration:c,ease:l,canvas:u}=s;if(!o||!n||!a){t();return}let f=ct(c);r==="lateral"?M(s,t):r==="zoomIn"?Ne(e,o,n,i,a,f,l,t):r==="zoomOut"?Me(e,o,n,i,a,f,l,u,t):t()}function Ne(s,t,e,r,o,n,i,a){x(t,e,r);let c=se(t,e,r,o,"forward");re(c,0);let l=o.stagger||0,u=l/1e3,f=n*1e3,h=n+(c.length>2?u*2:u);s(0,1,{duration:h,ease:ne(i),onUpdate:m=>{let p=m*h*1e3;oe(c,p,f,l)}}).then(()=>{S(t,o),S(e,o),r&&S(r,o),a()}).catch(()=>a())}function Me(s,t,e,r,o,n,i,a,c){let l=o.views[1],u=r&&o.views[2]?o.views[2]:null,f=l.backwardState,h=u?u.backwardState:null,d=se(t,e,r,o,"backward");re(d,0);let m=o.stagger||0,p=m/1e3,v=n*1e3,y=n+(d.length>2?p*2:p);s(0,1,{duration:y,ease:ne(i),onUpdate:w=>{let b=w*y*1e3;oe(d,b,v,m)}}).then(()=>{T(t,a),k(e,f),r&&h&&C(r,h),c()}).catch(()=>c())}function se(s,t,e,r,o){let n=r.views[0],i=r.views[1],a=e&&r.views[2]?r.views[2]:null,c=[{el:s,backward:n.backwardState,forward:n.forwardState},{el:t,backward:i.backwardState,forward:i.forwardState}];return a&&c.push({el:e,backward:a.backwardState,forward:a.forwardState}),c.map(({el:l,backward:u,forward:f})=>o==="forward"?{el:l,from:P(l,u.origin,u.transform),to:P(l,u.origin,f.transform)}:{el:l,from:P(l,f.origin,f.transform),to:P(l,f.origin,u.transform)})}function re(s,t){for(let{el:e,from:r,to:o}of s)e.style.transform=Y(U(r,o,t))}function oe(s,t,e,r){for(let o=0;o<s.length;o++){let{el:n,from:i,to:a}=s[o],c=o*r,l=Math.max(0,t-c),u=e>0?Math.min(1,l/e):1;n.style.transform=Y(U(i,a,u))}}function Fe(){let s=typeof globalThis<"u"?globalThis:typeof window<"u"?window:{};return s.motion?.animate||s.Motion?.animate||s.animate}function ne(s){if(typeof s!="string")return"easeInOut";let t=s.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOut":t.includes("ease-in")?"easeIn":t.includes("ease-out")?"easeOut":s}var ie={css:Vt,waapi:Yt,none:Xt,anime:Ut,gsap:Jt,motion:ee};function ae(s){if(typeof s=="function")return{runTransition(r,o){s(r,o)}};let t=typeof s=="string"?s.toLowerCase():"css";return{runTransition:ie[t]||ie.css}}function De(s){if(typeof s!="string"||s.trim()==="")return{tx:0,ty:0,rest:""};let t=s.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(!t)return null;let e=parseFloat(t[1]),r=parseFloat(t[2]),o=s.replace(/translate\s*\([^)]+\)\s*/,"").trim();return{tx:e,ty:r,rest:o}}function wt(s,t,e){let r=De(s);if(r===null)return s;let o=r.tx*t,n=r.ty*e,i=r.rest?` ${r.rest}`:"";return`translate(${o}px, ${n}px)${i}`.trim()}function He(s){if(typeof s!="string"||!s.trim())return null;let t=s.trim().match(/^([-\d.eE]+)px\s+([-\d.eE]+)px$/);return t?{x:parseFloat(t[1]),y:parseFloat(t[2])}:null}function gt(s,t,e){let r=He(s);return r===null?s:`${r.x*t}px ${r.y*e}px`}function bt(s,t,e,r,o){if(!s.storedViews?.length||!s.canvas||t<=0||e<=0)return;let n=r/t,i=o/e;for(let d of s.storedViews){let m=d.views;if(Array.isArray(m))for(let p=0;p<m.length;p++){let v=m[p];!v||v.detachedNode||(v.backwardState&&(v.backwardState.transform=wt(v.backwardState.transform,n,i),v.backwardState.origin!=null&&(v.backwardState.origin=gt(v.backwardState.origin,n,i))),v.forwardState&&(v.forwardState.transform=wt(v.forwardState.transform,n,i),v.forwardState.origin!=null&&(v.forwardState.origin=gt(v.forwardState.origin,n,i))))}}let a=s.canvas,c=a.querySelector(".is-current-view"),l=a.querySelector(".is-previous-view"),u=a.querySelector(".is-last-view"),f=a.querySelector(".is-new-current-view"),h=[c,l,u,f].filter(Boolean);for(let d of h){if(!d.style)continue;let m=d.style.transform;m!=null&&m!==""&&(d.style.transform=wt(m,n,i));let p=d.style.transformOrigin;p!=null&&p!==""&&(d.style.transformOrigin=gt(p,n,i))}}var je=8e3,tt=class{constructor(t){if(this.storedViews=[],this.currentStage=null,this.debug=!1,this.trace=[],this.blockEvents=!1,this._blockEventsSafetyTimer=null,this.touchstartX=0,this.touchstartY=0,this.touchendX=0,this.touchendY=0,this.touching=!1,this.lateralHistory=[],this._lastCanvasWidth=0,this._lastCanvasHeight=0,this._pendingResizeCorrection=!1,this._destroyed=!1,this._hooks={},this._plugins=[],It(t,this),!this.isValid){this.notify("is unable to start: invalid or missing required options (mount, initialView, views).","error");return}if(this.canvas=document.querySelector(this.mount),!this.canvas){this.notify(`mount selector "${this.mount}" did not match any element.`,"error"),this.isValid=!1;return}this.transitionDriver=ae(this.transitionDriver),this._onZoom=this.onZoom.bind(this),this._onTouchStart=this.onTouchStart.bind(this),this._onTouchEnd=this.onTouchEnd.bind(this),this._onKeyUp=this.onKeyUp.bind(this),this._onWheel=this.onWheel.bind(this),this._wheelCooldown=!1,this._onPrefetchTrigger=e=>{e.target.classList.contains("zoom-me")&&e.target.dataset.to&&this.prefetcher.prefetch(e.target.dataset.to,{trigger:e.target,...e.target.dataset})},this._onResize=this._handleResize.bind(this),this._resizeDebounceTimer=null,this._RESIZE_DEBOUNCE_MS=80,this.prefetcher=new lt(this.views),this._bindEvents()}_bindEvents(){let t=this.canvas;t&&(t.setAttribute("tabindex","0"),t.setAttribute("role","application"),t.setAttribute("aria-roledescription","zoomable interface"),t.setAttribute("aria-live","polite"),t.addEventListener("mouseup",this._onZoom,!1),t.addEventListener("touchend",this._onZoom,!1),t.addEventListener("touchstart",this._onTouchStart,{passive:!0}),t.addEventListener("touchend",this._onTouchEnd,!1),t.addEventListener("keyup",this._onKeyUp,!1),t.addEventListener("wheel",this._onWheel,{passive:!1}),t.addEventListener("mouseover",this._onPrefetchTrigger,{passive:!0}),t.addEventListener("focusin",this._onPrefetchTrigger,{passive:!0}),window.addEventListener("resize",this._onResize,{passive:!0}),typeof ResizeObserver<"u"&&(this._resizeObserver=new ResizeObserver(()=>this._handleResize()),this._resizeObserver.observe(t)))}_unbindEvents(){let t=this.canvas;t&&(t.removeEventListener("mouseup",this._onZoom,!1),t.removeEventListener("touchend",this._onZoom,!1),t.removeEventListener("touchstart",this._onTouchStart),t.removeEventListener("touchend",this._onTouchEnd,!1),t.removeEventListener("keyup",this._onKeyUp,!1),t.removeEventListener("wheel",this._onWheel),t.removeEventListener("mouseover",this._onPrefetchTrigger),t.removeEventListener("focusin",this._onPrefetchTrigger)),window.removeEventListener("resize",this._onResize),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}_setBlockEvents(){this.blockEvents=!0,this._clearBlockEventsSafety(),this._blockEventsSafetyTimer=setTimeout(()=>{this.blockEvents&&!this._destroyed&&(this.notify("blockEvents safety timeout: driver did not call onComplete. Force-resetting.","warn"),this.blockEvents=!1,this._onTransitionComplete())},je)}_clearBlockEventsSafety(){this._blockEventsSafetyTimer!==null&&(clearTimeout(this._blockEventsSafetyTimer),this._blockEventsSafetyTimer=null)}storeViews(t){this.tracing("storedViews()"),this.storedViews.push(t),this.debug&&console.debug("Zumly storedViews",t)}tracing(t){if(this.debug)if(t==="ended"){let e=this.trace.map((r,o)=>`${o===0?`Instance ${this.instance}: ${r}`:`${r}`}`).join(" > ");this.notify(e),this.trace=[]}else this.trace.push(t)}notify(t,e){return z(this.debug,t,e)}_recordCanvasSize(){if(!this.canvas)return;let t=this.canvas.getBoundingClientRect();this._lastCanvasWidth=t.width,this._lastCanvasHeight=t.height}_handleResize(){this._destroyed||(this._resizeDebounceTimer&&clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=setTimeout(()=>{if(this._resizeDebounceTimer=null,!this.isValid||!this.canvas||this._lastCanvasWidth===0)return;let t=this.canvas.getBoundingClientRect(),e=t.width,r=t.height;if(!(e===this._lastCanvasWidth&&r===this._lastCanvasHeight)){if(this.blockEvents){this._pendingResizeCorrection=!0;return}bt(this,this._lastCanvasWidth,this._lastCanvasHeight,e,r),this._lastCanvasWidth=e,this._lastCanvasHeight=r}},this._RESIZE_DEBOUNCE_MS))}_onTransitionComplete(){if(this._clearBlockEventsSafety(),this._pendingResizeCorrection&&!this.blockEvents){this._pendingResizeCorrection=!1;let t=this.canvas?.getBoundingClientRect();if(t&&this._lastCanvasWidth>0){let e=t.width,r=t.height;(e!==this._lastCanvasWidth||r!==this._lastCanvasHeight)&&bt(this,this._lastCanvasWidth,this._lastCanvasHeight,e,r),this._lastCanvasWidth=e,this._lastCanvasHeight=r}}else this._recordCanvasSize();this._manageFocus()}_manageFocus(){if(!this.canvas)return;let t=this.canvas.querySelector(".is-current-view");if(!t)return;let e=t.querySelector('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])');e?e.focus({preventScroll:!0}):(t.setAttribute("tabindex","-1"),t.focus({preventScroll:!0}))}_resolveEffects(t){let e=t?.dataset?.withEffects;if(e&&typeof e=="string"){let r=e.split("|").map(o=>o.trim());return[r[0]||"none",r[1]||r[0]||"none"]}return this.effects}_applyEffects(t,e,r,o,n){!r||r[0]==="none"&&r[1]==="none"||(t&&r[0]!=="none"&&(t.style.setProperty("--z-effect-filter",r[0]),t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("has-effect")),e&&r[1]!=="none"&&(e.style.setProperty("--z-effect-filter",r[1]),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("has-effect")))}_removeEffect(t){if(!t||!t.classList.contains("has-effect"))return;t.classList.remove("has-effect"),t.classList.add("has-effect-reverse");let e=()=>{t.classList.remove("has-effect-reverse"),t.style.removeProperty("--z-effect-filter"),t.removeEventListener("transitionend",e)};t.addEventListener("transitionend",e,{once:!0});let r=t.style.getPropertyValue("--zoom-duration");setTimeout(e,r?parseFloat(r)*(r.includes("ms")?1:1e3)+100:1100)}_resolveHideTrigger(t){return t?.dataset?.hideTrigger!==void 0?t.dataset.hideTrigger==="fade"?"fade":!0:this.hideTrigger}_applyHideTrigger(t,e,r,o,n){!r||!t||(r==="fade"?(t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("z-trigger-fade"),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("z-view-fade-in"),e.offsetHeight,e.classList.remove("hide")):t.classList.add("z-trigger-hidden"))}_restoreHideTrigger(t,e,r,o){if(!(!e||!t))if(e==="fade"){t.classList.remove("z-trigger-fade"),t.style.setProperty("--zoom-duration",r),t.style.setProperty("--zoom-ease",o),t.classList.add("z-trigger-fade-reverse");let n=()=>{t.classList.remove("z-trigger-fade-reverse"),t.style.removeProperty("--zoom-duration"),t.style.removeProperty("--zoom-ease"),t.removeEventListener("transitionend",n)};t.addEventListener("transitionend",n,{once:!0}),setTimeout(n,parseFloat(r)*(r.includes("ms")?1:1e3)+100)}else t.classList.remove("z-trigger-hidden")}on(t,e){return typeof e!="function"?this:((this._hooks[t]||=[]).push(e),this)}use(t,e){if(!t)return this;let r={plugin:t,options:e};return this._plugins.push(r),this._initialized&&this._installPlugin(r),this}_installPlugin(t){let{plugin:e,options:r}=t;try{typeof e=="function"?e(this,r):typeof e.install=="function"&&e.install(this,r)}catch(o){this.notify(`plugin install error: ${o.message}`,"error")}}off(t,e){return e?this._hooks[t]&&(this._hooks[t]=this._hooks[t].filter(r=>r!==e)):delete this._hooks[t],this}_emit(t,e={}){let r=this._hooks[t];if(!(!r||r.length===0))for(let o of r)try{o(e)}catch(n){this.debug&&console.error(`Zumly hook "${t}" threw:`,n)}}zoomLevel(){return this.storedViews.length}getZoomLevel(){return this.zoomLevel()}getCurrentViewName(){return!this.storedViews||this.storedViews.length===0?null:this.storedViews[this.storedViews.length-1]?.views?.[0]?.viewName??null}back(){if(!this._destroyed){if(this.lateralHistory&&this.lateralHistory.length>0){let t=this.lateralHistory.pop(),e=t&&typeof t=="object"?t.name:t,r=t&&typeof t=="object"?t.entry:void 0,o=t&&typeof t=="object"?t.node:void 0;return this._doLateral(e,!0,{savedEntry:r,keepAliveNode:o})}this.zoomOut()}}async goTo(t,e={}){return this._destroyed?void 0:(e.mode==="lateral"?"lateral":"depth")==="depth"?this.zoomTo(t,e):this._doLateral(t,!1,e)}async zoomTo(t,e={}){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("zoomTo() cannot run: instance is invalid or canvas not found.","error");return}if(typeof t!="string"||!t){this.notify("zoomTo() requires a non-empty view name.","warn");return}if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`zoomTo("${t}"): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}if(this.getCurrentViewName()===t)return;let o=this.canvas.getBoundingClientRect(),n=Math.max(40,o.width*.1),i=Math.max(40,o.height*.1),c={rect:{x:o.left+(o.width-n)/2,y:o.top+(o.height-i)/2,width:n,height:i},duration:e.duration??this.duration,ease:e.ease??this.ease,props:e.props??{}};await this._doZoomIn(t,c)}async init(){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("init() cannot run: instance is invalid or canvas element was not found.","error");return}this.tracing("init()"),this.preload&&this.preload.length&&await this.prefetcher.preloadEager(this.preload,null);let t=await this.prefetcher.get(this.initialView,null),e=await K(t,this.initialView,this.canvas,!0,this.views,this.componentContext);this._emit("viewMounted",{viewName:this.initialView,node:e}),this.prefetcher.scanAndPrefetch(e,null),this.storeViews({zoomLevel:this.storedViews.length,scale:1,views:[{viewName:this.initialView,backwardState:{origin:"0 0",transform:""}}]}),this.currentStage=this.storedViews[this.storedViews.length-1],this._recordCanvasSize(),this._initialized=!0;for(let r of this._plugins)this._installPlugin(r)}destroy(){this._destroyed||(this._emit("destroy"),this._destroyed=!0,this._clearBlockEventsSafety(),this._resizeDebounceTimer&&(clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=null),this._unbindEvents(),this._removeNav(),this._cleanupLateralKeepAlive(),this.blockEvents=!1,this.storedViews=[],this.currentStage=null,this.lateralHistory=[],this.trace=[],this._hooks={},this.prefetcher=null,this.transitionDriver=null,this.canvas&&(this.canvas.removeAttribute("tabindex"),this.canvas.removeAttribute("role"),this.canvas.removeAttribute("aria-roledescription"),this.canvas.removeAttribute("aria-live")),this.isValid=!1)}async _doZoomIn(t,e){if(this._destroyed)return;this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomIn",{viewName:t}),this.tracing("zoomIn()");let r=this.canvas,o=e.el,n=r.getBoundingClientRect(),i=n.left,a=n.top,l=(this.storedViews.length>0?this.storedViews[this.storedViews.length-1]:null)?.scale??1;this.tracing("getView()");let u=o?{trigger:o,target:document.createElement("div"),context:this.componentContext,props:Object.assign({},o.dataset)}:{target:document.createElement("div"),context:this.componentContext,props:e.props??{}},f=o?.dataset?.deferred!==void 0?!0:this.deferred,h,d=null;if(f){let E=await this.prefetcher.get(t,u);if(this._destroyed)return;for(d=document.createDocumentFragment();E.firstChild;)d.appendChild(E.firstChild);h=await K(E,t,r,!1,{},this.componentContext)}else{let E=await this.prefetcher.get(t,u);if(this._destroyed)return;this.prefetcher.scanAndPrefetch(E,u),h=await K(E,t,r,!1,this.views,this.componentContext)}if(!h)return;f||this._emit("viewMounted",{viewName:t,node:h}),o&&o.classList.add("zoomed");let m=o?(()=>{let E=o.getBoundingClientRect();return{x:E.x,y:E.y,width:E.width,height:E.height}})():e.rect,p=o?o.dataset.withDuration||this.duration:e.duration??this.duration,v=o?o.dataset.withEase||this.ease:e.ease??this.ease,y=o?o.dataset.withCover||this.cover:e.cover??this.cover,g=o?parseInt(o.dataset.withStagger,10)||this.stagger:e.stagger??this.stagger,w=r.querySelector(".is-current-view"),b=r.querySelector(".is-previous-view"),L=r.querySelector(".is-last-view");V(h),V(w),V(b),L&&(V(L),r.removeChild(L));let Z,H,W,_,O,N,A,fe=w.style.transform,Et=w.style.transformOrigin,ue=b?b.style.transform:null,_t=b?b.style.transformOrigin:null;try{w.classList.replace("is-current-view","is-previous-view"),b&&b.classList.replace("is-previous-view","is-last-view");let E=h.getBoundingClientRect(),j=w.getBoundingClientRect(),dt=null,xt=null,st=null;b&&(dt=b.getBoundingClientRect(),st=b.querySelector(".zoomed"),xt=st&&st.getBoundingClientRect?st.getBoundingClientRect():dt);let rt={left:i,top:a},Lt={width:n.width,height:n.height},Tt={width:E.width,height:E.height},zt=Zt(m.width,m.height,E.width,E.height,y);A=zt.scale;let we=zt.scaleInv;Z=$t(m,rt,Tt,we),W=w.style.transform;let kt=Mt(m,j);_=Ft(Lt,m,j,A,this.parallax);let Ct=nt(Et||"0 0"),q=G(W||""),Ot=nt(kt),B=G(_.transform),At=m;if(o&&(At=it(m,j,Ct,q.tx,q.ty,q.scale,Ot,B.tx,B.ty,B.scale)),H=Nt(At,rt,Tt),b){O=b.style.transform;let ge=it(j,j,Ct,q.tx,q.ty,q.scale,Ot,B.tx,B.ty,B.scale),be=Ht(_.x,_.y,rt,A,l),Pt=nt(_t||"0 0"),mt=G(O||""),pt=G(be),Se=it(xt,dt,Pt,mt.tx,mt.ty,mt.scale,Pt,pt.tx,pt.ty,pt.scale);N=Dt({canvasRect:Lt,canvasOffset:rt,triggerRect:m,previousViewRectAtBaseTransform:j,lastViewZoomedElementRect:Se,previousViewRectWithPreviousAtEndTransform:ge,scale:A,preScale:l,parallax:this.parallax})}h.style.transform=Z,w.style.transformOrigin=kt}catch(E){this.notify(`zoomIn geometry computation failed: ${E.message}. Aborting zoom.`,"error"),this.debug&&console.error("Zumly _doZoomIn error:",E),w.style.transform=fe,w.style.transformOrigin=Et,w.classList.contains("is-previous-view")&&w.classList.replace("is-previous-view","is-current-view"),b&&(b.style.transform=ue,b.style.transformOrigin=_t,b.classList.contains("is-last-view")&&b.classList.replace("is-last-view","is-previous-view"));try{r.removeChild(h)}catch{}R(w),R(b);return}let he=Q(h.dataset.viewName,{origin:h.style.transformOrigin,duration:p,ease:v,transform:Z},{origin:h.style.transformOrigin,duration:p,ease:v,transform:H}),de=Q(w.dataset.viewName,{origin:w.style.transformOrigin,duration:p,ease:v,transform:W},{origin:w.style.transformOrigin,duration:p,ease:v,transform:_.transform}),me=b?Q(b.dataset.viewName,{origin:b.style.transformOrigin,duration:p,ease:v,transform:O},{origin:b.style.transformOrigin,duration:p,ease:v,transform:N}):null,pe=L?jt(L):null,et=Rt(this.storedViews.length,he,de,me,pe);et.scale=A,et.stagger=g||0,this.storeViews(et),this.currentStage=this.storedViews[this.storedViews.length-1],this.tracing("setCSSVariables()");let ve=this._resolveEffects(o);this._applyEffects(w,b,ve,p,v);let ht=this._resolveHideTrigger(o);this._applyHideTrigger(o,h,ht,p,v),ht&&(et.hideTriggerMode=ht),this._setBlockEvents();let ye={type:"zoomIn",currentView:h,previousView:w,lastView:b,currentStage:this.currentStage,duration:p,ease:v};this.transitionDriver.runTransition(ye,async()=>{f&&d&&h&&!this._destroyed&&(h.appendChild(d),this.prefetcher.scanAndPrefetch(h,u),typeof this.views[t]=="object"&&typeof this.views[t].mounted=="function"&&await this.views[t].mounted(),this._emit("viewMounted",{viewName:t,node:h})),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterZoomIn",{viewName:t,zoomLevel:this.zoomLevel()}),this.tracing("ended")})}async zoomIn(t){this._destroyed||t?.dataset?.to&&await this._doZoomIn(t.dataset.to,{el:t})}async _doLateral(t,e=!1,r={}){if(this._destroyed||!this.isValid||!this.canvas)return;if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`goTo("${t}", { mode: 'lateral' }): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}let o=this.canvas.querySelector(".is-current-view");if(!o)return;let n=o.dataset?.viewName;if(n===t)return;this._emit("beforeLateral",{viewName:t,from:n,isBack:e});let i=this.lateralNav&&this.lateralNav.keepAlive;if(!e){this.lateralHistory=this.lateralHistory||[];let _=this.storedViews[this.storedViews.length-1];this.lateralHistory.push({name:n,entry:_.views[0],node:i?o:null})}this.tracing("lateral()");let a=r.duration??this.duration,c=r.ease??this.ease,l=this.canvas.querySelector(".is-previous-view"),u=this.canvas.querySelector(".is-last-view"),f=0,h=0;if(l){let _=l.querySelector(`.zoom-me[data-to="${n}"]`),O=l.querySelector(`.zoom-me[data-to="${t}"]`);if(_&&O){let N=_.getBoundingClientRect(),A=O.getBoundingClientRect();f=N.left+N.width/2-(A.left+A.width/2),h=N.top+N.height/2-(A.top+A.height/2)}else f=this.canvas.getBoundingClientRect().width*.15}let d=null,m=null;if(i&&(e&&r.keepAliveNode?m=r.keepAliveNode:m=this.canvas.querySelector(`.is-lateral-hidden[data-view-name="${t}"]`)),m){if(m.style.display="",m.style.opacity="",m.classList.remove("is-lateral-hidden","zoom-lateral-out"),m.classList.add("is-new-current-view","has-no-events"),d=m,!e&&this.lateralHistory){let _=this.lateralHistory.findIndex(O=>O.node===m);_!==-1&&this.lateralHistory.splice(_,1)}}else{let _={target:document.createElement("div"),context:this.componentContext,props:r.props??{}},O=await this.prefetcher.get(t,_);if(this._destroyed||(this.prefetcher.scanAndPrefetch(O,_),d=await K(O,t,this.canvas,!1,this.views,this.componentContext),!d))return;this._emit("viewMounted",{viewName:t,node:d})}V(d);let p=o.style.transform||"",v=o.style.transformOrigin||"0 0";d.style.transform=p,d.style.transformOrigin=v;let y=this.storedViews[this.storedViews.length-1],g=e&&r.savedEntry?{...r.savedEntry,viewName:t}:Q(t,{origin:v,duration:a,ease:c,transform:p},{origin:v,duration:a,ease:c,transform:p});y.views[0]=g,this.currentStage=y;let w=l?{transformStart:l.style.transform||"",transformEnd:this._computeLateralBackTransform(l.style.transform||"",f,h)}:null,b=u&&y.views[2]?{transformStart:u.style.transform||"",transformEnd:this._computeLateralBackTransform(u.style.transform||"",f*.7,h*.7)}:null;w&&y.views[1]&&(y.views[1].forwardState={...y.views[1].forwardState,transform:w.transformEnd}),b&&y.views[2]&&(y.views[2].forwardState={...y.views[2].forwardState,transform:b.transformEnd});let L=p,Z=this._computeLateralBackTransform(L,-f,-h),H=this._computeLateralBackTransform(p,f,h);this._setBlockEvents();let W={type:"lateral",currentView:d,previousView:o,lastView:u||null,backView:l||null,backViewState:w,lastViewState:b,incomingTransformStart:Z,incomingTransformEnd:L,outgoingTransform:p,outgoingTransformEnd:H,currentStage:this.currentStage,duration:a,ease:c,canvas:this.canvas,slideDeltaX:f,slideDeltaY:h,keepAlive:i&&!e?i:!1};this.transitionDriver.runTransition(W,()=>{i&&!e&&(o.classList.remove("is-current-view","is-new-current-view","has-no-events"),o.classList.add("is-lateral-hidden"),i!=="visible"?o.style.display="none":(o.style.transform=p,o.style.opacity="")),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterLateral",{viewName:t,from:n,isBack:e}),this.tracing("ended")})}_computeLateralBackTransform(t,e,r){let o=t.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(o){let n=parseFloat(o[1])+e,i=parseFloat(o[2])+r,a=t.replace(/translate\s*\([^)]+\)\s*/,"");return`translate(${n}px, ${i}px) ${a}`.trim()}return`translate(${e}px, ${r}px) ${t}`.trim()}zoomOut(){if(this._destroyed)return;this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("zoomOut()");let t=this.canvas,e=t.querySelector(".is-current-view"),r=t.querySelector(".is-previous-view");if(!e||!r){this.notify("zoomOut: current or previous view not found (animation may still be running)","warn");return}this._setBlockEvents(),this.currentStage=this.storedViews[this.storedViews.length-1];let o=t.querySelector(".is-last-view");this.tracing("setCSSVariables()");let n=this.currentStage.views[0]?.forwardState?.duration??this.duration,i=this.currentStage.views[0]?.forwardState?.ease??this.ease,a=r.querySelector(".zoomed");a&&a.classList.remove("zoomed");let c=this.currentStage.hideTriggerMode;c&&a&&this._restoreHideTrigger(a,c,n,i),c==="fade"?(e.classList.remove("z-view-fade-in"),e.style.setProperty("--zoom-duration",n),e.style.setProperty("--zoom-ease",i),e.classList.add("z-view-fade-out")):(e.classList.remove("z-view-fade-in"),e.style.removeProperty("opacity")),this._removeEffect(r),r.classList.replace("is-previous-view","is-current-view"),o!==null&&(o.classList.contains("has-effect")&&this.effects[0]!=="none"&&o.style.setProperty("--z-effect-filter",this.effects[0]),o.classList.replace("is-last-view","is-previous-view"),o.classList.remove("hide"),R(o));let l=qt(this.currentStage);if(l){t.prepend(l);let f=t.querySelector(".z-view:first-child");f&&(R(f),f.classList.add("hide"))}let u={type:"zoomOut",currentView:e,previousView:r,lastView:o,currentStage:this.currentStage,duration:n,ease:i,canvas:t};this.transitionDriver.runTransition(u,()=>{this.blockEvents=!1,this._onTransitionComplete(),this.storedViews.pop(),this._updateNav(),this._emit("afterZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("ended")})}onZoom(t){if(this._destroyed||t.type==="mouseup"&&!this.inputs.click||t.type==="touchend"&&!this.inputs.touch)return;let e=t.target;if(e.closest(".z-depth-nav")||e.closest(".z-lateral-nav"))return;let r=e.classList.contains("zoom-me")||e.closest(".zoom-me");if(!this.blockEvents&&r&&!this.touching){this.tracing("onZoom() \u2192 zoomIn"),t.stopPropagation();let o=e.classList.contains("zoom-me")?e:e.closest(".zoom-me");this.zoomIn(o);return}if(this.storedViews.length>1&&!this.blockEvents&&!r&&!this.touching){let o=this.canvas.querySelector(".is-current-view");if(o&&o.contains(e))return;let n=this._findSiblingTriggerAtPoint(t.clientX,t.clientY);if(n){this.tracing("onZoom() \u2192 lateral"),t.stopPropagation(),this._doLateral(n.dataset.to);return}this.tracing("onZoom() \u2192 zoomOut"),t.stopPropagation(),this.zoomOut()}}_findSiblingTriggerAtPoint(t,e){let r=this.canvas.querySelector(".is-previous-view");if(!r)return null;let n=this.canvas.querySelector(".is-current-view")?.dataset?.viewName;if(!n)return null;let i=r.querySelectorAll(".zoom-me[data-to]");for(let a of i){if(a.dataset.to===n)continue;let c=a.getBoundingClientRect();if(t>=c.left&&t<=c.right&&e>=c.top&&e<=c.bottom)return a}return null}_getSiblings(){let t=this.canvas.querySelector(".is-previous-view");if(!t)return{siblings:[],currentIndex:-1};let r=this.canvas.querySelector(".is-current-view")?.dataset?.viewName,o=t.querySelectorAll(".zoom-me[data-to]"),n=[];for(let a of o)a.dataset.to&&n.push(a.dataset.to);let i=n.indexOf(r);return{siblings:n,currentIndex:i}}_updateNav(){this._destroyed||(this._removeNav(),this._updateDepthNav(),this._updateLateralNav())}_updateDepthNav(){if(!this.depthNav||this.storedViews.length-1<1)return;let e=this.canvas.querySelector(".z-view.is-current-view");if(e&&e.querySelector(".z-depth-nav"))return;let r=this.depthNav.position||"bottom-left",o=document.createElement("div");o.className="z-depth-nav z-depth-nav--"+r;let n=document.createElement("button");n.className="z-nav-back",n.setAttribute("aria-label","Zoom out (go back)"),n.innerHTML="‹",n.addEventListener("mouseup",i=>{i.stopPropagation(),!this.blockEvents&&this.storedViews.length>1&&this.zoomOut()}),o.appendChild(n),this.canvas.appendChild(o)}_updateLateralNav(){if(!this.lateralNav)return;let t=this.storedViews.length-1,e=this._getSiblings();if(e.siblings.length<2)return;if(this.lateralNav.mode==="auto"&&t>=1){let a=this.canvas.querySelector(".z-view.is-current-view");if(a&&a.offsetWidth>=this.canvas.offsetWidth&&a.offsetHeight>=this.canvas.offsetHeight)return}let{siblings:r,currentIndex:o}=e,n=this.lateralNav.position||"bottom-center",i=document.createElement("div");if(i.className="z-lateral-nav z-lateral-nav--"+n,this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-prev",a.setAttribute("aria-label","Previous sibling view"),a.innerHTML="‹",a.disabled=o<=0,a.addEventListener("mouseup",c=>{c.stopPropagation(),o>0&&this._doLateral(r[o-1])}),i.appendChild(a)}if(this.lateralNav.dots){let a=document.createElement("div");a.className="z-nav-lateral-dots";for(let c=0;c<r.length;c++){let l=document.createElement("button");l.className="z-nav-dot z-nav-lat-dot"+(c===o?" is-active":""),l.setAttribute("aria-label",`Go to ${r[c]}`),l.dataset.to=r[c],l.addEventListener("mouseup",(u=>f=>{f.stopPropagation(),u!==o&&this._doLateral(r[u])})(c)),a.appendChild(l)}i.appendChild(a)}if(this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-next",a.setAttribute("aria-label","Next sibling view"),a.innerHTML="›",a.disabled=o>=r.length-1,a.addEventListener("mouseup",c=>{c.stopPropagation(),o<r.length-1&&this._doLateral(r[o+1])}),i.appendChild(a)}this.canvas.appendChild(i)}_removeNav(){this.canvas&&this.canvas.querySelectorAll(".z-depth-nav, .z-lateral-nav").forEach(t=>t.remove())}_cleanupLateralKeepAlive(){if(!this.canvas)return;let t=this.canvas.querySelectorAll(".is-lateral-hidden");for(let e of t)e.remove()}onKeyUp(t){this._destroyed||this.inputs.keyboard&&(this.tracing("onKeyUp()"),(t.key==="ArrowLeft"||t.key==="ArrowDown")&&(t.preventDefault(),this.storedViews.length>1&&!this.blockEvents?this.zoomOut():this.notify(`is on level zero. Can't zoom out. Trigger: ${t.key}`,"warn")),(t.key==="ArrowRight"||t.key==="ArrowUp")&&(t.preventDefault(),this.notify(t.key+" has no actions defined")))}onWheel(t){this._destroyed||this.inputs.wheel&&(this._isInsideScrollable(t.target,t.deltaY)||(t.preventDefault(),!(this.blockEvents||this._wheelCooldown)&&t.deltaY>0&&this.storedViews.length>1&&(this.tracing("onWheel() \u2192 zoomOut"),this._wheelCooldown=!0,setTimeout(()=>{this._wheelCooldown=!1},500),this.zoomOut())))}_isInsideScrollable(t,e){let r=t,o=this.canvas.querySelector(".is-current-view");for(;r&&r!==this.canvas;){if(r===o||o&&o.contains(r)){let{overflowY:n}=window.getComputedStyle(r);if((n==="auto"||n==="scroll")&&(e>0?r.scrollTop+r.clientHeight<r.scrollHeight-1:r.scrollTop>0))return!0}r=r.parentElement}return!1}onTouchStart(t){this._destroyed||this.inputs.touch&&(this.tracing("onTouchStart()"),this.touching=!0,this.touchstartX=t.changedTouches[0].screenX,this.touchstartY=t.changedTouches[0].screenY)}onTouchEnd(t){this._destroyed||this.inputs.touch&&(this.blockEvents||(this.tracing("onTouchEnd()"),this.touchendX=t.changedTouches[0].screenX,this.touchendY=t.changedTouches[0].screenY,this.handleGesture(t)))}handleGesture(t){t.stopPropagation(),this.tracing("handleGesture()");let e=this.touchendX-this.touchstartX,r=this.touchendY-this.touchstartY,o=Math.abs(e)<10&&Math.abs(r)<10;e<-30&&(this.storedViews.length>1&&!this.blockEvents?(this.tracing("swipe left"),this.zoomOut()):this.notify("is on level zero. Can't zoom out. Trigger: Swipe left","warn"));let n=t.target.classList.contains("zoom-me")?t.target:t.target.closest(".zoom-me");o&&!this.blockEvents&&n&&this.touching&&(this.touching=!1,this.tracing("tap"),t.preventDefault(),this.zoomIn(n)),o&&this.storedViews.length>1&&!this.blockEvents&&!n&&t.target.closest(".is-current-view")===null&&this.touching&&(this.touching=!1,this.tracing("tap"),this.zoomOut())}};var Re={separator:"/",prefix:"/"};function le(s,t){let e=[];for(let r of s.storedViews){let o=r.views&&r.views[0];o&&o.viewName&&e.push(o.viewName)}return e.join(t)}function qe(s,t){let e=window.location.hash.slice(1);return e.startsWith(s)&&(e=e.slice(s.length)),e?e.split(t).filter(Boolean):[]}var ce={install(s,t){let e=Object.assign({},Re,t),r=e.separator,o=e.prefix,n=!1;function i(u){if(n)return;let f=le(s,r),h="#"+o+f;window.location.hash!==h&&(n=!0,window.history[u](null,"",h),n=!1)}function a(){i("pushState")}function c(){i("replaceState")}s.on("afterZoomIn",a),s.on("afterLateral",a),s.on("afterZoomOut",c);function l(){if(n)return;n=!0;let u=qe(o,r),f=le(s,r).split(r).filter(Boolean);if(u.join(r)===f.join(r)){n=!1;return}if(u.length<f.length){let h=f.length-u.length;for(let d=0;d<h;d++)s.zoomOut()}else if(u.length===f.length&&u.length>0){let h=u[u.length-1];h!==f[f.length-1]&&s.goTo(h,{mode:"lateral"})}else u.length>f.length&&window.history.back();n=!1}window.addEventListener("popstate",l),c(),s.on("destroy",function(){s.off("afterZoomIn",a),s.off("afterLateral",a),s.off("afterZoomOut",c),window.removeEventListener("popstate",l)})}};tt.Router=ce;var Zs=tt;export{tt as Zumly,ce as ZumlyRouter,Zs as default};
|
|
7
|
+
var at=class{#t={};constructor(t={}){this.#t=t}#e(t){return typeof t=="function"?"function":t instanceof HTMLElement?"element":typeof t=="object"&&t!==null&&typeof t.render=="function"?"object":typeof t!="string"?"unknown":/^https?:\/\/|^\/|\.html$|\.php$/i.test(t)?"url":t.includes("<")?"html":t.includes("-")?"webcomponent":"unknown"}async resolve(t,e=null){if(typeof t=="string"&&Object.prototype.hasOwnProperty.call(this.#t,t)){let o=this.#t[t];return this.resolve(o,e)}switch(this.#e(t)){case"html":{let o=document.createElement("div");o.innerHTML=t.trim();let n=o.firstElementChild;if(!n)throw new Error("Zumly: view produced no element (html)");return n}case"url":{let o=new AbortController,n=setTimeout(()=>o.abort(),1e4),i;try{i=await fetch(t,{signal:o.signal})}finally{clearTimeout(n)}if(!i.ok)throw new Error(`Zumly: fetch failed for "${t}" (${i.status})`);let a=await i.text(),l=document.createElement("div");l.innerHTML=a.trim();let c=l.firstElementChild;if(!c)throw new Error("Zumly: view produced no element (url)");return c}case"function":{let o=e&&e.target||document.createElement("div"),n=await t({...e,target:o});if(typeof n=="string")return this.resolve(n,e);if(n instanceof HTMLElement)return n;let i=o.firstElementChild||o;return i.classList.contains("z-view")||i.classList.add("z-view"),i}case"object":{let o=await t.render(e);if(typeof o!="string")throw new Error("Zumly: view render() must return string");return this.resolve(o,e)}case"element":return t.cloneNode(!0);case"webcomponent":return await customElements.whenDefined(t),document.createElement(t);default:throw new Error("Zumly: unknown view type for source")}}};async function Q(r,t,e,s,o,n){if(!r||!r.classList){let i=document.createElement("div");i.classList.add("z-view"),r&&i.appendChild(r),r=i}else r.classList.contains("z-view")||r.classList.add("z-view");return r.dataset.viewName=t,r.getAttribute("aria-label")||r.setAttribute("aria-label",`View: ${t}`),r.style.transformOrigin="0 0",r.style.position="absolute",s?r.classList.add("is-current-view"):r.classList.add("is-new-current-view","has-no-events","hide"),e.append(r),typeof o[t]=="object"&&typeof o[t].mounted=="function"&&await o[t].mounted(),r}function L(r,t,e){t&&e==="welcome"&&console.info(`%c Zumly %c ${t}`,"background: #424085; color: white; border-radius: 3px;","color: #424085"),t&&r&&(e==="info"||e===void 0)&&console.info(`%c Zumly %c ${t}`,"background: #6679A3; color: #304157; border-radius: 3px;","color: #6679A3"),t&&e==="warn"&&console.warn(`%c Zumly %c ${t}`,"background: #DCBF53; color: #424085; border-radius: 3px;","color: #424085"),t&&e==="error"&&console.error(`%c Zumly %c ${t}`,"background: #BE4747; color: white; border-radius: 3px;","color: #424085")}function Zt(r,t){if(t.isValid=!1,!r||typeof r!="object"){L(!1,"'options' object has to be provided when instance is defined","error");return}if(typeof r.mount!="string"){L(!1,"'mount' must be a string selector","error");return}if(t.mount=r.mount,typeof r.initialView!="string"){L(!1,"'initialView' must be a string","error");return}if(t.initialView=r.initialView,!r.views||typeof r.views!="object"){L(!1,"'views' must be an object","error");return}t.views=r.views,t.isValid=!0,t.preload=Array.isArray(r.preload)?r.preload:[],t.debug=typeof r.debug=="boolean"?r.debug:!1,t.componentContext=r.componentContext&&typeof r.componentContext=="object"?r.componentContext:new Map;let e=r.transitions&&typeof r.transitions=="object"?r.transitions:null,s=e&&e.cover,o=typeof s=="string"?s.toLowerCase():null,n=o==="width"||o==="height";t.cover=n?o:"width",!n&&e&&s!==void 0&&L(!1,`'transitions.cover' must be either "width" or "height". Falling back to "width".`,"warn"),t.duration=e&&typeof e.duration=="string"?e.duration:"1s",t.ease=e&&typeof e.ease=="string"?e.ease:"ease-in-out",t.deferred=typeof r.deferred=="boolean"?r.deferred:!1;let i=e&&e.hideTrigger;i===!0||i==="fade"?t.hideTrigger=i:(t.hideTrigger=!1,i!=null&&i!==!1&&L(!1,`'transitions.hideTrigger' must be true or "fade". Falling back to false.`,"warn"));let a=e&&e.effects;Array.isArray(a)&&a.length>=2&&typeof a[0]=="string"&&typeof a[1]=="string"?t.effects=[a[0],a[1]]:Array.isArray(a)&&a.length===1&&typeof a[0]=="string"?t.effects=[a[0],a[0]]:(t.effects=["none","none"],a!=null&&L(!1,`'transitions.effects' must be an array of 1-2 CSS filter strings (e.g. ["blur(3px)", "blur(8px) saturate(0)"]). Falling back to no effects.`,"warn"));let l=e&&e.driver,c=typeof l=="string"?l.toLowerCase():null,u=typeof l=="function"?l:null;if(c!==null){let y=["css","waapi","none","anime","gsap","motion"];t.transitionDriver=y.includes(c)?c:"css",y.includes(c)||L(!1,`'transitions.driver' must be "css", "waapi", "none", "anime", "gsap", "motion", or a function. Got "${l}". Falling back to "css".`,"warn")}else u!==null?t.transitionDriver=u:t.transitionDriver="css";let f=e&&e.stagger;typeof f=="number"&&f>0?t.stagger=f:(t.stagger=0,f!=null&&f!==0&&L(!1,"'transitions.stagger' must be a positive number (ms). Falling back to 0 (disabled).","warn")),t.parallax=0,t.threshold=null;let h=e&&e.threshold;h&&typeof h=="object"&&h.enabled&&(t.threshold={duration:typeof h.duration=="number"&&h.duration>0?h.duration:300,commitAt:typeof h.commitAt=="number"&&h.commitAt>0&&h.commitAt<=1?h.commitAt:.5});let d=r.lateralNav;if(d===!1)t.lateralNav=!1;else if(d&&typeof d=="object"){let y=typeof d.mode=="string"?d.mode.toLowerCase():null,b=y==="auto"||y==="always";y&&!b&&L(!1,`'lateralNav.mode' must be "auto" or "always". Falling back to "auto".`,"warn");let w=null;if(Array.isArray(d.siblings))w=d.siblings.filter(g=>typeof g=="string"&&g),w.length<2&&(L(!1,"'lateralNav.siblings' needs at least 2 view names. Ignoring.","warn"),w=null);else if(d.siblings&&typeof d.siblings=="object"){w={};for(let[g,x]of Object.entries(d.siblings))if(Array.isArray(x)){let k=x.filter(C=>typeof C=="string"&&C);k.length>=2&&(w[g]=k)}Object.keys(w).length===0&&(w=null)}else d.siblings!==void 0&&L(!1,"'lateralNav.siblings' must be an array of view names or a { parentView: [...] } map. Ignoring.","warn");t.lateralNav={mode:b?y:"auto",arrows:typeof d.arrows=="boolean"?d.arrows:!0,dots:typeof d.dots=="boolean"?d.dots:!0,keepAlive:d.keepAlive===!0||d.keepAlive==="visible"?d.keepAlive:!1,siblings:w}}else t.lateralNav={mode:"auto",arrows:!0,dots:!0,keepAlive:!1,siblings:null};let p=r.depthNav;if(p===!1)t.depthNav=!1;else if(p&&typeof p=="object"){let y=typeof p.position=="string"?p.position.toLowerCase():null,b=y==="bottom-left"||y==="top-left";y&&!b&&L(!1,`'depthNav.position' must be "bottom-left" or "top-left". Falling back to "bottom-left".`,"warn"),t.depthNav={position:b?y:"bottom-left"}}else t.depthNav={position:"bottom-left"};let v=r.lateralNav&&typeof r.lateralNav=="object"?r.lateralNav.position:void 0;if(t.lateralNav&&typeof t.lateralNav=="object"){let y=v==="bottom-center"||v==="top-center";v&&!y&&L(!1,`'lateralNav.position' must be "bottom-center" or "top-center". Falling back to "bottom-center".`,"warn"),t.lateralNav.position=y?v:"bottom-center"}let m=r.inputs;m&&typeof m=="object"?t.inputs={wheel:typeof m.wheel=="boolean"?m.wheel:!0,keyboard:typeof m.keyboard=="boolean"?m.keyboard:!0,click:typeof m.click=="boolean"?m.click:!0,touch:typeof m.touch=="boolean"?m.touch:!0}:t.inputs={wheel:!0,keyboard:!0,click:!0,touch:!0}}function $t(r,t,e,s,o){let n=e/r,i=s/t;return o==="height"?{scale:i,scaleInv:1/i}:{scale:n,scaleInv:1/n}}function Ft(r,t,e,s){let o=t.left,n=t.top,i=r.x-o+(r.width-e.width*s)/2,a=r.y-n+(r.height-e.height*s)/2;return`translate(${i}px, ${a}px) scale(${s})`}function Mt(r,t,e){let s=t.left,o=t.top,n=r.x-s+(r.width-e.width)/2,i=r.y-o+(r.height-e.height)/2;return`translate(${n}px, ${i}px)`}function Dt(r,t){let e=r.x+r.width/2-t.x,s=r.y+r.height/2-t.y;return`${e}px ${s}px`}function Ht(r,t,e,s,o=0){let n=r.width/2-t.width/2-t.x+e.x,i=r.height/2-t.height/2-t.y+e.y,a=1-o,l=n*a,c=i*a;return{x:n,y:i,transform:`translate(${l}px, ${c}px) scale(${s})`}}function jt({canvasRect:r,canvasOffset:t,triggerRect:e,previousViewRectAtBaseTransform:s,lastViewZoomedElementRect:o,previousViewRectWithPreviousAtEndTransform:n,scale:i,preScale:a,parallax:l=0}){let c=t.left,u=t.top,f=r.width/2-e.width/2-e.x,h=r.height/2-e.height/2-e.y,d=f+(s.x-o.x)+n.x-c+(n.width-o.width)/2,p=h+(s.y-o.y)+n.y-u+(n.height-o.height)/2,v=1-Math.min(l*2,.9);return`translate(${d*v}px, ${p*v}px) scale(${i*a})`}function Rt(r,t,e,s,o){return`translate(${r-e.left}px, ${t-e.top}px) scale(${s*o})`}function lt(r){let t=r.split(/\s+/);return{x:parseFloat(t[0])||0,y:parseFloat(t[1])||0}}function J(r){let t=r.match(/translate\(\s*([-\d.]+)px[,\s]+([-\d.]+)px\s*\)/),e=r.match(/scale\(\s*([-\d.]+)\s*\)/);return{tx:t?parseFloat(t[1]):0,ty:t?parseFloat(t[2]):0,scale:e?parseFloat(e[1]):1}}function ct(r,t,e,s,o,n,i,a,l,c){let u=t.x-e.x*(1-n)-s,f=t.y-e.y*(1-n)-o,h=t.width/n,d=t.height/n,p=u+e.x+(r.x-u-e.x-s)/n,v=f+e.y+(r.y-f-e.y-o)/n,m=r.width/n,y=r.height/n,b=u+i.x+a+c*(p-u-i.x),w=f+i.y+l+c*(v-f-i.y),g=m*c,x=y*c;return{x:b,y:w,width:g,height:x,left:b,top:w,right:b+g,bottom:w+x}}function tt(r,t,e){return{viewName:r,backwardState:t,forwardState:e}}function qt(r){return{detachedNode:r}}function Bt(r,t,e,s,o){let n=[];return t!==null&&n.push(t),e!==null&&n.push(e),s!==null&&n.push(s),o!==null&&n.push(o),{zoomLevel:r,views:n}}function Vt(r){let t=r.views?.[3];if(!(!t||!(t.detachedNode instanceof Node)))return t.detachedNode}var ft=class{#t=new Map;set(t,e,s=null){this.#t.set(t,{node:e,expires:s?Date.now()+s:null})}get(t){let e=this.#t.get(t);return e?e.expires!==null&&Date.now()>e.expires?(this.#t.delete(t),null):e.node.cloneNode(!0):null}has(t){let e=this.#t.get(t);return e?e.expires!==null&&Date.now()>e.expires?(this.#t.delete(t),!1):!0:!1}invalidate(t){this.#t.delete(t)}clear(){this.#t.clear()}};var Ee=300*1e3,_e=/^https?:\/\/|^\/|\.html$|\.php$/i,ut=class{#t;#e;#r;#s=new Map;constructor(t={}){this.#r=t,this.#t=new at(t),this.#e=new ft}#o(t){return typeof this.#r[t]=="string"}#n(t){return _e.test(t)?Ee:null}async get(t,e=null){if(this.#o(t)){let s=this.#e.get(t);if(s)return s;if(this.#s.has(t))return this.#s.get(t);let o=(async()=>{let n=await this.#t.resolve(t,e),i=this.#r[t],a=this.#n(i);return this.#e.set(t,n,a),this.#s.delete(t),n})();return this.#s.set(t,o),o}return this.#t.resolve(t,e)}async preloadEager(t,e=null){!Array.isArray(t)||t.length===0||await Promise.all(t.map(s=>this.get(s,e)))}prefetch(t,e=null){this.get(t,e).catch(()=>{})}prefetchOnHover(t,e=null){this.prefetch(t,e)}scanAndPrefetch(t,e=null){if(!t||!t.querySelectorAll)return;t.querySelectorAll(".zoom-me[data-to]").forEach(o=>{let n=o.dataset.to;n&&(o.hasAttribute("role")||o.setAttribute("role","button"),o.hasAttribute("aria-label")||o.setAttribute("aria-label",`Zoom to ${n}`),this.prefetch(n,e))})}};function Y(r){r&&(r.style.contentVisibility="hidden")}function R(r){r&&(r.style.contentVisibility="visible")}function Z(r){if(typeof r=="number"&&!Number.isNaN(r))return Math.max(0,r);let t=String(r).trim(),e=t.match(/^(\d*\.?\d+)\s*(ms|s)?$/i);if(!e)return typeof console<"u"&&console.warn(`[zumly] Could not parse duration "${t}" \u2014 falling back to 500ms.`),500;let s=parseFloat(e[1]);return(e[2]||"s").toLowerCase()==="ms"?Math.max(0,s):Math.max(0,s*1e3)}function ht(r){return Z(r)/1e3}function S(r,t){if(r.classList.contains("is-new-current-view")){let e=t.views[0].forwardState;r.classList.replace("is-new-current-view","is-current-view"),r.classList.remove("zoom-current-view","has-no-events"),r.style.transformOrigin=e.origin,r.style.transform=e.transform;return}if(r.classList.contains("is-previous-view")){let e=t.views[1].forwardState;r.classList.remove("zoom-previous-view","has-no-events"),r.style.transformOrigin=e.origin,r.style.transform=e.transform;return}if(r.classList.contains("is-last-view")){let e=t.views[2].forwardState;r.classList.remove("zoom-last-view","has-no-events"),r.style.transformOrigin=e.origin,r.style.transform=e.transform}}function O(r,t){r.classList.remove("zoom-previous-view-reverse","has-no-events","has-effect","has-effect-reverse"),r.style.removeProperty("--z-effect-filter"),r.style.transformOrigin="0 0",r.style.transform=t.transform}function A(r,t){r.classList.remove("zoom-last-view-reverse","has-no-events","has-effect","has-effect-reverse"),r.style.removeProperty("--z-effect-filter"),r.style.transformOrigin=t.origin,r.style.transform=t.transform}function z(r,t){try{t&&t.removeChild(r)}catch{try{r.parentElement&&t.removeChild(r.parentElement)}catch{}}}function T(...r){for(let t of r)t&&(t.classList.remove("hide"),R(t))}function F(r,t){let{currentView:e,previousView:s,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformEnd:l,currentStage:c,canvas:u}=r,f=c.views[0];T(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=f.forwardState.origin,e.style.transform=l||f.forwardState.transform,o&&n&&(o.style.transform=n.transformEnd),i&&a&&(i.style.transform=a.transformEnd),r.keepAlive||z(s,u),t()}var M=150;function D(r,t){let e=!1,s=setTimeout(()=>{e||(e=!0,r())},t);return{finish(){e||(e=!0,clearTimeout(s),r())},safetyTimer:s}}function Xt(){return{a:1,b:0,c:0,d:1,e:0,f:0}}function xe(r){if(!r||r==="none")return Xt();let t=String(r).match(/matrix\(([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+),\s*([-\d.eE]+)\)/);return t?{a:parseFloat(t[1])||1,b:parseFloat(t[2])||0,c:parseFloat(t[3])||0,d:parseFloat(t[4])||1,e:parseFloat(t[5])||0,f:parseFloat(t[6])||0}:Xt()}function W(r){return`matrix(${r.a}, ${r.b}, ${r.c}, ${r.d}, ${r.e}, ${r.f})`}function U(r,t,e){return r+(t-r)*e}function K(r,t,e){let s=Math.max(0,Math.min(1,e));return{a:U(r.a,t.a,s),b:U(r.b,t.b,s),c:U(r.c,t.c,s),d:U(r.d,t.d,s),e:U(r.e,t.e,s),f:U(r.f,t.f,s)}}function P(r,t,e){r.style.transformOrigin=t,r.style.transform=e;try{r.getBoundingClientRect()}catch{}return xe(getComputedStyle(r).transform)}function Yt(r,t){let{type:e,currentView:s,previousView:o,lastView:n,currentStage:i,duration:a,ease:l,canvas:c}=r;if(!s||!o||!i){t();return}e==="lateral"?Le(r,t):e==="zoomIn"?Te(s,o,n,i,a,l,t):e==="zoomOut"?ze(s,o,n,i,a,l,c,t):t()}function Le(r,t){let{currentView:e,previousView:s,backView:o,backViewState:n,lastView:i,lastViewState:a,incomingTransformStart:l,incomingTransformEnd:c,outgoingTransform:u,outgoingTransformEnd:f,currentStage:h,duration:d,ease:p,canvas:v}=r,m=Z(d),y=h.views[0];T(e),e.classList.replace("is-new-current-view","is-current-view"),e.classList.remove("zoom-current-view","has-no-events"),e.style.transformOrigin=y.forwardState.origin,o&&n&&(I(o,d,p,{"--lateral-from":n.transformStart,"--lateral-to":n.transformEnd}),o.classList.add("zoom-lateral-back")),i&&a&&(I(i,d,p,{"--lateral-from":a.transformStart,"--lateral-to":a.transformEnd}),i.classList.add("zoom-lateral-back")),r.keepAlive!=="visible"&&(I(s,d,p,{"--lateral-out-from":u,"--lateral-out-to":f}),s.classList.add("zoom-lateral-out")),I(e,d,p,{"--lateral-in-from":l,"--lateral-in-to":c}),e.classList.add("zoom-lateral-in");let b=r.keepAlive==="visible"?[e]:[s,e];o&&n&&b.push(o),i&&a&&b.push(i);let w=b.length,{finish:g}=D(()=>{gt(b,x),r.keepAlive?(s.classList.remove("zoom-lateral-out"),s.style.opacity=""):z(s,v),o&&(o.classList.remove("zoom-lateral-back"),o.style.transform=n?.transformEnd||o.style.transform),i&&(i.classList.remove("zoom-lateral-back"),i.style.transform=a?.transformEnd||i.style.transform),e.classList.remove("zoom-lateral-in"),e.style.transform=c,t()},m+M);function x(k){let C=k?.target;C&&C.removeEventListener("animationend",x),w--,w<=0&&g()}b.forEach(k=>k.addEventListener("animationend",x))}function Te(r,t,e,s,o,n,i){T(r,t,e);let a=s.stagger||0;I(r,o,n,{"--current-view-transform-start":s.views[0].backwardState.transform,"--current-view-transform-end":s.views[0].forwardState.transform}),a>0&&r.style.setProperty("animation-delay","0ms"),I(t,o,n,{"--previous-view-transform-start":s.views[1].backwardState.transform,"--previous-view-transform-end":s.views[1].forwardState.transform}),a>0&&t.style.setProperty("animation-delay",`${a}ms`),e&&(I(e,o,n,{"--last-view-transform-start":s.views[2].backwardState.transform,"--last-view-transform-end":s.views[2].forwardState.transform}),a>0&&e.style.setProperty("animation-delay",`${a*2}ms`)),r.classList.add("zoom-current-view"),t.classList.add("zoom-previous-view"),e&&e.classList.add("zoom-last-view");let l=e?[r,t,e]:[r,t],c=l.length,u=Z(o),f=e?a*2:a,{finish:h}=D(()=>{gt(l,d),l.forEach(p=>p.style.removeProperty("animation-delay")),i()},u+f+M);function d(p){let v=p?.target;if(v&&v.removeEventListener("animationend",d),v?.isConnected)try{S(v,s)}catch{}c--,c<=0&&h()}l.forEach(p=>p.addEventListener("animationend",d))}function ze(r,t,e,s,o,n,i,a){let l=s.views[0],c=s.views[1],u=e&&s.views[2]?s.views[2]:null,f=s.stagger||0;I(r,o,n,{"--current-view-transform-start":l.backwardState.transform,"--current-view-transform-end":l.forwardState.transform}),f>0&&r.style.setProperty("animation-delay","0ms"),I(t,o,n,{"--previous-view-transform-start":c.backwardState.transform,"--previous-view-transform-end":c.forwardState.transform}),f>0&&t.style.setProperty("animation-delay",`${f}ms`),e&&u&&(I(e,o,n,{"--last-view-transform-start":u.backwardState.transform,"--last-view-transform-end":u.forwardState.transform}),f>0&&e.style.setProperty("animation-delay",`${f*2}ms`)),r.classList.add("zoom-current-view-reverse"),t.classList.add("zoom-previous-view-reverse"),e&&e.classList.add("zoom-last-view-reverse");let h=e?[r,t,e]:[r,t],d=h.length,p=Z(o),v=e?f*2:f,{finish:m}=D(()=>{gt(h,y),h.forEach(b=>b.style.removeProperty("animation-delay")),a()},p+v+M);function y(b){let w=b?.target;if(w&&w.removeEventListener("animationend",y),w?.isConnected)try{ke(w,s,i)}catch{}d--,d<=0&&m()}h.forEach(b=>b.addEventListener("animationend",y))}function ke(r,t,e){if(r.classList.contains("zoom-current-view-reverse")){z(r,e);return}if(r.classList.contains("zoom-previous-view-reverse")){O(r,t.views[1].backwardState);return}r.classList.contains("zoom-last-view-reverse")&&A(r,t.views[2].backwardState)}function I(r,t,e,s){r.style.setProperty("--zoom-duration",t),r.style.setProperty("--zoom-ease",e);for(let[o,n]of Object.entries(s))r.style.setProperty(o,n)}function gt(r,t){for(let e of r)e?.removeEventListener&&e.removeEventListener("animationend",t)}function Ut(r,t){let{type:e,currentView:s,previousView:o,lastView:n,currentStage:i,canvas:a}=r;if(!s||!o||!i){t();return}if(e==="lateral"){F(r,t);return}if(e==="zoomIn"){T(s,o,n),S(s,i),S(o,i),n&&S(n,i),t();return}if(e==="zoomOut"){z(s,a),T(o,n),O(o,i.views[1].backwardState),n&&A(n,i.views[2].backwardState),t();return}t()}function Wt(r,t){let{type:e,currentView:s,previousView:o,lastView:n,currentStage:i,duration:a,ease:l,canvas:c}=r;if(!s||!o||!i){t();return}let u=Z(a);if(e==="lateral"){Ae(r,u,l,t);return}if(e==="zoomIn"){Ce(s,o,n,i,u,l,t);return}if(e==="zoomOut"){Oe(s,o,n,i,u,l,c,t);return}t()}function Ce(r,t,e,s,o,n,i){T(r,t,e);let a=s.views[0],l=s.views[1],c=e&&s.views[2]?s.views[2]:null;r.style.transformOrigin=a.backwardState.origin,r.style.transform=a.backwardState.transform,t.style.transformOrigin=l.backwardState.origin,t.style.transform=l.backwardState.transform,c&&(e.style.transformOrigin=c.backwardState.origin,e.style.transform=c.backwardState.transform);let u=s.stagger||0,f=[];f.push(r.animate([{transform:a.backwardState.transform},{transform:a.forwardState.transform}],{duration:o,easing:n,fill:"forwards"})),f.push(t.animate([{transform:l.backwardState.transform},{transform:l.forwardState.transform}],{duration:o,delay:u,easing:n,fill:"forwards"})),c&&f.push(e.animate([{transform:c.backwardState.transform},{transform:c.forwardState.transform}],{duration:o,delay:u*2,easing:n,fill:"forwards"}));let h=c?u*2:u,{finish:d}=D(()=>{bt(f);try{S(r,s),S(t,s),e&&S(e,s)}catch{}i()},o+h+M);Promise.all(f.map(p=>p.finished)).then(d).catch(d)}function Oe(r,t,e,s,o,n,i,a){let l=s.views[0],c=s.views[1],u=e&&s.views[2]?s.views[2]:null,f=c.backwardState,h=u?u.backwardState:null;r.style.transformOrigin=l.forwardState.origin,r.style.transform=l.forwardState.transform,requestAnimationFrame(()=>{requestAnimationFrame(()=>{t.style.transformOrigin=c.forwardState.origin,e&&u&&(e.style.transformOrigin=u.forwardState.origin);let d=t.style.transform||getComputedStyle(t).transform||c.forwardState.transform,p=e&&u?e.style.transform||getComputedStyle(e).transform||u.forwardState.transform:null,v=s.stagger||0,m=[];m.push(r.animate([{transform:l.forwardState.transform},{transform:l.backwardState.transform}],{duration:o,easing:n,fill:"forwards"})),m.push(t.animate([{transform:d},{transform:f.transform}],{duration:o,delay:v,easing:n,fill:"both"})),e&&h&&m.push(e.animate([{transform:p},{transform:h.transform}],{duration:o,delay:v*2,easing:n,fill:"both"})),t.style.removeProperty("transform"),e&&e.style.removeProperty("transform");let y=e&&h?v*2:v,{finish:b}=D(()=>{bt(m);try{z(r,i),O(t,f),e&&h&&A(e,h)}catch{}a()},o+y+M);Promise.all(m.map(w=>w.finished)).then(b).catch(b)})})}function Ae(r,t,e,s){let{currentView:o,previousView:n,backView:i,backViewState:a,lastView:l,lastViewState:c,incomingTransformStart:u,incomingTransformEnd:f,outgoingTransform:h,outgoingTransformEnd:d,currentStage:p,canvas:v}=r,m=p.views[0];T(o),o.classList.replace("is-new-current-view","is-current-view"),o.classList.remove("zoom-current-view","has-no-events"),o.style.transformOrigin=m.forwardState.origin;let y=[];y.push(o.animate([{transform:u,opacity:0},{transform:f,opacity:1}],{duration:t,easing:e,fill:"forwards"})),r.keepAlive!=="visible"&&y.push(n.animate([{transform:h,opacity:1},{transform:d,opacity:0}],{duration:t,easing:e,fill:"forwards"})),i&&a&&y.push(i.animate([{transform:a.transformStart},{transform:a.transformEnd}],{duration:t,easing:e,fill:"forwards"})),l&&c&&y.push(l.animate([{transform:c.transformStart},{transform:c.transformEnd}],{duration:t,easing:e,fill:"forwards"}));let{finish:b}=D(()=>{bt(y),o.style.transform=f||m.forwardState.transform,i&&a&&(i.style.transform=a.transformEnd),l&&c&&(l.style.transform=c.transformEnd),r.keepAlive?(n.style.opacity="",n.style.transform=d):z(n,v),s()},t+M);Promise.all(y.map(w=>w.finished)).then(b).catch(b)}function bt(r){for(let t of r)try{t.cancel()}catch{}}function Kt(r,t){let e=typeof globalThis<"u"&&globalThis.anime;if(!e||typeof e!="function"){console.warn('Zumly anime driver: Anime.js not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.2/anime.min.js"><\/script>'),t();return}let{type:s,currentView:o,previousView:n,lastView:i,currentStage:a,duration:l,ease:c,canvas:u}=r;if(!o||!n||!a){t();return}let f=Z(l);s==="lateral"?F(r,t):s==="zoomIn"?Pe(e,o,n,i,a,f,c,t):s==="zoomOut"?Ie(e,o,n,i,a,f,c,u,t):t()}function Pe(r,t,e,s,o,n,i,a){T(t,e,s);let l=o.views[0],c=o.views[1],u=s&&o.views[2]?o.views[2]:null,f=Gt([{el:t,backward:l.backwardState,forward:l.forwardState},{el:e,backward:c.backwardState,forward:c.forwardState},...u?[{el:s,backward:u.backwardState,forward:u.forwardState}]:[]],"forward");Qt(f,0);let h=o.stagger||0,d=n+(u?h*2:h),p={value:0};r({targets:p,value:1,duration:d,easing:te(i),update:()=>{let v=p.value*d;Jt(f,v,n,h)},complete:()=>{S(t,o),S(e,o),s&&S(s,o),a()}})}function Ie(r,t,e,s,o,n,i,a,l){let c=o.views[0],u=o.views[1],f=s&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null,p=Gt([{el:t,backward:c.backwardState,forward:c.forwardState},{el:e,backward:u.backwardState,forward:u.forwardState},...f?[{el:s,backward:f.backwardState,forward:f.forwardState}]:[]],"backward");Qt(p,0);let v=o.stagger||0,m=n+(f?v*2:v),y={value:0};r({targets:y,value:1,duration:m,easing:te(i),update:()=>{let b=y.value*m;Jt(p,b,n,v)},complete:()=>{z(t,a),O(e,h),s&&d&&A(s,d),l()}})}function Gt(r,t){return r.map(({el:e,backward:s,forward:o})=>{if(t==="forward"){let n=P(e,s.origin,s.transform),i=P(e,s.origin,o.transform);return{el:e,from:n,to:i}}else{let n=P(e,o.origin,o.transform),i=P(e,o.origin,s.transform);return{el:e,from:n,to:i}}})}function Qt(r,t){for(let{el:e,from:s,to:o}of r)e.style.transform=W(K(s,o,t))}function Jt(r,t,e,s){for(let o=0;o<r.length;o++){let{el:n,from:i,to:a}=r[o],l=o*s,c=Math.max(0,t-l),u=e>0?Math.min(1,c/e):1;n.style.transform=W(K(i,a,u))}}function te(r){if(typeof r!="string")return"easeInOutQuad";let t=r.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOutQuad":t.includes("ease-in")?"easeInQuad":t.includes("ease-out")?"easeOutQuad":t}function ee(r,t){let e=typeof globalThis<"u"&&globalThis.gsap;if(!e||typeof e.to!="function"){console.warn('Zumly GSAP driver: GSAP not loaded. Add <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/gsap.min.js"><\/script>'),t();return}let{type:s,currentView:o,previousView:n,lastView:i,currentStage:a,duration:l,ease:c,canvas:u}=r;if(!o||!n||!a){t();return}let f=ht(l);s==="lateral"?F(r,t):s==="zoomIn"?Ne(e,o,n,i,a,f,c,t):s==="zoomOut"?Ze(e,o,n,i,a,f,c,u,t):t()}function Ne(r,t,e,s,o,n,i,a){T(t,e,s);let l=o.views[0],c=o.views[1],u=s&&o.views[2]?o.views[2]:null;dt(t,l.backwardState),dt(e,c.backwardState),u&&dt(s,u.backwardState);let f=r.timeline({onComplete:()=>{S(t,o),S(e,o),s&&S(s,o),a()}}),h=se(i),d=(o.stagger||0)/1e3;f.to(t,{transform:l.forwardState.transform,duration:n,ease:h},0),f.to(e,{transform:c.forwardState.transform,duration:n,ease:h},d),u&&f.to(s,{transform:u.forwardState.transform,duration:n,ease:h},d*2)}function Ze(r,t,e,s,o,n,i,a,l){let c=o.views[0],u=o.views[1],f=s&&o.views[2]?o.views[2]:null,h=u.backwardState,d=f?f.backwardState:null;dt(t,c.forwardState);let p=e.style.transform||getComputedStyle(e).transform||u.forwardState.transform,v=s&&f?s.style.transform||getComputedStyle(s).transform||f.forwardState.transform:null;e.style.transformOrigin=u.forwardState.origin,s&&f&&(s.style.transformOrigin=f.forwardState.origin);let m=se(i),y=r.timeline({onComplete:()=>{z(t,a),O(e,h),s&&d&&A(s,d),l()}}),b=(o.stagger||0)/1e3;r.set(e,{transform:p}),s&&v&&r.set(s,{transform:v}),y.fromTo(t,{transform:c.forwardState.transform},{transform:c.backwardState.transform,duration:n,ease:m},0),y.fromTo(e,{transform:p},{transform:h.transform,duration:n,ease:m},b),s&&d&&y.fromTo(s,{transform:v},{transform:d.transform,duration:n,ease:m},b*2)}function dt(r,t){r.style.transformOrigin=t.origin,r.style.transform=t.transform}function se(r){if(typeof r!="string")return"power2.inOut";let t=r.toLowerCase();return t==="linear"?"none":t.includes("ease-in-out")?"power2.inOut":t.includes("ease-in")?"power2.in":t.includes("ease-out")?"power2.out":t}function re(r,t){let e=Me();if(!e||typeof e!="function"){console.warn('Zumly Motion driver: Motion not loaded. Add <script src="https://cdn.jsdelivr.net/npm/motion@11/dist/motion.min.js"><\/script>'),t();return}let{type:s,currentView:o,previousView:n,lastView:i,currentStage:a,duration:l,ease:c,canvas:u}=r;if(!o||!n||!a){t();return}let f=ht(l);s==="lateral"?F(r,t):s==="zoomIn"?$e(e,o,n,i,a,f,c,t):s==="zoomOut"?Fe(e,o,n,i,a,f,c,u,t):t()}function $e(r,t,e,s,o,n,i,a){T(t,e,s);let l=oe(t,e,s,o,"forward");ne(l,0);let c=o.stagger||0,u=c/1e3,f=n*1e3,h=n+(l.length>2?u*2:u);r(0,1,{duration:h,ease:ae(i),onUpdate:p=>{let v=p*h*1e3;ie(l,v,f,c)}}).then(()=>{S(t,o),S(e,o),s&&S(s,o),a()}).catch(()=>a())}function Fe(r,t,e,s,o,n,i,a,l){let c=o.views[1],u=s&&o.views[2]?o.views[2]:null,f=c.backwardState,h=u?u.backwardState:null,d=oe(t,e,s,o,"backward");ne(d,0);let p=o.stagger||0,v=p/1e3,m=n*1e3,y=n+(d.length>2?v*2:v);r(0,1,{duration:y,ease:ae(i),onUpdate:w=>{let g=w*y*1e3;ie(d,g,m,p)}}).then(()=>{z(t,a),O(e,f),s&&h&&A(s,h),l()}).catch(()=>l())}function oe(r,t,e,s,o){let n=s.views[0],i=s.views[1],a=e&&s.views[2]?s.views[2]:null,l=[{el:r,backward:n.backwardState,forward:n.forwardState},{el:t,backward:i.backwardState,forward:i.forwardState}];return a&&l.push({el:e,backward:a.backwardState,forward:a.forwardState}),l.map(({el:c,backward:u,forward:f})=>o==="forward"?{el:c,from:P(c,u.origin,u.transform),to:P(c,u.origin,f.transform)}:{el:c,from:P(c,f.origin,f.transform),to:P(c,f.origin,u.transform)})}function ne(r,t){for(let{el:e,from:s,to:o}of r)e.style.transform=W(K(s,o,t))}function ie(r,t,e,s){for(let o=0;o<r.length;o++){let{el:n,from:i,to:a}=r[o],l=o*s,c=Math.max(0,t-l),u=e>0?Math.min(1,c/e):1;n.style.transform=W(K(i,a,u))}}function Me(){let r=typeof globalThis<"u"?globalThis:typeof window<"u"?window:{};return r.motion?.animate||r.Motion?.animate||r.animate}function ae(r){if(typeof r!="string")return"easeInOut";let t=r.toLowerCase();return t==="linear"?"linear":t.includes("ease-in-out")?"easeInOut":t.includes("ease-in")?"easeIn":t.includes("ease-out")?"easeOut":r}var le={css:Yt,waapi:Wt,none:Ut,anime:Kt,gsap:ee,motion:re};function ce(r){if(typeof r=="function")return{runTransition(s,o){r(s,o)}};let t=typeof r=="string"?r.toLowerCase():"css";return{runTransition:le[t]||le.css}}function De(r){if(typeof r!="string"||r.trim()==="")return{tx:0,ty:0,rest:""};let t=r.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(!t)return null;let e=parseFloat(t[1]),s=parseFloat(t[2]),o=r.replace(/translate\s*\([^)]+\)\s*/,"").trim();return{tx:e,ty:s,rest:o}}function St(r,t,e){let s=De(r);if(s===null)return r;let o=s.tx*t,n=s.ty*e,i=s.rest?` ${s.rest}`:"";return`translate(${o}px, ${n}px)${i}`.trim()}function He(r){if(typeof r!="string"||!r.trim())return null;let t=r.trim().match(/^([-\d.eE]+)px\s+([-\d.eE]+)px$/);return t?{x:parseFloat(t[1]),y:parseFloat(t[2])}:null}function Et(r,t,e){let s=He(r);return s===null?r:`${s.x*t}px ${s.y*e}px`}function _t(r,t,e,s,o){if(!r.storedViews?.length||!r.canvas||t<=0||e<=0)return;let n=s/t,i=o/e;for(let d of r.storedViews){let p=d.views;if(Array.isArray(p))for(let v=0;v<p.length;v++){let m=p[v];!m||m.detachedNode||(m.backwardState&&(m.backwardState.transform=St(m.backwardState.transform,n,i),m.backwardState.origin!=null&&(m.backwardState.origin=Et(m.backwardState.origin,n,i))),m.forwardState&&(m.forwardState.transform=St(m.forwardState.transform,n,i),m.forwardState.origin!=null&&(m.forwardState.origin=Et(m.forwardState.origin,n,i))))}}let a=r.canvas,l=a.querySelector(".is-current-view"),c=a.querySelector(".is-previous-view"),u=a.querySelector(".is-last-view"),f=a.querySelector(".is-new-current-view"),h=[l,c,u,f].filter(Boolean);for(let d of h){if(!d.style)continue;let p=d.style.transform;p!=null&&p!==""&&(d.style.transform=St(p,n,i));let v=d.style.transformOrigin;v!=null&&v!==""&&(d.style.transformOrigin=Et(v,n,i))}}var je=8e3,st=class{constructor(t){if(this.storedViews=[],this.currentStage=null,this.debug=!1,this.trace=[],this.blockEvents=!1,this._blockEventsSafetyTimer=null,this.touchstartX=0,this.touchstartY=0,this.touchendX=0,this.touchendY=0,this.touching=!1,this.lateralHistory=[],this._lastCanvasWidth=0,this._lastCanvasHeight=0,this._pendingResizeCorrection=!1,this._destroyed=!1,this._hooks={},this._plugins=[],Zt(t,this),!this.isValid){this.notify("is unable to start: invalid or missing required options (mount, initialView, views).","error");return}if(this.canvas=document.querySelector(this.mount),!this.canvas){this.notify(`mount selector "${this.mount}" did not match any element.`,"error"),this.isValid=!1;return}this.transitionDriver=ce(this.transitionDriver),this._onZoom=this.onZoom.bind(this),this._onTouchStart=this.onTouchStart.bind(this),this._onTouchEnd=this.onTouchEnd.bind(this),this._onKeyUp=this.onKeyUp.bind(this),this._onWheel=this.onWheel.bind(this),this._wheelCooldown=!1,this._onPrefetchTrigger=e=>{e.target.classList.contains("zoom-me")&&e.target.dataset.to&&this.prefetcher.prefetch(e.target.dataset.to,{trigger:e.target,...e.target.dataset})},this._onResize=this._handleResize.bind(this),this._resizeDebounceTimer=null,this._RESIZE_DEBOUNCE_MS=80,this.prefetcher=new ut(this.views),this._bindEvents()}_bindEvents(){let t=this.canvas;t&&(t.setAttribute("tabindex","0"),t.setAttribute("role","application"),t.setAttribute("aria-roledescription","zoomable interface"),t.setAttribute("aria-live","polite"),t.addEventListener("mouseup",this._onZoom,!1),t.addEventListener("touchend",this._onZoom,!1),t.addEventListener("touchstart",this._onTouchStart,{passive:!0}),t.addEventListener("touchend",this._onTouchEnd,!1),t.addEventListener("keyup",this._onKeyUp,!1),t.addEventListener("wheel",this._onWheel,{passive:!1}),t.addEventListener("mouseover",this._onPrefetchTrigger,{passive:!0}),t.addEventListener("focusin",this._onPrefetchTrigger,{passive:!0}),window.addEventListener("resize",this._onResize,{passive:!0}),typeof ResizeObserver<"u"&&(this._resizeObserver=new ResizeObserver(()=>this._handleResize()),this._resizeObserver.observe(t)))}_unbindEvents(){let t=this.canvas;t&&(t.removeEventListener("mouseup",this._onZoom,!1),t.removeEventListener("touchend",this._onZoom,!1),t.removeEventListener("touchstart",this._onTouchStart),t.removeEventListener("touchend",this._onTouchEnd,!1),t.removeEventListener("keyup",this._onKeyUp,!1),t.removeEventListener("wheel",this._onWheel),t.removeEventListener("mouseover",this._onPrefetchTrigger),t.removeEventListener("focusin",this._onPrefetchTrigger)),window.removeEventListener("resize",this._onResize),this._resizeObserver&&(this._resizeObserver.disconnect(),this._resizeObserver=null)}_resetCanvasScroll(t){if(t&&((t.scrollLeft!==0||t.scrollTop!==0)&&(this.notify(`canvas had a residual scroll (${t.scrollLeft}, ${t.scrollTop}) \u2014 resetting. Something scrolled the canvas mid-transition.`,"warn"),t.scrollLeft=0,t.scrollTop=0),!this._warnedScrolledAncestor)){for(let e=t.parentElement;e&&e!==document.body;e=e.parentElement)if(e.scrollLeft!==0||e.scrollTop!==0){let s=e.className?`.${String(e.className).trim().split(/\s+/).join(".")}`:e.tagName.toLowerCase();this.notify(`an ancestor of the canvas (${s}) is scrolled (${e.scrollLeft}, ${e.scrollTop}): all zooms will land displaced. Use 'overflow: clip' (not 'hidden') on containers around the canvas.`,"warn"),this._warnedScrolledAncestor=!0;break}}}_setBlockEvents(){this.blockEvents=!0,this._clearBlockEventsSafety(),this._blockEventsSafetyTimer=setTimeout(()=>{this.blockEvents&&!this._destroyed&&(this.notify("blockEvents safety timeout: driver did not call onComplete. Force-resetting.","warn"),this.blockEvents=!1,this._onTransitionComplete())},je)}_clearBlockEventsSafety(){this._blockEventsSafetyTimer!==null&&(clearTimeout(this._blockEventsSafetyTimer),this._blockEventsSafetyTimer=null)}storeViews(t){this.tracing("storedViews()"),this.storedViews.push(t),this.debug&&console.debug("Zumly storedViews",t)}tracing(t){if(this.debug)if(t==="ended"){let e=this.trace.map((s,o)=>`${o===0?`Instance ${this.instance}: ${s}`:`${s}`}`).join(" > ");this.notify(e),this.trace=[]}else this.trace.push(t)}notify(t,e){return L(this.debug,t,e)}_recordCanvasSize(){if(!this.canvas)return;let t=this.canvas.getBoundingClientRect();this._lastCanvasWidth=t.width,this._lastCanvasHeight=t.height}_handleResize(){this._destroyed||(this._resizeDebounceTimer&&clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=setTimeout(()=>{if(this._resizeDebounceTimer=null,!this.isValid||!this.canvas||this._lastCanvasWidth===0)return;let t=this.canvas.getBoundingClientRect(),e=t.width,s=t.height;if(!(e===this._lastCanvasWidth&&s===this._lastCanvasHeight)){if(this.blockEvents){this._pendingResizeCorrection=!0;return}_t(this,this._lastCanvasWidth,this._lastCanvasHeight,e,s),this._lastCanvasWidth=e,this._lastCanvasHeight=s}},this._RESIZE_DEBOUNCE_MS))}_onTransitionComplete(){if(this._clearBlockEventsSafety(),this._pendingResizeCorrection&&!this.blockEvents){this._pendingResizeCorrection=!1;let t=this.canvas?.getBoundingClientRect();if(t&&this._lastCanvasWidth>0){let e=t.width,s=t.height;(e!==this._lastCanvasWidth||s!==this._lastCanvasHeight)&&_t(this,this._lastCanvasWidth,this._lastCanvasHeight,e,s),this._lastCanvasWidth=e,this._lastCanvasHeight=s}}else this._recordCanvasSize();this._manageFocus()}_manageFocus(){if(!this.canvas)return;let t=this.canvas.querySelector(".is-current-view");if(!t)return;let e=t.querySelector('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])');e?e.focus({preventScroll:!0}):(t.setAttribute("tabindex","-1"),t.focus({preventScroll:!0}))}_resolveEffects(t){let e=t?.dataset?.withEffects;if(e&&typeof e=="string"){let s=e.split("|").map(o=>o.trim());return[s[0]||"none",s[1]||s[0]||"none"]}return this.effects}_applyEffects(t,e,s,o,n){!s||s[0]==="none"&&s[1]==="none"||(t&&s[0]!=="none"&&(t.style.setProperty("--z-effect-filter",s[0]),t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("has-effect")),e&&s[1]!=="none"&&(e.style.setProperty("--z-effect-filter",s[1]),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("has-effect")))}_removeEffect(t){if(!t||!t.classList.contains("has-effect"))return;t.classList.remove("has-effect"),t.classList.add("has-effect-reverse");let e=()=>{t.classList.remove("has-effect-reverse"),t.style.removeProperty("--z-effect-filter"),t.removeEventListener("transitionend",e)};t.addEventListener("transitionend",e,{once:!0});let s=t.style.getPropertyValue("--zoom-duration");setTimeout(e,s?parseFloat(s)*(s.includes("ms")?1:1e3)+100:1100)}_resolveHideTrigger(t){return t?.dataset?.hideTrigger!==void 0?t.dataset.hideTrigger==="fade"?"fade":!0:this.hideTrigger}_applyHideTrigger(t,e,s,o,n){!s||!t||(s==="fade"?(t.style.setProperty("--zoom-duration",o),t.style.setProperty("--zoom-ease",n),t.classList.add("z-trigger-fade"),e.style.setProperty("--zoom-duration",o),e.style.setProperty("--zoom-ease",n),e.classList.add("z-view-fade-in"),e.offsetHeight,e.classList.remove("hide")):t.classList.add("z-trigger-hidden"))}_restoreHideTrigger(t,e,s,o){if(!(!e||!t))if(e==="fade"){t.classList.remove("z-trigger-fade"),t.style.setProperty("--zoom-duration",s),t.style.setProperty("--zoom-ease",o),t.classList.add("z-trigger-fade-reverse");let n=()=>{t.classList.remove("z-trigger-fade-reverse"),t.style.removeProperty("--zoom-duration"),t.style.removeProperty("--zoom-ease"),t.removeEventListener("transitionend",n)};t.addEventListener("transitionend",n,{once:!0}),setTimeout(n,parseFloat(s)*(s.includes("ms")?1:1e3)+100)}else t.classList.remove("z-trigger-hidden")}on(t,e){return typeof e!="function"?this:((this._hooks[t]||=[]).push(e),this)}use(t,e){if(!t)return this;let s={plugin:t,options:e};return this._plugins.push(s),this._initialized&&this._installPlugin(s),this}_installPlugin(t){let{plugin:e,options:s}=t;try{typeof e=="function"?e(this,s):typeof e.install=="function"&&e.install(this,s)}catch(o){this.notify(`plugin install error: ${o.message}`,"error")}}off(t,e){return e?this._hooks[t]&&(this._hooks[t]=this._hooks[t].filter(s=>s!==e)):delete this._hooks[t],this}_emit(t,e={}){let s=this._hooks[t];if(!(!s||s.length===0))for(let o of s)try{o(e)}catch(n){this.debug&&console.error(`Zumly hook "${t}" threw:`,n)}}zoomLevel(){return this.storedViews.length}getZoomLevel(){return this.zoomLevel()}getCurrentViewName(){return!this.storedViews||this.storedViews.length===0?null:this.storedViews[this.storedViews.length-1]?.views?.[0]?.viewName??null}back(){if(!this._destroyed){if(this.blockEvents){this.notify("back ignored: a transition is already running.","warn");return}if(this.lateralHistory&&this.lateralHistory.length>0){let t=this.lateralHistory.pop(),e=t&&typeof t=="object"?t.name:t,s=t&&typeof t=="object"?t.entry:void 0,o=t&&typeof t=="object"?t.node:void 0;return this._doLateral(e,!0,{savedEntry:s,keepAliveNode:o})}this.zoomOut()}}async goTo(t,e={}){return this._destroyed?void 0:(e.mode==="lateral"?"lateral":"depth")==="depth"?this.zoomTo(t,e):this._doLateral(t,!1,e)}async zoomTo(t,e={}){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("zoomTo() cannot run: instance is invalid or canvas not found.","error");return}if(typeof t!="string"||!t){this.notify("zoomTo() requires a non-empty view name.","warn");return}if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`zoomTo("${t}"): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}if(this.getCurrentViewName()===t)return;let o=this.canvas.getBoundingClientRect(),n=Math.max(40,o.width*.1),i=Math.max(40,o.height*.1),l={rect:{x:o.left+(o.width-n)/2,y:o.top+(o.height-i)/2,width:n,height:i},duration:e.duration??this.duration,ease:e.ease??this.ease,props:e.props??{}};await this._doZoomIn(t,l)}async init(){if(this._destroyed)return;if(!this.isValid||!this.canvas){this.notify("init() cannot run: instance is invalid or canvas element was not found.","error");return}this.tracing("init()"),this.preload&&this.preload.length&&await this.prefetcher.preloadEager(this.preload,null);let t=await this.prefetcher.get(this.initialView,null),e=await Q(t,this.initialView,this.canvas,!0,this.views,this.componentContext);this._emit("viewMounted",{viewName:this.initialView,node:e}),this.prefetcher.scanAndPrefetch(e,null),this.storeViews({zoomLevel:this.storedViews.length,scale:1,views:[{viewName:this.initialView,backwardState:{origin:"0 0",transform:""}}]}),this.currentStage=this.storedViews[this.storedViews.length-1],this._recordCanvasSize(),this._initialized=!0;for(let s of this._plugins)this._installPlugin(s)}destroy(){this._destroyed||(this._emit("destroy"),this._destroyed=!0,this._clearBlockEventsSafety(),this._resizeDebounceTimer&&(clearTimeout(this._resizeDebounceTimer),this._resizeDebounceTimer=null),this._unbindEvents(),this._removeNav(),this._cleanupLateralKeepAlive(),this.blockEvents=!1,this.storedViews=[],this.currentStage=null,this.lateralHistory=[],this.trace=[],this._hooks={},this.prefetcher=null,this.transitionDriver=null,this.canvas&&(this.canvas.removeAttribute("tabindex"),this.canvas.removeAttribute("role"),this.canvas.removeAttribute("aria-roledescription"),this.canvas.removeAttribute("aria-live")),this.isValid=!1)}async _doZoomIn(t,e){if(this._destroyed)return;if(this.blockEvents){this.notify("zoomIn ignored: a transition is already running.","warn");return}this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomIn",{viewName:t}),this.tracing("zoomIn()");let s=this.canvas,o=e.el;this._resetCanvasScroll(s);let n=s.getBoundingClientRect(),i=n.left,a=n.top,c=(this.storedViews.length>0?this.storedViews[this.storedViews.length-1]:null)?.scale??1;this.tracing("getView()");let u=o?{trigger:o,target:document.createElement("div"),context:this.componentContext,props:Object.assign({},o.dataset)}:{target:document.createElement("div"),context:this.componentContext,props:e.props??{}},f=o?.dataset?.deferred!==void 0?!0:this.deferred,h,d=null;if(f){let E=await this.prefetcher.get(t,u);if(this._destroyed)return;for(d=document.createDocumentFragment();E.firstChild;)d.appendChild(E.firstChild);h=await Q(E,t,s,!1,{},this.componentContext)}else{let E=await this.prefetcher.get(t,u);if(this._destroyed)return;this.prefetcher.scanAndPrefetch(E,u),h=await Q(E,t,s,!1,this.views,this.componentContext)}if(!h)return;f||this._emit("viewMounted",{viewName:t,node:h}),o&&o.classList.add("zoomed");let p=o?(()=>{let E=o.getBoundingClientRect();return{x:E.x,y:E.y,width:E.width,height:E.height}})():e.rect,v=o?o.dataset.withDuration||this.duration:e.duration??this.duration,m=o?o.dataset.withEase||this.ease:e.ease??this.ease,y=o?o.dataset.withCover||this.cover:e.cover??this.cover,b=o?parseInt(o.dataset.withStagger,10)||this.stagger:e.stagger??this.stagger,w=s.querySelector(".is-current-view"),g=s.querySelector(".is-previous-view"),x=s.querySelector(".is-last-view");Y(h),Y(w),Y(g),x&&(Y(x),s.removeChild(x));let k,C,q,H,G,rt,_,N=w.style.transform,$=w.style.transformOrigin,B=g?g.style.transform:null,Lt=g?g.style.transformOrigin:null;try{w.classList.replace("is-current-view","is-previous-view"),g&&g.classList.replace("is-previous-view","is-last-view");let E=h.getBoundingClientRect(),j=w.getBoundingClientRect(),vt=null,Tt=null,nt=null;g&&(vt=g.getBoundingClientRect(),nt=g.querySelector(".zoomed"),Tt=nt&&nt.getBoundingClientRect?nt.getBoundingClientRect():vt);let it={left:i,top:a},zt={width:n.width,height:n.height},kt={width:E.width,height:E.height},Ct=$t(p.width,p.height,E.width,E.height,y);_=Ct.scale;let we=Ct.scaleInv;k=Ft(p,it,kt,we),q=w.style.transform;let Ot=Dt(p,j);H=Ht(zt,p,j,_,this.parallax);let At=lt($||"0 0"),V=J(q||""),Pt=lt(Ot),X=J(H.transform),It=p;if(o&&(It=ct(p,j,At,V.tx,V.ty,V.scale,Pt,X.tx,X.ty,X.scale)),C=Mt(It,it,kt),g){G=g.style.transform;let ge=ct(j,j,At,V.tx,V.ty,V.scale,Pt,X.tx,X.ty,X.scale),be=Rt(H.x,H.y,it,_,c),Nt=lt(Lt||"0 0"),yt=J(G||""),wt=J(be),Se=ct(Tt,vt,Nt,yt.tx,yt.ty,yt.scale,Nt,wt.tx,wt.ty,wt.scale);rt=jt({canvasRect:zt,canvasOffset:it,triggerRect:p,previousViewRectAtBaseTransform:j,lastViewZoomedElementRect:Se,previousViewRectWithPreviousAtEndTransform:ge,scale:_,preScale:c,parallax:this.parallax})}h.style.transform=k,w.style.transformOrigin=Ot}catch(E){this.notify(`zoomIn geometry computation failed: ${E.message}. Aborting zoom.`,"error"),this.debug&&console.error("Zumly _doZoomIn error:",E),w.style.transform=N,w.style.transformOrigin=$,w.classList.contains("is-previous-view")&&w.classList.replace("is-previous-view","is-current-view"),g&&(g.style.transform=B,g.style.transformOrigin=Lt,g.classList.contains("is-last-view")&&g.classList.replace("is-last-view","is-previous-view"));try{s.removeChild(h)}catch{}R(w),R(g);return}let he=tt(h.dataset.viewName,{origin:h.style.transformOrigin,duration:v,ease:m,transform:k},{origin:h.style.transformOrigin,duration:v,ease:m,transform:C}),de=tt(w.dataset.viewName,{origin:w.style.transformOrigin,duration:v,ease:m,transform:q},{origin:w.style.transformOrigin,duration:v,ease:m,transform:H.transform}),me=g?tt(g.dataset.viewName,{origin:g.style.transformOrigin,duration:v,ease:m,transform:G},{origin:g.style.transformOrigin,duration:v,ease:m,transform:rt}):null,pe=x?qt(x):null,ot=Bt(this.storedViews.length,he,de,me,pe);ot.scale=_,ot.stagger=b||0,this.storeViews(ot),this.currentStage=this.storedViews[this.storedViews.length-1],this.tracing("setCSSVariables()");let ve=this._resolveEffects(o);this._applyEffects(w,g,ve,v,m);let pt=this._resolveHideTrigger(o);this._applyHideTrigger(o,h,pt,v,m),pt&&(ot.hideTriggerMode=pt),this._setBlockEvents();let ye={type:"zoomIn",currentView:h,previousView:w,lastView:g,currentStage:this.currentStage,duration:v,ease:m};this.transitionDriver.runTransition(ye,async()=>{f&&d&&h&&!this._destroyed&&(h.appendChild(d),this.prefetcher.scanAndPrefetch(h,u),typeof this.views[t]=="object"&&typeof this.views[t].mounted=="function"&&await this.views[t].mounted(),this._emit("viewMounted",{viewName:t,node:h})),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterZoomIn",{viewName:t,zoomLevel:this.zoomLevel()}),this.tracing("ended")})}async zoomIn(t){this._destroyed||t?.dataset?.to&&await this._doZoomIn(t.dataset.to,{el:t})}async _doLateral(t,e=!1,s={}){if(this._destroyed)return;if(this.blockEvents){this.notify("lateral navigation ignored: a transition is already running.","warn");return}if(!this.isValid||!this.canvas)return;if(!Object.prototype.hasOwnProperty.call(this.views,t)){this.notify(`goTo("${t}", { mode: 'lateral' }): view not found in views. Available: ${Object.keys(this.views).join(", ")}`,"warn");return}let o=this.canvas.querySelector(".is-current-view");if(!o)return;let n=o.dataset?.viewName;if(n===t)return;this._emit("beforeLateral",{viewName:t,from:n,isBack:e});let i=this.lateralNav&&this.lateralNav.keepAlive;if(!e){this.lateralHistory=this.lateralHistory||[];let _=this.storedViews[this.storedViews.length-1];this.lateralHistory.push({name:n,entry:_.views[0],node:i?o:null})}this.tracing("lateral()");let a=s.duration??this.duration,l=s.ease??this.ease,c=this.canvas.querySelector(".is-previous-view"),u=this.canvas.querySelector(".is-last-view"),f=0,h=0,d=this._declaredSiblings(),p=d?d.indexOf(n):-1,v=d?d.indexOf(t):-1;if(p!==-1&&v!==-1){let _=this.canvas.getBoundingClientRect();f=(p-v)*_.width*.15}else if(c){let _=c.querySelector(`.zoom-me[data-to="${n}"]`),N=c.querySelector(`.zoom-me[data-to="${t}"]`);if(_&&N){let $=_.getBoundingClientRect(),B=N.getBoundingClientRect();f=$.left+$.width/2-(B.left+B.width/2),h=$.top+$.height/2-(B.top+B.height/2)}else f=this.canvas.getBoundingClientRect().width*.15}let m=null,y=null;if(i&&(e&&s.keepAliveNode?y=s.keepAliveNode:y=this.canvas.querySelector(`.is-lateral-hidden[data-view-name="${t}"]`)),y){if(y.style.display="",y.style.opacity="",y.classList.remove("is-lateral-hidden","zoom-lateral-out"),y.classList.add("is-new-current-view","has-no-events"),m=y,!e&&this.lateralHistory){let _=this.lateralHistory.findIndex(N=>N.node===y);_!==-1&&this.lateralHistory.splice(_,1)}}else{let _={target:document.createElement("div"),context:this.componentContext,props:s.props??{}},N=await this.prefetcher.get(t,_);if(this._destroyed||(this.prefetcher.scanAndPrefetch(N,_),m=await Q(N,t,this.canvas,!1,this.views,this.componentContext),!m))return;this._emit("viewMounted",{viewName:t,node:m})}Y(m);let b=o.style.transform||"",w=o.style.transformOrigin||"0 0";m.style.transform=b,m.style.transformOrigin=w;let g=this.storedViews[this.storedViews.length-1],x=e&&s.savedEntry?{...s.savedEntry,viewName:t}:tt(t,{origin:w,duration:a,ease:l,transform:b},{origin:w,duration:a,ease:l,transform:b});g.views[0]=x,this.currentStage=g;let k=c?{transformStart:c.style.transform||"",transformEnd:this._computeLateralBackTransform(c.style.transform||"",f,h)}:null,C=u&&g.views[2]?{transformStart:u.style.transform||"",transformEnd:this._computeLateralBackTransform(u.style.transform||"",f*.7,h*.7)}:null;k&&g.views[1]&&(g.views[1].forwardState={...g.views[1].forwardState,transform:k.transformEnd}),C&&g.views[2]&&(g.views[2].forwardState={...g.views[2].forwardState,transform:C.transformEnd});let q=b,H=this._computeLateralBackTransform(q,-f,-h),G=this._computeLateralBackTransform(b,f,h);this._setBlockEvents();let rt={type:"lateral",currentView:m,previousView:o,lastView:u||null,backView:c||null,backViewState:k,lastViewState:C,incomingTransformStart:H,incomingTransformEnd:q,outgoingTransform:b,outgoingTransformEnd:G,currentStage:this.currentStage,duration:a,ease:l,canvas:this.canvas,slideDeltaX:f,slideDeltaY:h,keepAlive:i&&!e?i:!1};this.transitionDriver.runTransition(rt,()=>{i&&!e&&(o.classList.remove("is-current-view","is-new-current-view","has-no-events"),o.classList.add("is-lateral-hidden"),i!=="visible"?o.style.display="none":(o.style.transform=b,o.style.opacity="")),this.blockEvents=!1,this._onTransitionComplete(),this._updateNav(),this._emit("afterLateral",{viewName:t,from:n,isBack:e}),this.tracing("ended")})}_computeLateralBackTransform(t,e,s){let o=t.match(/translate\s*\(\s*([-\d.eE]+)px\s*,\s*([-\d.eE]+)px\s*\)/);if(o){let n=parseFloat(o[1])+e,i=parseFloat(o[2])+s,a=t.replace(/translate\s*\([^)]+\)\s*/,"");return`translate(${n}px, ${i}px) ${a}`.trim()}return`translate(${e}px, ${s}px) ${t}`.trim()}zoomOut(){if(this._destroyed)return;if(this.blockEvents){this.notify("zoomOut ignored: a transition is already running.","warn");return}this._cleanupLateralKeepAlive(),this.lateralHistory=[],this._emit("beforeZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("zoomOut()");let t=this.canvas;this._resetCanvasScroll(t);let e=t.querySelector(".is-current-view"),s=t.querySelector(".is-previous-view");if(!e||!s){this.notify("zoomOut: current or previous view not found (animation may still be running)","warn");return}this._setBlockEvents(),this.currentStage=this.storedViews[this.storedViews.length-1];let o=t.querySelector(".is-last-view");this.tracing("setCSSVariables()");let n=this.currentStage.views[0]?.forwardState?.duration??this.duration,i=this.currentStage.views[0]?.forwardState?.ease??this.ease,a=s.querySelector(".zoomed");a&&a.classList.remove("zoomed");let l=this.currentStage.hideTriggerMode;l&&a&&this._restoreHideTrigger(a,l,n,i),l==="fade"?(e.classList.remove("z-view-fade-in"),e.style.setProperty("--zoom-duration",n),e.style.setProperty("--zoom-ease",i),e.classList.add("z-view-fade-out")):(e.classList.remove("z-view-fade-in"),e.style.removeProperty("opacity")),this._removeEffect(s),s.classList.replace("is-previous-view","is-current-view"),o!==null&&(o.classList.contains("has-effect")&&this.effects[0]!=="none"&&o.style.setProperty("--z-effect-filter",this.effects[0]),o.classList.replace("is-last-view","is-previous-view"),o.classList.remove("hide"),R(o));let c=Vt(this.currentStage);if(c){t.prepend(c);let f=t.querySelector(".z-view:first-child");f&&(R(f),f.classList.add("hide"))}let u={type:"zoomOut",currentView:e,previousView:s,lastView:o,currentStage:this.currentStage,duration:n,ease:i,canvas:t};this.transitionDriver.runTransition(u,()=>{this.blockEvents=!1,this._onTransitionComplete(),this.storedViews.pop(),this._updateNav(),this._emit("afterZoomOut",{zoomLevel:this.zoomLevel()}),this.tracing("ended")})}onZoom(t){if(this._destroyed||t.type==="mouseup"&&!this.inputs.click||t.type==="touchend"&&!this.inputs.touch)return;let e=t.target;if(e.closest(".z-depth-nav")||e.closest(".z-lateral-nav"))return;let s=e.classList.contains("zoom-me")||e.closest(".zoom-me");if(!this.blockEvents&&s&&!this.touching){this.tracing("onZoom() \u2192 zoomIn"),t.stopPropagation();let o=e.classList.contains("zoom-me")?e:e.closest(".zoom-me");this.zoomIn(o);return}if(this.storedViews.length>1&&!this.blockEvents&&!s&&!this.touching){let o=this.canvas.querySelector(".is-current-view");if(o&&o.contains(e))return;let n=this._findSiblingTriggerAtPoint(t.clientX,t.clientY);if(n){this.tracing("onZoom() \u2192 lateral"),t.stopPropagation(),this._doLateral(n.dataset.to);return}this.tracing("onZoom() \u2192 zoomOut"),t.stopPropagation(),this.zoomOut()}}_findSiblingTriggerAtPoint(t,e){let s=this.canvas.querySelector(".is-previous-view");if(!s)return null;let n=this.canvas.querySelector(".is-current-view")?.dataset?.viewName;if(!n)return null;let i=s.querySelectorAll(".zoom-me[data-to]");for(let a of i){if(a.dataset.to===n)continue;let l=a.getBoundingClientRect();if(t>=l.left&&t<=l.right&&e>=l.top&&e<=l.bottom)return a}return null}_getSiblings(){let e=this.canvas.querySelector(".is-current-view")?.dataset?.viewName,s=this._declaredSiblings();if(s&&s.indexOf(e)!==-1)return{siblings:s,currentIndex:s.indexOf(e)};let o=this.canvas.querySelector(".is-previous-view");if(!o)return{siblings:[],currentIndex:-1};let n=o.querySelectorAll(".zoom-me[data-to]"),i=[];for(let l of n)l.dataset.to&&i.push(l.dataset.to);let a=i.indexOf(e);return{siblings:i,currentIndex:a}}_declaredSiblings(){let t=this.lateralNav&&typeof this.lateralNav=="object"?this.lateralNav.siblings:null;if(!t)return null;if(Array.isArray(t))return t;let e=this.canvas.querySelector(".is-previous-view")?.dataset?.viewName;return e&&Array.isArray(t[e])?t[e]:null}_updateNav(){this._destroyed||(this._removeNav(),this._updateDepthNav(),this._updateLateralNav())}_updateDepthNav(){if(!this.depthNav||this.storedViews.length-1<1)return;let e=this.canvas.querySelector(".z-view.is-current-view");if(e&&e.querySelector(".z-depth-nav"))return;let s=this.depthNav.position||"bottom-left",o=document.createElement("div");o.className="z-depth-nav z-depth-nav--"+s;let n=document.createElement("button");n.className="z-nav-back",n.setAttribute("aria-label","Zoom out (go back)"),n.innerHTML="‹",n.addEventListener("mouseup",i=>{i.stopPropagation(),!this.blockEvents&&this.storedViews.length>1&&this.zoomOut()}),o.appendChild(n),this.canvas.appendChild(o)}_updateLateralNav(){if(!this.lateralNav)return;let t=this.storedViews.length-1,e=this._getSiblings();if(e.siblings.length<2)return;if(this.lateralNav.mode==="auto"&&t>=1){let a=this.canvas.querySelector(".z-view.is-current-view");if(a&&a.offsetWidth>=this.canvas.offsetWidth&&a.offsetHeight>=this.canvas.offsetHeight)return}let{siblings:s,currentIndex:o}=e,n=this.lateralNav.position||"bottom-center",i=document.createElement("div");if(i.className="z-lateral-nav z-lateral-nav--"+n,this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-prev",a.setAttribute("aria-label","Previous sibling view"),a.innerHTML="‹",a.disabled=o<=0,a.addEventListener("mouseup",l=>{l.stopPropagation(),o>0&&this._doLateral(s[o-1])}),i.appendChild(a)}if(this.lateralNav.dots){let a=document.createElement("div");a.className="z-nav-lateral-dots";for(let l=0;l<s.length;l++){let c=document.createElement("button");c.className="z-nav-dot z-nav-lat-dot"+(l===o?" is-active":""),c.setAttribute("aria-label",`Go to ${s[l]}`),c.dataset.to=s[l],c.addEventListener("mouseup",(u=>f=>{f.stopPropagation(),u!==o&&this._doLateral(s[u])})(l)),a.appendChild(c)}i.appendChild(a)}if(this.lateralNav.arrows){let a=document.createElement("button");a.className="z-nav-arrow z-nav-next",a.setAttribute("aria-label","Next sibling view"),a.innerHTML="›",a.disabled=o>=s.length-1,a.addEventListener("mouseup",l=>{l.stopPropagation(),o<s.length-1&&this._doLateral(s[o+1])}),i.appendChild(a)}this.canvas.appendChild(i)}_removeNav(){this.canvas&&this.canvas.querySelectorAll(".z-depth-nav, .z-lateral-nav").forEach(t=>t.remove())}_cleanupLateralKeepAlive(){if(!this.canvas)return;let t=this.canvas.querySelectorAll(".is-lateral-hidden");for(let e of t)e.remove()}onKeyUp(t){this._destroyed||this.inputs.keyboard&&(this.tracing("onKeyUp()"),(t.key==="ArrowLeft"||t.key==="ArrowDown")&&(t.preventDefault(),this.storedViews.length>1&&!this.blockEvents?this.zoomOut():this.notify(`is on level zero. Can't zoom out. Trigger: ${t.key}`,"warn")),(t.key==="ArrowRight"||t.key==="ArrowUp")&&(t.preventDefault(),this.notify(t.key+" has no actions defined")))}onWheel(t){this._destroyed||this.inputs.wheel&&(this._isInsideScrollable(t.target,t.deltaY)||(t.preventDefault(),!(this.blockEvents||this._wheelCooldown)&&t.deltaY>0&&this.storedViews.length>1&&(this.tracing("onWheel() \u2192 zoomOut"),this._wheelCooldown=!0,setTimeout(()=>{this._wheelCooldown=!1},500),this.zoomOut())))}_isInsideScrollable(t,e){let s=t,o=this.canvas.querySelector(".is-current-view");for(;s&&s!==this.canvas;){if(s===o||o&&o.contains(s)){let{overflowY:n}=window.getComputedStyle(s);if((n==="auto"||n==="scroll")&&(e>0?s.scrollTop+s.clientHeight<s.scrollHeight-1:s.scrollTop>0))return!0}s=s.parentElement}return!1}onTouchStart(t){this._destroyed||this.inputs.touch&&(this.tracing("onTouchStart()"),this.touching=!0,this.touchstartX=t.changedTouches[0].screenX,this.touchstartY=t.changedTouches[0].screenY)}onTouchEnd(t){this._destroyed||this.inputs.touch&&(this.blockEvents||(this.tracing("onTouchEnd()"),this.touchendX=t.changedTouches[0].screenX,this.touchendY=t.changedTouches[0].screenY,this.handleGesture(t)))}handleGesture(t){t.stopPropagation(),this.tracing("handleGesture()");let e=this.touchendX-this.touchstartX,s=this.touchendY-this.touchstartY,o=Math.abs(e)<10&&Math.abs(s)<10;e<-30&&(this.storedViews.length>1&&!this.blockEvents?(this.tracing("swipe left"),this.zoomOut()):this.notify("is on level zero. Can't zoom out. Trigger: Swipe left","warn"));let n=t.target.classList.contains("zoom-me")?t.target:t.target.closest(".zoom-me");o&&!this.blockEvents&&n&&this.touching&&(this.touching=!1,this.tracing("tap"),t.preventDefault(),this.zoomIn(n)),o&&this.storedViews.length>1&&!this.blockEvents&&!n&&t.target.closest(".is-current-view")===null&&this.touching&&(this.touching=!1,this.tracing("tap"),this.zoomOut())}};var Re={separator:"/",prefix:"/"};function fe(r,t){let e=[];for(let s of r.storedViews){let o=s.views&&s.views[0];o&&o.viewName&&e.push(o.viewName)}return e.join(t)}function qe(r,t){let e=window.location.hash.slice(1);return e.startsWith(r)&&(e=e.slice(r.length)),e?e.split(t).filter(Boolean):[]}var ue={install(r,t){let e=Object.assign({},Re,t),s=e.separator,o=e.prefix,n=!1;function i(u){if(n)return;let f=fe(r,s),h="#"+o+f;window.location.hash!==h&&(n=!0,window.history[u](null,"",h),n=!1)}function a(){i("pushState")}function l(){i("replaceState")}r.on("afterZoomIn",a),r.on("afterLateral",a),r.on("afterZoomOut",l);function c(){if(n)return;n=!0;let u=qe(o,s),f=fe(r,s).split(s).filter(Boolean);if(u.join(s)===f.join(s)){n=!1;return}if(u.length<f.length){let h=f.length-u.length;for(let d=0;d<h;d++)r.zoomOut()}else if(u.length===f.length&&u.length>0){let h=u[u.length-1];h!==f[f.length-1]&&r.goTo(h,{mode:"lateral"})}else u.length>f.length&&window.history.back();n=!1}window.addEventListener("popstate",c),l(),r.on("destroy",function(){r.off("afterZoomIn",a),r.off("afterLateral",a),r.off("afterZoomOut",l),window.removeEventListener("popstate",c)})}};st.Router=ue;var Ns=st;export{st as Zumly,ue as ZumlyRouter,Ns as default};
|
package/package.json
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "zumly",
|
|
3
|
-
"version": "0.92.
|
|
3
|
+
"version": "0.92.4",
|
|
4
4
|
"description": "Javascript library for building zooming user interfaces",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"author": "Juan Martin Muda - Zumerlab",
|
|
7
7
|
"license": "MIT",
|
|
8
|
-
"homepage": "https://zumerlab.github.io/zumly
|
|
8
|
+
"homepage": "https://zumerlab.github.io/zumly/",
|
|
9
9
|
"repository": {
|
|
10
10
|
"type": "git",
|
|
11
11
|
"url": "https://github.com/zumerlab/zumly.git"
|
|
@@ -57,6 +57,7 @@
|
|
|
57
57
|
},
|
|
58
58
|
"files": [
|
|
59
59
|
"dist",
|
|
60
|
+
"types",
|
|
60
61
|
"src/drivers/driver-helpers.js",
|
|
61
62
|
"src/drivers/index.js",
|
|
62
63
|
"docs/DRIVER_API.md",
|
|
@@ -23,15 +23,23 @@ import { showViewContent } from '../view-visibility.js'
|
|
|
23
23
|
*
|
|
24
24
|
* @example
|
|
25
25
|
* parseDurationMs('1s') // → 1000
|
|
26
|
+
* parseDurationMs('.7s') // → 700
|
|
26
27
|
* parseDurationMs('200ms') // → 200
|
|
27
28
|
* parseDurationMs(300) // → 300
|
|
28
29
|
* parseDurationMs('nope') // → 500
|
|
29
30
|
*/
|
|
30
31
|
export function parseDurationMs (duration) {
|
|
31
32
|
if (typeof duration === 'number' && !Number.isNaN(duration)) return Math.max(0, duration)
|
|
32
|
-
const str = String(duration)
|
|
33
|
-
|
|
34
|
-
|
|
33
|
+
const str = String(duration).trim()
|
|
34
|
+
// \d*\.?\d+ also accepts a leading dot ('.7s'), which CSS allows —
|
|
35
|
+
// previously that fell silently into the 500ms fallback.
|
|
36
|
+
const m = str.match(/^(\d*\.?\d+)\s*(ms|s)?$/i)
|
|
37
|
+
if (!m) {
|
|
38
|
+
if (typeof console !== 'undefined') {
|
|
39
|
+
console.warn(`[zumly] Could not parse duration "${str}" — falling back to 500ms.`) // eslint-disable-line no-console
|
|
40
|
+
}
|
|
41
|
+
return 500
|
|
42
|
+
}
|
|
35
43
|
const val = parseFloat(m[1])
|
|
36
44
|
const unit = (m[2] || 's').toLowerCase()
|
|
37
45
|
return unit === 'ms' ? Math.max(0, val) : Math.max(0, val * 1000)
|
package/types/zumly.d.ts
ADDED
|
@@ -0,0 +1,312 @@
|
|
|
1
|
+
// Type definitions for Zumly
|
|
2
|
+
// https://github.com/zumerlab/zumly
|
|
3
|
+
|
|
4
|
+
// ─── View sources ───────────────────────────────────────────────────
|
|
5
|
+
|
|
6
|
+
/** Context object passed to function and object view sources. */
|
|
7
|
+
export interface ViewContext {
|
|
8
|
+
/** A fresh <div> for mounting framework components. */
|
|
9
|
+
target: HTMLDivElement
|
|
10
|
+
/** The trigger element that initiated the zoom (if from a click). */
|
|
11
|
+
trigger?: HTMLElement
|
|
12
|
+
/** The componentContext from Zumly constructor options. */
|
|
13
|
+
context: Map<string, unknown> | Record<string, unknown>
|
|
14
|
+
/** Data attributes from the trigger element (e.g. data-id="42" → props.id). */
|
|
15
|
+
props: Record<string, string>
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
/** A function that receives context and returns a view. */
|
|
19
|
+
export type ViewFunction = (ctx: ViewContext) => string | HTMLElement | void | Promise<string | HTMLElement | void>
|
|
20
|
+
|
|
21
|
+
/** An object with a render method and optional mounted hook. */
|
|
22
|
+
export interface ViewObject {
|
|
23
|
+
render(ctx: ViewContext): string | HTMLElement | Promise<string | HTMLElement>
|
|
24
|
+
mounted?(): void | Promise<void>
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
/** All supported view source types. */
|
|
28
|
+
export type ViewSource = string | ViewFunction | ViewObject | HTMLElement
|
|
29
|
+
|
|
30
|
+
// ─── Options ────────────────────────────────────────────────────────
|
|
31
|
+
|
|
32
|
+
/** Built-in transition driver names. */
|
|
33
|
+
export type DriverName = 'css' | 'waapi' | 'none' | 'anime' | 'gsap' | 'motion'
|
|
34
|
+
|
|
35
|
+
/** Transition spec passed to custom driver functions. */
|
|
36
|
+
export interface TransitionSpec {
|
|
37
|
+
type: 'zoomIn' | 'zoomOut' | 'lateral'
|
|
38
|
+
currentView: HTMLElement
|
|
39
|
+
previousView: HTMLElement
|
|
40
|
+
lastView: HTMLElement | null
|
|
41
|
+
currentStage: ZoomSnapshot
|
|
42
|
+
duration: string
|
|
43
|
+
ease: string
|
|
44
|
+
canvas: HTMLElement
|
|
45
|
+
/** Lateral-specific fields (present when type === 'lateral') */
|
|
46
|
+
backView?: HTMLElement | null
|
|
47
|
+
backViewState?: { transformStart: string; transformEnd: string } | null
|
|
48
|
+
lastViewState?: { transformStart: string; transformEnd: string } | null
|
|
49
|
+
incomingTransformStart?: string
|
|
50
|
+
incomingTransformEnd?: string
|
|
51
|
+
outgoingTransform?: string
|
|
52
|
+
outgoingTransformEnd?: string
|
|
53
|
+
slideDeltaX?: number
|
|
54
|
+
slideDeltaY?: number
|
|
55
|
+
/** When true, driver should not remove the outgoing view from DOM (lateral keepAlive). */
|
|
56
|
+
keepAlive?: boolean
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
/** Custom driver function signature. */
|
|
60
|
+
export type DriverFunction = (spec: TransitionSpec, onComplete: () => void) => void
|
|
61
|
+
|
|
62
|
+
/** View state (transform + origin) stored in snapshots. */
|
|
63
|
+
export interface ViewState {
|
|
64
|
+
origin: string
|
|
65
|
+
transform: string
|
|
66
|
+
duration: string
|
|
67
|
+
ease: string
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
/** A single view entry in a zoom snapshot. */
|
|
71
|
+
export interface ViewEntry {
|
|
72
|
+
viewName: string
|
|
73
|
+
backwardState: ViewState
|
|
74
|
+
forwardState: ViewState
|
|
75
|
+
detachedNode?: HTMLElement
|
|
76
|
+
}
|
|
77
|
+
|
|
78
|
+
/** Zoom snapshot stored in the storedViews stack. */
|
|
79
|
+
export interface ZoomSnapshot {
|
|
80
|
+
level: number
|
|
81
|
+
views: [ViewEntry, ViewEntry, ViewEntry | null, ViewEntry | null]
|
|
82
|
+
scale?: number
|
|
83
|
+
stagger?: number
|
|
84
|
+
hideTriggerMode?: string
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
/** Transition configuration options. */
|
|
88
|
+
export interface TransitionOptions {
|
|
89
|
+
/** Transition driver. Default: 'css'. */
|
|
90
|
+
driver?: DriverName | DriverFunction
|
|
91
|
+
/** Which dimension to use for cover scale. Default: 'width'. */
|
|
92
|
+
cover?: 'width' | 'height'
|
|
93
|
+
/** CSS duration string. Default: '1s'. */
|
|
94
|
+
duration?: string
|
|
95
|
+
/** CSS easing function. Default: 'ease-in-out'. */
|
|
96
|
+
ease?: string
|
|
97
|
+
/** Array of 1-2 CSS filter strings for background view effects. */
|
|
98
|
+
effects?: [string] | [string, string]
|
|
99
|
+
/** Progressive delay (ms) between view layers during zoom. Default: 0. */
|
|
100
|
+
stagger?: number
|
|
101
|
+
/** Parallax intensity (0-1). Default: 0. */
|
|
102
|
+
parallax?: number
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
/** Lateral navigation UI configuration. */
|
|
106
|
+
export interface LateralNavOptions {
|
|
107
|
+
/** Display mode. 'auto' = only when view doesn't cover full canvas. 'always' = whenever siblings exist. Default: 'auto'. */
|
|
108
|
+
mode?: 'auto' | 'always'
|
|
109
|
+
/** Show prev/next arrow buttons. Default: true. */
|
|
110
|
+
arrows?: boolean
|
|
111
|
+
/** Show dot indicators. Default: true. */
|
|
112
|
+
dots?: boolean
|
|
113
|
+
/** Keep lateral views alive in the DOM. true = hidden, 'visible' = visible. Default: false. */
|
|
114
|
+
keepAlive?: boolean | 'visible'
|
|
115
|
+
/** Position of the lateral nav bar. Default: 'bottom-center'. */
|
|
116
|
+
position?: 'bottom-center' | 'top-center'
|
|
117
|
+
/**
|
|
118
|
+
* Declared sibling order for lateral navigation. Takes precedence over
|
|
119
|
+
* inferring order/slide direction from trigger positions in the parent view.
|
|
120
|
+
* Array = one lateral group; map = keyed by parent view name.
|
|
121
|
+
* @example ['today', 'tomorrow', 'week']
|
|
122
|
+
* @example { home: ['today', 'tomorrow', 'week'] }
|
|
123
|
+
*/
|
|
124
|
+
siblings?: string[] | Record<string, string[]>
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
/** Depth navigation UI configuration. */
|
|
128
|
+
export interface DepthNavOptions {
|
|
129
|
+
/** Position of the back button. Default: 'bottom-left'. */
|
|
130
|
+
position?: 'bottom-left' | 'top-left'
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
/** Input types that can be individually enabled/disabled. */
|
|
134
|
+
export interface InputsOptions {
|
|
135
|
+
/** Enable wheel zoom-out. Default: true. */
|
|
136
|
+
wheel?: boolean
|
|
137
|
+
/** Enable keyboard navigation (arrow keys). Default: true. */
|
|
138
|
+
keyboard?: boolean
|
|
139
|
+
/** Enable click/mouseup navigation. Default: true. */
|
|
140
|
+
click?: boolean
|
|
141
|
+
/** Enable touch navigation. Default: true. */
|
|
142
|
+
touch?: boolean
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
/** Options for goTo(). */
|
|
146
|
+
export interface GoToOptions {
|
|
147
|
+
/** Navigation mode. Default: 'depth'. */
|
|
148
|
+
mode?: 'depth' | 'lateral'
|
|
149
|
+
/** Override transition duration. */
|
|
150
|
+
duration?: string
|
|
151
|
+
/** Override transition easing. */
|
|
152
|
+
ease?: string
|
|
153
|
+
/** Props to pass to the target view. */
|
|
154
|
+
props?: Record<string, unknown>
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
/** Options for zoomTo(). */
|
|
158
|
+
export interface ZoomToOptions {
|
|
159
|
+
/** Override transition duration. */
|
|
160
|
+
duration?: string
|
|
161
|
+
/** Override transition easing. */
|
|
162
|
+
ease?: string
|
|
163
|
+
/** Props to pass to the target view. */
|
|
164
|
+
props?: Record<string, unknown>
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
/** Depth nav position presets. */
|
|
168
|
+
export type DepthNavPosition = 'bottom-left' | 'top-left'
|
|
169
|
+
|
|
170
|
+
/** Lateral nav position presets. */
|
|
171
|
+
export type LateralNavPosition = 'bottom-center' | 'top-center'
|
|
172
|
+
|
|
173
|
+
/** Zumly constructor options. */
|
|
174
|
+
export interface ZumlyOptions {
|
|
175
|
+
/** CSS selector for the canvas element (must have class zumly-canvas). */
|
|
176
|
+
mount: string
|
|
177
|
+
/** Name of the first view to show. */
|
|
178
|
+
initialView: string
|
|
179
|
+
/** Map of view names to view sources. */
|
|
180
|
+
views: Record<string, ViewSource>
|
|
181
|
+
/** View names to resolve and cache on init(). */
|
|
182
|
+
preload?: string[]
|
|
183
|
+
/** Transition configuration. */
|
|
184
|
+
transitions?: TransitionOptions
|
|
185
|
+
/** Enable debug messages. Default: false. */
|
|
186
|
+
debug?: boolean
|
|
187
|
+
/** Context object passed to function/object view sources. */
|
|
188
|
+
componentContext?: Map<string, unknown> | Record<string, unknown>
|
|
189
|
+
/** Lateral navigation UI. true = default, false = disabled. */
|
|
190
|
+
lateralNav?: boolean | LateralNavOptions
|
|
191
|
+
/** Depth navigation UI. true = default (back button, bottom-left), false = disabled. */
|
|
192
|
+
depthNav?: boolean | DepthNavOptions
|
|
193
|
+
/** Input types to enable/disable. All enabled by default. */
|
|
194
|
+
inputs?: InputsOptions
|
|
195
|
+
/** Enable deferred rendering (view content inserted after zoom animation). */
|
|
196
|
+
deferred?: boolean
|
|
197
|
+
/** Hide trigger mode during zoom: 'fade', 'remove', or falsy. */
|
|
198
|
+
hideTrigger?: string | false
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
// ─── Events ─────────────────────────────────────────────────────────
|
|
202
|
+
|
|
203
|
+
export interface ZumlyEventMap {
|
|
204
|
+
viewMounted: { viewName: string; node: HTMLElement }
|
|
205
|
+
beforeZoomIn: { viewName: string }
|
|
206
|
+
afterZoomIn: { viewName: string; zoomLevel: number }
|
|
207
|
+
beforeZoomOut: { zoomLevel: number }
|
|
208
|
+
afterZoomOut: { zoomLevel: number }
|
|
209
|
+
beforeLateral: { viewName: string; from: string; isBack: boolean }
|
|
210
|
+
afterLateral: { viewName: string; from: string; isBack: boolean }
|
|
211
|
+
destroy: Record<string, never>
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
export type ZumlyEventName = keyof ZumlyEventMap
|
|
215
|
+
|
|
216
|
+
// ─── Plugin system ──────────────────────────────────────────────────
|
|
217
|
+
|
|
218
|
+
/** A Zumly plugin: object with install(), or a plain function. */
|
|
219
|
+
export interface ZumlyPlugin<T = unknown> {
|
|
220
|
+
install(instance: Zumly, options?: T): void
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
export type ZumlyPluginFunction<T = unknown> = (instance: Zumly, options?: T) => void
|
|
224
|
+
|
|
225
|
+
// ─── Router plugin ──────────────────────────────────────────────────
|
|
226
|
+
|
|
227
|
+
export interface RouterOptions {
|
|
228
|
+
/** Character used to join view path segments in the hash. Default: '/'. */
|
|
229
|
+
separator?: string
|
|
230
|
+
/** Prefix before the path in the hash. Default: '/'. */
|
|
231
|
+
prefix?: string
|
|
232
|
+
}
|
|
233
|
+
|
|
234
|
+
export const ZumlyRouter: ZumlyPlugin<RouterOptions>
|
|
235
|
+
|
|
236
|
+
// ─── Zumly class ────────────────────────────────────────────────────
|
|
237
|
+
|
|
238
|
+
export class Zumly {
|
|
239
|
+
constructor(options: ZumlyOptions)
|
|
240
|
+
|
|
241
|
+
/** Static reference to the Router plugin. */
|
|
242
|
+
static Router: ZumlyPlugin<RouterOptions>
|
|
243
|
+
|
|
244
|
+
/** Whether the instance was initialized with valid options. */
|
|
245
|
+
readonly isValid: boolean
|
|
246
|
+
|
|
247
|
+
/** Initialize the zoom interface: render initial view and bind events. */
|
|
248
|
+
init(): Promise<void>
|
|
249
|
+
|
|
250
|
+
/** Clean up: remove listeners, timers, navigation UI, and nullify state. Idempotent. */
|
|
251
|
+
destroy(): void
|
|
252
|
+
|
|
253
|
+
/**
|
|
254
|
+
* Subscribe to a lifecycle event.
|
|
255
|
+
* @returns this (chainable)
|
|
256
|
+
*/
|
|
257
|
+
on<E extends ZumlyEventName>(event: E, fn: (data: ZumlyEventMap[E]) => void): this
|
|
258
|
+
|
|
259
|
+
/**
|
|
260
|
+
* Unsubscribe from a lifecycle event. If fn is omitted, removes all hooks for that event.
|
|
261
|
+
* @returns this (chainable)
|
|
262
|
+
*/
|
|
263
|
+
off<E extends ZumlyEventName>(event: E, fn?: (data: ZumlyEventMap[E]) => void): this
|
|
264
|
+
|
|
265
|
+
/**
|
|
266
|
+
* Register a plugin. Plugins are installed during init(), or immediately if already initialized.
|
|
267
|
+
* @returns this (chainable)
|
|
268
|
+
*/
|
|
269
|
+
use<T>(plugin: ZumlyPlugin<T> | ZumlyPluginFunction<T>, options?: T): this
|
|
270
|
+
|
|
271
|
+
/** Get the current zoom depth (number of stored snapshots). */
|
|
272
|
+
zoomLevel(): number
|
|
273
|
+
|
|
274
|
+
/** Alias for zoomLevel(). */
|
|
275
|
+
getZoomLevel(): number
|
|
276
|
+
|
|
277
|
+
/** Get the name of the currently active view, or null if not initialized. */
|
|
278
|
+
getCurrentViewName(): string | null
|
|
279
|
+
|
|
280
|
+
/**
|
|
281
|
+
* Navigate to a view by name. Unified API for depth and lateral navigation.
|
|
282
|
+
*/
|
|
283
|
+
goTo(viewName: string, options?: GoToOptions): Promise<void>
|
|
284
|
+
|
|
285
|
+
/**
|
|
286
|
+
* Programmatic zoom to a named view (depth navigation).
|
|
287
|
+
* Uses a centered synthetic trigger for the transition.
|
|
288
|
+
*/
|
|
289
|
+
zoomTo(viewName: string, options?: ZoomToOptions): Promise<void>
|
|
290
|
+
|
|
291
|
+
/** Zoom into the view indicated by a trigger element with data-to="viewName". */
|
|
292
|
+
zoomIn(el: HTMLElement): Promise<void>
|
|
293
|
+
|
|
294
|
+
/** Zoom out one level. No-op at root. */
|
|
295
|
+
zoomOut(): void
|
|
296
|
+
|
|
297
|
+
/**
|
|
298
|
+
* Navigate back. Pops lateral history first, then zooms out.
|
|
299
|
+
* Returns a Promise when navigating laterally.
|
|
300
|
+
*/
|
|
301
|
+
back(): Promise<void> | void
|
|
302
|
+
}
|
|
303
|
+
|
|
304
|
+
export default Zumly
|
|
305
|
+
|
|
306
|
+
// ─── Driver helper types ────────────────────────────────────────────
|
|
307
|
+
// These types describe the exports from 'zumly/driver-helpers'.
|
|
308
|
+
// Use: import type { MatrixComponents } from 'zumly'
|
|
309
|
+
|
|
310
|
+
export interface MatrixComponents {
|
|
311
|
+
a: number; b: number; c: number; d: number; e: number; f: number
|
|
312
|
+
}
|