react-strawberry-toast 1.6.2 → 2.0.0

package/README.md

@@ -53,7 +53,6 @@ function App() {
 | style      | Style of ToastContainer  |  Object | |
 | gap      | Gap Between toasts  |  Number | 9 |
 | pauseOnActivate      | Pause Toast timer when blur events occurs  |  Boolean | true |
-| limit      | Limit the number of toast to be displayed |  Number | |
 
 
 ### toast

package/dist/index.d.mts

@@ -93,9 +93,8 @@ interface ToastContainerProps {
     reverse?: boolean;
     gap?: number;
     pauseOnActivate?: boolean;
-    limit?: number;
 }
-declare function ToastContainer({ className, style, limit, position: globalPosition, containerId, gap, reverse, pauseOnActivate, }: ToastContainerProps): react_jsx_runtime.JSX.Element;
+declare function ToastContainer({ className, style, position: globalPosition, containerId, gap, reverse, pauseOnActivate, }: ToastContainerProps): react_jsx_runtime.JSX.Element;
 
 declare const useToasts: () => Array<NonHeadlessToastState>;
 

package/dist/index.d.ts

@@ -93,9 +93,8 @@ interface ToastContainerProps {
     reverse?: boolean;
     gap?: number;
     pauseOnActivate?: boolean;
-    limit?: number;
 }
-declare function ToastContainer({ className, style, limit, position: globalPosition, containerId, gap, reverse, pauseOnActivate, }: ToastContainerProps): react_jsx_runtime.JSX.Element;
+declare function ToastContainer({ className, style, position: globalPosition, containerId, gap, reverse, pauseOnActivate, }: ToastContainerProps): react_jsx_runtime.JSX.Element;
 
 declare const useToasts: () => Array<NonHeadlessToastState>;
 

package/dist/index.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";var D=Object.defineProperty;var at=Object.getOwnPropertyDescriptor;var rt=Object.getOwnPropertyNames;var nt=Object.prototype.hasOwnProperty;var it=(t,e)=>{for(var n in e)D(t,n,{get:e[n],enumerable:!0})},ct=(t,e,n,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of rt(e))!nt.call(t,a)&&a!==n&&D(t,a,{get:()=>e[a],enumerable:!(p=at(e,a))||p.enumerable});return t};var lt=t=>ct(D({},"__esModule",{value:!0}),t);var ft={};it(ft,{ToastContainer:()=>mt,toast:()=>s,toastStore:()=>b,useToasts:()=>V});module.exports=lt(ft);var Y=()=>{let t=0;return()=>`react-strawberry-toast_${t++}`};var $=class{state=[];listeners=new Set;activatedToasts=new Set;toastTimers=new Map;constructor(){}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}setState(e){this.state=typeof e=="function"?e(this.state):e,this.listeners.forEach(n=>n())}getSnapShot(){return this.state}};var d="react-strawberry-toast";var m=require("react/jsx-runtime");function dt(){return(0,m.jsxs)("svg",{stroke:"none",fill:"none",strokeWidth:"2",viewBox:"0 0 24 24",strokeLinecap:"round",strokeLinejoin:"round",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:[(0,m.jsx)("path",{stroke:"none",d:"M0 0h24v24H0z"}),(0,m.jsx)("path",{className:"react-strawberry-toast-path",d:"M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-1.293 5.953a1 1 0 0 0 -1.32 -.083l-.094 .083l-3.293 3.292l-1.293 -1.292l-.094 -.083a1 1 0 0 0 -1.403 1.403l.083 .094l2 2l.094 .083a1 1 0 0 0 1.226 0l.094 -.083l4 -4l.083 -.094a1 1 0 0 0 -.083 -1.32z",strokeWidth:"0",fill:"#1dca82"})]})}function X({fill:t}){return(0,m.jsx)("svg",{stroke:"none",fill:t,strokeWidth:"2",viewBox:"0 0 24 24",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:(0,m.jsx)("path",{className:"react-strawberry-toast-path",d:"M11.953 2C6.465 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.493 2 11.953 2zM13 17h-2v-2h2v2zm0-4h-2V7h2v6z"})})}function pt(){return(0,m.jsx)("svg",{stroke:"none",fill:"#fcba03",strokeWidth:"0",viewBox:"0 0 1024 1024",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:(0,m.jsx)("path",{className:"react-strawberry-toast-path",d:"M955.7 856l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zM480 416c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v184c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V416zm32 352a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"})})}function G(){return(0,m.jsx)("svg",{fill:"#8b8b8b",strokeWidth:"0",viewBox:"0 0 512 512",height:"15px",width:"15px",xmlns:"http://www.w3.org/2000/svg",children:(0,m.jsx)("path",{className:"react-strawberry-toast-path",d:"M400 145.49 366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49z"})})}var g={success:(0,m.jsx)(dt,{}),error:(0,m.jsx)(X,{fill:"#eb2639"}),loading:(0,m.jsx)("div",{className:`${d}__loading`}),warn:(0,m.jsx)(pt,{}),info:(0,m.jsx)(X,{fill:"#5365e7"})};var F=t=>{let e=o=>{let i=t.toastTimers.get(o);clearTimeout(i),t.toastTimers.delete(o)},n=o=>{t.activatedToasts.add(o)},p=o=>t.activatedToasts.has(o),a=(o,i=200)=>{p(o)&&(t.activatedToasts.delete(o),setTimeout(()=>{t.state=t.state.filter(c=>c.toastId!==o),t.setState([...t.state])},i),e(o))},h=()=>{t.state.forEach(o=>{u(o.toastId,0)})},f=(o,i,c)=>{t.state=t.state.map(v=>v.toastId===o?{...v,...c,updated:new Date().getTime(),data:i}:v),t.setState([...t.state])},w=o=>{let i=new Date().getTime();t.state=t.state.map(c=>c.toastId===o?{...c,pausedAt:i}:c),e(o)},u=(o,i)=>{let c=setTimeout(()=>{var r;t.state=t.state.map(l=>l.toastId===o?{...l,isVisible:!1}:l),t.setState([...t.state]);let v=(r=t.state.find(l=>l.toastId===o))==null?void 0:r.removeTimeOut;a(o,v)},i>2147483647?2147483647:i);t.toastTimers.set(o,c)};return{setActive:n,isActive:p,disappear:u,resume:o=>{if(t.toastTimers.has(o))return;let i=t.state.find(v=>v.toastId===o);if(!i)return;let c=i.createdAt+(i.timeOut||3e3)-(i.pausedAt||0);u(o,c)},pause:w,replace:f,remove:a,allClear:h}};var b=new $,ut=Y(),x=(t="default")=>(e,n={})=>{let{timeOut:p=3e3,removeTimeOut:a=200,pauseOnHover:h=!0,toastId:f,className:w,style:u,target:T,closeButton:o}=n,i=f||ut();if(s.isActive(i))throw new Error("A duplicate custom ID is not available.");let c=new Date().getTime(),v={updated:null,pausedAt:null,className:w||null,style:u||{},icon:n.icon||null,containerId:n.containerId||null,position:n.position||null,timeOut:p>2147483647?2147483647:p,toastId:i,data:e,createdAt:c,toastType:t,pauseOnHover:h,removeTimeOut:a,closeButton:o||!1,target:T||null,isVisible:!0};return b.state.push(v),b.setState([...b.state]),i},s=(t,e={})=>x()(t,e),_=F(b);s.setActive=_.setActive;s.isActive=_.isActive;s.disappear=_.disappear;s.resume=_.resume;s.pause=_.pause;s.replace=_.replace;s.remove=_.remove;s.allClear=_.allClear;s.success=x("success");s.error=x("error");s.warn=x("warn");s.info=x("info");s.loading=x("loading");s.custom=x("custom");s.promise=(t,e,n={})=>{let{loading:p,success:a,error:h}=e,f=s.loading(p,{...n,timeOut:2147483647}),w={toastId:f,close:()=>s.disappear(f,0),immediatelyClose:()=>{s.disappear(f,0),s.remove(f,0)},icons:{success:g.success,error:g.error,warn:g.warn,loading:g.loading,info:g.info},isVisible:!0},u=n.timeOut||=3e3;t.then(T=>{s.replace(f,typeof a=="function"?a(T,w):a,{...n,timeOut:u>2147483647?2147483647:u,toastType:"success"})}).catch(T=>{s.replace(f,typeof h=="function"?h(T,w):h,{...n,timeOut:u>2147483647?2147483647:u,toastType:"error"})})};var U=require("react");var R=require("react");var q=require("react");function J({condition:t,children:e}){let n=q.Children.toArray(e);if(n.length>2)throw new Error("The number of children exceeds two.");return n.find(p=>t?p.key===".0":p.key===".1")}function K({children:t}){return t}function Q({children:t}){return t}var Z=({isVisible:t,position:e})=>e?t?/top/i.test(e)?`${d}__fade-in`:`${d}__fade-in-reverse`:/bottom/i.test(e)?`${d}__fade-out-reverse`:`${d}__fade-out`:t?`${d}__fade-in`:`${d}__fade-out`;var P=require("react"),z=(t,e)=>{let n=(0,P.useRef)(e);(0,P.useEffect)(()=>{n.current=e},[e]),(0,P.useEffect)(()=>(window.addEventListener(t,n.current),()=>{window.removeEventListener(t,n.current)}),[t])};var S=require("react/jsx-runtime"),B=(0,R.forwardRef)(function({toastProps:e,pauseOnActivate:n},p){let{toastId:a,isVisible:h,timeOut:f,containerId:w,className:u,style:T,icon:o,updated:i,toastType:c,position:v,data:r,pauseOnHover:l,closeButton:y}=e,A=Z({isVisible:h,position:v}),I=typeof r=="function"?r({toastId:a,close:()=>s.disappear(a,0),immediatelyClose:()=>{s.disappear(a,0),s.remove(a,0)},icons:{success:g.success,error:g.error,warn:g.warn,loading:g.loading,info:g.info},isVisible:h}):r,O=()=>{n&&s.resume(a)},H=()=>{n&&s.pause(a)};z("focus",O),z("blur",H),(0,R.useEffect)(()=>{s.isActive(a)||(s.setActive(a),s.disappear(a,f))},[a]),(0,R.useEffect)(()=>{i!==null&&s.disappear(a,f)},[i]);let C=o||(c==="custom"||c==="default"?null:g[c]);return(0,S.jsx)("div",{role:"alert",ref:p,className:`${d}__toast-content-container`,"data-testid":`container-${w||"default"}`,onMouseEnter:()=>{l&&s.pause(a)},onMouseLeave:()=>{l&&s.resume(a)},children:(0,S.jsxs)(J,{condition:c!=="custom",children:[(0,S.jsx)(K,{children:(0,S.jsxs)("div",{className:u??`${d}__toast-content ${d}__toast-${c} ${s.isActive(a)?"":A}`,style:T,children:[C&&(0,S.jsx)("span",{className:`${d}__toast-icon`,children:C}),I,y&&(0,S.jsx)("button",{className:`${d}__close-button`,onClick:()=>{s.disappear(a,0)},type:"button",children:(0,S.jsx)(G,{})})]})}),(0,S.jsx)(Q,{children:(0,S.jsx)("div",{className:u??`${s.isActive(a)?"":A}`,children:I})})]})})});var j=require("react");var V=()=>(0,j.useSyncExternalStore)(b.subscribe.bind(b),b.getSnapShot.bind(b),b.getSnapShot.bind(b));var N=require("react/jsx-runtime");function mt({className:t,style:e,limit:n,position:p="top-center",containerId:a="",gap:h=9,reverse:f=!1,pauseOnActivate:w=!0}){let u=V(),T=(0,U.useRef)({}),o=(0,U.useRef)({}),i=r=>{var l;return(l=r.target)==null?void 0:l.element},c=r=>a?r.containerId===a:!r.containerId,v=u.filter(r=>!i(r)).reduce((r,l)=>{let y=l.position||p;return l.position=y,r[y]=r[y]||[],r[y].push(l),r},{});return(0,N.jsxs)("div",{id:`${d}__root`,"data-container-id":a,children:[u.filter(i).filter(c).map(r=>(0,N.jsx)(B,{ref:l=>{let y=r.target;if(!y||!l){delete o.current[r.toastId];return}let A=o.current[r.toastId]||y.element.getBoundingClientRect();o.current[r.toastId]={y:A.y,x:A.x};let[I,O]=y.offset||[0,0];l.style.top=`${A.y+O+window.scrollY}px`,l.style.left=`${A.x+I+window.scrollX}px`},toastProps:r,pauseOnActivate:w},r.toastId)),Object.entries(v).map(([r,l])=>{let y=l.filter(c).slice(0,n),A=f?y.reverse():y;return(0,N.jsx)("div",{"data-testid":r,className:`${d}__z9999 ${t??`${d}__toast-container ${d}__${r}`}`,style:e,children:A.map((I,O,H)=>(0,N.jsx)(B,{ref:C=>{if(!C){delete T.current[I.toastId];return}let tt=T.current[I.toastId]||C.getBoundingClientRect().height;T.current[I.toastId]=tt;let et=/left/.test(r)?50:/center/.test(r)?0:-50,st=/bottom/.test(r)?0:1,ot=H.filter((L,M)=>M<=O-st).reduce((L,M)=>/bottom/.test(r)?L-=h+T.current[M.toastId]:L+=h+T.current[M.toastId],0);C.style.transition="transform 0.2s cubic-bezier(0.43, 0.14, 0.2, 1.05)",C.style.transform=`translate(${et}%, ${ot}px)`},toastProps:I,pauseOnActivate:w},I.toastId))},r)})]})}
+"use strict";var D=Object.defineProperty;var ot=Object.getOwnPropertyDescriptor;var at=Object.getOwnPropertyNames;var rt=Object.prototype.hasOwnProperty;var nt=(t,e)=>{for(var n in e)D(t,n,{get:e[n],enumerable:!0})},it=(t,e,n,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of at(e))!rt.call(t,r)&&r!==n&&D(t,r,{get:()=>e[r],enumerable:!(p=ot(e,r))||p.enumerable});return t};var ct=t=>it(D({},"__esModule",{value:!0}),t);var mt={};nt(mt,{ToastContainer:()=>ut,toast:()=>o,toastStore:()=>g,useToasts:()=>V});module.exports=ct(mt);var Y=()=>{let t=0;return()=>`react-strawberry-toast_${t++}`};var $=class{state=[];listeners=new Set;activatedToasts=new Set;toastTimers=new Map;constructor(){}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}setState(e){this.state=typeof e=="function"?e(this.state):e,this.listeners.forEach(n=>n())}getSnapShot(){return this.state}};var d="react-strawberry-toast";var T=require("react/jsx-runtime");function lt(){return(0,T.jsxs)("svg",{stroke:"none",fill:"none",strokeWidth:"2",viewBox:"0 0 24 24",strokeLinecap:"round",strokeLinejoin:"round",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:[(0,T.jsx)("path",{stroke:"none",d:"M0 0h24v24H0z"}),(0,T.jsx)("path",{className:"react-strawberry-toast-path",d:"M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-1.293 5.953a1 1 0 0 0 -1.32 -.083l-.094 .083l-3.293 3.292l-1.293 -1.292l-.094 -.083a1 1 0 0 0 -1.403 1.403l.083 .094l2 2l.094 .083a1 1 0 0 0 1.226 0l.094 -.083l4 -4l.083 -.094a1 1 0 0 0 -.083 -1.32z",strokeWidth:"0",fill:"#1dca82"})]})}function X({fill:t}){return(0,T.jsx)("svg",{stroke:"none",fill:t,strokeWidth:"2",viewBox:"0 0 24 24",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:(0,T.jsx)("path",{className:"react-strawberry-toast-path",d:"M11.953 2C6.465 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.493 2 11.953 2zM13 17h-2v-2h2v2zm0-4h-2V7h2v6z"})})}function dt(){return(0,T.jsx)("svg",{stroke:"none",fill:"#fcba03",strokeWidth:"0",viewBox:"0 0 1024 1024",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:(0,T.jsx)("path",{className:"react-strawberry-toast-path",d:"M955.7 856l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zM480 416c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v184c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V416zm32 352a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"})})}function G(){return(0,T.jsx)("svg",{fill:"#8b8b8b",strokeWidth:"0",viewBox:"0 0 512 512",height:"15px",width:"15px",xmlns:"http://www.w3.org/2000/svg",children:(0,T.jsx)("path",{className:"react-strawberry-toast-path",d:"M400 145.49 366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49z"})})}var h={success:(0,T.jsx)(lt,{}),error:(0,T.jsx)(X,{fill:"#eb2639"}),loading:(0,T.jsx)("div",{className:`${d}__loading`}),warn:(0,T.jsx)(dt,{}),info:(0,T.jsx)(X,{fill:"#5365e7"})};var F=t=>{let e=a=>{let i=t.toastTimers.get(a);clearTimeout(i),t.toastTimers.delete(a)},n=a=>{t.activatedToasts.add(a)},p=a=>t.activatedToasts.has(a),r=(a,i=200)=>{p(a)&&(t.activatedToasts.delete(a),setTimeout(()=>{t.state=t.state.filter(c=>c.toastId!==a),t.setState([...t.state])},i),e(a))},y=()=>{t.state.forEach(a=>{u(a.toastId,0)})},f=(a,i,c)=>{t.state=t.state.map(s=>s.toastId===a?{...s,...c,updated:new Date().getTime(),data:i}:s),t.setState([...t.state])},w=a=>{let i=new Date().getTime();t.state=t.state.map(c=>c.toastId===a?{...c,pausedAt:i}:c),e(a)},u=(a,i)=>{let c=setTimeout(()=>{var m;t.state=t.state.map(l=>l.toastId===a?{...l,isVisible:!1}:l),t.setState([...t.state]);let s=(m=t.state.find(l=>l.toastId===a))==null?void 0:m.removeTimeOut;r(a,s)},i>2147483647?2147483647:i);t.toastTimers.set(a,c)};return{setActive:n,isActive:p,disappear:u,resume:a=>{if(t.toastTimers.has(a))return;let i=t.state.find(s=>s.toastId===a);if(!i)return;let c=i.createdAt+(i.timeOut||3e3)-(i.pausedAt||0);u(a,c)},pause:w,replace:f,remove:r,allClear:y}};var g=new $,pt=Y(),_=(t="default")=>(e,n={})=>{let{timeOut:p=3e3,removeTimeOut:r=200,pauseOnHover:y=!0,toastId:f,className:w,style:u,target:v,closeButton:a}=n,i=f||pt();if(o.isActive(i))throw new Error("A duplicate custom ID is not available.");let c=new Date().getTime(),s={updated:null,pausedAt:null,className:w||null,style:u||{},icon:n.icon||null,containerId:n.containerId||null,position:n.position||null,timeOut:p>2147483647?2147483647:p,toastId:i,data:e,createdAt:c,toastType:t,pauseOnHover:y,removeTimeOut:r,closeButton:a||!1,target:v||null,isVisible:!0};return g.state.push(s),g.setState([...g.state]),i},o=(t,e={})=>_()(t,e),A=F(g);o.setActive=A.setActive;o.isActive=A.isActive;o.disappear=A.disappear;o.resume=A.resume;o.pause=A.pause;o.replace=A.replace;o.remove=A.remove;o.allClear=A.allClear;o.success=_("success");o.error=_("error");o.warn=_("warn");o.info=_("info");o.loading=_("loading");o.custom=_("custom");o.promise=(t,e,n={})=>{let{loading:p,success:r,error:y}=e,f=o.loading(p,{...n,timeOut:2147483647}),w={toastId:f,close:()=>o.disappear(f,0),immediatelyClose:()=>{o.disappear(f,0),o.remove(f,0)},icons:{success:h.success,error:h.error,warn:h.warn,loading:h.loading,info:h.info},isVisible:!0},u=n.timeOut||=3e3;t.then(v=>{o.replace(f,typeof r=="function"?r(v,w):r,{...n,timeOut:u>2147483647?2147483647:u,toastType:"success"})}).catch(v=>{o.replace(f,typeof y=="function"?y(v,w):y,{...n,timeOut:u>2147483647?2147483647:u,toastType:"error"})})};var U=require("react");var P=require("react");var q=require("react");function J({condition:t,children:e}){let n=q.Children.toArray(e);if(n.length>2)throw new Error("The number of children exceeds two.");return n.find(p=>t?p.key===".0":p.key===".1")}function K({children:t}){return t}function Q({children:t}){return t}var Z=({isVisible:t,position:e})=>e?t?/top/i.test(e)?`${d}__fade-in`:`${d}__fade-in-reverse`:/bottom/i.test(e)?`${d}__fade-out-reverse`:`${d}__fade-out`:t?`${d}__fade-in`:`${d}__fade-out`;var O=require("react"),z=(t,e)=>{let n=(0,O.useRef)(e);(0,O.useEffect)(()=>{n.current=e},[e]),(0,O.useEffect)(()=>(window.addEventListener(t,n.current),()=>{window.removeEventListener(t,n.current)}),[t])};var S=require("react/jsx-runtime"),B=(0,P.forwardRef)(function({toastProps:e,pauseOnActivate:n},p){let{toastId:r,isVisible:y,timeOut:f,containerId:w,className:u,style:v,icon:a,updated:i,toastType:c,position:s,data:m,pauseOnHover:l,closeButton:E}=e,b=Z({isVisible:y,position:s}),C=typeof m=="function"?m({toastId:r,close:()=>o.disappear(r,0),immediatelyClose:()=>{o.disappear(r,0),o.remove(r,0)},icons:{success:h.success,error:h.error,warn:h.warn,loading:h.loading,info:h.info},isVisible:y}):m,H=()=>{n&&o.resume(r)},x=()=>{n&&o.pause(r)};z("focus",H),z("blur",x),(0,P.useEffect)(()=>{o.isActive(r)||(o.setActive(r),o.disappear(r,f))},[r]),(0,P.useEffect)(()=>{i!==null&&o.disappear(r,f)},[i]);let R=a||(c==="custom"||c==="default"?null:h[c]);return(0,S.jsx)("output",{role:"status",ref:p,className:`${d}__toast-content-container`,"data-testid":`container-${w||"default"}`,onMouseEnter:()=>{l&&o.pause(r)},onMouseLeave:()=>{l&&o.resume(r)},children:(0,S.jsxs)(J,{condition:c!=="custom",children:[(0,S.jsx)(K,{children:(0,S.jsxs)("div",{className:u??`${d}__toast-content ${d}__toast-${c} ${o.isActive(r)?"":b}`,style:v,children:[R&&(0,S.jsx)("span",{className:`${d}__toast-icon`,children:R}),C,E&&(0,S.jsx)("button",{className:`${d}__close-button`,onClick:()=>{o.disappear(r,0)},type:"button",children:(0,S.jsx)(G,{})})]})}),(0,S.jsx)(Q,{children:(0,S.jsx)("div",{className:u??`${o.isActive(r)?"":b}`,children:C})})]})})});var j=require("react");var V=()=>(0,j.useSyncExternalStore)(g.subscribe.bind(g),g.getSnapShot.bind(g),g.getSnapShot.bind(g));var N=require("react/jsx-runtime");function ut({className:t,style:e,position:n="top-center",containerId:p="",gap:r=9,reverse:y=!1,pauseOnActivate:f=!0}){let w=V(),u=(0,U.useRef)({}),v=(0,U.useRef)({}),a=s=>{var m;return(m=s.target)==null?void 0:m.element},i=s=>p?s.containerId===p:!s.containerId,c=w.filter(s=>!a(s)).reduce((s,m)=>{let l=m.position||n;return m.position=l,s[l]=s[l]||[],s[l].push(m),s},{});return(0,N.jsxs)("div",{id:`${d}__root`,"data-container-id":p,children:[w.filter(a).filter(i).map(s=>(0,N.jsx)(B,{ref:m=>{let l=s.target;if(!l||!m){delete v.current[s.toastId];return}let E=v.current[s.toastId]||l.element.getBoundingClientRect();v.current[s.toastId]={y:E.y,x:E.x};let[b,C]=l.offset||[0,0];m.style.top=`${E.y+C+window.scrollY}px`,m.style.left=`${E.x+b+window.scrollX}px`},toastProps:s,pauseOnActivate:f},s.toastId)),Object.entries(c).map(([s,m])=>{let l=m.filter(i),E=y?l.reverse():l;return(0,N.jsx)("div",{"data-testid":s,className:`${d}__z9999 ${t??`${d}__toast-container ${d}__${s}`}`,style:e,children:E.map((b,C,H)=>(0,N.jsx)(B,{ref:x=>{if(!x){delete u.current[b.toastId];return}let R=u.current[b.toastId]||x.getBoundingClientRect().height;u.current[b.toastId]=R;let tt=/left/.test(s)?50:/center/.test(s)?0:-50,et=/bottom/.test(s)?0:1,st=H.filter((L,M)=>M<=C-et).reduce((L,M)=>/bottom/.test(s)?L-=r+u.current[M.toastId]:L+=r+u.current[M.toastId],0);x.style.transition="transform 0.2s cubic-bezier(0.43, 0.14, 0.2, 1.05)",x.style.transform=`translate(${tt}%, ${st}px)`},toastProps:b,pauseOnActivate:f},b.toastId))},s)})]})}

