UNPKG

framer-motion

Version:

A simple and powerful JavaScript animation library

3 lines (2 loc) • 8.2 kB
const t={};const e=t=>t,i=t=>1e3*t,n=t=>t/1e3,s=0,a=!1;let o;function r(){o=void 0}const l={now:()=>(void 0===o&&l.set(t.useManualTiming?s:performance.now()),o),set:t=>{o=t,queueMicrotask(r)}},u=t=>null!==t;function h(t,e){return{kind:t,animation:e,timestamp:l.now(),frameTimestamp:s,frameIsProcessing:a}}class m{constructor(){this.isResolved=!1}get finished(){return this._finished||(this._finished=this.isResolved?Promise.resolve():new Promise(t=>{this._resolve=t})),this._finished}updateFinished(){this._finished=this._resolve=void 0,this.isResolved=!1}notifyFinished(){this.isResolved=!0,this._resolve?.()}then(t,e){return this.finished.then(t,e)}}function d(t){for(let e=1;e<t.length;e++)t[e]??(t[e]=t[e-1])}const c=t=>t.startsWith("--");const p={};function f(t,e){const i=function(t){let e;return()=>(void 0===e&&(e=t()),e)}(t);return()=>p[e]??i()}const g=f(()=>void 0!==window.ScrollTimeline,"scrollTimeline"),y=f(()=>{try{document.createElement("div").animate({opacity:0},{easing:"linear(0, 1)"})}catch(t){return!1}return!0},"linearEasing"),T=([t,e,i,n])=>`cubic-bezier(${t}, ${e}, ${i}, ${n})`,b={linear:"linear",ease:"ease",easeIn:"ease-in",easeOut:"ease-out",easeInOut:"ease-in-out",circIn:T([0,.65,.55,1]),circOut:T([.55,0,1,.45]),backIn:T([.31,.01,.66,-.59]),backOut:T([.33,1.53,.69,.99])};function A(t,e){return t?"function"==typeof t?y()?((t,e,i=10)=>{let n="";const s=Math.max(Math.round(e/i),2);for(let e=0;e<s;e++)n+=Math.round(1e4*t(e/(s-1)))/1e4+", ";return`linear(${n.substring(0,n.length-2)})`})(t,e):"ease-out":(t=>Array.isArray(t)&&"number"==typeof t[0])(t)?T(t):Array.isArray(t)?t.map(t=>A(t,e)||b.easeOut):b[t]:void 0}class S extends m{constructor(t){if(super(),this.finishedTime=null,this.isStopped=!1,this.manualStartTime=null,!t)return;const{element:e,name:i,keyframes:n,pseudoElement:s,allowFlatten:a=!1,finalKeyframe:o,onComplete:r}=t;this.isPseudoElement=Boolean(s),this.allowFlatten=a,this.options=t;const l=function({type:t,...e}){return function(t){return"function"==typeof t&&"applyToOptions"in t}(t)&&y()?t.applyToOptions(e):(e.duration??(e.duration=300),e.ease??(e.ease="easeOut"),e)}(t);this.animation=function(t,e,i,{delay:n=0,duration:s=300,repeat:a=0,repeatType:o="loop",ease:r="easeOut",times:l}={},u){const h={[e]:i};l&&(h.offset=l);const m=A(r,s);Array.isArray(m)&&(h.easing=m);const d={delay:n,duration:s,easing:Array.isArray(m)?"linear":m,fill:"both",iterations:a+1,direction:"reverse"===o?"alternate":"normal"};return u&&(d.pseudoElement=u),t.animate(h,d)}(e,i,n,l,s),!1===l.autoplay&&this.animation.pause(),this.animation.onfinish=()=>{if(this.finishedTime=this.time,!s){const t=function(t,{repeat:e,repeatType:i="loop"},n,s=1){const a=t.filter(u),o=s<0||e&&"loop"!==i&&e%2==1?0:a.length-1;return o&&void 0!==n?n:a[o]}(n,this.options,o,this.speed);this.updateMotionValue?.(t),function(t,e,i){c(e)?t.style.setProperty(e,i):t.style[e]=i}(e,i,t),this.animation.cancel()}r?.(),this.notifyFinished()},function(t,e,i){const n=globalThis.__MOTION_INSPECT__;if(n)try{n({...h("animation-start",t),options:i?{...e,...i}:e})}catch{}}(this,t,l)}play(){this.isStopped||(this.manualStartTime=null,this.animation.play(),"finished"===this.state&&this.updateFinished())}pause(){this.animation.pause()}complete(){this.animation.finish?.()}cancel(){try{this.animation.cancel()}catch(t){}}stop(){this.isStopped||(this.isStopped=!0,"idle"!==this.state&&null===this.finishedTime&&(this.updateMotionValue?this.updateMotionValue():this.commitStyles(),this.isPseudoElement||(this.animation.onfinish=null,this.cancel())))}commitStyles(){const t=this.options?.element;!this.isPseudoElement&&t?.isConnected&&this.animation.commitStyles?.()}get duration(){const t=this.animation.effect?.getComputedTiming?.().duration||0;return n(Number(t))}get iterationDuration(){const{delay:t=0}=this.options||{};return this.duration+n(t)}get time(){return n(Number(this.animation.currentTime)||0)}set time(t){const e=null!==this.finishedTime;this.manualStartTime=null,this.finishedTime=null,this.animation.currentTime=i(t),e&&this.animation.pause()}get speed(){return this.animation.playbackRate}set speed(t){t<0&&(this.finishedTime=null),this.animation.playbackRate=t}get state(){return null!==this.finishedTime?"finished":this.animation.playState}get startTime(){return this.manualStartTime??Number(this.animation.startTime)}set startTime(t){this.manualStartTime=this.animation.startTime=t}attachTimeline({timeline:t,onAttach:i,observe:n}){return this.allowFlatten&&this.animation.effect?.updateTiming({easing:"linear"}),this.animation.onfinish=null,t&&g()?(this.animation.timeline=t,i?.(this.animation),e):n(this)}}class k{constructor(t){this.stop=()=>this.runAll("stop"),this.animations=t.filter(Boolean)}get finished(){return Promise.all(this.animations.map(t=>t.finished))}getAll(t){return this.animations[0][t]}setAll(t,e){for(let i=0;i<this.animations.length;i++)this.animations[i][t]=e}attachTimeline(t){const e=this.animations.map(e=>e.attachTimeline(t));return()=>{e.forEach((t,e)=>{t&&t(),this.animations[e].stop()})}}get time(){return this.getAll("time")}set time(t){this.setAll("time",t)}get speed(){return this.getAll("speed")}set speed(t){this.setAll("speed",t)}get state(){return this.getAll("state")}get startTime(){return this.getAll("startTime")}get duration(){return v(this.animations,"duration")}get iterationDuration(){return v(this.animations,"iterationDuration")}runAll(t){this.animations.forEach(e=>e[t]())}play(){this.runAll("play")}pause(){this.runAll("pause")}cancel(){this.runAll("cancel")}complete(){this.runAll("complete")}}function v(t,e){let i=0;for(let n=0;n<t.length;n++){const s=t[n][e];null!==s&&s>i&&(i=s)}return i}class E extends k{then(t,e){return this.finished.finally(t).then(()=>{})}}const w=new WeakMap,B=(t,e="")=>`${t}:${e}`;function I(t){let e=w.get(t);return e||(e=new Map,w.set(t,e)),e}function R(t,e){const i=t?.[e]??t?.default??t;return i!==t?function(t,e){if(t?.inherit&&e){const{inherit:i,...n}=t;return{...e,...n}}return t}(i,t):i}const P=new Set(["borderWidth","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","borderRadius","borderTopLeftRadius","borderTopRightRadius","borderBottomRightRadius","borderBottomLeftRadius","width","maxWidth","height","maxHeight","top","right","bottom","left","inset","insetBlock","insetBlockStart","insetBlockEnd","insetInline","insetInlineStart","insetInlineEnd","padding","paddingTop","paddingRight","paddingBottom","paddingLeft","paddingBlock","paddingBlockStart","paddingBlockEnd","paddingInline","paddingInlineStart","paddingInlineEnd","margin","marginTop","marginRight","marginBottom","marginLeft","marginBlock","marginBlockStart","marginBlockEnd","marginInline","marginInlineStart","marginInlineEnd","fontSize","backgroundPositionX","backgroundPositionY"]);function _(t,e){for(let i=0;i<t.length;i++)"number"==typeof t[i]&&P.has(e)&&(t[i]=t[i]+"px")}const M={};function O(t,e){const i=window.getComputedStyle(t);return c(e)?i.getPropertyValue(e):i[e]}function F(t,e,n,s){if(null==t)return[];const a=function(t,e){if(null==t)return[];if(t instanceof EventTarget)return[t];if("string"==typeof t){const i=(e?e.current:M.current?.root||document).querySelectorAll(t);return i?Array.from(i):[]}return Array.from(t).filter(t=>null!=t)}(t,s),o=a.length,r=[];for(let t=0;t<o;t++){const s=a[t],l={...n};"function"==typeof l.delay&&(l.delay=l.delay(t,o));for(const t in e){let n=e[t];Array.isArray(n)||(n=[n]);const a={...R(l,t)};a.duration&&(a.duration=i(a.duration)),a.delay&&(a.delay=i(a.delay));const o=I(s),u=B(t,a.pseudoElement||""),h=o.get(u);h&&h.stop(),r.push({map:o,key:u,unresolvedKeyframes:n,options:{...a,element:s,name:t,allowFlatten:!l.type&&!l.ease}})}}for(let t=0;t<r.length;t++){const{unresolvedKeyframes:e,options:i}=r[t],{element:n,name:s,pseudoElement:a}=i;a||null!==e[0]||(e[0]=O(n,s)),d(e),_(e,s),!a&&e.length<2&&e.unshift(O(n,s)),i.keyframes=e}const l=[];for(let t=0;t<r.length;t++){const{map:e,key:i,options:n}=r[t],s=new S(n);e.set(i,s),s.finished.finally(()=>e.delete(i)),l.push(s)}return l}const W=t=>function(e,i,n){return new E(F(e,i,n,t))},x=W();export{x as animateMini,W as createScopedWaapiAnimate}; //# sourceMappingURL=size-rollup-waapi-animate.js.map