UNPKG

@accelint/design-toolkit

Version:

An open-source component library to serve as part of the entire ecosystem of UX for Accelint.

4 lines (3 loc) 2.44 kB
'use client'; import {jsxs,Fragment,jsx}from'react/jsx-runtime';import {useMemo,useState,useRef,useEffect,createElement}from'react';import {useBus}from'@accelint/bus/react';import {uuid}from'@accelint/core';import {useToastRegion}from'@react-aria/toast';import {useToastQueue}from'@react-stately/toast';import'client-only';import {UNSTABLE_ToastQueue,composeRenderProps,UNSTABLE_ToastList,UNSTABLE_ToastRegion,UNSTABLE_ToastStateContext}from'react-aria-components';import {Button}from'../button/index.js';import {Notice}from'.//index.js';import {NoticeEventTypes}from'./events.js';import {NoticeStyles}from'./styles.js';import {matchesMetadata}from'./utils.js';const{list:J,region:y}=NoticeStyles();function ae({id:s,classNames:t,defaultColor:T,defaultTimeout:v,hideClearAll:g,limit:u=3,global:E,placement:m,size:C="medium",...S}){const o=useMemo(()=>new UNSTABLE_ToastQueue({maxVisibleToasts:u}),[u]),A=useToastQueue(o),[L,P]=useState(false),l=useRef(null),{regionProps:q}=useToastRegion(S,o,l),{useEmit:c,useOn:d}=useBus(),h=c(NoticeEventTypes.actionPrimary),Q=c(NoticeEventTypes.actionSecondary),B=c(NoticeEventTypes.close);d(NoticeEventTypes.queue,e=>{(s&&e.payload.target===s||!s)&&o.add({...e.payload,id:e.payload.id||uuid(),color:T||e.payload.color},{timeout:v??e.payload.timeout});}),d(NoticeEventTypes.dequeue,e=>{const N=o.queue,r=N.filter(a=>matchesMetadata(e.payload,a.content));if(r.length&&r.length===N.length)o.clear();else for(const a of r)o.close(a.key);}),useEffect(()=>{o.subscribe(()=>{P(o.visibleToasts.length>0);});});const p=jsxs(Fragment,{children:[!g&&L&&jsx(Button,{className:composeRenderProps(t?.button,e=>e??""),variant:"outline",onPress:o.clear,children:"Clear All"}),jsx(UNSTABLE_ToastList,{className:composeRenderProps(t?.list,e=>J({className:e})),children:({toast:e})=>createElement(Notice,{...e.content,key:e.key,showClose:!(e.timeout&&e.content.primary&&e.content.secondary),classNames:t?.notice,size:C,onPrimaryAction:()=>h({id:e.content.id}),onSecondaryAction:()=>Q({id:e.content.id}),onClose:()=>{e.onClose?.(),o.close(e.key),B({id:e.content.id});}})})]});return E?jsx(UNSTABLE_ToastRegion,{className:y({className:t?.region}),"data-placement":m,queue:o,children:p}):jsx("div",{...q,className:y({className:t?.region}),"data-placement":m,ref:l,children:jsx(UNSTABLE_ToastStateContext.Provider,{value:A,children:p})})}export{ae as NoticeList};//# sourceMappingURL=list.js.map //# sourceMappingURL=list.js.map