package/dist/index.mjs

@@ -1,2 +1,2 @@
 "use client";
-var W=()=>{let t=0;return()=>`react-strawberry-toast_${t++}`};var P=class{state=[];listeners=new Set;activatedToasts=new Set;toastTimers=new Map;constructor(){}subscribe(a){return this.listeners.add(a),()=>{this.listeners.delete(a)}}setState(a){this.state=typeof a=="function"?a(this.state):a,this.listeners.forEach(n=>n())}getSnapShot(){return this.state}};var d="react-strawberry-toast";import{jsx as y,jsxs as at}from"react/jsx-runtime";function st(){return at("svg",{stroke:"none",fill:"none",strokeWidth:"2",viewBox:"0 0 24 24",strokeLinecap:"round",strokeLinejoin:"round",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:[y("path",{stroke:"none",d:"M0 0h24v24H0z"}),y("path",{className:"react-strawberry-toast-path",d:"M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-1.293 5.953a1 1 0 0 0 -1.32 -.083l-.094 .083l-3.293 3.292l-1.293 -1.292l-.094 -.083a1 1 0 0 0 -1.403 1.403l.083 .094l2 2l.094 .083a1 1 0 0 0 1.226 0l.094 -.083l4 -4l.083 -.094a1 1 0 0 0 -.083 -1.32z",strokeWidth:"0",fill:"#1dca82"})]})}function z({fill:t}){return y("svg",{stroke:"none",fill:t,strokeWidth:"2",viewBox:"0 0 24 24",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:y("path",{className:"react-strawberry-toast-path",d:"M11.953 2C6.465 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.493 2 11.953 2zM13 17h-2v-2h2v2zm0-4h-2V7h2v6z"})})}function ot(){return y("svg",{stroke:"none",fill:"#fcba03",strokeWidth:"0",viewBox:"0 0 1024 1024",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:y("path",{className:"react-strawberry-toast-path",d:"M955.7 856l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zM480 416c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v184c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V416zm32 352a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"})})}function B(){return y("svg",{fill:"#8b8b8b",strokeWidth:"0",viewBox:"0 0 512 512",height:"15px",width:"15px",xmlns:"http://www.w3.org/2000/svg",children:y("path",{className:"react-strawberry-toast-path",d:"M400 145.49 366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49z"})})}var g={success:y(st,{}),error:y(z,{fill:"#eb2639"}),loading:y("div",{className:`${d}__loading`}),warn:y(ot,{}),info:y(z,{fill:"#5365e7"})};var V=t=>{let a=s=>{let i=t.toastTimers.get(s);clearTimeout(i),t.toastTimers.delete(s)},n=s=>{t.activatedToasts.add(s)},m=s=>t.activatedToasts.has(s),r=(s,i=200)=>{m(s)&&(t.activatedToasts.delete(s),setTimeout(()=>{t.state=t.state.filter(c=>c.toastId!==s),t.setState([...t.state])},i),a(s))},T=()=>{t.state.forEach(s=>{p(s.toastId,0)})},u=(s,i,c)=>{t.state=t.state.map(h=>h.toastId===s?{...h,...c,updated:new Date().getTime(),data:i}:h),t.setState([...t.state])},b=s=>{let i=new Date().getTime();t.state=t.state.map(c=>c.toastId===s?{...c,pausedAt:i}:c),a(s)},p=(s,i)=>{let c=setTimeout(()=>{var o;t.state=t.state.map(l=>l.toastId===s?{...l,isVisible:!1}:l),t.setState([...t.state]);let h=(o=t.state.find(l=>l.toastId===s))==null?void 0:o.removeTimeOut;r(s,h)},i>2147483647?2147483647:i);t.toastTimers.set(s,c)};return{setActive:n,isActive:m,disappear:p,resume:s=>{if(t.toastTimers.has(s))return;let i=t.state.find(h=>h.toastId===s);if(!i)return;let c=i.createdAt+(i.timeOut||3e3)-(i.pausedAt||0);p(s,c)},pause:b,replace:u,remove:r,allClear:T}};var w=new P,rt=W(),C=(t="default")=>(a,n={})=>{let{timeOut:m=3e3,removeTimeOut:r=200,pauseOnHover:T=!0,toastId:u,className:b,style:p,target:f,closeButton:s}=n,i=u||rt();if(e.isActive(i))throw new Error("A duplicate custom ID is not available.");let c=new Date().getTime(),h={updated:null,pausedAt:null,className:b||null,style:p||{},icon:n.icon||null,containerId:n.containerId||null,position:n.position||null,timeOut:m>2147483647?2147483647:m,toastId:i,data:a,createdAt:c,toastType:t,pauseOnHover:T,removeTimeOut:r,closeButton:s||!1,target:f||null,isVisible:!0};return w.state.push(h),w.setState([...w.state]),i},e=(t,a={})=>C()(t,a),A=V(w);e.setActive=A.setActive;e.isActive=A.isActive;e.disappear=A.disappear;e.resume=A.resume;e.pause=A.pause;e.replace=A.replace;e.remove=A.remove;e.allClear=A.allClear;e.success=C("success");e.error=C("error");e.warn=C("warn");e.info=C("info");e.loading=C("loading");e.custom=C("custom");e.promise=(t,a,n={})=>{let{loading:m,success:r,error:T}=a,u=e.loading(m,{...n,timeOut:2147483647}),b={toastId:u,close:()=>e.disappear(u,0),immediatelyClose:()=>{e.disappear(u,0),e.remove(u,0)},icons:{success:g.success,error:g.error,warn:g.warn,loading:g.loading,info:g.info},isVisible:!0},p=n.timeOut||=3e3;t.then(f=>{e.replace(u,typeof r=="function"?r(f,b):r,{...n,timeOut:p>2147483647?2147483647:p,toastType:"success"})}).catch(f=>{e.replace(u,typeof T=="function"?T(f,b):T,{...n,timeOut:p>2147483647?2147483647:p,toastType:"error"})})};import{useRef as Q}from"react";import{useEffect as q,forwardRef as ct}from"react";import{Children as nt}from"react";function U({condition:t,children:a}){let n=nt.toArray(a);if(n.length>2)throw new Error("The number of children exceeds two.");return n.find(m=>t?m.key===".0":m.key===".1")}function Y({children:t}){return t}function X({children:t}){return t}var G=({isVisible:t,position:a})=>a?t?/top/i.test(a)?`${d}__fade-in`:`${d}__fade-in-reverse`:/bottom/i.test(a)?`${d}__fade-out-reverse`:`${d}__fade-out`:t?`${d}__fade-in`:`${d}__fade-out`;import{useEffect as F,useRef as it}from"react";var H=(t,a)=>{let n=it(a);F(()=>{n.current=a},[a]),F(()=>(window.addEventListener(t,n.current),()=>{window.removeEventListener(t,n.current)}),[t])};import{jsx as x,jsxs as J}from"react/jsx-runtime";var L=ct(function({toastProps:a,pauseOnActivate:n},m){let{toastId:r,isVisible:T,timeOut:u,containerId:b,className:p,style:f,icon:s,updated:i,toastType:c,position:h,data:o,pauseOnHover:l,closeButton:v}=a,E=G({isVisible:T,position:h}),S=typeof o=="function"?o({toastId:r,close:()=>e.disappear(r,0),immediatelyClose:()=>{e.disappear(r,0),e.remove(r,0)},icons:{success:g.success,error:g.error,warn:g.warn,loading:g.loading,info:g.info},isVisible:T}):o,N=()=>{n&&e.resume(r)},M=()=>{n&&e.pause(r)};H("focus",N),H("blur",M),q(()=>{e.isActive(r)||(e.setActive(r),e.disappear(r,u))},[r]),q(()=>{i!==null&&e.disappear(r,u)},[i]);let _=s||(c==="custom"||c==="default"?null:g[c]);return x("div",{role:"alert",ref:m,className:`${d}__toast-content-container`,"data-testid":`container-${b||"default"}`,onMouseEnter:()=>{l&&e.pause(r)},onMouseLeave:()=>{l&&e.resume(r)},children:J(U,{condition:c!=="custom",children:[x(Y,{children:J("div",{className:p??`${d}__toast-content ${d}__toast-${c} ${e.isActive(r)?"":E}`,style:f,children:[_&&x("span",{className:`${d}__toast-icon`,children:_}),S,v&&x("button",{className:`${d}__close-button`,onClick:()=>{e.disappear(r,0)},type:"button",children:x(B,{})})]})}),x(X,{children:x("div",{className:p??`${e.isActive(r)?"":E}`,children:S})})]})})});import{useSyncExternalStore as lt}from"react";var K=()=>lt(w.subscribe.bind(w),w.getSnapShot.bind(w),w.getSnapShot.bind(w));import{jsx as D,jsxs as dt}from"react/jsx-runtime";function qt({className:t,style:a,limit:n,position:m="top-center",containerId:r="",gap:T=9,reverse:u=!1,pauseOnActivate:b=!0}){let p=K(),f=Q({}),s=Q({}),i=o=>{var l;return(l=o.target)==null?void 0:l.element},c=o=>r?o.containerId===r:!o.containerId,h=p.filter(o=>!i(o)).reduce((o,l)=>{let v=l.position||m;return l.position=v,o[v]=o[v]||[],o[v].push(l),o},{});return dt("div",{id:`${d}__root`,"data-container-id":r,children:[p.filter(i).filter(c).map(o=>D(L,{ref:l=>{let v=o.target;if(!v||!l){delete s.current[o.toastId];return}let E=s.current[o.toastId]||v.element.getBoundingClientRect();s.current[o.toastId]={y:E.y,x:E.x};let[S,N]=v.offset||[0,0];l.style.top=`${E.y+N+window.scrollY}px`,l.style.left=`${E.x+S+window.scrollX}px`},toastProps:o,pauseOnActivate:b},o.toastId)),Object.entries(h).map(([o,l])=>{let v=l.filter(c).slice(0,n),E=u?v.reverse():v;return D("div",{"data-testid":o,className:`${d}__z9999 ${t??`${d}__toast-container ${d}__${o}`}`,style:a,children:E.map((S,N,M)=>D(L,{ref:_=>{if(!_){delete f.current[S.toastId];return}let Z=f.current[S.toastId]||_.getBoundingClientRect().height;f.current[S.toastId]=Z;let j=/left/.test(o)?50:/center/.test(o)?0:-50,tt=/bottom/.test(o)?0:1,et=M.filter(($,O)=>O<=N-tt).reduce(($,O)=>/bottom/.test(o)?$-=T+f.current[O.toastId]:$+=T+f.current[O.toastId],0);_.style.transition="transform 0.2s cubic-bezier(0.43, 0.14, 0.2, 1.05)",_.style.transform=`translate(${j}%, ${et}px)`},toastProps:S,pauseOnActivate:b},S.toastId))},o)})]})}export{qt as ToastContainer,e as toast,w as toastStore,K as useToasts};
+var W=()=>{let t=0;return()=>`react-strawberry-toast_${t++}`};var P=class{state=[];listeners=new Set;activatedToasts=new Set;toastTimers=new Map;constructor(){}subscribe(a){return this.listeners.add(a),()=>{this.listeners.delete(a)}}setState(a){this.state=typeof a=="function"?a(this.state):a,this.listeners.forEach(n=>n())}getSnapShot(){return this.state}};var d="react-strawberry-toast";import{jsx as T,jsxs as ot}from"react/jsx-runtime";function et(){return ot("svg",{stroke:"none",fill:"none",strokeWidth:"2",viewBox:"0 0 24 24",strokeLinecap:"round",strokeLinejoin:"round",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:[T("path",{stroke:"none",d:"M0 0h24v24H0z"}),T("path",{className:"react-strawberry-toast-path",d:"M17 3.34a10 10 0 1 1 -14.995 8.984l-.005 -.324l.005 -.324a10 10 0 0 1 14.995 -8.336zm-1.293 5.953a1 1 0 0 0 -1.32 -.083l-.094 .083l-3.293 3.292l-1.293 -1.292l-.094 -.083a1 1 0 0 0 -1.403 1.403l.083 .094l2 2l.094 .083a1 1 0 0 0 1.226 0l.094 -.083l4 -4l.083 -.094a1 1 0 0 0 -.083 -1.32z",strokeWidth:"0",fill:"#1dca82"})]})}function z({fill:t}){return T("svg",{stroke:"none",fill:t,strokeWidth:"2",viewBox:"0 0 24 24",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:T("path",{className:"react-strawberry-toast-path",d:"M11.953 2C6.465 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.493 2 11.953 2zM13 17h-2v-2h2v2zm0-4h-2V7h2v6z"})})}function st(){return T("svg",{stroke:"none",fill:"#fcba03",strokeWidth:"0",viewBox:"0 0 1024 1024",height:"22",width:"22",xmlns:"http://www.w3.org/2000/svg",children:T("path",{className:"react-strawberry-toast-path",d:"M955.7 856l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zM480 416c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v184c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V416zm32 352a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"})})}function B(){return T("svg",{fill:"#8b8b8b",strokeWidth:"0",viewBox:"0 0 512 512",height:"15px",width:"15px",xmlns:"http://www.w3.org/2000/svg",children:T("path",{className:"react-strawberry-toast-path",d:"M400 145.49 366.51 112 256 222.51 145.49 112 112 145.49 222.51 256 112 366.51 145.49 400 256 289.49 366.51 400 400 366.51 289.49 256 400 145.49z"})})}var h={success:T(et,{}),error:T(z,{fill:"#eb2639"}),loading:T("div",{className:`${d}__loading`}),warn:T(st,{}),info:T(z,{fill:"#5365e7"})};var V=t=>{let a=o=>{let i=t.toastTimers.get(o);clearTimeout(i),t.toastTimers.delete(o)},n=o=>{t.activatedToasts.add(o)},m=o=>t.activatedToasts.has(o),r=(o,i=200)=>{m(o)&&(t.activatedToasts.delete(o),setTimeout(()=>{t.state=t.state.filter(c=>c.toastId!==o),t.setState([...t.state])},i),a(o))},y=()=>{t.state.forEach(o=>{p(o.toastId,0)})},f=(o,i,c)=>{t.state=t.state.map(e=>e.toastId===o?{...e,...c,updated:new Date().getTime(),data:i}:e),t.setState([...t.state])},g=o=>{let i=new Date().getTime();t.state=t.state.map(c=>c.toastId===o?{...c,pausedAt:i}:c),a(o)},p=(o,i)=>{let c=setTimeout(()=>{var u;t.state=t.state.map(l=>l.toastId===o?{...l,isVisible:!1}:l),t.setState([...t.state]);let e=(u=t.state.find(l=>l.toastId===o))==null?void 0:u.removeTimeOut;r(o,e)},i>2147483647?2147483647:i);t.toastTimers.set(o,c)};return{setActive:n,isActive:m,disappear:p,resume:o=>{if(t.toastTimers.has(o))return;let i=t.state.find(e=>e.toastId===o);if(!i)return;let c=i.createdAt+(i.timeOut||3e3)-(i.pausedAt||0);p(o,c)},pause:g,replace:f,remove:r,allClear:y}};var w=new P,at=W(),A=(t="default")=>(a,n={})=>{let{timeOut:m=3e3,removeTimeOut:r=200,pauseOnHover:y=!0,toastId:f,className:g,style:p,target:v,closeButton:o}=n,i=f||at();if(s.isActive(i))throw new Error("A duplicate custom ID is not available.");let c=new Date().getTime(),e={updated:null,pausedAt:null,className:g||null,style:p||{},icon:n.icon||null,containerId:n.containerId||null,position:n.position||null,timeOut:m>2147483647?2147483647:m,toastId:i,data:a,createdAt:c,toastType:t,pauseOnHover:y,removeTimeOut:r,closeButton:o||!1,target:v||null,isVisible:!0};return w.state.push(e),w.setState([...w.state]),i},s=(t,a={})=>A()(t,a),E=V(w);s.setActive=E.setActive;s.isActive=E.isActive;s.disappear=E.disappear;s.resume=E.resume;s.pause=E.pause;s.replace=E.replace;s.remove=E.remove;s.allClear=E.allClear;s.success=A("success");s.error=A("error");s.warn=A("warn");s.info=A("info");s.loading=A("loading");s.custom=A("custom");s.promise=(t,a,n={})=>{let{loading:m,success:r,error:y}=a,f=s.loading(m,{...n,timeOut:2147483647}),g={toastId:f,close:()=>s.disappear(f,0),immediatelyClose:()=>{s.disappear(f,0),s.remove(f,0)},icons:{success:h.success,error:h.error,warn:h.warn,loading:h.loading,info:h.info},isVisible:!0},p=n.timeOut||=3e3;t.then(v=>{s.replace(f,typeof r=="function"?r(v,g):r,{...n,timeOut:p>2147483647?2147483647:p,toastType:"success"})}).catch(v=>{s.replace(f,typeof y=="function"?y(v,g):y,{...n,timeOut:p>2147483647?2147483647:p,toastType:"error"})})};import{useRef as Q}from"react";import{useEffect as q,forwardRef as it}from"react";import{Children as rt}from"react";function U({condition:t,children:a}){let n=rt.toArray(a);if(n.length>2)throw new Error("The number of children exceeds two.");return n.find(m=>t?m.key===".0":m.key===".1")}function Y({children:t}){return t}function X({children:t}){return t}var G=({isVisible:t,position:a})=>a?t?/top/i.test(a)?`${d}__fade-in`:`${d}__fade-in-reverse`:/bottom/i.test(a)?`${d}__fade-out-reverse`:`${d}__fade-out`:t?`${d}__fade-in`:`${d}__fade-out`;import{useEffect as F,useRef as nt}from"react";var H=(t,a)=>{let n=nt(a);F(()=>{n.current=a},[a]),F(()=>(window.addEventListener(t,n.current),()=>{window.removeEventListener(t,n.current)}),[t])};import{jsx as _,jsxs as J}from"react/jsx-runtime";var L=it(function({toastProps:a,pauseOnActivate:n},m){let{toastId:r,isVisible:y,timeOut:f,containerId:g,className:p,style:v,icon:o,updated:i,toastType:c,position:e,data:u,pauseOnHover:l,closeButton:I}=a,S=G({isVisible:y,position:e}),C=typeof u=="function"?u({toastId:r,close:()=>s.disappear(r,0),immediatelyClose:()=>{s.disappear(r,0),s.remove(r,0)},icons:{success:h.success,error:h.error,warn:h.warn,loading:h.loading,info:h.info},isVisible:y}):u,M=()=>{n&&s.resume(r)},x=()=>{n&&s.pause(r)};H("focus",M),H("blur",x),q(()=>{s.isActive(r)||(s.setActive(r),s.disappear(r,f))},[r]),q(()=>{i!==null&&s.disappear(r,f)},[i]);let N=o||(c==="custom"||c==="default"?null:h[c]);return _("output",{role:"status",ref:m,className:`${d}__toast-content-container`,"data-testid":`container-${g||"default"}`,onMouseEnter:()=>{l&&s.pause(r)},onMouseLeave:()=>{l&&s.resume(r)},children:J(U,{condition:c!=="custom",children:[_(Y,{children:J("div",{className:p??`${d}__toast-content ${d}__toast-${c} ${s.isActive(r)?"":S}`,style:v,children:[N&&_("span",{className:`${d}__toast-icon`,children:N}),C,I&&_("button",{className:`${d}__close-button`,onClick:()=>{s.disappear(r,0)},type:"button",children:_(B,{})})]})}),_(X,{children:_("div",{className:p??`${s.isActive(r)?"":S}`,children:C})})]})})});import{useSyncExternalStore as ct}from"react";var K=()=>ct(w.subscribe.bind(w),w.getSnapShot.bind(w),w.getSnapShot.bind(w));import{jsx as D,jsxs as lt}from"react/jsx-runtime";function Ft({className:t,style:a,position:n="top-center",containerId:m="",gap:r=9,reverse:y=!1,pauseOnActivate:f=!0}){let g=K(),p=Q({}),v=Q({}),o=e=>{var u;return(u=e.target)==null?void 0:u.element},i=e=>m?e.containerId===m:!e.containerId,c=g.filter(e=>!o(e)).reduce((e,u)=>{let l=u.position||n;return u.position=l,e[l]=e[l]||[],e[l].push(u),e},{});return lt("div",{id:`${d}__root`,"data-container-id":m,children:[g.filter(o).filter(i).map(e=>D(L,{ref:u=>{let l=e.target;if(!l||!u){delete v.current[e.toastId];return}let I=v.current[e.toastId]||l.element.getBoundingClientRect();v.current[e.toastId]={y:I.y,x:I.x};let[S,C]=l.offset||[0,0];u.style.top=`${I.y+C+window.scrollY}px`,u.style.left=`${I.x+S+window.scrollX}px`},toastProps:e,pauseOnActivate:f},e.toastId)),Object.entries(c).map(([e,u])=>{let l=u.filter(i),I=y?l.reverse():l;return D("div",{"data-testid":e,className:`${d}__z9999 ${t??`${d}__toast-container ${d}__${e}`}`,style:a,children:I.map((S,C,M)=>D(L,{ref:x=>{if(!x){delete p.current[S.toastId];return}let N=p.current[S.toastId]||x.getBoundingClientRect().height;p.current[S.toastId]=N;let Z=/left/.test(e)?50:/center/.test(e)?0:-50,j=/bottom/.test(e)?0:1,tt=M.filter(($,O)=>O<=C-j).reduce(($,O)=>/bottom/.test(e)?$-=r+p.current[O.toastId]:$+=r+p.current[O.toastId],0);x.style.transition="transform 0.2s cubic-bezier(0.43, 0.14, 0.2, 1.05)",x.style.transform=`translate(${Z}%, ${tt}px)`},toastProps:S,pauseOnActivate:f},S.toastId))},e)})]})}export{Ft as ToastContainer,s as toast,w as toastStore,K as useToasts};

