react-next-toast/dist/index.js

A premium, modern toast notification system for React applications

"use strict";var D=Object.defineProperty;var ft=Object.getOwnPropertyDescriptor;var mt=Object.getOwnPropertyNames;var ut=Object.prototype.hasOwnProperty;var xt=(t,o)=>{for(var s in o)D(t,s,{get:o[s],enumerable:!0})},Tt=(t,o,s,i)=>{if(o&&typeof o=="object"||typeof o=="function")for(let e of mt(o))!ut.call(t,e)&&e!==s&&D(t,e,{get:()=>o[e],enumerable:!(i=ft(o,e))||i.enumerable});return t};var yt=t=>Tt(D({},"__esModule",{value:!0}),t);var It={};xt(It,{CloseIcon:()=>E,ErrorIcon:()=>v,Icon:()=>st,InfoIcon:()=>y,LoadingIcon:()=>H,SuccessIcon:()=>k,Toast:()=>M,ToastContainer:()=>O,ToastNotification:()=>pt,ToastProvider:()=>lt,ToastTypeEnum:()=>j,TrashIcon:()=>rt,WarningIcon:()=>w,colors:()=>g,getVariantIcon:()=>L,injectStyles:()=>W,showToast:()=>wt,theme:()=>C,toast:()=>b,useToast:()=>ct});module.exports=yt(It);var f=require("react"),nt=require("react-dom/client");var it=require("react");var g={success:"#10B981",error:"#EF4444",warning:"#F59E0B",info:"#3B82F6",loading:"#6366F1",default:"#6B7280"},C={dark:{surface:"rgba(23, 25, 30, 0.92)",surfaceSolid:"#17191E",border:"rgba(255, 255, 255, 0.08)",textPrimary:"#FFFFFF",textSecondary:"#9CA3AF",backdrop:"rgba(0, 0, 0, 0.4)"},light:{surface:"rgba(255, 255, 255, 0.92)",surfaceSolid:"#FFFFFF",border:"rgba(0, 0, 0, 0.08)",textPrimary:"#111827",textSecondary:"#6B7280",backdrop:"rgba(255, 255, 255, 0.4)"}},ht=`
@keyframes toast-slide-in-right {
  from {
    transform: translateX(100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes toast-slide-out-right {
  from {
    transform: translateX(0);
    opacity: 1;
  }
  to {
    transform: translateX(100%);
    opacity: 0;
  }
}

@keyframes toast-slide-in-left {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes toast-slide-out-left {
  from {
    transform: translateX(0);
    opacity: 1;
  }
  to {
    transform: translateX(-100%);
    opacity: 0;
  }
}

@keyframes toast-slide-in-top {
  from {
    transform: translateY(-100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes toast-slide-in-bottom {
  from {
    transform: translateY(100%);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes toast-spinner {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@keyframes toast-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
`,_=!1;function W(){if(_||typeof document>"u")return;let t=document.createElement("style");t.id="react-next-toast-styles",t.textContent=ht,document.head.appendChild(t),_=!0}var G=(t,o,s)=>{let i=t.startsWith("top"),e=t.endsWith("left"),a=t.endsWith("center");return{position:"fixed",zIndex:999999,pointerEvents:"none",display:"flex",flexDirection:i?"column":"column-reverse",gap:`${s}px`,padding:"16px",maxHeight:"100vh",boxSizing:"border-box",...i?{top:0}:{bottom:0},...a?{left:"50%",transform:"translateX(-50%)"}:e?{left:0}:{right:0}}},$=(t,o,s)=>{let i=C[o];return{position:"relative",pointerEvents:"auto",display:"flex",alignItems:"flex-start",gap:"12px",width:"380px",maxWidth:"calc(100vw - 32px)",padding:"14px 16px",backgroundColor:i.surface,backdropFilter:"blur(12px)",WebkitBackdropFilter:"blur(12px)",border:`1px solid ${i.border}`,borderRadius:"12px",boxShadow:o==="dark"?"0 4px 24px rgba(0, 0, 0, 0.4), 0 1px 3px rgba(0, 0, 0, 0.2)":"0 4px 24px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04)",overflow:"hidden",animation:s?"toast-slide-out-right 0.2s ease-in forwards":"toast-slide-in-right 0.3s ease-out"}},Y=t=>({position:"absolute",left:0,top:0,bottom:0,width:"3px",backgroundColor:g[t]||g.default,borderRadius:"3px 0 0 3px"}),z=t=>({flexShrink:0,display:"flex",alignItems:"center",justifyContent:"center",width:"24px",height:"24px",marginTop:"1px"}),Z={flex:1,minWidth:0,display:"flex",flexDirection:"column",gap:"2px"},q=t=>({margin:0,fontSize:"14px",fontWeight:500,lineHeight:1.4,color:C[t].textPrimary,fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'}),J=t=>({margin:0,fontSize:"13px",fontWeight:400,lineHeight:1.4,color:C[t].textSecondary,fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'}),K={display:"flex",alignItems:"center",gap:"8px",flexShrink:0,marginLeft:"auto"},Q=t=>({padding:"6px 12px",fontSize:"13px",fontWeight:500,color:"#3B82F6",backgroundColor:"transparent",border:"none",borderRadius:"6px",cursor:"pointer",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',transition:"background-color 0.15s ease"}),tt=t=>({display:"flex",alignItems:"center",justifyContent:"center",width:"24px",height:"24px",padding:0,backgroundColor:"transparent",border:"none",borderRadius:"6px",cursor:"pointer",color:C[t].textSecondary,opacity:.6,transition:"opacity 0.15s ease, background-color 0.15s ease"}),ot={width:"20px",height:"20px",animation:"toast-spinner 1s linear infinite"};var I=require("react");var r=require("react/jsx-runtime"),k=({size:t=20,color:o=g.success})=>(0,r.jsxs)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,r.jsx)("rect",{width:"24",height:"24",rx:"6",fill:o,fillOpacity:"0.15"}),(0,r.jsx)("path",{d:"M7.5 12L10.5 15L16.5 9",stroke:o,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),v=({size:t=20,color:o=g.error})=>(0,r.jsxs)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,r.jsx)("circle",{cx:"12",cy:"12",r:"10",fill:o,fillOpacity:"0.15"}),(0,r.jsx)("circle",{cx:"12",cy:"12",r:"10",stroke:o,strokeWidth:"1.5"}),(0,r.jsx)("path",{d:"M12 8V12",stroke:o,strokeWidth:"2",strokeLinecap:"round"}),(0,r.jsx)("circle",{cx:"12",cy:"16",r:"1",fill:o})]}),w=({size:t=20,color:o=g.warning})=>(0,r.jsxs)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,r.jsx)("path",{d:"M12 3L22 20H2L12 3Z",fill:o,fillOpacity:"0.15",stroke:o,strokeWidth:"1.5",strokeLinejoin:"round"}),(0,r.jsx)("path",{d:"M12 10V14",stroke:o,strokeWidth:"2",strokeLinecap:"round"}),(0,r.jsx)("circle",{cx:"12",cy:"17",r:"1",fill:o})]}),y=({size:t=20,color:o=g.info})=>(0,r.jsxs)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,r.jsx)("circle",{cx:"12",cy:"12",r:"10",fill:o,fillOpacity:"0.15"}),(0,r.jsx)("circle",{cx:"12",cy:"12",r:"10",stroke:o,strokeWidth:"1.5"}),(0,r.jsx)("circle",{cx:"12",cy:"8",r:"1",fill:o}),(0,r.jsx)("path",{d:"M12 11V16",stroke:o,strokeWidth:"2",strokeLinecap:"round"})]}),H=({size:t=20,color:o=g.loading})=>(0,r.jsxs)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",style:ot,children:[(0,r.jsx)("circle",{cx:"12",cy:"12",r:"10",stroke:o,strokeOpacity:"0.2",strokeWidth:"2.5"}),(0,r.jsx)("path",{d:"M12 2C6.48 2 2 6.48 2 12",stroke:o,strokeWidth:"2.5",strokeLinecap:"round"})]}),E=({size:t=16,color:o="currentColor"})=>(0,r.jsx)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:(0,r.jsx)("path",{d:"M18 6L6 18M6 6L18 18",stroke:o,strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})}),rt=({size:t=20,color:o="#9CA3AF"})=>(0,r.jsxs)("svg",{width:t,height:t,viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:[(0,r.jsx)("path",{d:"M3 6H21M19 6V20C19 21 18 22 17 22H7C6 22 5 21 5 20V6M8 6V4C8 3 9 2 10 2H14C15 2 16 3 16 4V6",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),(0,r.jsx)("path",{d:"M10 11V17M14 11V17",stroke:o,strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"})]}),et={success:k,error:v,warning:w,info:y,loading:H,default:y};function L(t){let o=et[t]||et.default;return(0,r.jsx)(o,{})}var st={Success:()=>(0,r.jsx)(k,{}),Error:()=>(0,r.jsx)(v,{}),Warning:()=>(0,r.jsx)(w,{}),Info:()=>(0,r.jsx)(y,{})};var p=require("react/jsx-runtime"),M=({toast:t,theme:o,onDismiss:s})=>{let[i,e]=(0,I.useState)(!1),a=(0,I.useCallback)(()=>{e(!0),setTimeout(()=>{s(t?.id)},200)},[t?.id,s]);(0,I.useEffect)(()=>{if(t?.duration===0)return;let c=setTimeout(()=>{a()},t?.duration);return()=>clearTimeout(c)},[t?.duration,a]);let l=()=>{t?.action?.onClick(),a()};return(0,p.jsxs)("div",{style:$(t?.variant,o,i),role:"alert","aria-live":"polite","data-toast-id":t?.id,children:[(0,p.jsx)("div",{style:Y(t?.variant)}),(0,p.jsx)("div",{style:z(t?.variant),children:t?.icon||L(t?.variant)}),(0,p.jsxs)("div",{style:Z,children:[(0,p.jsx)("p",{style:q(o),children:t?.title}),t?.description&&(0,p.jsx)("p",{style:J(o),children:t?.description})]}),(0,p.jsxs)("div",{style:K,children:[t.action&&(0,p.jsx)("button",{style:Q(o),onClick:l,onMouseEnter:c=>{c.currentTarget.style.backgroundColor=o==="dark"?"rgba(59, 130, 246, 0.1)":"rgba(59, 130, 246, 0.08)"},onMouseLeave:c=>{c.currentTarget.style.backgroundColor="transparent"},children:t?.action?.label}),t.dismissible&&(0,p.jsx)("button",{style:tt(o),onClick:a,onMouseEnter:c=>{c.currentTarget.style.opacity="1",c.currentTarget.style.backgroundColor=o==="dark"?"rgba(255, 255, 255, 0.08)":"rgba(0, 0, 0, 0.05)"},onMouseLeave:c=>{c.currentTarget.style.opacity="0.6",c.currentTarget.style.backgroundColor="transparent"},"aria-label":"Dismiss notification",children:(0,p.jsx)(E,{size:14})})]})]})};var R=require("react/jsx-runtime"),O=({toasts:t,onDismiss:o,position:s="bottom-right",theme:i="dark",maxVisible:e=5,gap:a=12})=>{(0,it.useEffect)(()=>{W()},[]);let l=t.reduce((n,m)=>{let u=m.position||s;return n[u]||(n[u]=[]),n[u].push(m),n},{}),c=Object.entries(l).reduce((n,[m,u])=>(n[m]=u.slice(-e),n),{}),A=n=>typeof window>"u"?n:window.innerWidth<640&&(n==="bottom-right"||n==="bottom-left")?"top-center":n;return(0,R.jsx)(R.Fragment,{children:Object.entries(c).map(([n,m])=>{let u=A(n);return(0,R.jsx)("div",{style:G(u,i,a),"data-toast-container":n,children:m.map(S=>(0,R.jsx)(M,{toast:S,theme:i,onDismiss:o},S.id))},n)})})};var V=require("react/jsx-runtime"),at=(0,f.createContext)(null),ct=()=>{let t=(0,f.useContext)(at);if(!t)throw new Error("useToast must be used within a ToastProvider");return t},lt=({children:t,position:o="bottom-right",theme:s="dark",maxVisible:i=5,gap:e=12})=>{let[a,l]=(0,f.useState)([]),c=()=>`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`,A=(0,f.useCallback)((S,N,x={})=>{let U=x.id||c(),dt={id:U,variant:S,title:N,description:x.description,duration:x.duration??5e3,dismissible:x.dismissible??!0,action:x.action,icon:x.icon,position:x.position??o,createdAt:Date.now()};return l(gt=>[...gt,dt]),U},[o]),n=(0,f.useCallback)(S=>{l(N=>N.filter(x=>x.id!==S))},[]),m=(0,f.useCallback)(()=>{l([])},[]),u={toasts:a,addToast:A,dismissToast:n,dismissAll:m};return(0,V.jsxs)(at.Provider,{value:u,children:[t,(0,V.jsx)(O,{toasts:a,onDismiss:n,position:o,theme:s,maxVisible:i,gap:e})]})},B=null,d={toasts:[]},h={position:"bottom-right",theme:"dark",maxVisible:5,gap:12};function bt(){if(!(typeof document>"u")){if(!B){let t=document.createElement("div");t.id="react-next-toast-root",document.body.appendChild(t),B=(0,nt.createRoot)(t)}P()}}function P(){if(!B)return;let t=o=>{d={...d,toasts:d.toasts.filter(s=>s.id!==o)},P()};B.render((0,V.jsx)(O,{toasts:d.toasts,onDismiss:t,position:h.position,theme:h.theme,maxVisible:h.maxVisible,gap:h.gap}))}function St(){return`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`}function T(t,o,s={}){bt();let i=s.id||St(),e={id:i,variant:t,title:o,description:s.description,duration:s.duration??5e3,dismissible:s.dismissible??!0,action:s.action,icon:s.icon,position:s.position??h.position??"bottom-right",createdAt:Date.now()};return d={...d,toasts:[...d.toasts,e]},P(),i}function X(t){d={...d,toasts:d.toasts.filter(o=>o.id!==t)},P()}function Ct(){d={toasts:[]},P()}var b=Object.assign((t,o)=>T("default",t,o),{success:(t,o)=>T("success",t,o),error:(t,o)=>T("error",t,o),warning:(t,o)=>T("warning",t,o),info:(t,o)=>T("info",t,o),loading:(t,o)=>T("loading",t,{...o,duration:0}),dismiss:X,dismissAll:Ct,promise:async function(t,o,s){let i=T("loading",o.loading,{...s,duration:0});try{let e=await t;X(i);let a=typeof o.success=="function"?o.success(e):o.success;return T("success",a,s),e}catch(e){X(i);let a=typeof o.error=="function"?o.error(e):o.error;throw T("error",a,s),e}},configure:t=>{h={...h,...t},P()}});var j=(e=>(e.SUCCESS="success",e.ERROR="error",e.WARNING="warning",e.INFO="info",e))(j||{});var F=require("react/jsx-runtime"),kt={success:k,error:v,warning:w,info:y},vt=({message:t,backgroundColor:o,textColor:s,type:i,position:e})=>{let a=kt[i]||y,l={top:"30px",bottom:"30px",right:"10px",left:"10px"},c={position:"fixed",top:e==="top-right"||e==="top-left"||!e?l.top:void 0,bottom:e==="bottom-right"||e==="bottom-left"||!e?l.bottom:void 0,right:e==="top-right"||e==="bottom-right"||!e?l.right:void 0,left:e==="top-left"||e==="bottom-left"||e==="left"?l.left:void 0,maxWidth:"30%",minWidth:"320px",maxHeight:"max-content",backgroundColor:o||(i==="success"?"#10B981":i==="error"?"#EF4444":i==="warning"?"#F59E0B":i==="info"?"#3B82F6":"#6B7280"),border:"1px solid rgba(255, 255, 255, 0.1)",borderRadius:"12px",display:"flex",alignItems:"center",gap:"12px",paddingInline:"16px",paddingBlock:"14px",zIndex:99999999,backdropFilter:"blur(12px)"};return(0,F.jsxs)("div",{style:c,"data-toast-container":!0,children:[(0,F.jsx)("div",{style:{flexShrink:0},children:(0,F.jsx)(a,{size:20,color:"#FFFFFF"})}),(0,F.jsx)("p",{style:{color:s||"#FFFFFF",fontSize:"14px",fontWeight:500,maxHeight:"100px",overflowX:"hidden",overflowY:"visible",textOverflow:"ellipsis",whiteSpace:"pre-line",fontFamily:'-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',margin:0},dangerouslySetInnerHTML:{__html:t}})]})},pt=vt;var wt={success:(t,o)=>b.success(t,{duration:o}),error:(t,o)=>b.error(t,{duration:o}),warning:(t,o)=>b.warning(t,{duration:o}),info:(t,o)=>b.info(t,{duration:o})};0&&(module.exports={CloseIcon,ErrorIcon,Icon,InfoIcon,LoadingIcon,SuccessIcon,Toast,ToastContainer,ToastNotification,ToastProvider,ToastTypeEnum,TrashIcon,WarningIcon,colors,getVariantIcon,injectStyles,showToast,theme,toast,useToast});
//# sourceMappingURL=index.js.map