@cookbookdev/sonner/dist/index.js

An opinionated toast component for React.

"use client";var Oe=Object.create;var q=Object.defineProperty;var Ue=Object.getOwnPropertyDescriptor;var Ke=Object.getOwnPropertyNames;var Xe=Object.getPrototypeOf,Ye=Object.prototype.hasOwnProperty;var Je=(n,t)=>{for(var e in t)q(n,e,{get:t[e],enumerable:!0})},De=(n,t,e,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let p of Ke(t))!Ye.call(n,p)&&p!==e&&q(n,p,{get:()=>t[p],enumerable:!(r=Ue(t,p))||r.enumerable});return n};var Q=(n,t,e)=>(e=n!=null?Oe(Xe(n)):{},De(t||!n||!n.__esModule?q(e,"default",{value:n,enumerable:!0}):e,n)),Ge=n=>De(q({},"__esModule",{value:!0}),n);var ht={};Je(ht,{Toaster:()=>Tt,toast:()=>ke,useSonner:()=>gt});module.exports=Ge(ht);var s=Q(require("react")),Fe=Q(require("react-dom"));var v=Q(require("react")),He=n=>{switch(n){case"success":return Qe;case"info":return et;case"warning":return Ze;case"error":return tt;default:return null}},qe=Array(12).fill(0),Me=({visible:n})=>v.default.createElement("div",{className:"sonner-loading-wrapper","data-visible":n},v.default.createElement("div",{className:"sonner-spinner"},qe.map((t,e)=>v.default.createElement("div",{className:"sonner-loading-bar",key:`spinner-bar-${e}`})))),Qe=v.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor",height:"20",width:"20"},v.default.createElement("path",{fillRule:"evenodd",d:"M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z",clipRule:"evenodd"})),Ze=v.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",height:"20",width:"20"},v.default.createElement("path",{fillRule:"evenodd",d:"M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z",clipRule:"evenodd"})),et=v.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor",height:"20",width:"20"},v.default.createElement("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z",clipRule:"evenodd"})),tt=v.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 20 20",fill:"currentColor",height:"20",width:"20"},v.default.createElement("path",{fillRule:"evenodd",d:"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z",clipRule:"evenodd"}));var me=Q(require("react")),Ae=()=>{let[n,t]=me.default.useState(document.hidden);return me.default.useEffect(()=>{let e=()=>{t(document.hidden)};return document.addEventListener("visibilitychange",e),()=>window.removeEventListener("visibilitychange",e)},[]),n};var pe=1,fe=class{constructor(){this.subscribe=t=>(this.subscribers.push(t),()=>{let e=this.subscribers.indexOf(t);this.subscribers.splice(e,1)});this.publish=t=>{this.subscribers.forEach(e=>e(t))};this.addToast=t=>{this.publish(t),this.toasts=[...this.toasts,t]};this.create=t=>{var h;let{message:e,...r}=t,p=typeof(t==null?void 0:t.id)=="number"||((h=t.id)==null?void 0:h.length)>0?t.id:pe++,d=this.toasts.find(l=>l.id===p),T=t.dismissible===void 0?!0:t.dismissible;return d?this.toasts=this.toasts.map(l=>l.id===p?(this.publish({...l,...t,id:p,title:e}),{...l,...t,id:p,dismissible:T,title:e}):l):this.addToast({title:e,...r,dismissible:T,id:p}),p};this.dismiss=t=>(t||this.toasts.forEach(e=>{this.subscribers.forEach(r=>r({id:e.id,dismiss:!0}))}),this.subscribers.forEach(e=>e({id:t,dismiss:!0})),t);this.message=(t,e)=>this.create({...e,message:t});this.error=(t,e)=>this.create({...e,message:t,type:"error"});this.success=(t,e)=>this.create({...e,type:"success",message:t});this.info=(t,e)=>this.create({...e,type:"info",message:t});this.warning=(t,e)=>this.create({...e,type:"warning",message:t});this.loading=(t,e)=>this.create({...e,type:"loading",message:t});this.promise=(t,e)=>{if(!e)return;let r;e.loading!==void 0&&(r=this.create({...e,promise:t,type:"loading",message:e.loading,description:typeof e.description!="function"?e.description:void 0}));let p=t instanceof Promise?t:t(),d=r!==void 0;return p.then(async T=>{if(nt(T)&&!T.ok){d=!1;let h=typeof e.error=="function"?await e.error(`HTTP error! status: ${T.status}`):e.error,l=typeof e.description=="function"?await e.description(`HTTP error! status: ${T.status}`):e.description;this.create({id:r,type:"error",message:h,description:l})}else if(e.success!==void 0){d=!1;let h=typeof e.success=="function"?await e.success(T):e.success,l=typeof e.description=="function"?await e.description(T):e.description;this.create({id:r,type:"success",message:h,description:l})}}).catch(async T=>{if(e.error!==void 0){d=!1;let h=typeof e.error=="function"?await e.error(T):e.error,l=typeof e.description=="function"?await e.description(T):e.description;this.create({id:r,type:"error",message:h,description:l})}}).finally(()=>{var T;d&&(this.dismiss(r),r=void 0),(T=e.finally)==null||T.call(e)}),r};this.custom=(t,e)=>{let r=(e==null?void 0:e.id)||pe++;return this.create({jsx:t(r),id:r,...e}),r};this.subscribers=[],this.toasts=[]}},x=new fe,st=(n,t)=>{let e=(t==null?void 0:t.id)||pe++;return x.addToast({title:n,...t,id:e}),e},nt=n=>n&&typeof n=="object"&&"ok"in n&&typeof n.ok=="boolean"&&"status"in n&&typeof n.status=="number",it=st,ot=()=>x.toasts,ke=Object.assign(it,{success:x.success,info:x.info,warning:x.warning,error:x.error,custom:x.custom,message:x.message,promise:x.promise,dismiss:x.dismiss,loading:x.loading},{getHistory:ot});function O(n){return n.label!==void 0}var rt=3,at="32px",ct=4e3,lt=356,ut=14,dt=20,mt=200;function pt(...n){return n.filter(Boolean).join(" ")}var ft=n=>{var xe,we,ve,Re,Se,Ee,Pe,Ne,Be,Ce;let{invert:t,toast:e,unstyled:r,interacting:p,setHeights:d,visibleToasts:T,heights:h,index:l,toasts:Z,expanded:W,removeToast:U,defaultRichColors:ee,closeButton:a,style:K,cancelButtonStyle:X,actionButtonStyle:te,className:se="",descriptionClassName:ne="",duration:Y,position:ie,gap:C,loadingIcon:j,expandByDefault:_,classNames:o,icons:I,closeButtonAriaLabel:oe="Close toast",pauseWhenPageIsHidden:D,cn:R}=n,[F,re]=s.default.useState(!1),[H,M]=s.default.useState(!1),[ae,E]=s.default.useState(!1),[A,ce]=s.default.useState(!1),[u,f]=s.default.useState(0),[y,w]=s.default.useState(0),k=s.default.useRef(null),c=s.default.useRef(null),V=l===0,J=l+1<=T,b=e.type,P=e.dismissible!==!1,je=e.className||"",ze=e.descriptionClassName||"",G=s.default.useMemo(()=>h.findIndex(i=>i.toastId===e.id)||0,[h,e.id]),$e=s.default.useMemo(()=>{var i;return(i=e.closeButton)!=null?i:a},[e.closeButton,a]),ge=s.default.useMemo(()=>e.duration||Y||ct,[e.duration,Y]),le=s.default.useRef(0),z=s.default.useRef(0),Te=s.default.useRef(0),$=s.default.useRef(null),[he,We]=ie.split("-"),ye=s.default.useMemo(()=>h.reduce((i,m,g)=>g>=G?i:i+m.height,0),[h,G]),be=Ae(),_e=e.invert||t,ue=b==="loading";z.current=s.default.useMemo(()=>G*C+ye,[G,ye]),s.default.useEffect(()=>{re(!0)},[]),s.default.useLayoutEffect(()=>{if(!F)return;let i=c.current,m=i.style.height;i.style.height="auto";let g=i.getBoundingClientRect().height;i.style.height=m,w(g),d(N=>N.find(S=>S.toastId===e.id)?N.map(S=>S.toastId===e.id?{...S,height:g}:S):[{toastId:e.id,height:g,position:e.position},...N])},[F,e.title,e.description,d,e.id]);let L=s.default.useCallback(()=>{M(!0),f(z.current),d(i=>i.filter(m=>m.toastId!==e.id)),setTimeout(()=>{U(e)},mt)},[e,U,d,z]);s.default.useEffect(()=>{if(e.promise&&b==="loading"||e.duration===1/0||e.type==="loading")return;let i,m=ge;return W||p||D&&be?(()=>{if(Te.current<le.current){let B=new Date().getTime()-le.current;m=m-B}Te.current=new Date().getTime()})():(()=>{m!==1/0&&(le.current=new Date().getTime(),i=setTimeout(()=>{var B;(B=e.onAutoClose)==null||B.call(e,e),L()},m))})(),()=>clearTimeout(i)},[W,p,_,e,ge,L,e.promise,b,D,be]),s.default.useEffect(()=>{let i=c.current;if(i){let m=i.getBoundingClientRect().height;return w(m),d(g=>[{toastId:e.id,height:m,position:e.position},...g]),()=>d(g=>g.filter(N=>N.toastId!==e.id))}},[d,e.id]),s.default.useEffect(()=>{e.delete&&L()},[L,e.delete]);function Ve(){return I!=null&&I.loading?s.default.createElement("div",{className:"sonner-loader","data-visible":b==="loading"},I.loading):j?s.default.createElement("div",{className:"sonner-loader","data-visible":b==="loading"},j):s.default.createElement(Me,{visible:b==="loading"})}return s.default.createElement("li",{"aria-live":e.important?"assertive":"polite","aria-atomic":"true",role:"status",tabIndex:0,ref:c,className:R(se,je,o==null?void 0:o.toast,(xe=e==null?void 0:e.classNames)==null?void 0:xe.toast,o==null?void 0:o.default,o==null?void 0:o[b],(we=e==null?void 0:e.classNames)==null?void 0:we[b]),"data-sonner-toast":"","data-rich-colors":(ve=e.richColors)!=null?ve:ee,"data-styled":!(e.jsx||e.unstyled||r),"data-mounted":F,"data-promise":!!e.promise,"data-removed":H,"data-visible":J,"data-y-position":he,"data-x-position":We,"data-index":l,"data-front":V,"data-swiping":ae,"data-dismissible":P,"data-type":b,"data-invert":_e,"data-swipe-out":A,"data-expanded":!!(W||_&&F),style:{"--index":l,"--toasts-before":l,"--z-index":Z.length-l,"--offset":`${H?u:z.current}px`,"--initial-height":_?"auto":`${y}px`,...K,...e.style},onPointerDown:i=>{ue||!P||(k.current=new Date,f(z.current),i.target.setPointerCapture(i.pointerId),i.target.tagName!=="BUTTON"&&(E(!0),$.current={x:i.clientX,y:i.clientY}))},onPointerUp:()=>{var N,B,S,de;if(A||!P)return;$.current=null;let i=Number(((N=c.current)==null?void 0:N.style.getPropertyValue("--swipe-amount").replace("px",""))||0),m=new Date().getTime()-((B=k.current)==null?void 0:B.getTime()),g=Math.abs(i)/m;if(Math.abs(i)>=dt||g>.11){f(z.current),(S=e.onDismiss)==null||S.call(e,e),L(),ce(!0);return}(de=c.current)==null||de.style.setProperty("--swipe-amount","0px"),E(!1)},onPointerMove:i=>{var Ie;if(!$.current||!P)return;let m=i.clientY-$.current.y,g=i.clientX-$.current.x,B=(he==="top"?Math.min:Math.max)(0,m),S=i.pointerType==="touch"?10:2;Math.abs(B)>S?(Ie=c.current)==null||Ie.style.setProperty("--swipe-amount",`${m}px`):Math.abs(g)>S&&($.current=null)}},$e&&!e.jsx?s.default.createElement("button",{"aria-label":oe,"data-disabled":ue,"data-close-button":!0,onClick:ue||!P?()=>{}:()=>{var i;L(),(i=e.onDismiss)==null||i.call(e,e)},className:R(o==null?void 0:o.closeButton,(Re=e==null?void 0:e.classNames)==null?void 0:Re.closeButton)},s.default.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"12",height:"12",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"},s.default.createElement("line",{x1:"18",y1:"6",x2:"6",y2:"18"}),s.default.createElement("line",{x1:"6",y1:"6",x2:"18",y2:"18"}))):null,e.jsx||s.default.isValidElement(e.title)?e.jsx||e.title:s.default.createElement(s.default.Fragment,null,b||e.icon||e.promise?s.default.createElement("div",{"data-icon":"",className:R(o==null?void 0:o.icon,(Se=e==null?void 0:e.classNames)==null?void 0:Se.icon)},e.promise||e.type==="loading"&&!e.icon?e.icon||Ve():null,e.type!=="loading"?e.icon||(I==null?void 0:I[b])||He(b):null):null,s.default.createElement("div",{"data-content":"",className:R(o==null?void 0:o.content,(Ee=e==null?void 0:e.classNames)==null?void 0:Ee.content)},s.default.createElement("div",{"data-title":"",className:R(o==null?void 0:o.title,(Pe=e==null?void 0:e.classNames)==null?void 0:Pe.title)},e.title),e.description?s.default.createElement("div",{"data-description":"",className:R(ne,ze,o==null?void 0:o.description,(Ne=e==null?void 0:e.classNames)==null?void 0:Ne.description)},e.description):null),s.default.isValidElement(e.cancel)?e.cancel:e.cancel&&O(e.cancel)?s.default.createElement("button",{"data-button":!0,"data-cancel":!0,style:e.cancelButtonStyle||X,onClick:i=>{var m,g;O(e.cancel)&&P&&((g=(m=e.cancel).onClick)==null||g.call(m,i),L())},className:R(o==null?void 0:o.cancelButton,(Be=e==null?void 0:e.classNames)==null?void 0:Be.cancelButton)},e.cancel.label):null,s.default.isValidElement(e.action)?e.action:e.action&&O(e.action)?s.default.createElement("button",{"data-button":!0,"data-action":!0,style:e.actionButtonStyle||te,onClick:i=>{var m,g;O(e.action)&&(i.defaultPrevented||((g=(m=e.action).onClick)==null||g.call(m,i),L()))},className:R(o==null?void 0:o.actionButton,(Ce=e==null?void 0:e.classNames)==null?void 0:Ce.actionButton)},e.action.label):null))};function Le(){if(typeof window=="undefined"||typeof document=="undefined")return"ltr";let n=document.documentElement.getAttribute("dir");return n==="auto"||!n?window.getComputedStyle(document.documentElement).direction:n}function gt(){let[n,t]=s.default.useState([]);return s.default.useEffect(()=>x.subscribe(e=>{t(r=>{if("dismiss"in e&&e.dismiss)return r.filter(d=>d.id!==e.id);let p=r.findIndex(d=>d.id===e.id);if(p!==-1){let d=[...r];return d[p]={...d[p],...e},d}else return[e,...r]})}),[]),{toasts:n}}var Tt=n=>{let{invert:t,position:e="bottom-right",hotkey:r=["altKey","KeyT"],expand:p,closeButton:d,className:T,offset:h,theme:l="light",richColors:Z,duration:W,style:U,visibleToasts:ee=rt,toastOptions:a,dir:K=Le(),gap:X=ut,loadingIcon:te,icons:se,containerAriaLabel:ne="Notifications",pauseWhenPageIsHidden:Y,cn:ie=pt}=n,[C,j]=s.default.useState([]),_=s.default.useMemo(()=>Array.from(new Set([e].concat(C.filter(u=>u.position).map(u=>u.position)))),[C,e]),[o,I]=s.default.useState([]),[oe,D]=s.default.useState(!1),[R,F]=s.default.useState(!1),[re,H]=s.default.useState(l!=="system"?l:typeof window!="undefined"&&window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"),M=s.default.useRef(null),ae=r.join("+").replace(/Key/g,"").replace(/Digit/g,""),E=s.default.useRef(null),A=s.default.useRef(!1),ce=s.default.useCallback(u=>{j(f=>{var y;return(y=f.find(w=>w.id===u.id))!=null&&y.delete||x.dismiss(u.id),f.filter(({id:w})=>w!==u.id)})},[]);return s.default.useEffect(()=>x.subscribe(u=>{if(u.dismiss){j(f=>f.map(y=>y.id===u.id?{...y,delete:!0}:y));return}setTimeout(()=>{Fe.default.flushSync(()=>{j(f=>{let y=f.findIndex(w=>w.id===u.id);return y!==-1?[...f.slice(0,y),{...f[y],...u},...f.slice(y+1)]:[u,...f]})})})}),[]),s.default.useEffect(()=>{if(l!=="system"){H(l);return}l==="system"&&(window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches?H("dark"):H("light")),typeof window!="undefined"&&window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change",({matches:u})=>{H(u?"dark":"light")})},[l]),s.default.useEffect(()=>{C.length<=1&&D(!1)},[C]),s.default.useEffect(()=>{let u=f=>{var w,k;r.every(c=>f[c]||f.code===c)&&(D(!0),(w=M.current)==null||w.focus()),f.code==="Escape"&&(document.activeElement===M.current||(k=M.current)!=null&&k.contains(document.activeElement))&&D(!1)};return document.addEventListener("keydown",u),()=>document.removeEventListener("keydown",u)},[r]),s.default.useEffect(()=>{if(M.current)return()=>{E.current&&(E.current.focus({preventScroll:!0}),E.current=null,A.current=!1)}},[M.current]),C.length?s.default.createElement("section",{"aria-label":`${ne} ${ae}`,tabIndex:-1},_.map((u,f)=>{var k;let[y,w]=u.split("-");return s.default.createElement("ol",{key:u,dir:K==="auto"?Le():K,tabIndex:-1,ref:M,className:T,"data-sonner-toaster":!0,"data-theme":re,"data-y-position":y,"data-x-position":w,style:{"--front-toast-height":`${((k=o[0])==null?void 0:k.height)||0}px`,"--offset":typeof h=="number"?`${h}px`:h||at,"--width":`${lt}px`,"--gap":`${X}px`,...U},onBlur:c=>{A.current&&!c.currentTarget.contains(c.relatedTarget)&&(A.current=!1,E.current&&(E.current.focus({preventScroll:!0}),E.current=null))},onFocus:c=>{c.target instanceof HTMLElement&&c.target.dataset.dismissible==="false"||A.current||(A.current=!0,E.current=c.relatedTarget)},onMouseEnter:()=>D(!0),onMouseMove:()=>D(!0),onMouseLeave:()=>{R||D(!1)},onPointerDown:c=>{c.target instanceof HTMLElement&&c.target.dataset.dismissible==="false"||F(!0)},onPointerUp:()=>F(!1)},C.filter(c=>!c.position&&f===0||c.position===u).map((c,V)=>{var J,b;return s.default.createElement(ft,{key:c.id,icons:se,index:V,toast:c,defaultRichColors:Z,duration:(J=a==null?void 0:a.duration)!=null?J:W,className:a==null?void 0:a.className,descriptionClassName:a==null?void 0:a.descriptionClassName,invert:t,visibleToasts:ee,closeButton:(b=a==null?void 0:a.closeButton)!=null?b:d,interacting:R,position:u,style:a==null?void 0:a.style,unstyled:a==null?void 0:a.unstyled,classNames:a==null?void 0:a.classNames,cancelButtonStyle:a==null?void 0:a.cancelButtonStyle,actionButtonStyle:a==null?void 0:a.actionButtonStyle,removeToast:ce,toasts:C.filter(P=>P.position==c.position),heights:o.filter(P=>P.position==c.position),setHeights:I,expandByDefault:p,gap:X,loadingIcon:te,expanded:oe,pauseWhenPageIsHidden:Y,cn:ie})}))})):null};0&&(module.exports={Toaster,toast,useSonner});
//# sourceMappingURL=index.js.map