package/dist/style.css

@@ -1 +1 @@
-@keyframes l3{to{transform:rotate(1turn)}}@keyframes react-strawberry-toast_fade-in{0%{transform:translateY(-100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:.2}}@keyframes react-strawberry-toast_fade-in-reverse{0%{transform:translateY(100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out-reverse{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:.2}}.react-strawberry-toast__z9999{z-index:9999}.react-strawberry-toast__toast-container{width:100%;position:fixed;z-index:9999;display:flex;align-items:center;flex-direction:column}.react-strawberry-toast__top-left{top:16px;left:calc(-50% + 16px)}.react-strawberry-toast__top-center{top:16px;left:50%;transform:translate(-50%)}.react-strawberry-toast__top-right{top:16px;right:calc(-50% + 16px)}.react-strawberry-toast__bottom-left{bottom:8px;left:calc(-50% + 16px)}.react-strawberry-toast__bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.react-strawberry-toast__bottom-right{bottom:8px;right:calc(-50% + 16px)}.react-strawberry-toast__toast-content-container{position:absolute;pointer-events:none}.react-strawberry-toast__toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.react-strawberry-toast__fade-in{animation:react-strawberry-toast_fade-in .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out{animation:react-strawberry-toast_fade-out .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-in-reverse{animation:react-strawberry-toast_fade-in-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out-reverse{animation:react-strawberry-toast_fade-out-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__loading{width:18px;padding:3.5px;aspect-ratio:1;border-radius:50%;background:#6f6f70;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}.react-strawberry-toast__toast-content{pointer-events:auto;box-sizing:border-box;background-color:#fff;padding:10px;display:flex;align-items:center;gap:5px;border-radius:8px;box-shadow:2px 4px 10px #0000001a;min-height:47px;max-width:368px}.react-strawberry-toast__close-button{background:transparent;border:none;outline:none;width:15px;height:15px;cursor:pointer}
+@keyframes l3{to{transform:rotate(1turn)}}@keyframes react-strawberry-toast_fade-in{0%{transform:translateY(-100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:.2}}@keyframes react-strawberry-toast_fade-in-reverse{0%{transform:translateY(100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out-reverse{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:.2}}.react-strawberry-toast__z9999{z-index:9999}.react-strawberry-toast__toast-container{width:100%;position:fixed;z-index:9999;display:flex;align-items:center;flex-direction:column}.react-strawberry-toast__top-left{top:16px;left:calc(-50% + 16px)}.react-strawberry-toast__top-center{top:16px;left:50%;transform:translate(-50%)}.react-strawberry-toast__top-right{top:16px;right:calc(-50% + 16px)}.react-strawberry-toast__bottom-left{bottom:8px;left:calc(-50% + 16px)}.react-strawberry-toast__bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.react-strawberry-toast__bottom-right{bottom:8px;right:calc(-50% + 16px)}.react-strawberry-toast__toast-content-container{position:absolute;pointer-events:none}.react-strawberry-toast__toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.react-strawberry-toast__fade-in{animation:react-strawberry-toast_fade-in .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out{animation:react-strawberry-toast_fade-out .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-in-reverse{animation:react-strawberry-toast_fade-in-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out-reverse{animation:react-strawberry-toast_fade-out-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__loading{width:18px;padding:3.5px;aspect-ratio:1;border-radius:50%;background:#6f6f70;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}.react-strawberry-toast__toast-content{pointer-events:auto;box-sizing:border-box;background-color:#fff;padding:10px;display:flex;align-items:center;gap:5px;border-radius:8px;box-shadow:2px 2px 6px 2px #0000001a;min-height:47px;max-width:368px}.react-strawberry-toast__close-button{background:transparent;border:none;outline:none;width:15px;height:15px;cursor:pointer}

package/dist/style2.css

@@ -1 +1 @@
-@keyframes l3{to{transform:rotate(1turn)}}@keyframes react-strawberry-toast_fade-in{0%{transform:translateY(-100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:.2}}@keyframes react-strawberry-toast_fade-in-reverse{0%{transform:translateY(100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out-reverse{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:.2}}.react-strawberry-toast__z9999{z-index:9999}.react-strawberry-toast__toast-container{width:100%;position:fixed;z-index:9999;display:flex;align-items:center;flex-direction:column}.react-strawberry-toast__top-left{top:16px;left:calc(-50% + 16px)}.react-strawberry-toast__top-center{top:16px;left:50%;transform:translate(-50%)}.react-strawberry-toast__top-right{top:16px;right:calc(-50% + 16px)}.react-strawberry-toast__bottom-left{bottom:8px;left:calc(-50% + 16px)}.react-strawberry-toast__bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.react-strawberry-toast__bottom-right{bottom:8px;right:calc(-50% + 16px)}.react-strawberry-toast__toast-content-container{position:absolute;pointer-events:none}.react-strawberry-toast__toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.react-strawberry-toast__fade-in{animation:react-strawberry-toast_fade-in .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out{animation:react-strawberry-toast_fade-out .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-in-reverse{animation:react-strawberry-toast_fade-in-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out-reverse{animation:react-strawberry-toast_fade-out-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__loading{width:18px;padding:3.5px;aspect-ratio:1;border-radius:50%;background:#6f6f70;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}.react-strawberry-toast__toast-content{pointer-events:auto;box-sizing:border-box;background-color:#fff;padding:10px 10px 10px 15px;display:flex;align-items:center;gap:5px;width:314px;border-radius:8px;box-shadow:2px 4px 10px #0000001a;min-height:54px;max-width:368px;position:relative}.react-strawberry-toast__toast-success:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#1dca82}.react-strawberry-toast__toast-error:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#eb2639}.react-strawberry-toast__toast-warn:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#fcba03}.react-strawberry-toast__toast-info:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#5365e7}.react-strawberry-toast__close-button{background:transparent;border:none;outline:none;width:15px;height:15px;cursor:pointer;position:absolute;right:0;transform:translate(-10px)}
+@keyframes l3{to{transform:rotate(1turn)}}@keyframes react-strawberry-toast_fade-in{0%{transform:translateY(-100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:.2}}@keyframes react-strawberry-toast_fade-in-reverse{0%{transform:translateY(100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out-reverse{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:.2}}.react-strawberry-toast__z9999{z-index:9999}.react-strawberry-toast__toast-container{width:100%;position:fixed;z-index:9999;display:flex;align-items:center;flex-direction:column}.react-strawberry-toast__top-left{top:16px;left:calc(-50% + 16px)}.react-strawberry-toast__top-center{top:16px;left:50%;transform:translate(-50%)}.react-strawberry-toast__top-right{top:16px;right:calc(-50% + 16px)}.react-strawberry-toast__bottom-left{bottom:8px;left:calc(-50% + 16px)}.react-strawberry-toast__bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.react-strawberry-toast__bottom-right{bottom:8px;right:calc(-50% + 16px)}.react-strawberry-toast__toast-content-container{position:absolute;pointer-events:none}.react-strawberry-toast__toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.react-strawberry-toast__fade-in{animation:react-strawberry-toast_fade-in .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out{animation:react-strawberry-toast_fade-out .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-in-reverse{animation:react-strawberry-toast_fade-in-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out-reverse{animation:react-strawberry-toast_fade-out-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__loading{width:18px;padding:3.5px;aspect-ratio:1;border-radius:50%;background:#6f6f70;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}.react-strawberry-toast__toast-content{pointer-events:auto;box-sizing:border-box;background-color:#fff;padding:10px 10px 10px 15px;display:flex;align-items:center;gap:5px;width:314px;border-radius:8px;box-shadow:2px 2px 6px 2px #0000001a;min-height:54px;max-width:368px;position:relative}.react-strawberry-toast__toast-success:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#1dca82}.react-strawberry-toast__toast-error:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#eb2639}.react-strawberry-toast__toast-warn:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#fcba03}.react-strawberry-toast__toast-info:before{content:"";display:inline-block;top:0;left:0;width:7px;height:100%;position:absolute;border-top-left-radius:8px;border-bottom-left-radius:8px;background-color:#5365e7}.react-strawberry-toast__close-button{background:transparent;border:none;outline:none;width:15px;height:15px;cursor:pointer;position:absolute;right:0;transform:translate(-10px)}

package/dist/style3.css

@@ -1 +1 @@
-@keyframes l3{to{transform:rotate(1turn)}}@keyframes react-strawberry-toast_fade-in{0%{transform:translateY(-100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:.2}}@keyframes react-strawberry-toast_fade-in-reverse{0%{transform:translateY(100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out-reverse{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:.2}}.react-strawberry-toast__z9999{z-index:9999}.react-strawberry-toast__toast-container{width:100%;position:fixed;z-index:9999;display:flex;align-items:center;flex-direction:column}.react-strawberry-toast__top-left{top:16px;left:calc(-50% + 16px)}.react-strawberry-toast__top-center{top:16px;left:50%;transform:translate(-50%)}.react-strawberry-toast__top-right{top:16px;right:calc(-50% + 16px)}.react-strawberry-toast__bottom-left{bottom:8px;left:calc(-50% + 16px)}.react-strawberry-toast__bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.react-strawberry-toast__bottom-right{bottom:8px;right:calc(-50% + 16px)}.react-strawberry-toast__toast-content-container{position:absolute;pointer-events:none}.react-strawberry-toast__toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.react-strawberry-toast__fade-in{animation:react-strawberry-toast_fade-in .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out{animation:react-strawberry-toast_fade-out .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-in-reverse{animation:react-strawberry-toast_fade-in-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out-reverse{animation:react-strawberry-toast_fade-out-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__loading{width:18px;padding:3.5px;aspect-ratio:1;border-radius:50%;background:#6f6f70;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}.react-strawberry-toast__toast-content{pointer-events:auto;box-sizing:border-box;padding:10px;display:flex;align-items:center;gap:5px;width:314px;border-radius:8px;box-shadow:2px 4px 10px #0000001a;min-height:54px;max-width:368px;position:relative;background-color:#fff}.react-strawberry-toast__toast-success{color:#fff;background-color:#1dca82}.react-strawberry-toast__toast-error{color:#fff;background-color:#eb2639}.react-strawberry-toast__toast-warn{color:#fff;background-color:#fcba03}.react-strawberry-toast__toast-info{color:#fff;background-color:#5365e7}.react-strawberry-toast__close-button{background:transparent;border:none;outline:none;width:15px;height:15px;cursor:pointer;position:absolute;right:0;transform:translate(-10px)}svg .react-strawberry-toast-path{fill:#fff}
+@keyframes l3{to{transform:rotate(1turn)}}@keyframes react-strawberry-toast_fade-in{0%{transform:translateY(-100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out{0%{transform:translateY(0);opacity:1}to{transform:translateY(-100%);opacity:.2}}@keyframes react-strawberry-toast_fade-in-reverse{0%{transform:translateY(100%) scale(.2);opacity:.2}to{transform:translateY(0) scale(1);opacity:1}}@keyframes react-strawberry-toast_fade-out-reverse{0%{transform:translateY(0);opacity:1}to{transform:translateY(100%);opacity:.2}}.react-strawberry-toast__z9999{z-index:9999}.react-strawberry-toast__toast-container{width:100%;position:fixed;z-index:9999;display:flex;align-items:center;flex-direction:column}.react-strawberry-toast__top-left{top:16px;left:calc(-50% + 16px)}.react-strawberry-toast__top-center{top:16px;left:50%;transform:translate(-50%)}.react-strawberry-toast__top-right{top:16px;right:calc(-50% + 16px)}.react-strawberry-toast__bottom-left{bottom:8px;left:calc(-50% + 16px)}.react-strawberry-toast__bottom-center{bottom:8px;left:50%;transform:translate(-50%)}.react-strawberry-toast__bottom-right{bottom:8px;right:calc(-50% + 16px)}.react-strawberry-toast__toast-content-container{position:absolute;pointer-events:none}.react-strawberry-toast__toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center}.react-strawberry-toast__fade-in{animation:react-strawberry-toast_fade-in .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out{animation:react-strawberry-toast_fade-out .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-in-reverse{animation:react-strawberry-toast_fade-in-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__fade-out-reverse{animation:react-strawberry-toast_fade-out-reverse .3s cubic-bezier(.43,.14,.2,1.05)}.react-strawberry-toast__loading{width:18px;padding:3.5px;aspect-ratio:1;border-radius:50%;background:#6f6f70;--_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;-webkit-mask:var(--_m);mask:var(--_m);-webkit-mask-composite:source-out;mask-composite:subtract;animation:l3 1s infinite linear}.react-strawberry-toast__toast-content{pointer-events:auto;box-sizing:border-box;padding:10px;display:flex;align-items:center;gap:5px;width:314px;border-radius:8px;box-shadow:2px 2px 6px 2px #0000001a;min-height:54px;max-width:368px;position:relative;background-color:#fff}.react-strawberry-toast__toast-success{color:#fff;background-color:#1dca82}.react-strawberry-toast__toast-error{color:#fff;background-color:#eb2639}.react-strawberry-toast__toast-warn{color:#fff;background-color:#fcba03}.react-strawberry-toast__toast-info{color:#fff;background-color:#5365e7}.react-strawberry-toast__close-button{background:transparent;border:none;outline:none;width:15px;height:15px;cursor:pointer;position:absolute;right:0;transform:translate(-10px)}svg .react-strawberry-toast-path{fill:#fff}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-strawberry-toast",
   "description": "A simple and customizable React toast library",
-  "version": "1.6.2",
+  "version": "2.0.0",
   "author": "dkpark10",
   "license": "MIT",
   "keywords": [