vue-flip-animation/dist/vue-flip.cjs

# Installation

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const g=require("vue-demi"),$=require("vue"),k=d=>{const{el:p,isChild:f=!0,scrollContent:a=document.documentElement,onlyVisible:v=!0}=d;g.onMounted(()=>{m(f)}),g.onUpdated(()=>{m(f)});const l={},n={previous:null,rect:null};function m(e){const t=g.isRef(p)?p.value:p;e?T({el:t,scrollContent:a,onlyVisible:v}):L({el:t,scrollContent:a})}const y=e=>e.distanceLeft===0&&e.distanceTop===0&&e.disWidth===0&&e.disHeight===0,C=(e,t)=>{t.animate([{transform:`translate(${e.distanceLeft}px,${e.distanceTop}px) `},{transform:"none"}],{duration:500})};function R(e=document.documentElement){n.rect&&(n.previous=n.rect),n.rect=e.getBoundingClientRect()}const B=(e,t)=>t?n.rect||n.previous?!1:e.top>n.rect.height||e.bottom<0||e.left<0||e.left>n.rect.width:!0,x=function(e,t){const r=n.previous.top,i=n.rect.top,c=n.previous.left,o=n.rect.left;let u=0,s=0;return r!==i&&(u=i-r),c!==o&&(s=o-c),{distanceLeft:e.left-t.left+s,distanceTop:e.top-t.top+u,disWidth:e.width/t.width,disHeight:e.height/t.height}};function T(e){const{el:t,scrollContent:r,onlyVisible:i}=e,c=Array.prototype.slice.call(t.children);let o=!0;for(let u=0;u<c.length;u++){const s=c[u],h=s.dataset.key,_=s.getBoundingClientRect();if(o&&R(r),!B(_,i)&&h in l){const V=l[h],w=s.getBoundingClientRect(),b=x(V,w);y(b)||C(b,s)}o&&(o=!1),l[h]=_}}function L(e){const{el:t,scrollContent:r}=e,i=t.getBoundingClientRect();if(R(r),l.previousRect){const c=l.previousRect,o=x(c,i);y(o)||C(o,t)}l.previousRect=i}},H=g.defineComponent({name:"vueFlip",props:{isChild:{type:Boolean,default:!0},scrollContent:{type:HTMLElement,default:document.documentElement},onlyVisible:{type:Boolean,default:!0}},setup(d){const p=g.ref(),{isChild:f,scrollContent:a,onlyVisible:v}=d;g.onMounted(()=>{debugger;m(f)}),g.onUpdated(()=>{m(f)});const l={},n={previous:null,rect:null};function m(e){const t=p.value;e?T({el:t,scrollContent:a,onlyVisible:v}):L({el:t,scrollContent:a})}const y=e=>e.distanceLeft===0&&e.distanceTop===0&&e.disWidth===0&&e.disHeight===0,C=(e,t)=>{t.animate([{transform:`translate(${e.distanceLeft}px,${e.distanceTop}px) `},{transform:"none"}],{duration:500})};function R(e=document.documentElement){n.rect&&(n.previous=n.rect),n.rect=e.getBoundingClientRect()}const B=(e,t)=>t?n.rect||n.previous?!1:e.top>n.rect.height||e.bottom<0||e.left<0||e.left>n.rect.width:!0,x=function(e,t){const r=n.previous.top,i=n.rect.top,c=n.previous.left,o=n.rect.left;let u=0,s=0;return r!==i&&(u=i-r),c!==o&&(s=o-c),{distanceLeft:e.left-t.left+s,distanceTop:e.top-t.top+u,disWidth:e.width/t.width,disHeight:e.height/t.height}};function T(e){const{el:t,scrollContent:r,onlyVisible:i}=e,c=Array.prototype.slice.call(t.children);let o=!0;for(let u=0;u<c.length;u++){const s=c[u],h=s.dataset.key,_=s.getBoundingClientRect();if(o&&R(r),!B(_,i)&&h in l){const V=l[h],w=s.getBoundingClientRect(),b=x(V,w);y(b)||C(b,s)}o&&(o=!1),l[h]=_}}function L(e){const{el:t,scrollContent:r}=e,i=t.getBoundingClientRect();if(R(r),l.previousRect){const c=l.previousRect,o=x(c,i);y(o)||C(o,t)}l.previousRect=i}return{flipRef:p}}}),E=(d,p)=>{const f=d.__vccOpts||d;for(const[a,v]of p)f[a]=v;return f},M={ref:"flipRef"};function D(d,p,f,a,v,l){return $.openBlock(),$.createElementBlock("div",M,[$.renderSlot(d.$slots,"default")],512)}const F=E(H,[["render",D]]),A={install(d){d.component(F.name,F)}};exports.default=A;exports.useFlip=k;exports.vueFlip=F;