@neoconfetti/react - npm Package Compare versions

Comparing version 0.0.1 to 0.1.0

dist/index.js

 import { useRef, useEffect, createElement } from 'react';
 
 // ../core/dist/index.js
-var style_module_default = '@keyframes Bc2PgW_ya{to{translate:0 var(--sh)}}@keyframes Bc2PgW_xa{to{translate:var(--xlp)0}}@keyframes Bc2PgW_r{50%{rotate:var(--hr)180deg}to{rotate:var(--r)360deg}}.Bc2PgW_c{z-index:1200;width:0;height:0;position:relative;overflow:visible}.Bc2PgW_p{animation:xa var(--dc)forwards cubic-bezier(var(--x1),var(--x2),var(--x3),var(--x4));animation-name:Bc2PgW_xa}.Bc2PgW_p>div{animation:ya var(--dc)forwards cubic-bezier(var(--y1),var(--y2),var(--y3),var(--y4));width:var(--w);height:var(--h);animation-name:Bc2PgW_ya;position:absolute;top:0;left:0}.Bc2PgW_p>div:before{content:"";background-color:var(--bgc);animation:r var(--rd)infinite linear;border-radius:var(--br);width:100%;height:100%;animation-name:Bc2PgW_r;display:block}';
-var c = "Bc2PgW_c";
-var p = "Bc2PgW_p";
+var style_module_default = '@keyframes mz3PUW_ya{to{translate:0 var(--sh)}}@keyframes mz3PUW_xa{to{translate:var(--xlp)0}}@keyframes mz3PUW_r{50%{rotate:var(--hr)180deg}to{rotate:var(--r)360deg}}.mz3PUW_c{z-index:1200;width:0;height:0;position:relative;overflow:visible}.mz3PUW_p{animation:xa var(--dc)forwards cubic-bezier(var(--x1),var(--x2),var(--x3),var(--x4));animation-name:mz3PUW_xa}.mz3PUW_p>div{animation:ya var(--dc)forwards cubic-bezier(var(--y1),var(--y2),var(--y3),var(--y4));width:var(--w);height:var(--h);animation-name:mz3PUW_ya;position:absolute;top:0;left:0}.mz3PUW_p>div:before{content:"";background-color:var(--bgc);animation:r var(--rd)infinite linear;border-radius:var(--br);width:100%;height:100%;animation-name:mz3PUW_r;display:block}';
+var c = "mz3PUW_c";
+var p = "mz3PUW_p";
 var DEFAULT_COLORS = ["#FFC700", "#FF0000", "#2E3191", "#41BBC7"];
@@ -8,0 +8,0 @@ var DEFAULT_DURATION = 3500;

dist/min/index.js

