@neoconfetti/react - npm Package Compare versions

Comparing version 0.2.0 to 1.0.0

dist/index.js

@@ -1,2 +0,2 @@
-import { useRef, useEffect, createElement } from 'react';
+"use client";
 
@@ -210,2 +210,5 @@ // ../core/dist/index.js
 var should_be_circle = (rotation_transform) => rotation_transform !== 1 && coin_flip();
+
+// src/index.ts
+import { createElement, useEffect, useRef } from "react";
 function Confetti({ class: className, ...options }) {
@@ -228,3 +231,4 @@ const target_ref = useRef(null);
 }
-
-export { Confetti };
+export {
+  Confetti
+};

dist/min/index.js

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

package.json

 {
   "name": "@neoconfetti/react",
-  "version": "0.2.0",
+  "version": "1.0.0",
   "description": "Confetti explosion in React 🎉🎊",
@@ -5,0 +5,0 @@ "author": "Puru Vijay",

Fixed alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21234

increased by0.15%

Lines of code

309

increased by1.31%

Number of low quality alerts

0

decreased by-100%

No dependency changes