react-toast-kit
Version:
A modern, accessible toast notification system for React applications with automatic CSS injection
31 lines • 34.7 kB
JavaScript
import {create}from'zustand';import*as Z from'react';import {jsxs,Fragment,jsx}from'react/jsx-runtime';/* React Toast Kit - CSS auto-injection enabled */
var oe=(r=>typeof require<"u"?require:typeof Proxy<"u"?new Proxy(r,{get:(e,s)=>(typeof require<"u"?require:e)[s]}):r)(function(r){if(typeof require<"u")return require.apply(this,arguments);throw Error('Dynamic require of "'+r+'" is not supported')});var w=4e3,U="top-right",z="system",X=3,A="slide",D="solid",M=()=>{if(typeof window>"u"||typeof window.matchMedia!="function")return "light";try{if(window.matchMedia("(prefers-color-scheme: dark)").matches||window.matchMedia("(-apple-system-interface-style: dark)").matches)return "dark";let s=document.documentElement,l=document.body;if(s?.classList.contains("dark")||l?.classList.contains("dark")||s?.classList.contains("theme-dark")||l?.classList.contains("theme-dark")||s?.dataset.theme==="dark"||l?.dataset.theme==="dark")return "dark";if(typeof window.getComputedStyle=="function"){let a=window.getComputedStyle(document.body),v=window.getComputedStyle(document.documentElement),c=a.backgroundColor||v.backgroundColor||"";if(c){let T=c.match(/\d+/g)?.map(Number);if(T&&T.length>=3&&(.299*T[0]+.587*T[1]+.114*T[2])/255<.5)return "dark"}}return "light"}catch(r){return console.warn("React Toast Kit: Error detecting system theme, falling back to light mode",r),"light"}},u=(r,e)=>{if(typeof window>"u")return e;try{let s=window.__TOAST_CONFIG__;if(s&&typeof s=="object"&&r in s)return s[r]}catch(s){console.warn(`React Toast Kit: Failed to get config value for ${r}`,s);}return e},g=create((r,e)=>({toasts:[],maxToasts:X,theme:z,effectiveTheme:M(),pausedToasts:new Set,activeTimers:new Map,plugins:[],addToast:s=>{try{let{toasts:l,maxToasts:a,plugins:v,activeTimers:c,pausedToasts:T}=e(),t=s;v.forEach(y=>{if(y.beforeCreate){let d=y.beforeCreate(t),C;(d.style||t.style)&&(C={...t.style||{},...d.style||{}}),t={id:d.id||t.id,variant:d.variant||t.variant,position:d.position||t.position,duration:d.duration!==void 0?d.duration:t.duration,pauseOnHover:d.pauseOnHover!==void 0?d.pauseOnHover:t.pauseOnHover,dismissible:d.dismissible!==void 0?d.dismissible:t.dismissible,dismissOnClick:d.dismissOnClick!==void 0?d.dismissOnClick:t.dismissOnClick,theme:d.theme||t.theme,createdAt:t.createdAt,title:d.title||t.title,description:d.description||t.description,icon:d.icon||t.icon,component:d.component||t.component,onDismiss:d.onDismiss||t.onDismiss,className:d.className||t.className,style:C,animation:d.animation||t.animation,customAnimation:d.customAnimation||t.customAnimation,visualStyle:d.visualStyle||t.visualStyle,progressBarStyle:d.progressBarStyle||t.progressBarStyle,progressBarColor:d.progressBarColor||t.progressBarColor,progressBarPosition:d.progressBarPosition||t.progressBarPosition,progressBarThickness:d.progressBarThickness||t.progressBarThickness,floating:d.floating!==void 0?d.floating:t.floating,emoji:d.emoji||t.emoji,rippleEffect:d.rippleEffect!==void 0?d.rippleEffect:t.rippleEffect,stagger:d.stagger!==void 0?d.stagger:t.stagger,swipeToDismiss:d.swipeToDismiss!==void 0?d.swipeToDismiss:t.swipeToDismiss,priority:d.priority||t.priority,progressAnimation:d.progressAnimation||t.progressAnimation,iconString:t.iconString,updating:t.updating,timerId:t.timerId};}});let h=l.length;if(t.priority==="high")h=0;else if(t.priority==="normal"){let y=l.findIndex(d=>d.priority==="low");y!==-1&&(h=y);}if(l.length>=a){let y=[...l].sort((d,C)=>d.createdAt-C.createdAt).find(d=>d.id!==t.id);y&&e().removeToast(y.id);}let S=[...l];if(S.splice(h,0,t),r({toasts:S}),t.duration&&t.duration>0&&!T.has(t.id)){let y=c.get(t.id);y&&clearTimeout(y);let d=window.setTimeout(()=>{e().removeToast(t.id);},t.duration);r(C=>({activeTimers:new Map(C.activeTimers).set(t.id,d)}));}return v.forEach(y=>{y.afterCreate&&y.afterCreate(t);}),t.stagger&&t.stagger>0&&setTimeout(()=>{},t.stagger),t.id}catch(l){return console.error("React Toast Kit: Failed to add toast",l),""}},removeToast:s=>{try{let{toasts:l,plugins:a,activeTimers:v}=e(),c=l.find(h=>h.id===s);if(!c)return;let T=!0;if(a.forEach(h=>{h.beforeRemove&&h.beforeRemove(c)===!1&&(T=!1);}),!T)return;let t=v.get(s);t&&clearTimeout(t),c.onDismiss&&c.onDismiss(s),r(h=>({toasts:h.toasts.filter(S=>S.id!==s),pausedToasts:new Set([...h.pausedToasts].filter(S=>S!==s)),activeTimers:new Map([...h.activeTimers].filter(([S])=>S!==s))})),a.forEach(h=>{h.afterRemove&&h.afterRemove(c);});}catch(l){console.error("React Toast Kit: Failed to remove toast",l);}},updateToast:(s,l)=>{try{let{activeTimers:a}=e();r(v=>({toasts:v.toasts.map(c=>{if(c.id===s){let T={...c,...l,updating:!0};if(l.duration!==void 0&&T.duration!==c.duration){let t=a.get(s);if(t&&clearTimeout(t),T.duration>0&&!v.pausedToasts.has(s)){let h=window.setTimeout(()=>{e().removeToast(s);},T.duration);setTimeout(()=>{r(S=>({activeTimers:new Map(S.activeTimers).set(s,h)}));},0);}}return T}return c})})),setTimeout(()=>{r(v=>({toasts:v.toasts.map(c=>c.id===s?{...c,updating:!1}:c)}));},100);}catch(a){console.error("React Toast Kit: Failed to update toast",a);}},pauseToast:s=>{let{activeTimers:l}=e(),a=l.get(s);a&&(clearTimeout(a),r(v=>{let c=new Map(v.activeTimers);return c.delete(s),{activeTimers:c}})),r(v=>({pausedToasts:new Set(v.pausedToasts).add(s)}));},resumeToast:s=>{let{toasts:l}=e();r(v=>{let c=new Set(v.pausedToasts);return c.delete(s),{pausedToasts:c}});let a=l.find(v=>v.id===s);if(a&&a.duration&&a.duration>0){let v=Date.now()-a.createdAt,c=Math.max(0,a.duration-v),T=window.setTimeout(()=>{e().removeToast(s);},c);r(t=>({activeTimers:new Map(t.activeTimers).set(s,T)}));}},clearAllToasts:()=>{try{let{toasts:s,activeTimers:l}=e();l.forEach(a=>clearTimeout(a)),s.forEach(a=>{a.onDismiss&&a.onDismiss(a.id);}),r({toasts:[],pausedToasts:new Set,activeTimers:new Map});}catch(s){console.error("React Toast Kit: Failed to clear all toasts",s);}},setTheme:s=>{r({theme:s}),e().updateEffectiveTheme();},setMaxToasts:s=>{let l=Math.max(1,s);r({maxToasts:l});},updateEffectiveTheme:()=>{let{theme:s}=e(),l;s==="system"?l=M():l=s,r({effectiveTheme:l});},cleanup:()=>{try{let{activeTimers:s,toasts:l}=e();s.forEach(a=>clearTimeout(a)),l.forEach(a=>{a.onDismiss&&a.onDismiss(a.id);}),r({toasts:[],pausedToasts:new Set,activeTimers:new Map});}catch(s){console.error("React Toast Kit: Failed to cleanup",s);}},registerPlugin:s=>{try{r(l=>({plugins:[...l.plugins.filter(a=>a.name!==s.name),s]}));}catch(l){console.error("React Toast Kit: Failed to register plugin",l);}},unregisterPlugin:s=>{try{r(l=>({plugins:l.plugins.filter(a=>a.name!==s)}));}catch(l){console.error("React Toast Kit: Failed to unregister plugin",l);}}})),L=false,I=()=>{if(!(L||typeof window>"u"||typeof window.matchMedia!="function"))try{let r=window.matchMedia("(prefers-color-scheme: dark)");typeof r.addEventListener=="function"?r.addEventListener("change",()=>{let{theme:e}=g.getState();e==="system"&&g.getState().updateEffectiveTheme();}):typeof r.addListener=="function"&&r.addListener(()=>{let{theme:e}=g.getState();e==="system"&&g.getState().updateEffectiveTheme();});try{let e=window.matchMedia("(-apple-system-interface-style: dark)");typeof e.addEventListener=="function"&&e.addEventListener("change",()=>{let{theme:s}=g.getState();s==="system"&&g.getState().updateEffectiveTheme();});}catch{}if(typeof MutationObserver=="function"){new MutationObserver(()=>{let{theme:l}=g.getState();l==="system"&&g.getState().updateEffectiveTheme();}).observe(document.documentElement,{attributes:!0,attributeFilter:["class","data-theme"]});let s=new MutationObserver(()=>{let{theme:l}=g.getState();l==="system"&&g.getState().updateEffectiveTheme();});document.body&&s.observe(document.body,{attributes:!0,attributeFilter:["class","data-theme"]});}L=!0;}catch(r){console.warn("React Toast Kit: Error setting up theme change listeners",r);}};typeof window<"u"&&typeof document<"u"&&(document.readyState==="loading"?document.addEventListener("DOMContentLoaded",I):I(),g.getState().updateEffectiveTheme());var q=()=>Math.random().toString(36).substring(2,9),j={success:`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Success">
<path d="M10 18.3333C14.6024 18.3333 18.3334 14.6023 18.3334 9.99996C18.3334 5.39759 14.6024 1.66663 10 1.66663C5.39765 1.66663 1.66669 5.39759 1.66669 9.99996C1.66669 14.6023 5.39765 18.3333 10 18.3333Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M6.66669 10L9.16669 12.5L13.3334 7.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>`,error:`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Error">
<path d="M10 18.3333C14.6024 18.3333 18.3334 14.6023 18.3334 9.99996C18.3334 5.39759 14.6024 1.66663 10 1.66663C5.39765 1.66663 1.66669 5.39759 1.66669 9.99996C1.66669 14.6023 5.39765 18.3333 10 18.3333Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12.5 7.5L7.5 12.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M7.5 7.5L12.5 12.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>`,warning:`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Warning">
<path d="M8.57465 3.21667L1.51632 15C1.37079 15.2589 1.29379 15.5503 1.29298 15.8469C1.29216 16.1434 1.36756 16.4353 1.51175 16.6951C1.65593 16.9548 1.86359 17.1738 2.11656 17.3309C2.36954 17.4879 2.65908 17.5778 2.95548 17.5917H17.0721C17.3685 17.5778 17.6581 17.4879 17.9111 17.3309C18.164 17.1738 18.3717 16.9548 18.5159 16.6951C18.6601 16.4353 18.7355 16.1434 18.7347 15.8469C18.7339 15.5503 18.6569 15.2589 18.5113 15L11.453 3.21667C11.3018 2.96735 11.0893 2.7609 10.8353 2.61224C10.5813 2.46357 10.294 2.3779 10.0005 2.3646C9.7069 2.37798 9.41956 2.46374 9.16556 2.61247C8.91156 2.76121 8.69907 2.96773 8.54798 3.21708L8.57465 3.21667Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 7.5V10.8333" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 14.1667H10.0083" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>`,info:`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Info">
<path d="M10 18.3333C14.6024 18.3333 18.3334 14.6023 18.3334 9.99996C18.3334 5.39759 14.6024 1.66663 10 1.66663C5.39765 1.66663 1.66669 5.39759 1.66669 9.99996C1.66669 14.6023 5.39765 18.3333 10 18.3333Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 13.3333V10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 6.66663H10.0083" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>`,default:`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Notification">
<path d="M18.3334 10C18.3334 14.6024 14.6024 18.3333 10 18.3333C5.39765 18.3333 1.66669 14.6024 1.66669 10C1.66669 5.39763 5.39765 1.66667 10 1.66667C14.6024 1.66667 18.3334 5.39763 18.3334 10Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 6.66667V10" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 13.3333H10.0083" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>`,loading:`<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" class="animate-spin" role="img" aria-label="Loading">
<path d="M10 3.33337V5.00004" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 15V16.6667" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.1084 4.1084L5.2834 5.28257" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.7166 14.7167L15.8916 15.8917" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M3.33337 10H5.00004" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M15 10H16.6667" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M4.1084 15.8917L5.2834 14.7167" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M14.7166 5.28257L15.8916 4.1084" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>`},O=r=>{try{let e;typeof r=="string"?e={description:r,duration:u("defaultDuration",w),dismissible:u("defaultDismissible",!0),pauseOnHover:u("defaultPauseOnHover",!0),dismissOnClick:u("defaultDismissOnClick",!1),animation:u("defaultAnimation",A),visualStyle:u("defaultStyle",D),progressBarStyle:u("defaultProgressBarStyle",void 0),progressBarColor:u("defaultProgressBarColor",void 0),progressBarPosition:u("defaultProgressBarPosition","bottom"),progressBarThickness:u("defaultProgressBarThickness",3),progressAnimation:u("defaultProgressAnimation","linear"),floating:u("defaultFloating",!1),rippleEffect:u("defaultRippleEffect",!1),swipeToDismiss:u("defaultSwipeToDismiss",!1),priority:u("defaultPriority","normal"),stagger:u("defaultStagger",0)}:e={duration:u("defaultDuration",w),dismissible:u("defaultDismissible",!0),pauseOnHover:u("defaultPauseOnHover",!0),dismissOnClick:u("defaultDismissOnClick",!1),animation:u("defaultAnimation",A),visualStyle:u("defaultStyle",D),progressBarStyle:u("defaultProgressBarStyle",void 0),progressBarColor:u("defaultProgressBarColor",void 0),progressBarPosition:u("defaultProgressBarPosition","bottom"),progressBarThickness:u("defaultProgressBarThickness",3),progressAnimation:u("defaultProgressAnimation","linear"),floating:u("defaultFloating",!1),rippleEffect:u("defaultRippleEffect",!1),swipeToDismiss:u("defaultSwipeToDismiss",!1),priority:u("defaultPriority","normal"),stagger:u("defaultStagger",0),...r};let s=u("globalClassName",void 0),l=u("globalStyle",void 0);s&&(e.className=e.className?`${s} ${e.className}`:s),l&&typeof l=="object"&&(e.style={...l,...e.style||{}});let a={id:e.id||q(),variant:e.variant||"default",position:e.position||U,duration:e.duration!==void 0?e.duration:w,pauseOnHover:e.pauseOnHover!==void 0?e.pauseOnHover:!0,dismissible:e.dismissible!==void 0?e.dismissible:!0,dismissOnClick:e.dismissOnClick!==void 0?e.dismissOnClick:!1,theme:e.theme||z,title:e.title,description:e.description,icon:e.icon,component:e.component,createdAt:Date.now(),onDismiss:e.onDismiss,className:e.className,style:e.style,animation:e.animation,customAnimation:e.customAnimation,visualStyle:e.visualStyle,progressBarStyle:e.progressBarStyle,progressBarColor:e.progressBarColor,progressBarPosition:e.progressBarPosition,progressBarThickness:e.progressBarThickness,floating:e.floating,emoji:e.emoji,rippleEffect:e.rippleEffect,stagger:e.stagger,swipeToDismiss:e.swipeToDismiss,priority:e.priority,progressAnimation:e.progressAnimation};return !a.icon&&!a.emoji&&a.variant&&a.variant in j&&(a.iconString=j[a.variant]),g.getState().addToast(a)}catch(e){return console.error("React Toast Kit: Failed to create toast",e),""}},R=r=>e=>O({...typeof e=="string"?{description:e}:e,variant:r}),m=r=>O(r);m.success=R("success");m.error=R("error");m.warning=R("warning");m.info=R("info");m.loading=R("loading");m.custom=(r,e={})=>O({...e,component:r,variant:"custom"});m.promise=async(r,e)=>{let s=O({...typeof e.loading=="string"?{description:e.loading}:e.loading,variant:"loading",duration:0});try{let l=await r,a;return typeof e.success=="function"?a=e.success(l):a=e.success,m.update(s,typeof a=="string"?{description:a,variant:"success",duration:w}:{...a,variant:"success",duration:a.duration||w}),l}catch(l){let a;throw typeof e.error=="function"?a=e.error(l):a=e.error,m.update(s,typeof a=="string"?{description:a,variant:"error",duration:w}:{...a,variant:"error",duration:a.duration||w}),l}};m.update=(r,e)=>{try{let s=g.getState().toasts.find(l=>l.id===r);s&&s.variant==="loading"&&e.variant&&e.variant!=="loading"&&!e.duration&&(e.duration=w),g.getState().updateToast(r,e);}catch(s){console.error("React Toast Kit: Failed to update toast",s);}};m.dismiss=r=>{try{r?g.getState().removeToast(r):g.getState().clearAllToasts();}catch(e){console.error("React Toast Kit: Failed to dismiss toast",e);}};m.clearAll=()=>{try{g.getState().clearAllToasts();}catch(r){console.error("React Toast Kit: Failed to clear all toasts",r);}};var J=typeof process<"u"&&process.env.NODE_ENV==="development"?{getActiveToasts:()=>g.getState().toasts,clearAll:()=>g.getState().clearAllToasts(),debugInfo:()=>{let r=g.getState();console.group("React Toast Kit Debug Info"),console.table(r.toasts.map(e=>({id:e.id,variant:e.variant,position:e.position,duration:e.duration,priority:e.priority,createdAt:new Date(e.createdAt).toLocaleTimeString()}))),console.log("Theme:",r.theme,"| Effective:",r.effectiveTheme),console.log("Paused toasts:",Array.from(r.pausedToasts)),console.log("Active timers:",r.activeTimers.size),console.log("Registered plugins:",r.plugins.map(e=>e.name)),console.groupEnd();},getStore:()=>g.getState(),simulateError:()=>{m.error("This is a test error toast for debugging");},simulateSuccess:()=>{m.success("This is a test success toast for debugging");}}:{},re=r=>{g.getState().registerPlugin(r);},ae=r=>{g.getState().unregisterPlugin(r);},ne=()=>{g.getState().cleanup();},le={show:()=>{if(typeof window<"u"){let r=new CustomEvent("react-toast-kit:devtools:show");window.dispatchEvent(r);}},hide:()=>{if(typeof window<"u"){let r=new CustomEvent("react-toast-kit:devtools:hide");window.dispatchEvent(r);}},toggle:()=>{if(typeof window<"u"){let r=new CustomEvent("react-toast-kit:devtools:toggle");window.dispatchEvent(r);}},getToasts:()=>g.getState().toasts,...J};var {useState:B,useEffect:Y,useCallback:ee,useMemo:te}=Z,ce=()=>{let[r,e]=B(false),[s,l]=B("monitor"),[a,v]=B(false),{toasts:c,theme:T,effectiveTheme:t,maxToasts:h,pausedToasts:S,activeTimers:y,plugins:d,clearAllToasts:C,removeToast:F,pauseToast:N,resumeToast:V,setTheme:G,setMaxToasts:K}=g(),[k,x]=B({title:"Test Toast",description:"This is a test toast for debugging",variant:"info",position:"top-right",animation:"slide",visualStyle:"solid",duration:4e3,pauseOnHover:true,dismissible:true}),E=te(()=>{let i=c.reduce((b,P)=>(b[P.variant]=(b[P.variant]||0)+1,b),{}),f=c.reduce((b,P)=>(b[P.position]=(b[P.position]||0)+1,b),{});return {total:c.length,paused:S.size,timers:y.size,byVariant:i,byPosition:f}},[c,S,y]),_={success:()=>m.success("\u2705 Success toast test"),error:()=>m.error("\u274C Error toast test"),warning:()=>m.warning("\u26A0\uFE0F Warning toast test"),info:()=>m.info("\u2139\uFE0F Info toast test"),loading:()=>m.loading("\u23F3 Loading toast test"),custom:()=>m.custom(jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[jsx("span",{style:{fontSize:"24px"},children:"\u{1F389}"}),jsx("span",{children:"Custom component toast!"})]})),promise:()=>{let i=new Promise((f,b)=>{setTimeout(()=>Math.random()>.5?f("Success!"):b("Failed!"),2e3);});m.promise(i,{loading:"Loading...",success:"Promise resolved!",error:"Promise rejected!"});},stress:()=>{for(let i=0;i<5;i++)setTimeout(()=>{m({title:`Stress test toast #${i+1}`,description:"Testing multiple toasts at once",variant:["success","error","warning","info"][i%4],position:["top-left","top-right","bottom-left","bottom-right"][i%4],duration:2e3});},i*200);}},W=ee(()=>{m(k);},[k]);if(Y(()=>{let i=f=>{f.altKey&&f.shiftKey&&f.key==="D"&&e(b=>!b);};return window.addEventListener("keydown",i),()=>window.removeEventListener("keydown",i)},[]),typeof process<"u"&&process.env.NODE_ENV==="production")return null;let $=(i="default")=>{switch(i){case "success":return {background:"#dcfce7",color:"#166534"};case "error":return {background:"#fee2e2",color:"#b91c1c"};case "warning":return {background:"#fef3c7",color:"#92400e"};case "info":return {background:"#dbeafe",color:"#1e40af"};case "loading":return {background:"#f3f4f6",color:"#4b5563"};default:return {background:"#f1f5f9",color:"#334155"}}},n={devToolsButton:{position:"fixed",bottom:"16px",right:"16px",zIndex:1e4,width:"48px",height:"48px",borderRadius:"24px",background:"linear-gradient(135deg, #3b82f6, #8b5cf6)",color:"white",boxShadow:"0 4px 12px rgba(59, 130, 246, 0.5)",border:"none",cursor:"pointer",display:"flex",alignItems:"center",justifyContent:"center",transition:"transform 0.2s"},devToolsPanel:{position:"fixed",bottom:"16px",right:"16px",zIndex:1e4,width:a?"320px":"380px",height:a?"48px":"600px",background:t==="dark"?"#1f2937":"white",borderRadius:"8px",boxShadow:"0 10px 25px rgba(0, 0, 0, 0.2)",border:`1px solid ${t==="dark"?"#374151":"#e5e7eb"}`,overflow:"hidden",fontFamily:"system-ui, sans-serif",display:"flex",flexDirection:"column"},panelHeader:{display:"flex",alignItems:"center",justifyContent:"space-between",padding:"12px 16px",background:t==="dark"?"#111827":"#f0f9ff",borderBottom:`1px solid ${t==="dark"?"#374151":"#e5e7eb"}`},headerTitle:{display:"flex",alignItems:"center",gap:"8px",fontWeight:600,fontSize:"14px",color:t==="dark"?"#f3f4f6":"#1f2937"},statusIndicator:{width:"8px",height:"8px",borderRadius:"4px",background:"#22c55e"},tabsContainer:{display:"flex",borderBottom:`1px solid ${t==="dark"?"#374151":"#e5e7eb"}`},tab:i=>({flex:1,padding:"10px",textAlign:"center",fontSize:"13px",color:i?t==="dark"?"#60a5fa":"#3b82f6":t==="dark"?"#9ca3af":"#64748b",background:i?t==="dark"?"#111827":"white":t==="dark"?"#1f2937":"#f8fafc",cursor:"pointer",borderBottom:i?`2px solid ${t==="dark"?"#60a5fa":"#3b82f6"}`:"2px solid transparent"}),contentContainer:{padding:"16px",overflowY:"auto",flex:1,fontSize:"14px"},statsGrid:{display:"grid",gridTemplateColumns:"repeat(2, 1fr)",gap:"8px",marginBottom:"16px"},statCard:(i=false)=>({padding:"12px",borderRadius:"6px",background:t==="dark"?i?"#422006":"#082f49":i?"#fef3c7":"#f0f9ff",display:"flex",flexDirection:"column"}),statTitle:(i=false)=>({fontSize:"12px",fontWeight:500,color:t==="dark"?i?"#fcd34d":"#93c5fd":i?"#b45309":"#0369a1",marginBottom:"4px"}),statValue:(i=false)=>({fontSize:"20px",fontWeight:700,color:t==="dark"?i?"#fbbf24":"#bfdbfe":i?"#92400e":"#0c4a6e"}),sectionTitle:{fontWeight:600,color:t==="dark"?"#e2e8f0":"#334155",margin:"16px 0 8px"},quickTestsGrid:{display:"grid",gridTemplateColumns:"repeat(2, 1fr)",gap:"8px",marginBottom:"16px"},quickTestButton:{padding:"8px",borderRadius:"6px",background:t==="dark"?"#1f2937":"#f1f5f9",border:"none",color:t==="dark"?"#d1d5db":"#334155",fontSize:"12px",cursor:"pointer",textAlign:"left"},toastsList:{display:"flex",flexDirection:"column",gap:"8px",maxHeight:"240px",overflowY:"auto"},toastItem:{padding:"10px",borderRadius:"6px",background:t==="dark"?"#1f2937":"#f8fafc",border:`1px solid ${t==="dark"?"#374151":"#e2e8f0"}`},toastHeader:{display:"flex",justifyContent:"space-between",alignItems:"center",marginBottom:"6px"},variantBadge:(i="default")=>{let f=$(i);return {padding:"2px 6px",borderRadius:"4px",fontSize:"11px",fontWeight:500,background:f.background,color:f.color}},toastActions:{display:"flex",gap:"4px"},actionButton:i=>({background:"none",border:"none",fontSize:"11px",cursor:"pointer",padding:"2px 4px",borderRadius:"4px",color:i}),toastContent:{fontSize:"12px",color:t==="dark"?"#cbd5e1":"#475569"},toastTitle:{fontWeight:500,color:t==="dark"?"#e2e8f0":"#334155",marginBottom:"2px"},toastDescription:{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},toastMeta:{marginTop:"4px",fontSize:"11px",color:t==="dark"?"#64748b":"#94a3b8"},inputGroup:{marginBottom:"12px"},inputLabel:{display:"block",fontSize:"12px",fontWeight:500,color:t==="dark"?"#e2e8f0":"#334155",marginBottom:"4px"},textInput:{width:"100%",padding:"8px",border:`1px solid ${t==="dark"?"#374151":"#cbd5e1"}`,borderRadius:"4px",fontSize:"12px",background:t==="dark"?"#1f2937":"white",color:t==="dark"?"#f1f5f9":"inherit"},selectInput:{width:"100%",padding:"8px",border:`1px solid ${t==="dark"?"#374151":"#cbd5e1"}`,borderRadius:"4px",fontSize:"12px",background:t==="dark"?"#1f2937":"white",color:t==="dark"?"#f1f5f9":"inherit"},createButton:{width:"100%",padding:"8px",background:"#3b82f6",color:"white",border:"none",borderRadius:"4px",fontSize:"13px",fontWeight:500,cursor:"pointer"},formGrid:{display:"grid",gridTemplateColumns:"1fr 1fr",gap:"8px"}};return jsxs(Fragment,{children:[!r&&jsx("button",{onClick:()=>e(true),style:n.devToolsButton,title:"Open Toast DevTools (Alt+Shift+D)",children:jsxs("svg",{width:"24",height:"24",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"}),jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M15 12a3 3 0 11-6 0 3 3 0 016 0z"})]})}),r&&jsxs("div",{style:n.devToolsPanel,children:[jsxs("div",{style:n.panelHeader,children:[jsxs("div",{style:n.headerTitle,children:[jsx("div",{style:n.statusIndicator}),jsx("span",{children:"React Toast Kit DevTools"}),jsxs("span",{style:{fontSize:"11px",padding:"2px 6px",borderRadius:"4px",background:t==="dark"?"#0c4a6e":"#dbeafe",color:t==="dark"?"#bfdbfe":"#1e40af"},children:[E.total," active"]})]}),jsxs("div",{style:{display:"flex",alignItems:"center",gap:"4px"},children:[jsx("button",{onClick:()=>v(!a),style:{padding:"4px",background:"transparent",border:"none",cursor:"pointer",color:t==="dark"?"#9ca3af":"#64748b"},title:a?"Expand":"Minimize",children:jsx("svg",{width:"16",height:"16",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:a?"M7 14l5-5 5 5":"M17 10l-5 5-5-5"})})}),jsx("button",{onClick:()=>e(false),style:{padding:"4px",background:"transparent",border:"none",cursor:"pointer",color:"#ef4444"},title:"Close DevTools",children:jsx("svg",{width:"16",height:"16",fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M6 18L18 6M6 6l12 12"})})})]})]}),!a&&jsxs(Fragment,{children:[jsx("div",{style:n.tabsContainer,children:[{key:"monitor",label:"Monitor",icon:"\u{1F4CA}"},{key:"create",label:"Create",icon:"\u2795"},{key:"settings",label:"Settings",icon:"\u2699\uFE0F"}].map(i=>jsxs("button",{onClick:()=>l(i.key),style:n.tab(s===i.key),children:[jsx("span",{style:{marginRight:"4px"},children:i.icon}),i.label]},i.key))}),jsxs("div",{style:n.contentContainer,children:[s==="monitor"&&jsxs("div",{children:[jsxs("div",{style:n.statsGrid,children:[jsxs("div",{style:n.statCard(),children:[jsx("div",{style:n.statTitle(),children:"Total"}),jsx("div",{style:n.statValue(),children:E.total})]}),jsxs("div",{style:n.statCard(true),children:[jsx("div",{style:n.statTitle(true),children:"Paused"}),jsx("div",{style:n.statValue(true),children:E.paused})]})]}),jsxs("div",{children:[jsx("h3",{style:n.sectionTitle,children:"Quick Tests"}),jsx("div",{style:n.quickTestsGrid,children:Object.entries(_).map(([i,f])=>jsx("button",{onClick:f,style:n.quickTestButton,children:i.charAt(0).toUpperCase()+i.slice(1)},i))})]}),jsxs("div",{children:[jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"space-between",marginBottom:"8px"},children:[jsx("h3",{style:n.sectionTitle,children:"Active Toasts"}),c.length>0&&jsx("button",{onClick:C,style:{fontSize:"12px",color:"#ef4444",background:"transparent",border:"none",cursor:"pointer",textDecoration:"underline"},children:"Clear All"})]}),jsx("div",{style:n.toastsList,children:c.length===0?jsx("div",{style:{textAlign:"center",padding:"16px",color:t==="dark"?"#9ca3af":"#64748b"},children:"No active toasts"}):c.map(i=>jsxs("div",{style:n.toastItem,children:[jsxs("div",{style:n.toastHeader,children:[jsx("span",{style:n.variantBadge(i.variant),children:i.variant||"default"}),jsxs("div",{style:n.toastActions,children:[jsx("button",{onClick:()=>S.has(i.id)?V(i.id):N(i.id),style:n.actionButton("#2563eb"),children:S.has(i.id)?"\u25B6\uFE0F":"\u23F8\uFE0F"}),jsx("button",{onClick:()=>F(i.id),style:n.actionButton("#ef4444"),children:"\u274C"})]})]}),jsxs("div",{style:n.toastContent,children:[jsx("div",{style:n.toastTitle,children:i.title||"No title"}),i.description&&jsx("div",{style:n.toastDescription,children:i.description}),jsxs("div",{style:n.toastMeta,children:[i.position," \u2022 ",i.animation||"slide"," \u2022 ",i.duration,"ms"]})]})]},i.id))})]})]}),s==="create"&&jsxs("div",{children:[jsx("h3",{style:n.sectionTitle,children:"Create Test Toast"}),jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Title"}),jsx("input",{type:"text",value:k.title||"",onChange:i=>x(f=>({...f,title:i.target.value})),style:n.textInput})]}),jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Description"}),jsx("textarea",{value:k.description||"",onChange:i=>x(f=>({...f,description:i.target.value})),style:{...n.textInput,minHeight:"60px",resize:"vertical"},rows:2})]}),jsxs("div",{style:n.formGrid,children:[jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Variant"}),jsxs("select",{value:k.variant||"default",onChange:i=>x(f=>({...f,variant:i.target.value})),style:n.selectInput,children:[jsx("option",{value:"default",children:"Default"}),jsx("option",{value:"success",children:"Success"}),jsx("option",{value:"error",children:"Error"}),jsx("option",{value:"warning",children:"Warning"}),jsx("option",{value:"info",children:"Info"}),jsx("option",{value:"loading",children:"Loading"})]})]}),jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Position"}),jsxs("select",{value:k.position||"top-right",onChange:i=>x(f=>({...f,position:i.target.value})),style:n.selectInput,children:[jsx("option",{value:"top-left",children:"Top Left"}),jsx("option",{value:"top-center",children:"Top Center"}),jsx("option",{value:"top-right",children:"Top Right"}),jsx("option",{value:"bottom-left",children:"Bottom Left"}),jsx("option",{value:"bottom-center",children:"Bottom Center"}),jsx("option",{value:"bottom-right",children:"Bottom Right"})]})]})]}),jsxs("div",{style:n.formGrid,children:[jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Animation"}),jsxs("select",{value:k.animation||"slide",onChange:i=>x(f=>({...f,animation:i.target.value})),style:n.selectInput,children:[jsx("option",{value:"slide",children:"Slide"}),jsx("option",{value:"fade",children:"Fade"}),jsx("option",{value:"scale",children:"Scale"}),jsx("option",{value:"flip",children:"Flip"}),jsx("option",{value:"zoom",children:"Zoom"}),jsx("option",{value:"bounce",children:"Bounce"})]})]}),jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Style"}),jsxs("select",{value:k.visualStyle||"solid",onChange:i=>x(f=>({...f,visualStyle:i.target.value})),style:n.selectInput,children:[jsx("option",{value:"solid",children:"Solid"}),jsx("option",{value:"glass",children:"Glass"}),jsx("option",{value:"gradient",children:"Gradient"}),jsx("option",{value:"shimmer",children:"Shimmer"}),jsx("option",{value:"pill",children:"Pill"}),jsx("option",{value:"neon",children:"Neon"}),jsx("option",{value:"retro",children:"Retro"}),jsx("option",{value:"confetti",children:"Confetti"})]})]})]}),jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Duration (ms)"}),jsx("input",{type:"number",value:k.duration||4e3,onChange:i=>x(f=>({...f,duration:parseInt(i.target.value)})),style:n.textInput})]}),jsx("button",{onClick:W,style:n.createButton,children:"Create Toast"})]})]}),s==="settings"&&jsxs("div",{children:[jsx("h3",{style:n.sectionTitle,children:"Global Settings"}),jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"12px"},children:[jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Theme"}),jsxs("select",{value:T,onChange:i=>G(i.target.value),style:n.selectInput,children:[jsx("option",{value:"light",children:"Light"}),jsx("option",{value:"dark",children:"Dark"}),jsx("option",{value:"system",children:"System"})]}),jsxs("div",{style:{fontSize:"11px",color:t==="dark"?"#64748b":"#94a3b8",marginTop:"4px"},children:["Current: ",t]})]}),jsxs("div",{style:n.inputGroup,children:[jsx("label",{style:n.inputLabel,children:"Max Toasts"}),jsx("input",{type:"number",value:h,onChange:i=>K(parseInt(i.target.value)),min:"1",max:"10",style:n.textInput})]}),jsxs("div",{style:{marginTop:"16px",paddingTop:"16px",borderTop:`1px solid ${t==="dark"?"#374151":"#e5e7eb"}`},children:[jsx("h4",{style:{...n.sectionTitle,fontSize:"13px"},children:"Keyboard Shortcuts"}),jsx("div",{style:{fontSize:"12px",background:t==="dark"?"#1f2937":"#f1f5f9",padding:"8px",borderRadius:"4px",marginTop:"8px"},children:jsxs("div",{children:[jsx("strong",{children:"Alt + Shift + D"}),": Toggle DevTools"]})})]}),jsxs("div",{style:{marginTop:"8px",paddingTop:"16px",borderTop:`1px solid ${t==="dark"?"#374151":"#e5e7eb"}`},children:[jsx("h4",{style:{...n.sectionTitle,fontSize:"13px"},children:"Plugin Info"}),d.length===0?jsx("div",{style:{fontSize:"12px",color:t==="dark"?"#9ca3af":"#64748b"},children:"No plugins registered"}):jsx("div",{style:{display:"flex",flexDirection:"column",gap:"8px"},children:d.map(i=>jsxs("div",{style:{fontSize:"12px",background:t==="dark"?"#1f2937":"#f1f5f9",padding:"8px",borderRadius:"4px"},children:[jsx("div",{style:{fontWeight:500},children:i.name}),jsx("div",{style:{color:t==="dark"?"#9ca3af":"#64748b"},children:i.description})]},i.name))})]})]})]})]})]})]})]})};export{oe as a,g as b,m as c,re as d,ae as e,ne as f,le as g,ce as h};//# sourceMappingURL=chunk-AANTHRRE.mjs.map
//# sourceMappingURL=chunk-AANTHRRE.mjs.map