@@ -1,1 +0,1 @@
-import{useRef as t,useEffect as e,createElement as r}from"react";var a='@keyframes Bc2PgW_ya{to{translate:0 var(--sh)}}@keyframes Bc2PgW_xa{to{translate:var(--xlp)0}}@keyframes Bc2PgW_r{50%{rotate:var(--hr)180deg}to{rotate:var(--r)360deg}}.Bc2PgW_c{z-index:1200;width:0;height:0;position:relative;overflow:visible}.Bc2PgW_p{animation:xa var(--dc)forwards cubic-bezier(var(--x1),var(--x2),var(--x3),var(--x4));animation-name:Bc2PgW_xa}.Bc2PgW_p>div{animation:ya var(--dc)forwards cubic-bezier(var(--y1),var(--y2),var(--y3),var(--y4));width:var(--w);height:var(--h);animation-name:Bc2PgW_ya;position:absolute;top:0;left:0}.Bc2PgW_p>div:before{content:"";background-color:var(--bgc);animation:r var(--rd)infinite linear;border-radius:var(--br);width:100%;height:100%;animation-name:Bc2PgW_r;display:block}',o="Bc2PgW_c",n="Bc2PgW_p",i=["#FFC700","#FF0000","#2E3191","#41BBC7"],c=3500,s=.5,l=150,d="mix",p=12,u="",y=!0,f=800,g=1600;function m(t,e={}){let{colors:r=i,duration:m=c,force:F=s,particleCount:O=l,particleShape:j=d,particleSize:E=p,particleClass:$=u,destroyAfterDone:q=y,stageHeight:D=f,stageWidth:J=g}=e;!function(t){if(document.querySelector("style[data-neoconfetti]"))return;const e=w("style");e.dataset.neoconfetti="",e.textContent=t,C(document.head,e)}(a),t.classList.add(o),t.style.setProperty("--sh",D+"px");let I=[],G=[];const K=()=>_(W()*(A-1)),Q=(t,e)=>"circles"===t||H(e);function R(t,e){const r=K(),a=Q(j,r),o=(e,r)=>t.style.setProperty(e,r+"");o("--xlp",T(B(N(e,90)-180),0,180,-J/2,J/2)+"px"),o("--dc",m-_(1e3*W())+"ms");const n=W()<x?M(W()*b,2):0;o("--x1",n),o("--x2",-1*n),o("--x3",n),o("--x4",M(B(T(B(N(e,90)-180),0,180,-1,1)),4)),o("--y1",M(W()*P,4)),o("--y2",M(W()*F*(k()?1:-1),4)),o("--y3",P),o("--y4",M(S(T(B(e-180),0,180,F,-F),0),4)),o("--w",(a?E:_(4*W())+E/2)+"px"),o("--h",(a?E:_(2*W())+E)+"px");const i=r.toString(2).padStart(3,"0").split("");o("--hr",i.map((t=>+t/2+"")).join(" ")),o("--r",i.join(" ")),o("--rd",M(W()*(v-h)+h)+"ms"),o("--br",a?"50%":0)}let U;function V(){t.innerHTML="",clearTimeout(U),I=L(O,r),G=function(t,e=[],r){const a=[];for(const{color:o}of e){const e=w("div");e.className=`${n} ${r}`,e.style.setProperty("--bgc",o);const i=w("div");C(e,i),C(t,e),a.push(e)}return a}(t,I,$);for(const[t,e]of z(G))R(e,I[+t].degree);U=setTimeout((()=>{q&&(t.innerHTML="")}),m)}return V(),{update(e){const a=e.particleCount??l,o=e.particleShape??d,h=e.particleSize??p,v=e.particleClass??u,x=e.colors??i,b=e.stageHeight??f,P=e.duration??c,B=e.force??s,W=e.stageWidth??g,_=e.destroyAfterDone??y;I=L(a,x);let S=!1;if(a===O){G=Array.from(t.querySelectorAll(`.${n}`));for(const[t,{color:e}]of z(I)){const a=G[+t];JSON.stringify(r)!==JSON.stringify(x)&&a.style.setProperty("--bgc",e),o!==j&&a.style.setProperty("--br",Q(o,K())?"50%":"0"),v!==$&&($&&a.classList.remove($),v&&a.classList.add(v))}}else S=!0;q&&!_&&clearTimeout(U),t.style.setProperty("--sh",b+"px"),m=P,r=x,F=B,O=a,j=o,E=h,$=v,q=_,D=b,J=W,S&&V()},destroy(){t.innerHTML="",clearTimeout(U)}}}var h=200,v=800,x=.1,b=.3,P=.5,B=Math.abs,W=Math.random,_=Math.round,S=Math.max,w=t=>document.createElement(t),C=(t,e)=>t.appendChild(e),L=(t,e)=>Array.from({length:t},((r,a)=>({color:e[a%e.length],degree:360*a/t}))),M=(t,e=2)=>_((t+Number.EPSILON)*10**e)/10**e,T=(t,e,r,a,o)=>(t-e)*(o-a)/(r-e)+a,N=(t,e)=>t+e>360?t+e-360:t+e,k=()=>W()>.5,z=Object.entries,A=6,H=t=>1!==t&&k();function F({class:a,...o}){const n=t(null),i=t();return e((()=>{if("undefined"!=typeof window&&n.current){if(i.current)return i.current.update(o),i.current.destroy;i.current=m(n.current,o)}}),[o]),r("div",{ref:n,className:a})}export{F as Confetti};
+import{useRef as t,useEffect as e,createElement as r}from"react";var a='@keyframes mz3PUW_ya{to{translate:0 var(--sh)}}@keyframes mz3PUW_xa{to{translate:var(--xlp)0}}@keyframes mz3PUW_r{50%{rotate:var(--hr)180deg}to{rotate:var(--r)360deg}}.mz3PUW_c{z-index:1200;width:0;height:0;position:relative;overflow:visible}.mz3PUW_p{animation:xa var(--dc)forwards cubic-bezier(var(--x1),var(--x2),var(--x3),var(--x4));animation-name:mz3PUW_xa}.mz3PUW_p>div{animation:ya var(--dc)forwards cubic-bezier(var(--y1),var(--y2),var(--y3),var(--y4));width:var(--w);height:var(--h);animation-name:mz3PUW_ya;position:absolute;top:0;left:0}.mz3PUW_p>div:before{content:"";background-color:var(--bgc);animation:r var(--rd)infinite linear;border-radius:var(--br);width:100%;height:100%;animation-name:mz3PUW_r;display:block}',o="mz3PUW_c",n="mz3PUW_p",i=["#FFC700","#FF0000","#2E3191","#41BBC7"],s=3500,c=.5,l=150,d="mix",m=12,p="",u=!0,y=800,f=1600;function h(t,e={}){let{colors:r=i,duration:h=s,force:F=c,particleCount:O=l,particleShape:j=d,particleSize:E=m,particleClass:$=p,destroyAfterDone:q=u,stageHeight:B=y,stageWidth:D=f}=e;!function(t){if(document.querySelector("style[data-neoconfetti]"))return;const e=S("style");e.dataset.neoconfetti="",e.textContent=t,w(document.head,e)}(a),t.classList.add(o),t.style.setProperty("--sh",B+"px");let J=[],I=[];const G=()=>U(W()*(A-1)),K=(t,e)=>"circles"===t||H(e);function Q(t,e){const r=G(),a=K(j,r),o=(e,r)=>t.style.setProperty(e,r+"");o("--xlp",M(z(T(e,90)-180),0,180,-D/2,D/2)+"px"),o("--dc",h-U(1e3*W())+"ms");const n=W()<g?L(W()*b,2):0;o("--x1",n),o("--x2",-1*n),o("--x3",n),o("--x4",L(z(M(z(T(e,90)-180),0,180,-1,1)),4)),o("--y1",L(W()*P,4)),o("--y2",L(W()*F*(N()?1:-1),4)),o("--y3",P),o("--y4",L(_(M(z(e-180),0,180,F,-F),0),4)),o("--w",(a?E:U(4*W())+E/2)+"px"),o("--h",(a?E:U(2*W())+E)+"px");const i=r.toString(2).padStart(3,"0").split("");o("--hr",i.map((t=>+t/2+"")).join(" ")),o("--r",i.join(" ")),o("--rd",L(W()*(x-v)+v)+"ms"),o("--br",a?"50%":0)}let R;function V(){t.innerHTML="",clearTimeout(R),J=C(O,r),I=function(t,e=[],r){const a=[];for(const{color:o}of e){const e=S("div");e.className=`${n} ${r}`,e.style.setProperty("--bgc",o);const i=S("div");w(e,i),w(t,e),a.push(e)}return a}(t,J,$);for(const[t,e]of k(I))Q(e,J[+t].degree);R=setTimeout((()=>{q&&(t.innerHTML="")}),h)}return V(),{update(e){const a=e.particleCount??l,o=e.particleShape??d,v=e.particleSize??m,x=e.particleClass??p,g=e.colors??i,b=e.stageHeight??y,P=e.duration??s,z=e.force??c,W=e.stageWidth??f,U=e.destroyAfterDone??u;J=C(a,g);let _=!1;if(a===O){I=Array.from(t.querySelectorAll(`.${n}`));for(const[t,{color:e}]of k(J)){const a=I[+t];JSON.stringify(r)!==JSON.stringify(g)&&a.style.setProperty("--bgc",e),o!==j&&a.style.setProperty("--br",K(o,G())?"50%":"0"),x!==$&&($&&a.classList.remove($),x&&a.classList.add(x))}}else _=!0;q&&!U&&clearTimeout(R),t.style.setProperty("--sh",b+"px"),h=P,r=g,F=z,O=a,j=o,E=v,$=x,q=U,B=b,D=W,_&&V()},destroy(){t.innerHTML="",clearTimeout(R)}}}var v=200,x=800,g=.1,b=.3,P=.5,z=Math.abs,W=Math.random,U=Math.round,_=Math.max,S=t=>document.createElement(t),w=(t,e)=>t.appendChild(e),C=(t,e)=>Array.from({length:t},((r,a)=>({color:e[a%e.length],degree:360*a/t}))),L=(t,e=2)=>U((t+Number.EPSILON)*10**e)/10**e,M=(t,e,r,a,o)=>(t-e)*(o-a)/(r-e)+a,T=(t,e)=>t+e>360?t+e-360:t+e,N=()=>W()>.5,k=Object.entries,A=6,H=t=>1!==t&&N();function F({class:a,...o}){const n=t(null),i=t();return e((()=>{if("undefined"!=typeof window&&n.current){if(i.current)return i.current.update(o),i.current.destroy;i.current=h(n.current,o)}}),[o]),r("div",{ref:n,className:a})}export{F as Confetti};

package.json

 {
   "name": "@neoconfetti/react",
-  "version": "0.0.1",
+  "version": "0.1.0",
   "description": "Confetti explosion in React 🎉🎊",
@@ -50,3 +50,3 @@ "author": "Puru Vijay",
   "devDependencies": {
-    "@neoconfetti/core": "2.1.0"
+    "@neoconfetti/core": "2.2.0"
   },
@@ -53,0 +53,0 @@ "scripts": {

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

No metric changes

No dependency changes