vue3-lottie - npm Package Compare versions

Comparing version 2.6.0 to 2.7.0

dist/vue3-lottie.es.js

@@ -1093,2 +1093,6 @@ import { defineComponent, ref, computed, watch, onMounted, openBlock, createElementBlock, normalizeStyle } from "vue";
       default: () => ({})
+    },
+    assetsPath: {
+      type: String,
+      default: ""
     }
@@ -1147,3 +1151,4 @@ },
         autoplay: autoPlay,
-        animationData
+        animationData,
+        assetsPath: props.assetsPath
       };
@@ -1380,5 +1385,5 @@ if (isEqual(props.rendererSettings, {}) === false) {
 const plugin = {
-  version: "2.6.0",
+  version: "2.7.0",
   install
 };
 export { Vue3Lottie, plugin as default, install };

dist/vue3-lottie.umd.js

@@ -1,1 +0,1 @@
-(function(g,A){typeof exports=="object"&&typeof module!="undefined"?A(exports,require("vue"),require("lottie-web")):typeof define=="function"&&define.amd?define(["exports","vue","lottie-web"],A):(g=typeof globalThis!="undefined"?globalThis:g||self,A(g["vue3-lottie"]={},g.Vue,g.Lottie))})(this,function(g,A,bt){"use strict";function _t(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var $t=_t(bt),Tt=typeof global=="object"&&global&&global.Object===Object&&global,$e=Tt,mt=typeof self=="object"&&self&&self.Object===Object&&self,At=$e||mt||Function("return this")(),O=At,Ot=O.Symbol,E=Ot,Te=Object.prototype,wt=Te.hasOwnProperty,St=Te.toString,R=E?E.toStringTag:void 0;function jt(e){var t=wt.call(e,R),r=e[R];try{e[R]=void 0;var n=!0}catch{}var i=St.call(e);return n&&(t?e[R]=r:delete e[R]),i}var Pt=Object.prototype,Et=Pt.toString;function Lt(e){return Et.call(e)}var Ct="[object Null]",It="[object Undefined]",me=E?E.toStringTag:void 0;function U(e){return e==null?e===void 0?It:Ct:me&&me in Object(e)?jt(e):Lt(e)}function L(e){return e!=null&&typeof e=="object"}var Dt=Array.isArray,G=Dt;function K(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var Mt="[object AsyncFunction]",Ft="[object Function]",xt="[object GeneratorFunction]",Bt="[object Proxy]";function Ae(e){if(!K(e))return!1;var t=U(e);return t==Ft||t==xt||t==Mt||t==Bt}var Ht=O["__core-js_shared__"],ae=Ht,Oe=function(){var e=/[^.]+$/.exec(ae&&ae.keys&&ae.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""}();function Nt(e){return!!Oe&&Oe in e}var Rt=Function.prototype,Ut=Rt.toString;function C(e){if(e!=null){try{return Ut.call(e)}catch{}try{return e+""}catch{}}return""}var Gt=/[\\^$.*+?()[\]{}|]/g,Kt=/^\[object .+?Constructor\]$/,zt=Function.prototype,qt=Object.prototype,Yt=zt.toString,Vt=qt.hasOwnProperty,Wt=RegExp("^"+Yt.call(Vt).replace(Gt,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");function Jt(e){if(!K(e)||Nt(e))return!1;var t=Ae(e)?Wt:Kt;return t.test(C(e))}function Xt(e,t){return e==null?void 0:e[t]}function I(e,t){var r=Xt(e,t);return Jt(r)?r:void 0}var Zt=I(O,"WeakMap"),oe=Zt,we=Object.create,Qt=function(){function e(){}return function(t){if(!K(t))return{};if(we)return we(t);e.prototype=t;var r=new e;return e.prototype=void 0,r}}(),kt=Qt;function er(e,t){var r=-1,n=e.length;for(t||(t=Array(n));++r<n;)t[r]=e[r];return t}var tr=function(){try{var e=I(Object,"defineProperty");return e({},"",{}),e}catch{}}(),Se=tr;function rr(e,t){for(var r=-1,n=e==null?0:e.length;++r<n&&t(e[r],r,e)!==!1;);return e}var nr=9007199254740991,ar=/^(?:0|[1-9]\d*)$/;function or(e,t){var r=typeof e;return t=t==null?nr:t,!!t&&(r=="number"||r!="symbol"&&ar.test(e))&&e>-1&&e%1==0&&e<t}function je(e,t,r){t=="__proto__"&&Se?Se(e,t,{configurable:!0,enumerable:!0,value:r,writable:!0}):e[t]=r}function ie(e,t){return e===t||e!==e&&t!==t}var ir=Object.prototype,sr=ir.hasOwnProperty;function Pe(e,t,r){var n=e[t];(!(sr.call(e,t)&&ie(n,r))||r===void 0&&!(t in e))&&je(e,t,r)}function J(e,t,r,n){var i=!r;r||(r={});for(var a=-1,o=t.length;++a<o;){var s=t[a],u=n?n(r[s],e[s],s,r,e):void 0;u===void 0&&(u=e[s]),i?je(r,s,u):Pe(r,s,u)}return r}var ur=9007199254740991;function Ee(e){return typeof e=="number"&&e>-1&&e%1==0&&e<=ur}function Le(e){return e!=null&&Ee(e.length)&&!Ae(e)}var fr=Object.prototype;function se(e){var t=e&&e.constructor,r=typeof t=="function"&&t.prototype||fr;return e===r}function lr(e,t){for(var r=-1,n=Array(e);++r<e;)n[r]=t(r);return n}var cr="[object Arguments]";function Ce(e){return L(e)&&U(e)==cr}var Ie=Object.prototype,dr=Ie.hasOwnProperty,gr=Ie.propertyIsEnumerable,pr=Ce(function(){return arguments}())?Ce:function(e){return L(e)&&dr.call(e,"callee")&&!gr.call(e,"callee")},yr=pr;function vr(){return!1}var De=typeof g=="object"&&g&&!g.nodeType&&g,Me=De&&typeof module=="object"&&module&&!module.nodeType&&module,hr=Me&&Me.exports===De,Fe=hr?O.Buffer:void 0,br=Fe?Fe.isBuffer:void 0,_r=br||vr,X=_r,$r="[object Arguments]",Tr="[object Array]",mr="[object Boolean]",Ar="[object Date]",Or="[object Error]",wr="[object Function]",Sr="[object Map]",jr="[object Number]",Pr="[object Object]",Er="[object RegExp]",Lr="[object Set]",Cr="[object String]",Ir="[object WeakMap]",Dr="[object ArrayBuffer]",Mr="[object DataView]",Fr="[object Float32Array]",xr="[object Float64Array]",Br="[object Int8Array]",Hr="[object Int16Array]",Nr="[object Int32Array]",Rr="[object Uint8Array]",Ur="[object Uint8ClampedArray]",Gr="[object Uint16Array]",Kr="[object Uint32Array]",d={};d[Fr]=d[xr]=d[Br]=d[Hr]=d[Nr]=d[Rr]=d[Ur]=d[Gr]=d[Kr]=!0,d[$r]=d[Tr]=d[Dr]=d[mr]=d[Mr]=d[Ar]=d[Or]=d[wr]=d[Sr]=d[jr]=d[Pr]=d[Er]=d[Lr]=d[Cr]=d[Ir]=!1;function zr(e){return L(e)&&Ee(e.length)&&!!d[U(e)]}function ue(e){return function(t){return e(t)}}var xe=typeof g=="object"&&g&&!g.nodeType&&g,z=xe&&typeof module=="object"&&module&&!module.nodeType&&module,qr=z&&z.exports===xe,fe=qr&&$e.process,Yr=function(){try{var e=z&&z.require&&z.require("util").types;return e||fe&&fe.binding&&fe.binding("util")}catch{}}(),B=Yr,Be=B&&B.isTypedArray,Vr=Be?ue(Be):zr,He=Vr,Wr=Object.prototype,Jr=Wr.hasOwnProperty;function Ne(e,t){var r=G(e),n=!r&&yr(e),i=!r&&!n&&X(e),a=!r&&!n&&!i&&He(e),o=r||n||i||a,s=o?lr(e.length,String):[],u=s.length;for(var l in e)(t||Jr.call(e,l))&&!(o&&(l=="length"||i&&(l=="offset"||l=="parent")||a&&(l=="buffer"||l=="byteLength"||l=="byteOffset")||or(l,u)))&&s.push(l);return s}function Re(e,t){return function(r){return e(t(r))}}var Xr=Re(Object.keys,Object),Zr=Xr,Qr=Object.prototype,kr=Qr.hasOwnProperty;function en(e){if(!se(e))return Zr(e);var t=[];for(var r in Object(e))kr.call(e,r)&&r!="constructor"&&t.push(r);return t}function le(e){return Le(e)?Ne(e):en(e)}function tn(e){var t=[];if(e!=null)for(var r in Object(e))t.push(r);return t}var rn=Object.prototype,nn=rn.hasOwnProperty;function an(e){if(!K(e))return tn(e);var t=se(e),r=[];for(var n in e)n=="constructor"&&(t||!nn.call(e,n))||r.push(n);return r}function ce(e){return Le(e)?Ne(e,!0):an(e)}var on=I(Object,"create"),q=on;function sn(){this.__data__=q?q(null):{},this.size=0}function un(e){var t=this.has(e)&&delete this.__data__[e];return this.size-=t?1:0,t}var fn="__lodash_hash_undefined__",ln=Object.prototype,cn=ln.hasOwnProperty;function dn(e){var t=this.__data__;if(q){var r=t[e];return r===fn?void 0:r}return cn.call(t,e)?t[e]:void 0}var gn=Object.prototype,pn=gn.hasOwnProperty;function yn(e){var t=this.__data__;return q?t[e]!==void 0:pn.call(t,e)}var vn="__lodash_hash_undefined__";function hn(e,t){var r=this.__data__;return this.size+=this.has(e)?0:1,r[e]=q&&t===void 0?vn:t,this}function D(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}D.prototype.clear=sn,D.prototype.delete=un,D.prototype.get=dn,D.prototype.has=yn,D.prototype.set=hn;function bn(){this.__data__=[],this.size=0}function Z(e,t){for(var r=e.length;r--;)if(ie(e[r][0],t))return r;return-1}var _n=Array.prototype,$n=_n.splice;function Tn(e){var t=this.__data__,r=Z(t,e);if(r<0)return!1;var n=t.length-1;return r==n?t.pop():$n.call(t,r,1),--this.size,!0}function mn(e){var t=this.__data__,r=Z(t,e);return r<0?void 0:t[r][1]}function An(e){return Z(this.__data__,e)>-1}function On(e,t){var r=this.__data__,n=Z(r,e);return n<0?(++this.size,r.push([e,t])):r[n][1]=t,this}function S(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}S.prototype.clear=bn,S.prototype.delete=Tn,S.prototype.get=mn,S.prototype.has=An,S.prototype.set=On;var wn=I(O,"Map"),Y=wn;function Sn(){this.size=0,this.__data__={hash:new D,map:new(Y||S),string:new D}}function jn(e){var t=typeof e;return t=="string"||t=="number"||t=="symbol"||t=="boolean"?e!=="__proto__":e===null}function Q(e,t){var r=e.__data__;return jn(t)?r[typeof t=="string"?"string":"hash"]:r.map}function Pn(e){var t=Q(this,e).delete(e);return this.size-=t?1:0,t}function En(e){return Q(this,e).get(e)}function Ln(e){return Q(this,e).has(e)}function Cn(e,t){var r=Q(this,e),n=r.size;return r.set(e,t),this.size+=r.size==n?0:1,this}function M(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}M.prototype.clear=Sn,M.prototype.delete=Pn,M.prototype.get=En,M.prototype.has=Ln,M.prototype.set=Cn;function Ue(e,t){for(var r=-1,n=t.length,i=e.length;++r<n;)e[i+r]=t[r];return e}var In=Re(Object.getPrototypeOf,Object),Ge=In;function Dn(){this.__data__=new S,this.size=0}function Mn(e){var t=this.__data__,r=t.delete(e);return this.size=t.size,r}function Fn(e){return this.__data__.get(e)}function xn(e){return this.__data__.has(e)}var Bn=200;function Hn(e,t){var r=this.__data__;if(r instanceof S){var n=r.__data__;if(!Y||n.length<Bn-1)return n.push([e,t]),this.size=++r.size,this;r=this.__data__=new M(n)}return r.set(e,t),this.size=r.size,this}function j(e){var t=this.__data__=new S(e);this.size=t.size}j.prototype.clear=Dn,j.prototype.delete=Mn,j.prototype.get=Fn,j.prototype.has=xn,j.prototype.set=Hn;function Nn(e,t){return e&&J(t,le(t),e)}function Rn(e,t){return e&&J(t,ce(t),e)}var Ke=typeof g=="object"&&g&&!g.nodeType&&g,ze=Ke&&typeof module=="object"&&module&&!module.nodeType&&module,Un=ze&&ze.exports===Ke,qe=Un?O.Buffer:void 0,Ye=qe?qe.allocUnsafe:void 0;function Gn(e,t){if(t)return e.slice();var r=e.length,n=Ye?Ye(r):new e.constructor(r);return e.copy(n),n}function Kn(e,t){for(var r=-1,n=e==null?0:e.length,i=0,a=[];++r<n;){var o=e[r];t(o,r,e)&&(a[i++]=o)}return a}function Ve(){return[]}var zn=Object.prototype,qn=zn.propertyIsEnumerable,We=Object.getOwnPropertySymbols,Yn=We?function(e){return e==null?[]:(e=Object(e),Kn(We(e),function(t){return qn.call(e,t)}))}:Ve,de=Yn;function Vn(e,t){return J(e,de(e),t)}var Wn=Object.getOwnPropertySymbols,Jn=Wn?function(e){for(var t=[];e;)Ue(t,de(e)),e=Ge(e);return t}:Ve,Je=Jn;function Xn(e,t){return J(e,Je(e),t)}function Xe(e,t,r){var n=t(e);return G(e)?n:Ue(n,r(e))}function ge(e){return Xe(e,le,de)}function Zn(e){return Xe(e,ce,Je)}var Qn=I(O,"DataView"),pe=Qn,kn=I(O,"Promise"),ye=kn,ea=I(O,"Set"),ve=ea,Ze="[object Map]",ta="[object Object]",Qe="[object Promise]",ke="[object Set]",et="[object WeakMap]",tt="[object DataView]",ra=C(pe),na=C(Y),aa=C(ye),oa=C(ve),ia=C(oe),F=U;(pe&&F(new pe(new ArrayBuffer(1)))!=tt||Y&&F(new Y)!=Ze||ye&&F(ye.resolve())!=Qe||ve&&F(new ve)!=ke||oe&&F(new oe)!=et)&&(F=function(e){var t=U(e),r=t==ta?e.constructor:void 0,n=r?C(r):"";if(n)switch(n){case ra:return tt;case na:return Ze;case aa:return Qe;case oa:return ke;case ia:return et}return t});var V=F,sa=Object.prototype,ua=sa.hasOwnProperty;function fa(e){var t=e.length,r=new e.constructor(t);return t&&typeof e[0]=="string"&&ua.call(e,"index")&&(r.index=e.index,r.input=e.input),r}var la=O.Uint8Array,k=la;function he(e){var t=new e.constructor(e.byteLength);return new k(t).set(new k(e)),t}function ca(e,t){var r=t?he(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.byteLength)}var da=/\w*$/;function ga(e){var t=new e.constructor(e.source,da.exec(e));return t.lastIndex=e.lastIndex,t}var rt=E?E.prototype:void 0,nt=rt?rt.valueOf:void 0;function pa(e){return nt?Object(nt.call(e)):{}}function ya(e,t){var r=t?he(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.length)}var va="[object Boolean]",ha="[object Date]",ba="[object Map]",_a="[object Number]",$a="[object RegExp]",Ta="[object Set]",ma="[object String]",Aa="[object Symbol]",Oa="[object ArrayBuffer]",wa="[object DataView]",Sa="[object Float32Array]",ja="[object Float64Array]",Pa="[object Int8Array]",Ea="[object Int16Array]",La="[object Int32Array]",Ca="[object Uint8Array]",Ia="[object Uint8ClampedArray]",Da="[object Uint16Array]",Ma="[object Uint32Array]";function Fa(e,t,r){var n=e.constructor;switch(t){case Oa:return he(e);case va:case ha:return new n(+e);case wa:return ca(e,r);case Sa:case ja:case Pa:case Ea:case La:case Ca:case Ia:case Da:case Ma:return ya(e,r);case ba:return new n;case _a:case ma:return new n(e);case $a:return ga(e);case Ta:return new n;case Aa:return pa(e)}}function xa(e){return typeof e.constructor=="function"&&!se(e)?kt(Ge(e)):{}}var Ba="[object Map]";function Ha(e){return L(e)&&V(e)==Ba}var at=B&&B.isMap,Na=at?ue(at):Ha,Ra=Na,Ua="[object Set]";function Ga(e){return L(e)&&V(e)==Ua}var ot=B&&B.isSet,Ka=ot?ue(ot):Ga,za=Ka,qa=1,Ya=2,Va=4,it="[object Arguments]",Wa="[object Array]",Ja="[object Boolean]",Xa="[object Date]",Za="[object Error]",st="[object Function]",Qa="[object GeneratorFunction]",ka="[object Map]",eo="[object Number]",ut="[object Object]",to="[object RegExp]",ro="[object Set]",no="[object String]",ao="[object Symbol]",oo="[object WeakMap]",io="[object ArrayBuffer]",so="[object DataView]",uo="[object Float32Array]",fo="[object Float64Array]",lo="[object Int8Array]",co="[object Int16Array]",go="[object Int32Array]",po="[object Uint8Array]",yo="[object Uint8ClampedArray]",vo="[object Uint16Array]",ho="[object Uint32Array]",c={};c[it]=c[Wa]=c[io]=c[so]=c[Ja]=c[Xa]=c[uo]=c[fo]=c[lo]=c[co]=c[go]=c[ka]=c[eo]=c[ut]=c[to]=c[ro]=c[no]=c[ao]=c[po]=c[yo]=c[vo]=c[ho]=!0,c[Za]=c[st]=c[oo]=!1;function ee(e,t,r,n,i,a){var o,s=t&qa,u=t&Ya,l=t&Va;if(r&&(o=i?r(e,n,i,a):r(e)),o!==void 0)return o;if(!K(e))return e;var T=G(e);if(T){if(o=fa(e),!s)return er(e,o)}else{var y=V(e),p=y==st||y==Qa;if(X(e))return Gn(e,s);if(y==ut||y==it||p&&!i){if(o=u||p?{}:xa(e),!s)return u?Xn(e,Rn(o,e)):Vn(e,Nn(o,e))}else{if(!c[y])return i?e:{};o=Fa(e,y,s)}}a||(a=new j);var m=a.get(e);if(m)return m;a.set(e,o),za(e)?e.forEach(function(h){o.add(ee(h,t,r,h,e,a))}):Ra(e)&&e.forEach(function(h,b){o.set(b,ee(h,t,r,b,e,a))});var _=l?u?Zn:ge:u?ce:le,$=T?void 0:_(e);return rr($||e,function(h,b){$&&(b=h,h=e[b]),Pe(o,b,ee(h,t,r,b,e,a))}),o}var bo=1,_o=4;function $o(e){return ee(e,bo|_o)}var To="__lodash_hash_undefined__";function mo(e){return this.__data__.set(e,To),this}function Ao(e){return this.__data__.has(e)}function te(e){var t=-1,r=e==null?0:e.length;for(this.__data__=new M;++t<r;)this.add(e[t])}te.prototype.add=te.prototype.push=mo,te.prototype.has=Ao;function Oo(e,t){for(var r=-1,n=e==null?0:e.length;++r<n;)if(t(e[r],r,e))return!0;return!1}function wo(e,t){return e.has(t)}var So=1,jo=2;function ft(e,t,r,n,i,a){var o=r&So,s=e.length,u=t.length;if(s!=u&&!(o&&u>s))return!1;var l=a.get(e),T=a.get(t);if(l&&T)return l==t&&T==e;var y=-1,p=!0,m=r&jo?new te:void 0;for(a.set(e,t),a.set(t,e);++y<s;){var _=e[y],$=t[y];if(n)var h=o?n($,_,y,t,e,a):n(_,$,y,e,t,a);if(h!==void 0){if(h)continue;p=!1;break}if(m){if(!Oo(t,function(b,P){if(!wo(m,P)&&(_===b||i(_,b,r,n,a)))return m.push(P)})){p=!1;break}}else if(!(_===$||i(_,$,r,n,a))){p=!1;break}}return a.delete(e),a.delete(t),p}function Po(e){var t=-1,r=Array(e.size);return e.forEach(function(n,i){r[++t]=[i,n]}),r}function Eo(e){var t=-1,r=Array(e.size);return e.forEach(function(n){r[++t]=n}),r}var Lo=1,Co=2,Io="[object Boolean]",Do="[object Date]",Mo="[object Error]",Fo="[object Map]",xo="[object Number]",Bo="[object RegExp]",Ho="[object Set]",No="[object String]",Ro="[object Symbol]",Uo="[object ArrayBuffer]",Go="[object DataView]",lt=E?E.prototype:void 0,be=lt?lt.valueOf:void 0;function Ko(e,t,r,n,i,a,o){switch(r){case Go:if(e.byteLength!=t.byteLength||e.byteOffset!=t.byteOffset)return!1;e=e.buffer,t=t.buffer;case Uo:return!(e.byteLength!=t.byteLength||!a(new k(e),new k(t)));case Io:case Do:case xo:return ie(+e,+t);case Mo:return e.name==t.name&&e.message==t.message;case Bo:case No:return e==t+"";case Fo:var s=Po;case Ho:var u=n&Lo;if(s||(s=Eo),e.size!=t.size&&!u)return!1;var l=o.get(e);if(l)return l==t;n|=Co,o.set(e,t);var T=ft(s(e),s(t),n,i,a,o);return o.delete(e),T;case Ro:if(be)return be.call(e)==be.call(t)}return!1}var zo=1,qo=Object.prototype,Yo=qo.hasOwnProperty;function Vo(e,t,r,n,i,a){var o=r&zo,s=ge(e),u=s.length,l=ge(t),T=l.length;if(u!=T&&!o)return!1;for(var y=u;y--;){var p=s[y];if(!(o?p in t:Yo.call(t,p)))return!1}var m=a.get(e),_=a.get(t);if(m&&_)return m==t&&_==e;var $=!0;a.set(e,t),a.set(t,e);for(var h=o;++y<u;){p=s[y];var b=e[p],P=t[p];if(n)var ne=o?n(P,b,p,t,e,a):n(b,P,p,e,t,a);if(!(ne===void 0?b===P||i(b,P,r,n,a):ne)){$=!1;break}h||(h=p=="constructor")}if($&&!h){var H=e.constructor,N=t.constructor;H!=N&&"constructor"in e&&"constructor"in t&&!(typeof H=="function"&&H instanceof H&&typeof N=="function"&&N instanceof N)&&($=!1)}return a.delete(e),a.delete(t),$}var Wo=1,ct="[object Arguments]",dt="[object Array]",re="[object Object]",Jo=Object.prototype,gt=Jo.hasOwnProperty;function Xo(e,t,r,n,i,a){var o=G(e),s=G(t),u=o?dt:V(e),l=s?dt:V(t);u=u==ct?re:u,l=l==ct?re:l;var T=u==re,y=l==re,p=u==l;if(p&&X(e)){if(!X(t))return!1;o=!0,T=!1}if(p&&!T)return a||(a=new j),o||He(e)?ft(e,t,r,n,i,a):Ko(e,t,u,r,n,i,a);if(!(r&Wo)){var m=T&&gt.call(e,"__wrapped__"),_=y&&gt.call(t,"__wrapped__");if(m||_){var $=m?e.value():e,h=_?t.value():t;return a||(a=new j),i($,h,r,n,a)}}return p?(a||(a=new j),Vo(e,t,r,n,i,a)):!1}function pt(e,t,r,n,i){return e===t?!0:e==null||t==null||!L(e)&&!L(t)?e!==e&&t!==t:Xo(e,t,r,n,pt,i)}function _e(e,t){return pt(e,t)}var ai="",Zo=(e,t)=>{const r=e.__vccOpts||e;for(const[n,i]of t)r[n]=i;return r};const Qo=A.defineComponent({props:{animationData:{type:Object,default:()=>({})},animationLink:{type:String,default:""},loop:{type:[Boolean,Number],default:!0},autoPlay:{type:Boolean,default:!0},width:{type:[Number,String],default:"100%"},height:{type:[Number,String],default:"100%"},speed:{type:Number,default:1},delay:{type:Number,default:0},direction:{type:String,default:"forward"},pauseOnHover:{type:Boolean,default:!1},playOnHover:{type:Boolean,default:!1},backgroundColor:{type:String,default:"transparent"},pauseAnimation:{type:Boolean,default:!1},renderer:{type:String,default:"svg"},rendererSettings:{type:Object,default:()=>({})}},emits:{onComplete:null,onLoopComplete:null,onEnterFrame:null,onSegmentStart:null,onAnimationLoaded:null},setup(e,{emit:t}){let r=A.ref(null);const n=A.ref("");let i=1;const a=f=>document.querySelector(`[data-id="${f}"]`)!==null,o=async f=>{let v=e.autoPlay;e.playOnHover&&(v=!1);let w={};if(_e(e.animationData,{})===!1&&(w=$o(e.animationData)),e.animationLink!="")try{w=await(await fetch(e.animationLink)).json()}catch(ht){console.error(ht);return}let x=e.loop;typeof x=="number"&&x>0&&(x=x-1),e.delay>0&&(v=!1);const W={container:f,renderer:e.renderer,loop:x,autoplay:v,animationData:w};_e(e.rendererSettings,{})===!1&&(W.rendererSettings=e.rendererSettings),r=$t.default.loadAnimation(W),setTimeout(()=>{v=e.autoPlay,e.playOnHover?r.pause():v?r.play():r.pause(),t("onAnimationLoaded")},e.delay),r.setSpeed(e.speed),e.direction==="reverse"&&r.setDirection(-1),e.direction==="normal"&&r.setDirection(1),(e.pauseAnimation||e.playOnHover)&&r.pause(),r.addEventListener("loopComplete",()=>{e.direction==="alternate"&&(r.stop(),i=i*-1,r.setDirection(i),r.play()),t("onLoopComplete")}),r.addEventListener("complete",()=>{t("onComplete")}),r.addEventListener("enterFrame",()=>{t("onEnterFrame")}),r.addEventListener("segmentStart",()=>{t("onSegmentStart")})},s=A.computed(()=>{let f=e.width,v=e.height;return typeof e.width=="number"&&(f=`${e.width}px`),typeof e.height=="number"&&(v=`${e.height}px`),{"--lottie-animation-container-width":f,"--lottie-animation-container-height":v,"--lottie-animation-container-background-color":e.backgroundColor}}),u=()=>{r&&e.pauseOnHover&&r.pause(),r&&e.playOnHover&&r.play()},l=()=>{r&&e.pauseOnHover&&r.play(),r&&e.playOnHover&&r.pause()};A.watch(()=>e.pauseAnimation,()=>{if((e.pauseOnHover||e.playOnHover)&&e.pauseAnimation){console.error("If you are using pauseAnimation prop for Vue3-Lottie, please remove the props pauseOnHover and playOnHover");return}r&&(e.pauseAnimation?r.pause():r.play())});const T=()=>{r&&r.play()},y=()=>{r&&r.pause()},p=()=>{r&&r.stop()},m=()=>{r&&r.destroy()},_=(f=1)=>{if(f<=0)throw new Error("Speed must be greater than 0");r&&r.setSpeed(f)},$=f=>{r&&(f==="forward"?r.setDirection(1):f==="reverse"&&r.setDirection(-1))},h=(f,v=!0)=>{r&&r.goToAndStop(f,v)},b=(f,v=!0)=>{r&&r.goToAndPlay(f,v)},P=(f,v=!1)=>{r&&r.playSegments(f,v)},ne=(f=!0)=>{r&&r.setSubframe(f)},H=(f=!0)=>{if(r)return r.getDuration(f)},N=(f,v=0)=>{r&&r.renderer.elements[v].updateDocumentData(f)},ri=f=>{for(var v="",w="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",x=w.length,W=0;W<f;W++)v+=w.charAt(Math.floor(Math.random()*x));return v},ni=f=>{if(e.pauseOnHover&&e.playOnHover)throw new Error("You cannot set pauseOnHover and playOnHover for Vue3-Lottie at the same time.");if(e.animationLink===""&&_e(e.animationData,{}))throw new Error("You must provide either animationLink or animationData");const v=setInterval(()=>{if(a(f)){clearInterval(v);const w=document.querySelector(`[data-id="${f}" ]`);w&&o(w)}},0)};return A.onMounted(async()=>{n.value=ri(20),ni(n.value)}),{elementid:n,hoverEnded:l,hoverStarted:u,getCurrentStyle:s,play:T,pause:y,stop:p,destroy:m,setSpeed:_,setDirection:$,goToAndStop:h,goToAndPlay:b,playSegments:P,setSubFrame:ne,getDuration:H,updateDocumentData:N}}}),ko=["data-id"];function ei(e,t,r,n,i,a){return A.openBlock(),A.createElementBlock("div",{"data-id":e.elementid,class:"lottie-animation-container",style:A.normalizeStyle(e.getCurrentStyle),onMouseenter:t[0]||(t[0]=(...o)=>e.hoverStarted&&e.hoverStarted(...o)),onMouseleave:t[1]||(t[1]=(...o)=>e.hoverEnded&&e.hoverEnded(...o))},null,44,ko)}var yt=Zo(Qo,[["render",ei]]);function vt(e,t){const r=Object.assign({},{name:"Vue3Lottie"},t);e.component(`${r.name}`,yt)}const ti={version:"2.6.0",install:vt};g.Vue3Lottie=yt,g.default=ti,g.install=vt,Object.defineProperties(g,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(g,A){typeof exports=="object"&&typeof module!="undefined"?A(exports,require("vue"),require("lottie-web")):typeof define=="function"&&define.amd?define(["exports","vue","lottie-web"],A):(g=typeof globalThis!="undefined"?globalThis:g||self,A(g["vue3-lottie"]={},g.Vue,g.Lottie))})(this,function(g,A,bt){"use strict";function _t(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var $t=_t(bt),Tt=typeof global=="object"&&global&&global.Object===Object&&global,$e=Tt,mt=typeof self=="object"&&self&&self.Object===Object&&self,At=$e||mt||Function("return this")(),O=At,Ot=O.Symbol,E=Ot,Te=Object.prototype,St=Te.hasOwnProperty,wt=Te.toString,R=E?E.toStringTag:void 0;function jt(e){var t=St.call(e,R),r=e[R];try{e[R]=void 0;var n=!0}catch{}var i=wt.call(e);return n&&(t?e[R]=r:delete e[R]),i}var Pt=Object.prototype,Et=Pt.toString;function Lt(e){return Et.call(e)}var Ct="[object Null]",It="[object Undefined]",me=E?E.toStringTag:void 0;function U(e){return e==null?e===void 0?It:Ct:me&&me in Object(e)?jt(e):Lt(e)}function L(e){return e!=null&&typeof e=="object"}var Dt=Array.isArray,G=Dt;function K(e){var t=typeof e;return e!=null&&(t=="object"||t=="function")}var Mt="[object AsyncFunction]",Ft="[object Function]",xt="[object GeneratorFunction]",Bt="[object Proxy]";function Ae(e){if(!K(e))return!1;var t=U(e);return t==Ft||t==xt||t==Mt||t==Bt}var Ht=O["__core-js_shared__"],ae=Ht,Oe=function(){var e=/[^.]+$/.exec(ae&&ae.keys&&ae.keys.IE_PROTO||"");return e?"Symbol(src)_1."+e:""}();function Nt(e){return!!Oe&&Oe in e}var Rt=Function.prototype,Ut=Rt.toString;function C(e){if(e!=null){try{return Ut.call(e)}catch{}try{return e+""}catch{}}return""}var Gt=/[\\^$.*+?()[\]{}|]/g,Kt=/^\[object .+?Constructor\]$/,zt=Function.prototype,qt=Object.prototype,Yt=zt.toString,Vt=qt.hasOwnProperty,Wt=RegExp("^"+Yt.call(Vt).replace(Gt,"\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g,"$1.*?")+"$");function Jt(e){if(!K(e)||Nt(e))return!1;var t=Ae(e)?Wt:Kt;return t.test(C(e))}function Xt(e,t){return e==null?void 0:e[t]}function I(e,t){var r=Xt(e,t);return Jt(r)?r:void 0}var Zt=I(O,"WeakMap"),oe=Zt,Se=Object.create,Qt=function(){function e(){}return function(t){if(!K(t))return{};if(Se)return Se(t);e.prototype=t;var r=new e;return e.prototype=void 0,r}}(),kt=Qt;function er(e,t){var r=-1,n=e.length;for(t||(t=Array(n));++r<n;)t[r]=e[r];return t}var tr=function(){try{var e=I(Object,"defineProperty");return e({},"",{}),e}catch{}}(),we=tr;function rr(e,t){for(var r=-1,n=e==null?0:e.length;++r<n&&t(e[r],r,e)!==!1;);return e}var nr=9007199254740991,ar=/^(?:0|[1-9]\d*)$/;function or(e,t){var r=typeof e;return t=t==null?nr:t,!!t&&(r=="number"||r!="symbol"&&ar.test(e))&&e>-1&&e%1==0&&e<t}function je(e,t,r){t=="__proto__"&&we?we(e,t,{configurable:!0,enumerable:!0,value:r,writable:!0}):e[t]=r}function ie(e,t){return e===t||e!==e&&t!==t}var ir=Object.prototype,sr=ir.hasOwnProperty;function Pe(e,t,r){var n=e[t];(!(sr.call(e,t)&&ie(n,r))||r===void 0&&!(t in e))&&je(e,t,r)}function J(e,t,r,n){var i=!r;r||(r={});for(var a=-1,o=t.length;++a<o;){var s=t[a],u=n?n(r[s],e[s],s,r,e):void 0;u===void 0&&(u=e[s]),i?je(r,s,u):Pe(r,s,u)}return r}var ur=9007199254740991;function Ee(e){return typeof e=="number"&&e>-1&&e%1==0&&e<=ur}function Le(e){return e!=null&&Ee(e.length)&&!Ae(e)}var fr=Object.prototype;function se(e){var t=e&&e.constructor,r=typeof t=="function"&&t.prototype||fr;return e===r}function lr(e,t){for(var r=-1,n=Array(e);++r<e;)n[r]=t(r);return n}var cr="[object Arguments]";function Ce(e){return L(e)&&U(e)==cr}var Ie=Object.prototype,dr=Ie.hasOwnProperty,gr=Ie.propertyIsEnumerable,pr=Ce(function(){return arguments}())?Ce:function(e){return L(e)&&dr.call(e,"callee")&&!gr.call(e,"callee")},yr=pr;function vr(){return!1}var De=typeof g=="object"&&g&&!g.nodeType&&g,Me=De&&typeof module=="object"&&module&&!module.nodeType&&module,hr=Me&&Me.exports===De,Fe=hr?O.Buffer:void 0,br=Fe?Fe.isBuffer:void 0,_r=br||vr,X=_r,$r="[object Arguments]",Tr="[object Array]",mr="[object Boolean]",Ar="[object Date]",Or="[object Error]",Sr="[object Function]",wr="[object Map]",jr="[object Number]",Pr="[object Object]",Er="[object RegExp]",Lr="[object Set]",Cr="[object String]",Ir="[object WeakMap]",Dr="[object ArrayBuffer]",Mr="[object DataView]",Fr="[object Float32Array]",xr="[object Float64Array]",Br="[object Int8Array]",Hr="[object Int16Array]",Nr="[object Int32Array]",Rr="[object Uint8Array]",Ur="[object Uint8ClampedArray]",Gr="[object Uint16Array]",Kr="[object Uint32Array]",d={};d[Fr]=d[xr]=d[Br]=d[Hr]=d[Nr]=d[Rr]=d[Ur]=d[Gr]=d[Kr]=!0,d[$r]=d[Tr]=d[Dr]=d[mr]=d[Mr]=d[Ar]=d[Or]=d[Sr]=d[wr]=d[jr]=d[Pr]=d[Er]=d[Lr]=d[Cr]=d[Ir]=!1;function zr(e){return L(e)&&Ee(e.length)&&!!d[U(e)]}function ue(e){return function(t){return e(t)}}var xe=typeof g=="object"&&g&&!g.nodeType&&g,z=xe&&typeof module=="object"&&module&&!module.nodeType&&module,qr=z&&z.exports===xe,fe=qr&&$e.process,Yr=function(){try{var e=z&&z.require&&z.require("util").types;return e||fe&&fe.binding&&fe.binding("util")}catch{}}(),B=Yr,Be=B&&B.isTypedArray,Vr=Be?ue(Be):zr,He=Vr,Wr=Object.prototype,Jr=Wr.hasOwnProperty;function Ne(e,t){var r=G(e),n=!r&&yr(e),i=!r&&!n&&X(e),a=!r&&!n&&!i&&He(e),o=r||n||i||a,s=o?lr(e.length,String):[],u=s.length;for(var l in e)(t||Jr.call(e,l))&&!(o&&(l=="length"||i&&(l=="offset"||l=="parent")||a&&(l=="buffer"||l=="byteLength"||l=="byteOffset")||or(l,u)))&&s.push(l);return s}function Re(e,t){return function(r){return e(t(r))}}var Xr=Re(Object.keys,Object),Zr=Xr,Qr=Object.prototype,kr=Qr.hasOwnProperty;function en(e){if(!se(e))return Zr(e);var t=[];for(var r in Object(e))kr.call(e,r)&&r!="constructor"&&t.push(r);return t}function le(e){return Le(e)?Ne(e):en(e)}function tn(e){var t=[];if(e!=null)for(var r in Object(e))t.push(r);return t}var rn=Object.prototype,nn=rn.hasOwnProperty;function an(e){if(!K(e))return tn(e);var t=se(e),r=[];for(var n in e)n=="constructor"&&(t||!nn.call(e,n))||r.push(n);return r}function ce(e){return Le(e)?Ne(e,!0):an(e)}var on=I(Object,"create"),q=on;function sn(){this.__data__=q?q(null):{},this.size=0}function un(e){var t=this.has(e)&&delete this.__data__[e];return this.size-=t?1:0,t}var fn="__lodash_hash_undefined__",ln=Object.prototype,cn=ln.hasOwnProperty;function dn(e){var t=this.__data__;if(q){var r=t[e];return r===fn?void 0:r}return cn.call(t,e)?t[e]:void 0}var gn=Object.prototype,pn=gn.hasOwnProperty;function yn(e){var t=this.__data__;return q?t[e]!==void 0:pn.call(t,e)}var vn="__lodash_hash_undefined__";function hn(e,t){var r=this.__data__;return this.size+=this.has(e)?0:1,r[e]=q&&t===void 0?vn:t,this}function D(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}D.prototype.clear=sn,D.prototype.delete=un,D.prototype.get=dn,D.prototype.has=yn,D.prototype.set=hn;function bn(){this.__data__=[],this.size=0}function Z(e,t){for(var r=e.length;r--;)if(ie(e[r][0],t))return r;return-1}var _n=Array.prototype,$n=_n.splice;function Tn(e){var t=this.__data__,r=Z(t,e);if(r<0)return!1;var n=t.length-1;return r==n?t.pop():$n.call(t,r,1),--this.size,!0}function mn(e){var t=this.__data__,r=Z(t,e);return r<0?void 0:t[r][1]}function An(e){return Z(this.__data__,e)>-1}function On(e,t){var r=this.__data__,n=Z(r,e);return n<0?(++this.size,r.push([e,t])):r[n][1]=t,this}function w(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}w.prototype.clear=bn,w.prototype.delete=Tn,w.prototype.get=mn,w.prototype.has=An,w.prototype.set=On;var Sn=I(O,"Map"),Y=Sn;function wn(){this.size=0,this.__data__={hash:new D,map:new(Y||w),string:new D}}function jn(e){var t=typeof e;return t=="string"||t=="number"||t=="symbol"||t=="boolean"?e!=="__proto__":e===null}function Q(e,t){var r=e.__data__;return jn(t)?r[typeof t=="string"?"string":"hash"]:r.map}function Pn(e){var t=Q(this,e).delete(e);return this.size-=t?1:0,t}function En(e){return Q(this,e).get(e)}function Ln(e){return Q(this,e).has(e)}function Cn(e,t){var r=Q(this,e),n=r.size;return r.set(e,t),this.size+=r.size==n?0:1,this}function M(e){var t=-1,r=e==null?0:e.length;for(this.clear();++t<r;){var n=e[t];this.set(n[0],n[1])}}M.prototype.clear=wn,M.prototype.delete=Pn,M.prototype.get=En,M.prototype.has=Ln,M.prototype.set=Cn;function Ue(e,t){for(var r=-1,n=t.length,i=e.length;++r<n;)e[i+r]=t[r];return e}var In=Re(Object.getPrototypeOf,Object),Ge=In;function Dn(){this.__data__=new w,this.size=0}function Mn(e){var t=this.__data__,r=t.delete(e);return this.size=t.size,r}function Fn(e){return this.__data__.get(e)}function xn(e){return this.__data__.has(e)}var Bn=200;function Hn(e,t){var r=this.__data__;if(r instanceof w){var n=r.__data__;if(!Y||n.length<Bn-1)return n.push([e,t]),this.size=++r.size,this;r=this.__data__=new M(n)}return r.set(e,t),this.size=r.size,this}function j(e){var t=this.__data__=new w(e);this.size=t.size}j.prototype.clear=Dn,j.prototype.delete=Mn,j.prototype.get=Fn,j.prototype.has=xn,j.prototype.set=Hn;function Nn(e,t){return e&&J(t,le(t),e)}function Rn(e,t){return e&&J(t,ce(t),e)}var Ke=typeof g=="object"&&g&&!g.nodeType&&g,ze=Ke&&typeof module=="object"&&module&&!module.nodeType&&module,Un=ze&&ze.exports===Ke,qe=Un?O.Buffer:void 0,Ye=qe?qe.allocUnsafe:void 0;function Gn(e,t){if(t)return e.slice();var r=e.length,n=Ye?Ye(r):new e.constructor(r);return e.copy(n),n}function Kn(e,t){for(var r=-1,n=e==null?0:e.length,i=0,a=[];++r<n;){var o=e[r];t(o,r,e)&&(a[i++]=o)}return a}function Ve(){return[]}var zn=Object.prototype,qn=zn.propertyIsEnumerable,We=Object.getOwnPropertySymbols,Yn=We?function(e){return e==null?[]:(e=Object(e),Kn(We(e),function(t){return qn.call(e,t)}))}:Ve,de=Yn;function Vn(e,t){return J(e,de(e),t)}var Wn=Object.getOwnPropertySymbols,Jn=Wn?function(e){for(var t=[];e;)Ue(t,de(e)),e=Ge(e);return t}:Ve,Je=Jn;function Xn(e,t){return J(e,Je(e),t)}function Xe(e,t,r){var n=t(e);return G(e)?n:Ue(n,r(e))}function ge(e){return Xe(e,le,de)}function Zn(e){return Xe(e,ce,Je)}var Qn=I(O,"DataView"),pe=Qn,kn=I(O,"Promise"),ye=kn,ea=I(O,"Set"),ve=ea,Ze="[object Map]",ta="[object Object]",Qe="[object Promise]",ke="[object Set]",et="[object WeakMap]",tt="[object DataView]",ra=C(pe),na=C(Y),aa=C(ye),oa=C(ve),ia=C(oe),F=U;(pe&&F(new pe(new ArrayBuffer(1)))!=tt||Y&&F(new Y)!=Ze||ye&&F(ye.resolve())!=Qe||ve&&F(new ve)!=ke||oe&&F(new oe)!=et)&&(F=function(e){var t=U(e),r=t==ta?e.constructor:void 0,n=r?C(r):"";if(n)switch(n){case ra:return tt;case na:return Ze;case aa:return Qe;case oa:return ke;case ia:return et}return t});var V=F,sa=Object.prototype,ua=sa.hasOwnProperty;function fa(e){var t=e.length,r=new e.constructor(t);return t&&typeof e[0]=="string"&&ua.call(e,"index")&&(r.index=e.index,r.input=e.input),r}var la=O.Uint8Array,k=la;function he(e){var t=new e.constructor(e.byteLength);return new k(t).set(new k(e)),t}function ca(e,t){var r=t?he(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.byteLength)}var da=/\w*$/;function ga(e){var t=new e.constructor(e.source,da.exec(e));return t.lastIndex=e.lastIndex,t}var rt=E?E.prototype:void 0,nt=rt?rt.valueOf:void 0;function pa(e){return nt?Object(nt.call(e)):{}}function ya(e,t){var r=t?he(e.buffer):e.buffer;return new e.constructor(r,e.byteOffset,e.length)}var va="[object Boolean]",ha="[object Date]",ba="[object Map]",_a="[object Number]",$a="[object RegExp]",Ta="[object Set]",ma="[object String]",Aa="[object Symbol]",Oa="[object ArrayBuffer]",Sa="[object DataView]",wa="[object Float32Array]",ja="[object Float64Array]",Pa="[object Int8Array]",Ea="[object Int16Array]",La="[object Int32Array]",Ca="[object Uint8Array]",Ia="[object Uint8ClampedArray]",Da="[object Uint16Array]",Ma="[object Uint32Array]";function Fa(e,t,r){var n=e.constructor;switch(t){case Oa:return he(e);case va:case ha:return new n(+e);case Sa:return ca(e,r);case wa:case ja:case Pa:case Ea:case La:case Ca:case Ia:case Da:case Ma:return ya(e,r);case ba:return new n;case _a:case ma:return new n(e);case $a:return ga(e);case Ta:return new n;case Aa:return pa(e)}}function xa(e){return typeof e.constructor=="function"&&!se(e)?kt(Ge(e)):{}}var Ba="[object Map]";function Ha(e){return L(e)&&V(e)==Ba}var at=B&&B.isMap,Na=at?ue(at):Ha,Ra=Na,Ua="[object Set]";function Ga(e){return L(e)&&V(e)==Ua}var ot=B&&B.isSet,Ka=ot?ue(ot):Ga,za=Ka,qa=1,Ya=2,Va=4,it="[object Arguments]",Wa="[object Array]",Ja="[object Boolean]",Xa="[object Date]",Za="[object Error]",st="[object Function]",Qa="[object GeneratorFunction]",ka="[object Map]",eo="[object Number]",ut="[object Object]",to="[object RegExp]",ro="[object Set]",no="[object String]",ao="[object Symbol]",oo="[object WeakMap]",io="[object ArrayBuffer]",so="[object DataView]",uo="[object Float32Array]",fo="[object Float64Array]",lo="[object Int8Array]",co="[object Int16Array]",go="[object Int32Array]",po="[object Uint8Array]",yo="[object Uint8ClampedArray]",vo="[object Uint16Array]",ho="[object Uint32Array]",c={};c[it]=c[Wa]=c[io]=c[so]=c[Ja]=c[Xa]=c[uo]=c[fo]=c[lo]=c[co]=c[go]=c[ka]=c[eo]=c[ut]=c[to]=c[ro]=c[no]=c[ao]=c[po]=c[yo]=c[vo]=c[ho]=!0,c[Za]=c[st]=c[oo]=!1;function ee(e,t,r,n,i,a){var o,s=t&qa,u=t&Ya,l=t&Va;if(r&&(o=i?r(e,n,i,a):r(e)),o!==void 0)return o;if(!K(e))return e;var T=G(e);if(T){if(o=fa(e),!s)return er(e,o)}else{var y=V(e),p=y==st||y==Qa;if(X(e))return Gn(e,s);if(y==ut||y==it||p&&!i){if(o=u||p?{}:xa(e),!s)return u?Xn(e,Rn(o,e)):Vn(e,Nn(o,e))}else{if(!c[y])return i?e:{};o=Fa(e,y,s)}}a||(a=new j);var m=a.get(e);if(m)return m;a.set(e,o),za(e)?e.forEach(function(h){o.add(ee(h,t,r,h,e,a))}):Ra(e)&&e.forEach(function(h,b){o.set(b,ee(h,t,r,b,e,a))});var _=l?u?Zn:ge:u?ce:le,$=T?void 0:_(e);return rr($||e,function(h,b){$&&(b=h,h=e[b]),Pe(o,b,ee(h,t,r,b,e,a))}),o}var bo=1,_o=4;function $o(e){return ee(e,bo|_o)}var To="__lodash_hash_undefined__";function mo(e){return this.__data__.set(e,To),this}function Ao(e){return this.__data__.has(e)}function te(e){var t=-1,r=e==null?0:e.length;for(this.__data__=new M;++t<r;)this.add(e[t])}te.prototype.add=te.prototype.push=mo,te.prototype.has=Ao;function Oo(e,t){for(var r=-1,n=e==null?0:e.length;++r<n;)if(t(e[r],r,e))return!0;return!1}function So(e,t){return e.has(t)}var wo=1,jo=2;function ft(e,t,r,n,i,a){var o=r&wo,s=e.length,u=t.length;if(s!=u&&!(o&&u>s))return!1;var l=a.get(e),T=a.get(t);if(l&&T)return l==t&&T==e;var y=-1,p=!0,m=r&jo?new te:void 0;for(a.set(e,t),a.set(t,e);++y<s;){var _=e[y],$=t[y];if(n)var h=o?n($,_,y,t,e,a):n(_,$,y,e,t,a);if(h!==void 0){if(h)continue;p=!1;break}if(m){if(!Oo(t,function(b,P){if(!So(m,P)&&(_===b||i(_,b,r,n,a)))return m.push(P)})){p=!1;break}}else if(!(_===$||i(_,$,r,n,a))){p=!1;break}}return a.delete(e),a.delete(t),p}function Po(e){var t=-1,r=Array(e.size);return e.forEach(function(n,i){r[++t]=[i,n]}),r}function Eo(e){var t=-1,r=Array(e.size);return e.forEach(function(n){r[++t]=n}),r}var Lo=1,Co=2,Io="[object Boolean]",Do="[object Date]",Mo="[object Error]",Fo="[object Map]",xo="[object Number]",Bo="[object RegExp]",Ho="[object Set]",No="[object String]",Ro="[object Symbol]",Uo="[object ArrayBuffer]",Go="[object DataView]",lt=E?E.prototype:void 0,be=lt?lt.valueOf:void 0;function Ko(e,t,r,n,i,a,o){switch(r){case Go:if(e.byteLength!=t.byteLength||e.byteOffset!=t.byteOffset)return!1;e=e.buffer,t=t.buffer;case Uo:return!(e.byteLength!=t.byteLength||!a(new k(e),new k(t)));case Io:case Do:case xo:return ie(+e,+t);case Mo:return e.name==t.name&&e.message==t.message;case Bo:case No:return e==t+"";case Fo:var s=Po;case Ho:var u=n&Lo;if(s||(s=Eo),e.size!=t.size&&!u)return!1;var l=o.get(e);if(l)return l==t;n|=Co,o.set(e,t);var T=ft(s(e),s(t),n,i,a,o);return o.delete(e),T;case Ro:if(be)return be.call(e)==be.call(t)}return!1}var zo=1,qo=Object.prototype,Yo=qo.hasOwnProperty;function Vo(e,t,r,n,i,a){var o=r&zo,s=ge(e),u=s.length,l=ge(t),T=l.length;if(u!=T&&!o)return!1;for(var y=u;y--;){var p=s[y];if(!(o?p in t:Yo.call(t,p)))return!1}var m=a.get(e),_=a.get(t);if(m&&_)return m==t&&_==e;var $=!0;a.set(e,t),a.set(t,e);for(var h=o;++y<u;){p=s[y];var b=e[p],P=t[p];if(n)var ne=o?n(P,b,p,t,e,a):n(b,P,p,e,t,a);if(!(ne===void 0?b===P||i(b,P,r,n,a):ne)){$=!1;break}h||(h=p=="constructor")}if($&&!h){var H=e.constructor,N=t.constructor;H!=N&&"constructor"in e&&"constructor"in t&&!(typeof H=="function"&&H instanceof H&&typeof N=="function"&&N instanceof N)&&($=!1)}return a.delete(e),a.delete(t),$}var Wo=1,ct="[object Arguments]",dt="[object Array]",re="[object Object]",Jo=Object.prototype,gt=Jo.hasOwnProperty;function Xo(e,t,r,n,i,a){var o=G(e),s=G(t),u=o?dt:V(e),l=s?dt:V(t);u=u==ct?re:u,l=l==ct?re:l;var T=u==re,y=l==re,p=u==l;if(p&&X(e)){if(!X(t))return!1;o=!0,T=!1}if(p&&!T)return a||(a=new j),o||He(e)?ft(e,t,r,n,i,a):Ko(e,t,u,r,n,i,a);if(!(r&Wo)){var m=T&&gt.call(e,"__wrapped__"),_=y&&gt.call(t,"__wrapped__");if(m||_){var $=m?e.value():e,h=_?t.value():t;return a||(a=new j),i($,h,r,n,a)}}return p?(a||(a=new j),Vo(e,t,r,n,i,a)):!1}function pt(e,t,r,n,i){return e===t?!0:e==null||t==null||!L(e)&&!L(t)?e!==e&&t!==t:Xo(e,t,r,n,pt,i)}function _e(e,t){return pt(e,t)}var ai="",Zo=(e,t)=>{const r=e.__vccOpts||e;for(const[n,i]of t)r[n]=i;return r};const Qo=A.defineComponent({props:{animationData:{type:Object,default:()=>({})},animationLink:{type:String,default:""},loop:{type:[Boolean,Number],default:!0},autoPlay:{type:Boolean,default:!0},width:{type:[Number,String],default:"100%"},height:{type:[Number,String],default:"100%"},speed:{type:Number,default:1},delay:{type:Number,default:0},direction:{type:String,default:"forward"},pauseOnHover:{type:Boolean,default:!1},playOnHover:{type:Boolean,default:!1},backgroundColor:{type:String,default:"transparent"},pauseAnimation:{type:Boolean,default:!1},renderer:{type:String,default:"svg"},rendererSettings:{type:Object,default:()=>({})},assetsPath:{type:String,default:""}},emits:{onComplete:null,onLoopComplete:null,onEnterFrame:null,onSegmentStart:null,onAnimationLoaded:null},setup(e,{emit:t}){let r=A.ref(null);const n=A.ref("");let i=1;const a=f=>document.querySelector(`[data-id="${f}"]`)!==null,o=async f=>{let v=e.autoPlay;e.playOnHover&&(v=!1);let S={};if(_e(e.animationData,{})===!1&&(S=$o(e.animationData)),e.animationLink!="")try{S=await(await fetch(e.animationLink)).json()}catch(ht){console.error(ht);return}let x=e.loop;typeof x=="number"&&x>0&&(x=x-1),e.delay>0&&(v=!1);const W={container:f,renderer:e.renderer,loop:x,autoplay:v,animationData:S,assetsPath:e.assetsPath};_e(e.rendererSettings,{})===!1&&(W.rendererSettings=e.rendererSettings),r=$t.default.loadAnimation(W),setTimeout(()=>{v=e.autoPlay,e.playOnHover?r.pause():v?r.play():r.pause(),t("onAnimationLoaded")},e.delay),r.setSpeed(e.speed),e.direction==="reverse"&&r.setDirection(-1),e.direction==="normal"&&r.setDirection(1),(e.pauseAnimation||e.playOnHover)&&r.pause(),r.addEventListener("loopComplete",()=>{e.direction==="alternate"&&(r.stop(),i=i*-1,r.setDirection(i),r.play()),t("onLoopComplete")}),r.addEventListener("complete",()=>{t("onComplete")}),r.addEventListener("enterFrame",()=>{t("onEnterFrame")}),r.addEventListener("segmentStart",()=>{t("onSegmentStart")})},s=A.computed(()=>{let f=e.width,v=e.height;return typeof e.width=="number"&&(f=`${e.width}px`),typeof e.height=="number"&&(v=`${e.height}px`),{"--lottie-animation-container-width":f,"--lottie-animation-container-height":v,"--lottie-animation-container-background-color":e.backgroundColor}}),u=()=>{r&&e.pauseOnHover&&r.pause(),r&&e.playOnHover&&r.play()},l=()=>{r&&e.pauseOnHover&&r.play(),r&&e.playOnHover&&r.pause()};A.watch(()=>e.pauseAnimation,()=>{if((e.pauseOnHover||e.playOnHover)&&e.pauseAnimation){console.error("If you are using pauseAnimation prop for Vue3-Lottie, please remove the props pauseOnHover and playOnHover");return}r&&(e.pauseAnimation?r.pause():r.play())});const T=()=>{r&&r.play()},y=()=>{r&&r.pause()},p=()=>{r&&r.stop()},m=()=>{r&&r.destroy()},_=(f=1)=>{if(f<=0)throw new Error("Speed must be greater than 0");r&&r.setSpeed(f)},$=f=>{r&&(f==="forward"?r.setDirection(1):f==="reverse"&&r.setDirection(-1))},h=(f,v=!0)=>{r&&r.goToAndStop(f,v)},b=(f,v=!0)=>{r&&r.goToAndPlay(f,v)},P=(f,v=!1)=>{r&&r.playSegments(f,v)},ne=(f=!0)=>{r&&r.setSubframe(f)},H=(f=!0)=>{if(r)return r.getDuration(f)},N=(f,v=0)=>{r&&r.renderer.elements[v].updateDocumentData(f)},ri=f=>{for(var v="",S="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789",x=S.length,W=0;W<f;W++)v+=S.charAt(Math.floor(Math.random()*x));return v},ni=f=>{if(e.pauseOnHover&&e.playOnHover)throw new Error("You cannot set pauseOnHover and playOnHover for Vue3-Lottie at the same time.");if(e.animationLink===""&&_e(e.animationData,{}))throw new Error("You must provide either animationLink or animationData");const v=setInterval(()=>{if(a(f)){clearInterval(v);const S=document.querySelector(`[data-id="${f}" ]`);S&&o(S)}},0)};return A.onMounted(async()=>{n.value=ri(20),ni(n.value)}),{elementid:n,hoverEnded:l,hoverStarted:u,getCurrentStyle:s,play:T,pause:y,stop:p,destroy:m,setSpeed:_,setDirection:$,goToAndStop:h,goToAndPlay:b,playSegments:P,setSubFrame:ne,getDuration:H,updateDocumentData:N}}}),ko=["data-id"];function ei(e,t,r,n,i,a){return A.openBlock(),A.createElementBlock("div",{"data-id":e.elementid,class:"lottie-animation-container",style:A.normalizeStyle(e.getCurrentStyle),onMouseenter:t[0]||(t[0]=(...o)=>e.hoverStarted&&e.hoverStarted(...o)),onMouseleave:t[1]||(t[1]=(...o)=>e.hoverEnded&&e.hoverEnded(...o))},null,44,ko)}var yt=Zo(Qo,[["render",ei]]);function vt(e,t){const r=Object.assign({},{name:"Vue3Lottie"},t);e.component(`${r.name}`,yt)}const ti={version:"2.7.0",install:vt};g.Vue3Lottie=yt,g.default=ti,g.install=vt,Object.defineProperties(g,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

dist/vue3-lottie.vue.d.ts

@@ -17,2 +17,3 @@ import { PropType } from 'vue';
     pauseAnimation: boolean;
+    assetsPath: string;
 }
@@ -80,2 +81,6 @@ declare const _default: import("vue").DefineComponent<{
     };
+    assetsPath: {
+        type: PropType<string>;
+        default: string;
+    };
 }, {
@@ -165,2 +170,6 @@ elementid: import("vue").Ref<string>;
     };
+    assetsPath: {
+        type: PropType<string>;
+        default: string;
+    };
 }>> & {
@@ -187,4 +196,5 @@ onOnComplete?: ((...args: any[]) => any) | ((...args: unknown[]) => any);
     rendererSettings: any;
+    assetsPath: string;
     renderer: any;
 }>;
 export default _default;

package.json

 {
   "name": "vue3-lottie",
-  "version": "2.6.0",
+  "version": "2.7.0",
   "license": "MIT",
@@ -64,3 +64,3 @@ "author": "Sanjay Soundarajan <[e-mail]> (https://sanjaysoundarajan.dev)",
   },
-  "readme": "<p align=\"center\">\r\n  <a href=\"#\">\r\n    <img src=\"hi.gif\" width=\"150\" height=\"150\" />\r\n  </a>\r\n\r\n  <h3 align=\"center\">Vue 3 Lottie</h3>\r\n\r\n  <p align=\"center\">\r\n    Add Lottie animations to your Vue 3 application <br/>\r\n    <br/>\r\n    <a href=\"https://www.npmjs.com/package/vue3-lottie\">\r\n      <img src=\"https://img.shields.io/npm/v/vue3-lottie\" />\r\n    </a>\r\n    <a href=\"https://www.npmjs.com/package/vue3-lottie\">\r\n      <img src=\"https://img.shields.io/npm/dm/vue3-lottie\" />\r\n    </a>\r\n    <a href=\"https://github.com/megasanjay/vue3-lottie/stargazers\">\r\n      <img src=\"https://img.shields.io/github/stars/megasanjay/vue3-lottie.svg?style=flat-square\" />\r\n    </a>\r\n    <a href=\"https://github.com/megasanjay/vue3-lottie/blob/main/LICENSE\">\r\n      <img src=\"https://img.shields.io/npm/l/vue3-lottie\" >\r\n    </a>\r\n    <a href=\"https://github.com/megasanjay/vue3-lottie/issues\">\r\n      <img src=\"https://img.shields.io/github/issues/megasanjay/vue3-lottie\" />\r\n    </a>\r\n    <br/> \r\n    <br/>\r\n    <a href=\"https://vue3-lottie.vercel.app/\"><strong>Explore the documentation »</strong></a>\r\n  </p>\r\n</p>\r\n\r\n`vue3-lottie` was created to help developers add Lottie animations to their Vue 3 applications. In my search for a simple way to add Lottie animations to my Vue application I found a suprising lack of maintained solutions. `vue3-lottie` is a vue wrapper around the `lottie-web` library with a few additional features.\r\n\r\n# Demos\r\n\r\nView the live demos here: [https://vue3-lottie.vercel.app](https://vue3-lottie.vercel.app)\r\n\r\n# Upgrade to v2.x\r\n\r\nIf you are using version 1.x of `vue3-lottie` you should upgrade to version 2.x. You can do this by running the [Installation and Usage](#installation-and-usage) command below. This adds TS support for the component. There are some new imports so take a look at the [new documentation](https://vue3-lottie.vercel.app/guide.html#usage).\r\n\r\n# Installation and Usage\r\n\r\n## Vue 3\r\n\r\n- You can install `vue3-lottie` over `yarn` or `npm`. `lottie-web` is a dependency of `vue3-lottie` and should be automatically installed when you install `vue3-lottie`.\r\n\r\nIf you are using npm:\r\n\r\n```shell\r\nnpm install vue3-lottie@latest --save\r\n```\r\n\r\nIf you are using yarn:\r\n\r\n```shell\r\nyarn add vue3-lottie@latest\r\n```\r\n\r\n- Register the component in your Vue 3 application.\r\n\r\nThe most common use case is to register the component globally.\r\n\r\n```js\r\n// main.js\r\nimport { createApp } from 'vue'\r\nimport Vue3Lottie from 'vue3-lottie'\r\nimport 'vue3-lottie/dist/style.css'\r\n\r\ncreateApp(App).use(Vue3Lottie).mount('#app')\r\n```\r\n\r\nTo define global components for [Volar type-checking](https://github.com/johnsoncodehk/volar/tree/master/extensions/vscode-vue-language-features#usage) you will need to add:\r\n\r\n```ts\r\n// components.d.ts\r\ndeclare module '@vue/runtime-core' {\r\n  export interface GlobalComponents {\r\n    LottieAnimation: typeof import('vue3-lottie')['Vue3Lottie']\r\n  }\r\n}\r\nexport {}\r\n```\r\n\r\nIf needed rename component to use:\r\n\r\n```ts\r\napp.use(Vue3Lottie, { name: 'LottieAnimation' }) // use in template <LottieAnimation />\r\n```\r\n\r\n- `name` string (default: 'Vue3Lottie') - set custom component name\r\n\r\nAlternatively you can also import the component locally.\r\n\r\n```js\r\nimport { Vue3Lottie } from 'vue3-lottie'\r\nimport 'vue3-lottie/dist/style.css'\r\n\r\nexport default {\r\n  components: {\r\n    Vue3Lottie,\r\n  },\r\n}\r\n```\r\n\r\nYou can then use the component in your template\r\n\r\n```vue\r\n<template>\r\n  <Vue3Lottie :animationData=\"AstronautJSON\" :height=\"200\" :width=\"200\" />\r\n</template>\r\n\r\n<script>\r\nimport { Vue3Lottie } from 'vue3-lottie'\r\nimport 'vue3-lottie/dist/style.css'\r\n\r\nimport AstronautJSON from './astronaut.json'\r\n\r\nexport default {\r\n  components: {\r\n    Vue3Lottie,\r\n  },\r\n  data() {\r\n    return {\r\n      AstronautJSON,\r\n    }\r\n  },\r\n}\r\n</script>\r\n```\r\n\r\n## Nuxt 3\r\n\r\nThis is still experimental. Will be updated soon.\r\n\r\n- You can install `vue3-lottie` over `yarn` or `npm`. `lottie-web` is a dependency of `vue3-lottie` and should be automatically installed when you install `vue3-lottie`.\r\n\r\nIf you are using npm:\r\n\r\n```shell\r\nnpm install vue3-lottie@latest --save\r\n```\r\n\r\nIf you are using yarn:\r\n\r\n```shell\r\nyarn add vue3-lottie@latest\r\n```\r\n\r\n- Create a folder called **`plugins`** at the root of your project.\r\n- Create a file named **`Vue3Lottie.client.ts`** inside the _plugins_ directory.\r\n- Add the following code to the **`Vue3Lottie.client.ts`** file.\r\n\r\n```ts\r\nimport Vue3Lottie from 'vue3-lottie'\r\n\r\nexport default defineNuxtPlugin((nuxtApp) => {\r\n  nuxtApp.vueApp.use(Vue3Lottie)\r\n})\r\n```\r\n\r\nThis should register as a global component that you can call anywhere in your app under the <Vue3Lottie> tag.\r\n\r\nI would recommend using a `<client-only>` parent tag to ensure that the animation only loads in on the client side.\r\n\r\n```vue\r\n<client-only>\r\n  <Vue3Lottie\r\n    animationLink=\"https://assets10.lottiefiles.com/packages/lf20_soCRuE.json\"\r\n    :height=\"200\"\r\n    :width=\"200\"\r\n  />\r\n</client-only>\r\n```\r\n\r\n- Import the css file required by the component into your **`app.vue`** file.\r\n\r\n```js\r\nimport 'vue3-lottie/dist/style.css'\r\n```\r\n\r\n# Props and options\r\n\r\nMore detailed explanations are provided in the [documentation](https://vue3-lottie.vercel.app/guide.html).\r\n\r\n| Prop             | Type              | Default Value | Description                                                                              |\r\n| ---------------- | ----------------- | ------------- | ---------------------------------------------------------------------------------------- |\r\n| animationData    | Object            | {}            | The lottie animation data provided as a JSON object                                      |\r\n| animationLink    | String            | ''            | A URL link to the Lottie animation data (eg: `Lottie Animation URL` on lottiefiles.com)  |\r\n| width            | Number or String  | \"100%\"        | Width of the lottie animation container (Numbers correspond to pixel values)             |\r\n| height           | Number or String  | \"100%\"        | Height of the lottie animation container (Numbers correspond to pixel values)            |\r\n| speed            | Number            | \"1\"           | Speed of the lottie animation                                                            |\r\n| direction        | String            | \"forward\"     | Animation play direction                                                                 |\r\n| loop             | Number or Boolean | true          | The number of instances that the lottie animation should run (true is infinite)          |\r\n| autoPlay         | Boolean           | true          | Start animation on component load                                                        |\r\n| delay            | Number            | 0             | Delay the animation play state by some milliseconds                                      |\r\n| pauseAnimation   | Boolean           | false         | Prop to pass reactive variables so that you can control animation pause and play         |\r\n| pauseOnHover     | Boolean           | false         | Whether to pause the animation on hover                                                  |\r\n| playOnHover      | Boolean           | false         | Whether to play the animation when you hover                                             |\r\n| backgroundColor  | String            | transparent   | Background color of the container                                                        |\r\n| renderer         | String            | \"svg\"         | Set the renderer                                                                         |\r\n| rendererSettings | Object            | {}            | Options for if you want to use an existing canvas to draw (can be ignored on most cases) |\r\n\r\n# Events\r\n\r\nA few events are emitted from the component. Look at the [Demos](#Demos) for examples.\r\n\r\n- onComplete\r\n  - If your animation has a finite amount of loops you can use this event to know when the animation has completed.\r\n- onLoopComplete\r\n  - If your animation has a finite amount of loops you can use this event to know when the animation has completed a loop.\r\n- onEnterFrame\r\n  - This event is fired every frame of the animation. There will be 60 events fired per second if your lottie animation runs at 60fps.\r\n- onSegmentStart\r\n  - This event is fired when the animation enters a segment.\r\n- onAnimationLoaded\r\n  - This event is fired when the animation has loaded. This should let you know when you can start referencing the methods for the component.\r\n\r\n# Methods\r\n\r\nYou can control the animation with the following methods. These methods can be called by assigning a `ref` value to the `vue3-lottie` component. Look at the [Demos](#Demos) for examples.\r\n\r\n- play\r\n  - Plays the animation\r\n- pause\r\n  - Pauses the animation\r\n- stop\r\n  - Stops the animation. This will also reset the animation to the first frame. Look at the demo for some examples.\r\n- destroy\r\n  - You can call this method to destroy the animation. It will remove the animation from the DOM.\r\n- setSpeed(speed)\r\n  - You can call this method to change the speed of your animation.\r\n- setDirection(direction)\r\n  - You can call this method to change the direction of your animation.\r\n- getDuration(inFrames)\r\n  - You can call this method to get the duration of your animation.\r\n- goToAndStop(frameNumber, isFrames)\r\n  - You can call this method to go to a specific frame of your animation. The animation will be stopped at the end of this call.\r\n- goToAndPlay(frameNumber, isFrames)\r\n  - You can call this method to go to a specific frame of your animation. The animation will be played from this frame.\r\n- playSegments(segments, forceFlag)\r\n  - You can call this method to play a specific segment of your animation.\r\n- setSubFrame(subFrame)\r\n  - You can call this method to set the subframe value.\r\n- updateDocumentData(documentData, index)\r\n  - This method updates text on text layers. Refer to the [official docs](https://github.com/airbnb/lottie-web/wiki/TextLayer.updateDocumentData) for how to use this method.\r\n\r\n# Credits\r\n\r\nA big thank you goes to [@reslear](https://github.com/reslear) for adding Typescript support to this library. Go check out his profile and give him a follow!\r\n\r\n- [@DamianGlowala](https://github.com/DamianGlowala) - PR [#29](https://github.com/megasanjay/vue3-lottie/pull/29) - Fix `watch` function\r\n- [@Doyeon Eum](https://lottiefiles.com/user/283677) - For the hero [image](https://lottiefiles.com/20574-mongryong-hi) in this repo.\r\n- [@Tafel](https://github.com/tafelnl) - PR[#296](https://github.com/megasanjay/vue3-lottie/pull/296) - Update lodash to the tree-shakeable versions\r\n\r\n![forthebadge](https://forthebadge.com/images/badges/made-with-vue.svg) ![forthebadge](https://forthebadge.com/images/badges/built-with-love.svg)\r\n"
+  "readme": "<p align=\"center\">\r\n  <a href=\"#\">\r\n    <img src=\"hi.gif\" width=\"150\" height=\"150\" />\r\n  </a>\r\n\r\n  <h3 align=\"center\">Vue 3 Lottie</h3>\r\n\r\n  <p align=\"center\">\r\n    Add Lottie animations to your Vue 3 application <br/>\r\n    <br/>\r\n    <a href=\"https://www.npmjs.com/package/vue3-lottie\">\r\n      <img src=\"https://img.shields.io/npm/v/vue3-lottie\" />\r\n    </a>\r\n    <a href=\"https://www.npmjs.com/package/vue3-lottie\">\r\n      <img src=\"https://img.shields.io/npm/dm/vue3-lottie\" />\r\n    </a>\r\n    <a href=\"https://github.com/megasanjay/vue3-lottie/stargazers\">\r\n      <img src=\"https://img.shields.io/github/stars/megasanjay/vue3-lottie.svg?style=flat-square\" />\r\n    </a>\r\n    <a href=\"https://github.com/megasanjay/vue3-lottie/blob/main/LICENSE\">\r\n      <img src=\"https://img.shields.io/npm/l/vue3-lottie\" >\r\n    </a>\r\n    <a href=\"https://github.com/megasanjay/vue3-lottie/issues\">\r\n      <img src=\"https://img.shields.io/github/issues/megasanjay/vue3-lottie\" />\r\n    </a>\r\n    <br/> \r\n    <br/>\r\n    <a href=\"https://vue3-lottie.vercel.app/\"><strong>Explore the documentation »</strong></a>\r\n  </p>\r\n</p>\r\n\r\n`vue3-lottie` was created to help developers add Lottie animations to their Vue 3 applications. In my search for a simple way to add Lottie animations to my Vue application I found a suprising lack of maintained solutions. `vue3-lottie` is a vue wrapper around the `lottie-web` library with a few additional features.\r\n\r\n# Demos\r\n\r\nView the live demos here: [https://vue3-lottie.vercel.app](https://vue3-lottie.vercel.app)\r\n\r\n# Upgrade to v2.x\r\n\r\nIf you are using version 1.x of `vue3-lottie` you should upgrade to version 2.x. You can do this by running the [Installation and Usage](#installation-and-usage) command below. This adds TS support for the component. There are some new imports so take a look at the [new documentation](https://vue3-lottie.vercel.app/guide.html#usage).\r\n\r\n# Installation and Usage\r\n\r\n## Vue 3\r\n\r\n- You can install `vue3-lottie` over `yarn` or `npm`. `lottie-web` is a dependency of `vue3-lottie` and should be automatically installed when you install `vue3-lottie`.\r\n\r\nIf you are using npm:\r\n\r\n```shell\r\nnpm install vue3-lottie@latest --save\r\n```\r\n\r\nIf you are using yarn:\r\n\r\n```shell\r\nyarn add vue3-lottie@latest\r\n```\r\n\r\n- Register the component in your Vue 3 application.\r\n\r\nThe most common use case is to register the component globally.\r\n\r\n```js\r\n// main.js\r\nimport { createApp } from 'vue'\r\nimport Vue3Lottie from 'vue3-lottie'\r\nimport 'vue3-lottie/dist/style.css'\r\n\r\ncreateApp(App).use(Vue3Lottie).mount('#app')\r\n```\r\n\r\nIf you get an error with TS, try `use(Vue3Lottie, { name: \"Vue3Lottie\" })`\r\n\r\nTo define global components for [Volar type-checking](https://github.com/johnsoncodehk/volar/tree/master/extensions/vscode-vue-language-features#usage) you will need to add:\r\n\r\n```ts\r\n// components.d.ts\r\ndeclare module '@vue/runtime-core' {\r\n  export interface GlobalComponents {\r\n    LottieAnimation: typeof import('vue3-lottie')['Vue3Lottie']\r\n  }\r\n}\r\nexport {}\r\n```\r\n\r\nIf needed rename component to use:\r\n\r\n```ts\r\napp.use(Vue3Lottie, { name: 'LottieAnimation' }) // use in template <LottieAnimation />\r\n```\r\n\r\n- `name` string (default: 'Vue3Lottie') - set custom component name\r\n\r\nAlternatively you can also import the component locally.\r\n\r\n```js\r\nimport { Vue3Lottie } from 'vue3-lottie'\r\nimport 'vue3-lottie/dist/style.css'\r\n\r\nexport default {\r\n  components: {\r\n    Vue3Lottie,\r\n  },\r\n}\r\n```\r\n\r\nYou can then use the component in your template\r\n\r\n```vue\r\n<template>\r\n  <Vue3Lottie :animationData=\"AstronautJSON\" :height=\"200\" :width=\"200\" />\r\n</template>\r\n\r\n<script>\r\nimport { Vue3Lottie } from 'vue3-lottie'\r\nimport 'vue3-lottie/dist/style.css'\r\n\r\nimport AstronautJSON from './astronaut.json'\r\n\r\nexport default {\r\n  components: {\r\n    Vue3Lottie,\r\n  },\r\n  data() {\r\n    return {\r\n      AstronautJSON,\r\n    }\r\n  },\r\n}\r\n</script>\r\n```\r\n\r\n## Nuxt 3\r\n\r\nThis is still experimental. Will be updated soon.\r\n\r\n- You can install `vue3-lottie` over `yarn` or `npm`. `lottie-web` is a dependency of `vue3-lottie` and should be automatically installed when you install `vue3-lottie`.\r\n\r\nIf you are using npm:\r\n\r\n```shell\r\nnpm install vue3-lottie@latest --save\r\n```\r\n\r\nIf you are using yarn:\r\n\r\n```shell\r\nyarn add vue3-lottie@latest\r\n```\r\n\r\n- Create a folder called **`plugins`** at the root of your project.\r\n- Create a file named **`Vue3Lottie.client.ts`** inside the _plugins_ directory.\r\n- Add the following code to the **`Vue3Lottie.client.ts`** file.\r\n\r\n```ts\r\nimport Vue3Lottie from 'vue3-lottie'\r\n\r\nexport default defineNuxtPlugin((nuxtApp) => {\r\n  nuxtApp.vueApp.use(Vue3Lottie)\r\n})\r\n```\r\n\r\nIf you get an error with TS, try `use(Vue3Lottie, { name: \"Vue3Lottie\" })`\r\n\r\nThis should register as a global component that you can call anywhere in your app under the <Vue3Lottie> tag.\r\n\r\nI would recommend using a `<client-only>` parent tag to ensure that the animation only loads in on the client side.\r\n\r\n```vue\r\n<client-only>\r\n  <Vue3Lottie\r\n    animationLink=\"https://assets10.lottiefiles.com/packages/lf20_soCRuE.json\"\r\n    :height=\"200\"\r\n    :width=\"200\"\r\n  />\r\n</client-only>\r\n```\r\n\r\n- Import the css file required by the component into your **`app.vue`** file.\r\n\r\n```js\r\nimport 'vue3-lottie/dist/style.css'\r\n```\r\n\r\n# Props and options\r\n\r\nMore detailed explanations are provided in the [documentation](https://vue3-lottie.vercel.app/guide.html).\r\n\r\n| Prop             | Type              | Default Value | Description                                                                              |\r\n| ---------------- | ----------------- | ------------- | ---------------------------------------------------------------------------------------- |\r\n| animationData    | Object            | {}            | The lottie animation data provided as a JSON object                                      |\r\n| animationLink    | String            | ''            | A URL link to the Lottie animation data (eg: `Lottie Animation URL` on lottiefiles.com)  |\r\n| width            | Number or String  | \"100%\"        | Width of the lottie animation container (Numbers correspond to pixel values)             |\r\n| height           | Number or String  | \"100%\"        | Height of the lottie animation container (Numbers correspond to pixel values)            |\r\n| speed            | Number            | \"1\"           | Speed of the lottie animation                                                            |\r\n| direction        | String            | \"forward\"     | Animation play direction                                                                 |\r\n| loop             | Number or Boolean | true          | The number of instances that the lottie animation should run (true is infinite)          |\r\n| autoPlay         | Boolean           | true          | Start animation on component load                                                        |\r\n| delay            | Number            | 0             | Delay the animation play state by some milliseconds                                      |\r\n| pauseAnimation   | Boolean           | false         | Prop to pass reactive variables so that you can control animation pause and play         |\r\n| pauseOnHover     | Boolean           | false         | Whether to pause the animation on hover                                                  |\r\n| playOnHover      | Boolean           | false         | Whether to play the animation when you hover                                             |\r\n| backgroundColor  | String            | transparent   | Background color of the container                                                        |\r\n| assetsPath       | String            | \"\"            | URL to the image asset you need to use in your Lottie animation                          |\r\n| renderer         | String            | \"svg\"         | Set the renderer                                                                         |\r\n| rendererSettings | Object            | {}            | Options for if you want to use an existing canvas to draw (can be ignored on most cases) |\r\n\r\n# Events\r\n\r\nA few events are emitted from the component. Look at the [Demos](#Demos) for examples.\r\n\r\n- onComplete\r\n  - If your animation has a finite amount of loops you can use this event to know when the animation has completed.\r\n- onLoopComplete\r\n  - If your animation has a finite amount of loops you can use this event to know when the animation has completed a loop.\r\n- onEnterFrame\r\n  - This event is fired every frame of the animation. There will be 60 events fired per second if your lottie animation runs at 60fps.\r\n- onSegmentStart\r\n  - This event is fired when the animation enters a segment.\r\n- onAnimationLoaded\r\n  - This event is fired when the animation has loaded. This should let you know when you can start referencing the methods for the component.\r\n\r\n# Methods\r\n\r\nYou can control the animation with the following methods. These methods can be called by assigning a `ref` value to the `vue3-lottie` component. Look at the [Demos](#Demos) for examples.\r\n\r\n- play\r\n  - Plays the animation\r\n- pause\r\n  - Pauses the animation\r\n- stop\r\n  - Stops the animation. This will also reset the animation to the first frame. Look at the demo for some examples.\r\n- destroy\r\n  - You can call this method to destroy the animation. It will remove the animation from the DOM.\r\n- setSpeed(speed)\r\n  - You can call this method to change the speed of your animation.\r\n- setDirection(direction)\r\n  - You can call this method to change the direction of your animation.\r\n- getDuration(inFrames)\r\n  - You can call this method to get the duration of your animation.\r\n- goToAndStop(frameNumber, isFrames)\r\n  - You can call this method to go to a specific frame of your animation. The animation will be stopped at the end of this call.\r\n- goToAndPlay(frameNumber, isFrames)\r\n  - You can call this method to go to a specific frame of your animation. The animation will be played from this frame.\r\n- playSegments(segments, forceFlag)\r\n  - You can call this method to play a specific segment of your animation.\r\n- setSubFrame(subFrame)\r\n  - You can call this method to set the subframe value.\r\n- updateDocumentData(documentData, index)\r\n  - This method updates text on text layers. Refer to the [official docs](https://github.com/airbnb/lottie-web/wiki/TextLayer.updateDocumentData) for how to use this method.\r\n\r\n# Credits\r\n\r\nA big thank you goes to [@reslear](https://github.com/reslear) for adding Typescript support to this library. Go check out his profile and give him a follow!\r\n\r\n- [@DamianGlowala](https://github.com/DamianGlowala) - PR [#29](https://github.com/megasanjay/vue3-lottie/pull/29) - Fix `watch` function\r\n- [@Doyeon Eum](https://lottiefiles.com/user/283677) - For the hero [image](https://lottiefiles.com/20574-mongryong-hi) in this repo.\r\n- [@Tafel](https://github.com/tafelnl) - PR[#296](https://github.com/megasanjay/vue3-lottie/pull/296) - Update lodash to the tree-shakeable versions\r\n- [@TartanLeGrand](https://github.com/TartanLeGrand) - PR[#307](https://github.com/megasanjay/vue3-lottie/pull/307) - Add the `assetsPath` prop to the component\r\n\r\n![forthebadge](https://forthebadge.com/images/badges/made-with-vue.svg) ![forthebadge](https://forthebadge.com/images/badges/built-with-love.svg)\r\n"
 }

README.md

@@ -73,2 +73,4 @@ <p align="center">
 
+If you get an error with TS, try `use(Vue3Lottie, { name: "Vue3Lottie" })`
+
 To define global components for [Volar type-checking](https://github.com/johnsoncodehk/volar/tree/master/extensions/vscode-vue-language-features#usage) you will need to add:
@@ -163,2 +165,4 @@
 
+If you get an error with TS, try `use(Vue3Lottie, { name: "Vue3Lottie" })`
+
 This should register as a global component that you can call anywhere in your app under the <Vue3Lottie> tag.
@@ -203,2 +207,3 @@
 | backgroundColor  | String            | transparent   | Background color of the container                                                        |
+| assetsPath       | String            | ""            | URL to the image asset you need to use in your Lottie animation                          |
 | renderer         | String            | "svg"         | Set the renderer                                                                         |
@@ -258,3 +263,4 @@ | rendererSettings | Object            | {}            | Options for if you want to use an existing canvas to draw (can be ignored on most cases) |
 - [@Tafel](https://github.com/tafelnl) - PR[#296](https://github.com/megasanjay/vue3-lottie/pull/296) - Update lodash to the tree-shakeable versions
+- [@TartanLeGrand](https://github.com/TartanLeGrand) - PR[#307](https://github.com/megasanjay/vue3-lottie/pull/307) - Add the `assetsPath` prop to the component
 
 ![forthebadge](https://forthebadge.com/images/badges/made-with-vue.svg) ![forthebadge](https://forthebadge.com/images/badges/built-with-love.svg)

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

101593

increased by1.32%

Lines of code

1686

increased by0.9%

Number of lines in readme file

263

increased by2.33%

No dependency changes