@radix-ui/react-toast 0.1.2-rc.5 → 0.1.2-rc.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,2 +1,652 @@
1
- import{VisuallyHidden as e}from"@radix-ui/react-visually-hidden";import{useLayoutEffect as t}from"@radix-ui/react-use-layout-effect";import{useControllableState as r}from"@radix-ui/react-use-controllable-state";import{useCallbackRef as o}from"@radix-ui/react-use-callback-ref";import{Primitive as n}from"@radix-ui/react-primitive";import{Presence as s}from"@radix-ui/react-presence";import{UnstablePortal as a}from"@radix-ui/react-portal";import*as i from"@radix-ui/react-dismissable-layer";import{createContextScope as c}from"@radix-ui/react-context";import{useComposedRefs as u}from"@radix-ui/react-compose-refs";import{composeEventHandlers as l}from"@radix-ui/primitive";import*as p from"react-dom";import*as d from"react";import w from"@babel/runtime/helpers/esm/extends";const[f,m]=c("Toast");export{m as createToastScope};const[v,T]=f("ToastProvider");export const ToastProvider=e=>{const{__scopeToast:t,label:r="Notification",duration:o=5e3,swipeDirection:n="right",swipeThreshold:s=50,children:a}=e,[i,c]=d.useState(null),[u,l]=d.useState(0),p=d.useRef(!1),w=d.useRef(!1);/*#__PURE__*/return d.createElement(v,{scope:t,label:r,duration:o,swipeDirection:n,swipeThreshold:s,toastCount:u,viewport:i,onViewportChange:c,onToastAdd:d.useCallback((()=>l((e=>e+1))),[]),onToastRemove:d.useCallback((()=>l((e=>e-1))),[]),isFocusedToastEscapeKeyDownRef:p,isClosePausedRef:w},a)};/*#__PURE__*/const E=["F8"];export const ToastViewport=/*#__PURE__*/d.forwardRef(((e,t)=>{const{__scopeToast:r,hotkey:o=E,label:s="Notifications ({hotkey})",...a}=e,c=T("ToastViewport",r),l=d.useRef(null),p=d.useRef(null),f=u(t,p,c.onViewportChange),m=o.join("+").replace(/Key/g,"").replace(/Digit/g,"");return d.useEffect((()=>{const e=e=>{var t;o.every((t=>e[t]||e.code===t))&&(null===(t=p.current)||void 0===t||t.focus())};return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)}),[o]),d.useEffect((()=>{const e=l.current,t=p.current;if(e&&t){const r=()=>{const e=new Event("toast.viewportPause");t.dispatchEvent(e),c.isClosePausedRef.current=!0},o=()=>{const e=new Event("toast.viewportResume");t.dispatchEvent(e),c.isClosePausedRef.current=!1};return e.addEventListener("focusin",r),e.addEventListener("focusout",o),e.addEventListener("pointerenter",r),e.addEventListener("pointerleave",o),window.addEventListener("blur",r),window.addEventListener("focus",o),()=>{e.removeEventListener("focusin",r),e.removeEventListener("focusout",o),e.removeEventListener("pointerenter",r),e.removeEventListener("pointerleave",o),window.removeEventListener("blur",r),window.removeEventListener("focus",o)}}}),[c.isClosePausedRef]),d.useEffect((()=>{const e=p.current;if(e){const t=new Set,r=new MutationObserver((r=>{r.map((e=>Array.from(e.addedNodes))).reduce(((e,t)=>e.concat(t))).forEach((r=>{t.has(r)?t.delete(r):(e.prepend(r),t.add(r))}))}));return r.observe(e,{childList:!0}),()=>r.disconnect()}}),[]),/*#__PURE__*/d.createElement(i.Branch,{ref:l,role:"region","aria-label":s.replace("{hotkey}",m),tabIndex:-1,style:{pointerEvents:c.toastCount>0?void 0:"none"}},/*#__PURE__*/d.createElement(n.ol,w({tabIndex:-1},a,{ref:f})))}));/*#__PURE__*/export const Toast=/*#__PURE__*/d.forwardRef(((e,t)=>{const{forceMount:o,open:n,defaultOpen:a,onOpenChange:i,...c}=e,[u=!0,p]=r({prop:n,defaultProp:a,onChange:i});/*#__PURE__*/return d.createElement(s,{present:o||u},/*#__PURE__*/d.createElement(g,w({open:u},c,{ref:t,onClose:()=>p(!1),onSwipeStart:l(e.onSwipeStart,(e=>{e.currentTarget.setAttribute("data-swipe","start")})),onSwipeMove:l(e.onSwipeMove,(e=>{const{x:t,y:r}=e.detail.delta;e.currentTarget.setAttribute("data-swipe","move"),e.currentTarget.style.setProperty("--radix-toast-swipe-move-x",`${t}px`),e.currentTarget.style.setProperty("--radix-toast-swipe-move-y",`${r}px`)})),onSwipeCancel:l(e.onSwipeCancel,(e=>{e.currentTarget.setAttribute("data-swipe","cancel"),e.currentTarget.style.removeProperty("--radix-toast-swipe-move-x"),e.currentTarget.style.removeProperty("--radix-toast-swipe-move-y"),e.currentTarget.style.removeProperty("--radix-toast-swipe-end-x"),e.currentTarget.style.removeProperty("--radix-toast-swipe-end-y")})),onSwipeEnd:l(e.onSwipeEnd,(e=>{const{x:t,y:r}=e.detail.delta;e.currentTarget.setAttribute("data-swipe","end"),e.currentTarget.style.removeProperty("--radix-toast-swipe-move-x"),e.currentTarget.style.removeProperty("--radix-toast-swipe-move-y"),e.currentTarget.style.setProperty("--radix-toast-swipe-end-x",`${t}px`),e.currentTarget.style.setProperty("--radix-toast-swipe-end-y",`${r}px`),p(!1)}))})))}));/*#__PURE__*/const[x,y]=f("Toast",{isInteractive:!1,onClose(){}}),g=/*#__PURE__*/d.forwardRef(((e,t)=>{const{__scopeToast:r,type:s="foreground",duration:a,open:c,onClose:f,onEscapeKeyDown:m,onSwipeStart:v,onSwipeMove:E,onSwipeCancel:y,onSwipeEnd:g,...P}=e,R=T("Toast",r),D=d.useRef(null),S=u(t,D),L=d.useRef(null),A=d.useRef(null),_=a||R.duration,k=d.useRef(0),M=d.useRef(_),F=d.useRef(0),{onToastAdd:I,onToastRemove:K}=R,V=o((()=>{var e,t;(null===(e=D.current)||void 0===e?void 0:e.contains(document.activeElement))&&(null===(t=R.viewport)||void 0===t||t.focus()),f()})),$=d.useCallback((e=>{e&&e!==1/0&&(window.clearTimeout(F.current),k.current=(new Date).getTime(),F.current=window.setTimeout(V,e))}),[V]);return d.useEffect((()=>{const e=R.viewport;if(e){const t=()=>{$(M.current)},r=()=>{const e=(new Date).getTime()-k.current;M.current=M.current-e,window.clearTimeout(F.current)};return e.addEventListener("toast.viewportPause",r),e.addEventListener("toast.viewportResume",t),()=>{e.removeEventListener("toast.viewportPause",r),e.removeEventListener("toast.viewportResume",t)}}}),[R.viewport,_,$]),d.useEffect((()=>{c&&!R.isClosePausedRef.current&&$(_)}),[c,_,R.isClosePausedRef,$]),d.useEffect((()=>(I(),()=>K())),[I,K]),R.viewport?/*#__PURE__*/d.createElement(d.Fragment,null,/*#__PURE__*/d.createElement(h,{__scopeToast:r,role:"status","aria-live":"foreground"===s?"assertive":"polite","aria-atomic":!0},e.children),/*#__PURE__*/d.createElement(x,{scope:r,isInteractive:!0,onClose:V},/*#__PURE__*/p.createPortal(/*#__PURE__*/d.createElement(i.Root,{asChild:!0,onEscapeKeyDown:l(m,(()=>{R.isFocusedToastEscapeKeyDownRef.current||V(),R.isFocusedToastEscapeKeyDownRef.current=!1}))},/*#__PURE__*/d.createElement(n.li,w({role:"status","aria-live":"off","aria-atomic":!0,tabIndex:0,"data-state":c?"open":"closed","data-swipe-direction":R.swipeDirection},P,{ref:S,style:{userSelect:"none",touchAction:"none",...e.style},onKeyDown:l(e.onKeyDown,(e=>{"Escape"===e.key&&(null==m||m(e.nativeEvent),e.nativeEvent.defaultPrevented||(R.isFocusedToastEscapeKeyDownRef.current=!0,V()))})),onPointerDown:l(e.onPointerDown,(e=>{0===e.button&&(L.current={x:e.clientX,y:e.clientY})})),onPointerMove:l(e.onPointerMove,(e=>{if(!L.current)return;const t=e.clientX-L.current.x,r=e.clientY-L.current.y,o=Boolean(A.current),n=["left","right"].includes(R.swipeDirection),s=["left","up"].includes(R.swipeDirection)?Math.min:Math.max,a=n?s(0,t):0,i=n?0:s(0,r),c="touch"===e.pointerType?10:2,u={x:a,y:i},l={originalEvent:e,delta:u};o?(A.current=u,b("toast.swipeMove",E,l)):C(u,R.swipeDirection,c)?(A.current=u,b("toast.swipeStart",v,l),e.target.setPointerCapture(e.pointerId)):(Math.abs(t)>c||Math.abs(r)>c)&&(L.current=null)})),onPointerUp:l(e.onPointerUp,(e=>{const t=A.current;if(e.target.releasePointerCapture(e.pointerId),A.current=null,L.current=null,t){const r=e.currentTarget,o={originalEvent:e,delta:t};C(t,R.swipeDirection,R.swipeThreshold)?b("toast.swipeEnd",g,o):b("toast.swipeCancel",y,o),r.addEventListener("click",(e=>e.preventDefault()),{once:!0})}}))}))),R.viewport))):null}));g.propTypes={type(e){if(e.type&&!["foreground","background"].includes(e.type)){throw new Error("Invalid prop `type` supplied to `Toast`. Expected `foreground | background`.")}return null}};const h=r=>{const{__scopeToast:n,...s}=r,i=T("Toast",n),[c,u]=d.useState(!1),[l,p]=d.useState(!1);return function(e=(()=>{})){const r=o(e);t((()=>{let e=0,t=0;return e=window.requestAnimationFrame((()=>t=window.requestAnimationFrame(r))),()=>{window.cancelAnimationFrame(e),window.cancelAnimationFrame(t)}}),[r])}((()=>u(!0))),d.useEffect((()=>{const e=window.setTimeout((()=>p(!0)),1e3);return()=>window.clearTimeout(e)}),[]),l?null:/*#__PURE__*/d.createElement(a,{asChild:!0},/*#__PURE__*/d.createElement(e,{asChild:!0},/*#__PURE__*/d.createElement("div",s,c&&/*#__PURE__*/d.createElement(d.Fragment,null,i.label," ",r.children))))};export const ToastTitle=/*#__PURE__*/d.forwardRef(((e,t)=>{const{__scopeToast:r,...o}=e;/*#__PURE__*/return d.createElement(n.div,w({},o,{ref:t}))}));/*#__PURE__*/export const ToastDescription=/*#__PURE__*/d.forwardRef(((e,t)=>{const{__scopeToast:r,...o}=e;/*#__PURE__*/return d.createElement(n.div,w({},o,{ref:t}))}));/*#__PURE__*/export const ToastAction=/*#__PURE__*/d.forwardRef(((e,t)=>{const{altText:r,...o}=e,n=y("ToastAction",e.__scopeToast);return r?n.isInteractive?/*#__PURE__*/d.createElement(ToastClose,w({},o,{ref:t})):/*#__PURE__*/d.createElement("span",null,r):null}));ToastAction.propTypes={altText(e){if(!e.altText)throw new Error("Missing prop `altText` expected on `ToastAction`");return null}};export const ToastClose=/*#__PURE__*/d.forwardRef(((e,t)=>{const{__scopeToast:r,...o}=e,s=y("ToastClose",r);return s.isInteractive?/*#__PURE__*/d.createElement(n.button,w({type:"button"},o,{ref:t,onClick:l(e.onClick,s.onClose)})):null}));/*#__PURE__*/function b(e,t,r){const o=r.originalEvent.currentTarget,n=new CustomEvent(e,{bubbles:!0,cancelable:!0,detail:r});t&&o.addEventListener(e,t,{once:!0}),o.dispatchEvent(n)}const C=(e,t,r=0)=>{const o=Math.abs(e.x),n=Math.abs(e.y),s=o>n;return"left"===t||"right"===t?s&&o>r:!s&&n>r};export const Provider=ToastProvider;export const Viewport=ToastViewport;export const Root=Toast;export const Title=ToastTitle;export const Description=ToastDescription;export const Action=ToastAction;export const Close=ToastClose;
1
+ import $eyrYI$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
2
+ import {useState as $eyrYI$useState, useRef as $eyrYI$useRef, createElement as $eyrYI$createElement, useCallback as $eyrYI$useCallback, forwardRef as $eyrYI$forwardRef, useEffect as $eyrYI$useEffect, Fragment as $eyrYI$Fragment} from "react";
3
+ import {createPortal as $eyrYI$createPortal} from "react-dom";
4
+ import {composeEventHandlers as $eyrYI$composeEventHandlers} from "@radix-ui/primitive";
5
+ import {useComposedRefs as $eyrYI$useComposedRefs} from "@radix-ui/react-compose-refs";
6
+ import {createCollection as $eyrYI$createCollection} from "@radix-ui/react-collection";
7
+ import {createContextScope as $eyrYI$createContextScope} from "@radix-ui/react-context";
8
+ import {Branch as $eyrYI$Branch, Root as $eyrYI$Root} from "@radix-ui/react-dismissable-layer";
9
+ import {Presence as $eyrYI$Presence} from "@radix-ui/react-presence";
10
+ import {Primitive as $eyrYI$Primitive, dispatchDiscreteCustomEvent as $eyrYI$dispatchDiscreteCustomEvent} from "@radix-ui/react-primitive";
11
+ import {Slottable as $eyrYI$Slottable} from "@radix-ui/react-slot";
12
+ import {useCallbackRef as $eyrYI$useCallbackRef} from "@radix-ui/react-use-callback-ref";
13
+ import {useControllableState as $eyrYI$useControllableState} from "@radix-ui/react-use-controllable-state";
14
+ import {useLayoutEffect as $eyrYI$useLayoutEffect} from "@radix-ui/react-use-layout-effect";
15
+ import {VisuallyHidden as $eyrYI$VisuallyHidden} from "@radix-ui/react-visually-hidden";
16
+
17
+
18
+
19
+
20
+
21
+
22
+
23
+
24
+
25
+
26
+
27
+
28
+
29
+
30
+
31
+
32
+ /* -------------------------------------------------------------------------------------------------
33
+ * ToastProvider
34
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$PROVIDER_NAME = 'ToastProvider';
35
+ const [$054eb8030ebde76e$var$Collection, $054eb8030ebde76e$var$useCollection, $054eb8030ebde76e$var$createCollectionScope] = $eyrYI$createCollection('Toast');
36
+ const [$054eb8030ebde76e$var$createToastContext, $054eb8030ebde76e$export$8a359da18fbc9073] = $eyrYI$createContextScope('Toast', [
37
+ $054eb8030ebde76e$var$createCollectionScope
38
+ ]);
39
+ const [$054eb8030ebde76e$var$ToastProviderProvider, $054eb8030ebde76e$var$useToastProviderContext] = $054eb8030ebde76e$var$createToastContext($054eb8030ebde76e$var$PROVIDER_NAME);
40
+ const $054eb8030ebde76e$export$f5d03d415824e0e = (props)=>{
41
+ const { __scopeToast: __scopeToast , label: label = 'Notification' , duration: duration = 5000 , swipeDirection: swipeDirection = 'right' , swipeThreshold: swipeThreshold = 50 , children: children } = props;
42
+ const [viewport, setViewport] = $eyrYI$useState(null);
43
+ const [toastCount, setToastCount] = $eyrYI$useState(0);
44
+ const isFocusedToastEscapeKeyDownRef = $eyrYI$useRef(false);
45
+ const isClosePausedRef = $eyrYI$useRef(false);
46
+ return /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$Collection.Provider, {
47
+ scope: __scopeToast
48
+ }, /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$ToastProviderProvider, {
49
+ scope: __scopeToast,
50
+ label: label,
51
+ duration: duration,
52
+ swipeDirection: swipeDirection,
53
+ swipeThreshold: swipeThreshold,
54
+ toastCount: toastCount,
55
+ viewport: viewport,
56
+ onViewportChange: setViewport,
57
+ onToastAdd: $eyrYI$useCallback(()=>setToastCount((prevCount)=>prevCount + 1
58
+ )
59
+ , []),
60
+ onToastRemove: $eyrYI$useCallback(()=>setToastCount((prevCount)=>prevCount - 1
61
+ )
62
+ , []),
63
+ isFocusedToastEscapeKeyDownRef: isFocusedToastEscapeKeyDownRef,
64
+ isClosePausedRef: isClosePausedRef
65
+ }, children));
66
+ };
67
+ $054eb8030ebde76e$export$f5d03d415824e0e.propTypes = {
68
+ label (props) {
69
+ if (props.label && typeof props.label === 'string' && !props.label.trim()) {
70
+ const error = `Invalid prop \`label\` supplied to \`${$054eb8030ebde76e$var$PROVIDER_NAME}\`. Expected non-empty \`string\`.`;
71
+ return new Error(error);
72
+ }
73
+ return null;
74
+ }
75
+ };
76
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$f5d03d415824e0e, {
77
+ displayName: $054eb8030ebde76e$var$PROVIDER_NAME
78
+ });
79
+ /* -------------------------------------------------------------------------------------------------
80
+ * ToastViewport
81
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$VIEWPORT_NAME = 'ToastViewport';
82
+ const $054eb8030ebde76e$var$VIEWPORT_DEFAULT_HOTKEY = [
83
+ 'F8'
84
+ ];
85
+ const $054eb8030ebde76e$var$VIEWPORT_PAUSE = 'toast.viewportPause';
86
+ const $054eb8030ebde76e$var$VIEWPORT_RESUME = 'toast.viewportResume';
87
+ const $054eb8030ebde76e$export$6192c2425ecfd989 = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
88
+ const { __scopeToast: __scopeToast , hotkey: hotkey = $054eb8030ebde76e$var$VIEWPORT_DEFAULT_HOTKEY , label: label = 'Notifications ({hotkey})' , ...viewportProps } = props;
89
+ const context = $054eb8030ebde76e$var$useToastProviderContext($054eb8030ebde76e$var$VIEWPORT_NAME, __scopeToast);
90
+ const getItems = $054eb8030ebde76e$var$useCollection(__scopeToast);
91
+ const wrapperRef = $eyrYI$useRef(null);
92
+ const headFocusProxyRef = $eyrYI$useRef(null);
93
+ const tailFocusProxyRef = $eyrYI$useRef(null);
94
+ const ref = $eyrYI$useRef(null);
95
+ const composedRefs = $eyrYI$useComposedRefs(forwardedRef, ref, context.onViewportChange);
96
+ const hotkeyLabel = hotkey.join('+').replace(/Key/g, '').replace(/Digit/g, '');
97
+ const hasToasts = context.toastCount > 0;
98
+ $eyrYI$useEffect(()=>{
99
+ const handleKeyDown = (event)=>{
100
+ var _ref$current;
101
+ // we use `event.code` as it is consistent regardless of meta keys that were pressed.
102
+ // for example, `event.key` for `Control+Alt+t` is `†` and `t !== †`
103
+ const isHotkeyPressed = hotkey.every((key)=>event[key] || event.code === key
104
+ );
105
+ if (isHotkeyPressed) (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.focus();
106
+ };
107
+ document.addEventListener('keydown', handleKeyDown);
108
+ return ()=>document.removeEventListener('keydown', handleKeyDown)
109
+ ;
110
+ }, [
111
+ hotkey
112
+ ]);
113
+ $eyrYI$useEffect(()=>{
114
+ const wrapper = wrapperRef.current;
115
+ const viewport = ref.current;
116
+ if (wrapper && viewport) {
117
+ const handlePause = ()=>{
118
+ const pauseEvent = new CustomEvent($054eb8030ebde76e$var$VIEWPORT_PAUSE);
119
+ viewport.dispatchEvent(pauseEvent);
120
+ context.isClosePausedRef.current = true;
121
+ };
122
+ const handleResume = ()=>{
123
+ const resumeEvent = new CustomEvent($054eb8030ebde76e$var$VIEWPORT_RESUME);
124
+ viewport.dispatchEvent(resumeEvent);
125
+ context.isClosePausedRef.current = false;
126
+ }; // Toasts are not in the viewport React tree so we need to bind DOM events
127
+ wrapper.addEventListener('focusin', handlePause);
128
+ wrapper.addEventListener('focusout', handleResume);
129
+ wrapper.addEventListener('pointerenter', handlePause);
130
+ wrapper.addEventListener('pointerleave', handleResume);
131
+ window.addEventListener('blur', handlePause);
132
+ window.addEventListener('focus', handleResume);
133
+ return ()=>{
134
+ wrapper.removeEventListener('focusin', handlePause);
135
+ wrapper.removeEventListener('focusout', handleResume);
136
+ wrapper.removeEventListener('pointerenter', handlePause);
137
+ wrapper.removeEventListener('pointerleave', handleResume);
138
+ window.removeEventListener('blur', handlePause);
139
+ window.removeEventListener('focus', handleResume);
140
+ };
141
+ }
142
+ }, [
143
+ context.isClosePausedRef
144
+ ]);
145
+ const getSortedTabbableCandidates = $eyrYI$useCallback(({ tabbingDirection: tabbingDirection })=>{
146
+ const toastItems = getItems();
147
+ const tabbableCandidates = toastItems.map((toastItem)=>{
148
+ const toastNode = toastItem.ref.current;
149
+ const toastTabbableCandidates = [
150
+ toastNode,
151
+ ...$054eb8030ebde76e$var$getTabbableCandidates(toastNode)
152
+ ];
153
+ return tabbingDirection === 'forwards' ? toastTabbableCandidates : toastTabbableCandidates.reverse();
154
+ });
155
+ return (tabbingDirection === 'forwards' ? tabbableCandidates.reverse() : tabbableCandidates).flat();
156
+ }, [
157
+ getItems
158
+ ]);
159
+ $eyrYI$useEffect(()=>{
160
+ const viewport = ref.current; // We programmatically manage tabbing as we are unable to influence
161
+ // the source order with portals, this allows us to reverse the
162
+ // tab order so that it runs from most recent toast to least
163
+ if (viewport) {
164
+ const handleKeyDown = (event)=>{
165
+ const isMetaKey = event.altKey || event.ctrlKey || event.metaKey;
166
+ const isTabKey = event.key === 'Tab' && !isMetaKey;
167
+ if (isTabKey) {
168
+ const focusedElement = document.activeElement;
169
+ const isTabbingBackwards = event.shiftKey;
170
+ const targetIsViewport = event.target === viewport; // If we're back tabbing after jumping to the viewport then we simply
171
+ // proxy focus out to the preceding document
172
+ if (targetIsViewport && isTabbingBackwards) {
173
+ var _headFocusProxyRef$cu;
174
+ (_headFocusProxyRef$cu = headFocusProxyRef.current) === null || _headFocusProxyRef$cu === void 0 || _headFocusProxyRef$cu.focus();
175
+ return;
176
+ }
177
+ const tabbingDirection = isTabbingBackwards ? 'backwards' : 'forwards';
178
+ const sortedCandidates = getSortedTabbableCandidates({
179
+ tabbingDirection: tabbingDirection
180
+ });
181
+ const index = sortedCandidates.findIndex((candidate)=>candidate === focusedElement
182
+ );
183
+ if ($054eb8030ebde76e$var$focusFirst(sortedCandidates.slice(index + 1))) event.preventDefault();
184
+ else {
185
+ var _headFocusProxyRef$cu2, _tailFocusProxyRef$cu;
186
+ // If we can't focus that means we're at the edges so we
187
+ // proxy to the corresponding exit point and let the browser handle
188
+ // tab/shift+tab keypress and implicitly pass focus to the next valid element in the document
189
+ isTabbingBackwards ? (_headFocusProxyRef$cu2 = headFocusProxyRef.current) === null || _headFocusProxyRef$cu2 === void 0 || _headFocusProxyRef$cu2.focus() : (_tailFocusProxyRef$cu = tailFocusProxyRef.current) === null || _tailFocusProxyRef$cu === void 0 || _tailFocusProxyRef$cu.focus();
190
+ }
191
+ }
192
+ }; // Toasts are not in the viewport React tree so we need to bind DOM events
193
+ viewport.addEventListener('keydown', handleKeyDown);
194
+ return ()=>viewport.removeEventListener('keydown', handleKeyDown)
195
+ ;
196
+ }
197
+ }, [
198
+ getItems,
199
+ getSortedTabbableCandidates
200
+ ]);
201
+ return /*#__PURE__*/ $eyrYI$createElement($eyrYI$Branch, {
202
+ ref: wrapperRef,
203
+ role: "region",
204
+ "aria-label": label.replace('{hotkey}', hotkeyLabel) // Ensure virtual cursor from landmarks menus triggers focus/blur for pause/resume
205
+ ,
206
+ tabIndex: -1 // incase list has size when empty (e.g. padding), we remove pointer events so
207
+ ,
208
+ style: {
209
+ pointerEvents: hasToasts ? undefined : 'none'
210
+ }
211
+ }, hasToasts && /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$FocusProxy, {
212
+ ref: headFocusProxyRef,
213
+ onFocusFromOutsideViewport: ()=>{
214
+ const tabbableCandidates = getSortedTabbableCandidates({
215
+ tabbingDirection: 'forwards'
216
+ });
217
+ $054eb8030ebde76e$var$focusFirst(tabbableCandidates);
218
+ }
219
+ }), /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$Collection.Slot, {
220
+ scope: __scopeToast
221
+ }, /*#__PURE__*/ $eyrYI$createElement($eyrYI$Primitive.ol, $eyrYI$babelruntimehelpersesmextends({
222
+ tabIndex: -1
223
+ }, viewportProps, {
224
+ ref: composedRefs
225
+ }))), hasToasts && /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$FocusProxy, {
226
+ ref: tailFocusProxyRef,
227
+ onFocusFromOutsideViewport: ()=>{
228
+ const tabbableCandidates = getSortedTabbableCandidates({
229
+ tabbingDirection: 'backwards'
230
+ });
231
+ $054eb8030ebde76e$var$focusFirst(tabbableCandidates);
232
+ }
233
+ }));
234
+ });
235
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$6192c2425ecfd989, {
236
+ displayName: $054eb8030ebde76e$var$VIEWPORT_NAME
237
+ });
238
+ /* -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$FOCUS_PROXY_NAME = 'ToastFocusProxy';
239
+ const $054eb8030ebde76e$var$FocusProxy = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
240
+ const { __scopeToast: __scopeToast , onFocusFromOutsideViewport: onFocusFromOutsideViewport , ...proxyProps } = props;
241
+ const context = $054eb8030ebde76e$var$useToastProviderContext($054eb8030ebde76e$var$FOCUS_PROXY_NAME, __scopeToast);
242
+ return /*#__PURE__*/ $eyrYI$createElement($eyrYI$VisuallyHidden, $eyrYI$babelruntimehelpersesmextends({
243
+ "aria-hidden": true,
244
+ tabIndex: 0
245
+ }, proxyProps, {
246
+ ref: forwardedRef // Avoid page scrolling when focus is on the focus proxy
247
+ ,
248
+ style: {
249
+ position: 'fixed'
250
+ },
251
+ onFocus: (event)=>{
252
+ var _context$viewport;
253
+ const prevFocusedElement = event.relatedTarget;
254
+ const isFocusFromOutsideViewport = !((_context$viewport = context.viewport) !== null && _context$viewport !== void 0 && _context$viewport.contains(prevFocusedElement));
255
+ if (isFocusFromOutsideViewport) onFocusFromOutsideViewport();
256
+ }
257
+ }));
258
+ });
259
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$var$FocusProxy, {
260
+ displayName: $054eb8030ebde76e$var$FOCUS_PROXY_NAME
261
+ });
262
+ /* -------------------------------------------------------------------------------------------------
263
+ * Toast
264
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$TOAST_NAME = 'Toast';
265
+ const $054eb8030ebde76e$var$TOAST_SWIPE_START = 'toast.swipeStart';
266
+ const $054eb8030ebde76e$var$TOAST_SWIPE_MOVE = 'toast.swipeMove';
267
+ const $054eb8030ebde76e$var$TOAST_SWIPE_CANCEL = 'toast.swipeCancel';
268
+ const $054eb8030ebde76e$var$TOAST_SWIPE_END = 'toast.swipeEnd';
269
+ const $054eb8030ebde76e$export$8d8dc7d5f743331b = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
270
+ const { forceMount: forceMount , open: openProp , defaultOpen: defaultOpen , onOpenChange: onOpenChange , ...toastProps } = props;
271
+ const [open = true, setOpen] = $eyrYI$useControllableState({
272
+ prop: openProp,
273
+ defaultProp: defaultOpen,
274
+ onChange: onOpenChange
275
+ });
276
+ return /*#__PURE__*/ $eyrYI$createElement($eyrYI$Presence, {
277
+ present: forceMount || open
278
+ }, /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$ToastImpl, $eyrYI$babelruntimehelpersesmextends({
279
+ open: open
280
+ }, toastProps, {
281
+ ref: forwardedRef,
282
+ onClose: ()=>setOpen(false)
283
+ ,
284
+ onSwipeStart: $eyrYI$composeEventHandlers(props.onSwipeStart, (event)=>{
285
+ event.currentTarget.setAttribute('data-swipe', 'start');
286
+ }),
287
+ onSwipeMove: $eyrYI$composeEventHandlers(props.onSwipeMove, (event)=>{
288
+ const { x: x , y: y } = event.detail.delta;
289
+ event.currentTarget.setAttribute('data-swipe', 'move');
290
+ event.currentTarget.style.setProperty('--radix-toast-swipe-move-x', `${x}px`);
291
+ event.currentTarget.style.setProperty('--radix-toast-swipe-move-y', `${y}px`);
292
+ }),
293
+ onSwipeCancel: $eyrYI$composeEventHandlers(props.onSwipeCancel, (event)=>{
294
+ event.currentTarget.setAttribute('data-swipe', 'cancel');
295
+ event.currentTarget.style.removeProperty('--radix-toast-swipe-move-x');
296
+ event.currentTarget.style.removeProperty('--radix-toast-swipe-move-y');
297
+ event.currentTarget.style.removeProperty('--radix-toast-swipe-end-x');
298
+ event.currentTarget.style.removeProperty('--radix-toast-swipe-end-y');
299
+ }),
300
+ onSwipeEnd: $eyrYI$composeEventHandlers(props.onSwipeEnd, (event)=>{
301
+ const { x: x , y: y } = event.detail.delta;
302
+ event.currentTarget.setAttribute('data-swipe', 'end');
303
+ event.currentTarget.style.removeProperty('--radix-toast-swipe-move-x');
304
+ event.currentTarget.style.removeProperty('--radix-toast-swipe-move-y');
305
+ event.currentTarget.style.setProperty('--radix-toast-swipe-end-x', `${x}px`);
306
+ event.currentTarget.style.setProperty('--radix-toast-swipe-end-y', `${y}px`);
307
+ setOpen(false);
308
+ })
309
+ })));
310
+ });
311
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$8d8dc7d5f743331b, {
312
+ displayName: $054eb8030ebde76e$var$TOAST_NAME
313
+ });
314
+ /* -----------------------------------------------------------------------------------------------*/ const [$054eb8030ebde76e$var$ToastInteractiveProvider, $054eb8030ebde76e$var$useToastInteractiveContext] = $054eb8030ebde76e$var$createToastContext($054eb8030ebde76e$var$TOAST_NAME, {
315
+ isInteractive: false,
316
+ onClose () {}
317
+ });
318
+ const $054eb8030ebde76e$var$ToastImpl = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
319
+ const { __scopeToast: __scopeToast , children: children , type: type = 'foreground' , duration: durationProp , open: open , onClose: onClose , onEscapeKeyDown: onEscapeKeyDown , onSwipeStart: onSwipeStart , onSwipeMove: onSwipeMove , onSwipeCancel: onSwipeCancel , onSwipeEnd: onSwipeEnd , ...toastProps } = props;
320
+ const context = $054eb8030ebde76e$var$useToastProviderContext($054eb8030ebde76e$var$TOAST_NAME, __scopeToast);
321
+ const ref = $eyrYI$useRef(null);
322
+ const composedRefs = $eyrYI$useComposedRefs(forwardedRef, ref);
323
+ const pointerStartRef = $eyrYI$useRef(null);
324
+ const swipeDeltaRef = $eyrYI$useRef(null);
325
+ const duration1 = durationProp || context.duration;
326
+ const closeTimerStartTimeRef = $eyrYI$useRef(0);
327
+ const closeTimerRemainingTimeRef = $eyrYI$useRef(duration1);
328
+ const closeTimerRef = $eyrYI$useRef(0);
329
+ const [renderLabel, setRenderLabel] = $eyrYI$useState(false);
330
+ const { onToastAdd: onToastAdd , onToastRemove: onToastRemove } = context;
331
+ const handleClose = $eyrYI$useCallbackRef(()=>{
332
+ var _ref$current2, _context$viewport2;
333
+ // focus viewport if focus is within toast to read the remaining toast
334
+ // count to SR users and ensure focus isn't lost
335
+ const isFocusInToast = (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.contains(document.activeElement);
336
+ if (isFocusInToast) (_context$viewport2 = context.viewport) === null || _context$viewport2 === void 0 || _context$viewport2.focus();
337
+ onClose();
338
+ });
339
+ const startTimer = $eyrYI$useCallback((duration)=>{
340
+ if (!duration || duration === Infinity) return;
341
+ window.clearTimeout(closeTimerRef.current);
342
+ closeTimerStartTimeRef.current = new Date().getTime();
343
+ closeTimerRef.current = window.setTimeout(handleClose, duration);
344
+ }, [
345
+ handleClose
346
+ ]);
347
+ $eyrYI$useEffect(()=>{
348
+ const viewport = context.viewport;
349
+ if (viewport) {
350
+ const handleResume = ()=>{
351
+ startTimer(closeTimerRemainingTimeRef.current);
352
+ };
353
+ const handlePause = ()=>{
354
+ const elapsedTime = new Date().getTime() - closeTimerStartTimeRef.current;
355
+ closeTimerRemainingTimeRef.current = closeTimerRemainingTimeRef.current - elapsedTime;
356
+ window.clearTimeout(closeTimerRef.current);
357
+ };
358
+ viewport.addEventListener($054eb8030ebde76e$var$VIEWPORT_PAUSE, handlePause);
359
+ viewport.addEventListener($054eb8030ebde76e$var$VIEWPORT_RESUME, handleResume);
360
+ return ()=>{
361
+ viewport.removeEventListener($054eb8030ebde76e$var$VIEWPORT_PAUSE, handlePause);
362
+ viewport.removeEventListener($054eb8030ebde76e$var$VIEWPORT_RESUME, handleResume);
363
+ };
364
+ }
365
+ }, [
366
+ context.viewport,
367
+ duration1,
368
+ startTimer
369
+ ]); // start timer when toast opens or duration changes.
370
+ // we include `open` in deps because closed !== unmounted when animating
371
+ // so it could reopen before being completely unmounted
372
+ $eyrYI$useEffect(()=>{
373
+ if (open && !context.isClosePausedRef.current) startTimer(duration1);
374
+ }, [
375
+ open,
376
+ duration1,
377
+ context.isClosePausedRef,
378
+ startTimer
379
+ ]);
380
+ $eyrYI$useEffect(()=>{
381
+ onToastAdd();
382
+ return ()=>onToastRemove()
383
+ ;
384
+ }, [
385
+ onToastAdd,
386
+ onToastRemove
387
+ ]); // render label in the next frame to trigger toast announcement in NVDA
388
+ $054eb8030ebde76e$var$useNextFrame(()=>setRenderLabel(true)
389
+ );
390
+ if (!context.viewport) return null;
391
+ return /*#__PURE__*/ $eyrYI$createElement($eyrYI$Fragment, null, /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$ToastInteractiveProvider, {
392
+ scope: __scopeToast,
393
+ isInteractive: true,
394
+ onClose: handleClose
395
+ }, /*#__PURE__*/ $eyrYI$createPortal(/*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$var$Collection.ItemSlot, {
396
+ scope: __scopeToast
397
+ }, /*#__PURE__*/ $eyrYI$createElement($eyrYI$Root, {
398
+ asChild: true,
399
+ onEscapeKeyDown: $eyrYI$composeEventHandlers(onEscapeKeyDown, ()=>{
400
+ if (!context.isFocusedToastEscapeKeyDownRef.current) handleClose();
401
+ context.isFocusedToastEscapeKeyDownRef.current = false;
402
+ })
403
+ }, /*#__PURE__*/ $eyrYI$createElement($eyrYI$Primitive.li, $eyrYI$babelruntimehelpersesmextends({
404
+ role: "status",
405
+ "aria-live": type === 'foreground' ? 'assertive' : 'polite',
406
+ "aria-atomic": true // Prevent voice over from announcing before the label is rendered
407
+ ,
408
+ "aria-hidden": !renderLabel || undefined,
409
+ tabIndex: 0,
410
+ "data-state": open ? 'open' : 'closed',
411
+ "data-swipe-direction": context.swipeDirection
412
+ }, toastProps, {
413
+ ref: composedRefs,
414
+ style: {
415
+ userSelect: 'none',
416
+ touchAction: 'none',
417
+ ...props.style
418
+ },
419
+ onKeyDown: $eyrYI$composeEventHandlers(props.onKeyDown, (event)=>{
420
+ if (event.key !== 'Escape') return;
421
+ onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event.nativeEvent);
422
+ if (!event.nativeEvent.defaultPrevented) {
423
+ context.isFocusedToastEscapeKeyDownRef.current = true;
424
+ handleClose();
425
+ }
426
+ }),
427
+ onPointerDown: $eyrYI$composeEventHandlers(props.onPointerDown, (event)=>{
428
+ if (event.button !== 0) return;
429
+ pointerStartRef.current = {
430
+ x: event.clientX,
431
+ y: event.clientY
432
+ };
433
+ }),
434
+ onPointerMove: $eyrYI$composeEventHandlers(props.onPointerMove, (event)=>{
435
+ if (!pointerStartRef.current) return;
436
+ const x = event.clientX - pointerStartRef.current.x;
437
+ const y = event.clientY - pointerStartRef.current.y;
438
+ const hasSwipeMoveStarted = Boolean(swipeDeltaRef.current);
439
+ const isHorizontalSwipe = [
440
+ 'left',
441
+ 'right'
442
+ ].includes(context.swipeDirection);
443
+ const clamp = [
444
+ 'left',
445
+ 'up'
446
+ ].includes(context.swipeDirection) ? Math.min : Math.max;
447
+ const clampedX = isHorizontalSwipe ? clamp(0, x) : 0;
448
+ const clampedY = !isHorizontalSwipe ? clamp(0, y) : 0;
449
+ const moveStartBuffer = event.pointerType === 'touch' ? 10 : 2;
450
+ const delta = {
451
+ x: clampedX,
452
+ y: clampedY
453
+ };
454
+ const eventDetail = {
455
+ originalEvent: event,
456
+ delta: delta
457
+ };
458
+ if (hasSwipeMoveStarted) {
459
+ swipeDeltaRef.current = delta;
460
+ $054eb8030ebde76e$var$handleAndDispatchCustomEvent($054eb8030ebde76e$var$TOAST_SWIPE_MOVE, onSwipeMove, eventDetail, {
461
+ discrete: false
462
+ });
463
+ } else if ($054eb8030ebde76e$var$isDeltaInDirection(delta, context.swipeDirection, moveStartBuffer)) {
464
+ swipeDeltaRef.current = delta;
465
+ $054eb8030ebde76e$var$handleAndDispatchCustomEvent($054eb8030ebde76e$var$TOAST_SWIPE_START, onSwipeStart, eventDetail, {
466
+ discrete: false
467
+ });
468
+ event.target.setPointerCapture(event.pointerId);
469
+ } else if (Math.abs(x) > moveStartBuffer || Math.abs(y) > moveStartBuffer) // User is swiping in wrong direction so we disable swipe gesture
470
+ // for the current pointer down interaction
471
+ pointerStartRef.current = null;
472
+ }),
473
+ onPointerUp: $eyrYI$composeEventHandlers(props.onPointerUp, (event1)=>{
474
+ const delta = swipeDeltaRef.current;
475
+ event1.target.releasePointerCapture(event1.pointerId);
476
+ swipeDeltaRef.current = null;
477
+ pointerStartRef.current = null;
478
+ if (delta) {
479
+ const toast = event1.currentTarget;
480
+ const eventDetail = {
481
+ originalEvent: event1,
482
+ delta: delta
483
+ };
484
+ if ($054eb8030ebde76e$var$isDeltaInDirection(delta, context.swipeDirection, context.swipeThreshold)) $054eb8030ebde76e$var$handleAndDispatchCustomEvent($054eb8030ebde76e$var$TOAST_SWIPE_END, onSwipeEnd, eventDetail, {
485
+ discrete: true
486
+ });
487
+ else $054eb8030ebde76e$var$handleAndDispatchCustomEvent($054eb8030ebde76e$var$TOAST_SWIPE_CANCEL, onSwipeCancel, eventDetail, {
488
+ discrete: true
489
+ });
490
+ // Prevent click event from triggering on items within the toast when
491
+ // pointer up is part of a swipe gesture
492
+ toast.addEventListener('click', (event)=>event.preventDefault()
493
+ , {
494
+ once: true
495
+ });
496
+ }
497
+ })
498
+ }), /*#__PURE__*/ $eyrYI$createElement($eyrYI$VisuallyHidden, null, renderLabel && context.label), /*#__PURE__*/ $eyrYI$createElement($eyrYI$Slottable, null, children)))), context.viewport)));
499
+ });
500
+ $054eb8030ebde76e$var$ToastImpl.propTypes = {
501
+ type (props) {
502
+ if (props.type && ![
503
+ 'foreground',
504
+ 'background'
505
+ ].includes(props.type)) {
506
+ const error = `Invalid prop \`type\` supplied to \`${$054eb8030ebde76e$var$TOAST_NAME}\`. Expected \`foreground | background\`.`;
507
+ return new Error(error);
508
+ }
509
+ return null;
510
+ }
511
+ };
512
+ /* -------------------------------------------------------------------------------------------------
513
+ * ToastTitle
514
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$TITLE_NAME = 'ToastTitle';
515
+ const $054eb8030ebde76e$export$16d42d7c29b95a4 = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
516
+ const { __scopeToast: __scopeToast , ...titleProps } = props;
517
+ return /*#__PURE__*/ $eyrYI$createElement($eyrYI$Primitive.div, $eyrYI$babelruntimehelpersesmextends({}, titleProps, {
518
+ ref: forwardedRef
519
+ }));
520
+ });
521
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$16d42d7c29b95a4, {
522
+ displayName: $054eb8030ebde76e$var$TITLE_NAME
523
+ });
524
+ /* -------------------------------------------------------------------------------------------------
525
+ * ToastDescription
526
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$DESCRIPTION_NAME = 'ToastDescription';
527
+ const $054eb8030ebde76e$export$ecddd96c53621d9a = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
528
+ const { __scopeToast: __scopeToast , ...descriptionProps } = props;
529
+ return /*#__PURE__*/ $eyrYI$createElement($eyrYI$Primitive.div, $eyrYI$babelruntimehelpersesmextends({}, descriptionProps, {
530
+ ref: forwardedRef
531
+ }));
532
+ });
533
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$ecddd96c53621d9a, {
534
+ displayName: $054eb8030ebde76e$var$DESCRIPTION_NAME
535
+ });
536
+ /* -------------------------------------------------------------------------------------------------
537
+ * ToastAction
538
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$ACTION_NAME = 'ToastAction';
539
+ const $054eb8030ebde76e$export$3019feecfda683d2 = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
540
+ const { altText: altText , ...actionProps } = props;
541
+ const context = $054eb8030ebde76e$var$useToastInteractiveContext($054eb8030ebde76e$var$ACTION_NAME, props.__scopeToast);
542
+ if (!altText) return null;
543
+ return context.isInteractive ? /*#__PURE__*/ $eyrYI$createElement($054eb8030ebde76e$export$811e70f61c205839, $eyrYI$babelruntimehelpersesmextends({}, actionProps, {
544
+ ref: forwardedRef
545
+ })) : /*#__PURE__*/ $eyrYI$createElement("span", null, altText);
546
+ });
547
+ $054eb8030ebde76e$export$3019feecfda683d2.propTypes = {
548
+ altText (props) {
549
+ if (!props.altText) return new Error(`Missing prop \`altText\` expected on \`${$054eb8030ebde76e$var$ACTION_NAME}\``);
550
+ return null;
551
+ }
552
+ };
553
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$3019feecfda683d2, {
554
+ displayName: $054eb8030ebde76e$var$ACTION_NAME
555
+ });
556
+ /* -------------------------------------------------------------------------------------------------
557
+ * ToastClose
558
+ * -----------------------------------------------------------------------------------------------*/ const $054eb8030ebde76e$var$CLOSE_NAME = 'ToastClose';
559
+ const $054eb8030ebde76e$export$811e70f61c205839 = /*#__PURE__*/ $eyrYI$forwardRef((props, forwardedRef)=>{
560
+ const { __scopeToast: __scopeToast , ...closeProps } = props;
561
+ const interactiveContext = $054eb8030ebde76e$var$useToastInteractiveContext($054eb8030ebde76e$var$CLOSE_NAME, __scopeToast);
562
+ return interactiveContext.isInteractive ? /*#__PURE__*/ $eyrYI$createElement($eyrYI$Primitive.button, $eyrYI$babelruntimehelpersesmextends({
563
+ type: "button"
564
+ }, closeProps, {
565
+ ref: forwardedRef,
566
+ onClick: $eyrYI$composeEventHandlers(props.onClick, interactiveContext.onClose)
567
+ })) : null;
568
+ });
569
+ /*#__PURE__*/ Object.assign($054eb8030ebde76e$export$811e70f61c205839, {
570
+ displayName: $054eb8030ebde76e$var$CLOSE_NAME
571
+ });
572
+ /* ---------------------------------------------------------------------------------------------- */ function $054eb8030ebde76e$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete }) {
573
+ const currentTarget = detail.originalEvent.currentTarget;
574
+ const event = new CustomEvent(name, {
575
+ bubbles: true,
576
+ cancelable: true,
577
+ detail: detail
578
+ });
579
+ if (handler) currentTarget.addEventListener(name, handler, {
580
+ once: true
581
+ });
582
+ if (discrete) $eyrYI$dispatchDiscreteCustomEvent(currentTarget, event);
583
+ else currentTarget.dispatchEvent(event);
584
+ }
585
+ const $054eb8030ebde76e$var$isDeltaInDirection = (delta, direction, threshold = 0)=>{
586
+ const deltaX = Math.abs(delta.x);
587
+ const deltaY = Math.abs(delta.y);
588
+ const isDeltaX = deltaX > deltaY;
589
+ if (direction === 'left' || direction === 'right') return isDeltaX && deltaX > threshold;
590
+ else return !isDeltaX && deltaY > threshold;
591
+ };
592
+ function $054eb8030ebde76e$var$useNextFrame(callback = ()=>{}) {
593
+ const fn = $eyrYI$useCallbackRef(callback);
594
+ $eyrYI$useLayoutEffect(()=>{
595
+ let raf1 = 0;
596
+ let raf2 = 0;
597
+ raf1 = window.requestAnimationFrame(()=>raf2 = window.requestAnimationFrame(fn)
598
+ );
599
+ return ()=>{
600
+ window.cancelAnimationFrame(raf1);
601
+ window.cancelAnimationFrame(raf2);
602
+ };
603
+ }, [
604
+ fn
605
+ ]);
606
+ }
607
+ /**
608
+ * Returns a list of potential tabbable candidates.
609
+ *
610
+ * NOTE: This is only a close approximation. For example it doesn't take into account cases like when
611
+ * elements are not visible. This cannot be worked out easily by just reading a property, but rather
612
+ * necessitate runtime knowledge (computed styles, etc). We deal with these cases separately.
613
+ *
614
+ * See: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
615
+ * Credit: https://github.com/discord/focus-layers/blob/master/src/util/wrapFocus.tsx#L1
616
+ */ function $054eb8030ebde76e$var$getTabbableCandidates(container) {
617
+ const nodes = [];
618
+ const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
619
+ acceptNode: (node)=>{
620
+ const isHiddenInput = node.tagName === 'INPUT' && node.type === 'hidden';
621
+ if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP; // `.tabIndex` is not the same as the `tabindex` attribute. It works on the
622
+ // runtime's understanding of tabbability, so this automatically accounts
623
+ // for any kind of element that could be tabbed to.
624
+ return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
625
+ }
626
+ });
627
+ while(walker.nextNode())nodes.push(walker.currentNode); // we do not take into account the order of nodes with positive `tabIndex` as it
628
+ // hinders accessibility to have tab order different from visual order.
629
+ return nodes;
630
+ }
631
+ function $054eb8030ebde76e$var$focusFirst(candidates) {
632
+ const previouslyFocusedElement = document.activeElement;
633
+ return candidates.some((candidate)=>{
634
+ // if focus is already where we want to go, we don't want to keep going through the candidates
635
+ if (candidate === previouslyFocusedElement) return true;
636
+ candidate.focus();
637
+ return document.activeElement !== previouslyFocusedElement;
638
+ });
639
+ }
640
+ const $054eb8030ebde76e$export$2881499e37b75b9a = $054eb8030ebde76e$export$f5d03d415824e0e;
641
+ const $054eb8030ebde76e$export$d5c6c08dc2d3ca7 = $054eb8030ebde76e$export$6192c2425ecfd989;
642
+ const $054eb8030ebde76e$export$be92b6f5f03c0fe9 = $054eb8030ebde76e$export$8d8dc7d5f743331b;
643
+ const $054eb8030ebde76e$export$f99233281efd08a0 = $054eb8030ebde76e$export$16d42d7c29b95a4;
644
+ const $054eb8030ebde76e$export$393edc798c47379d = $054eb8030ebde76e$export$ecddd96c53621d9a;
645
+ const $054eb8030ebde76e$export$e19cd5f9376f8cee = $054eb8030ebde76e$export$3019feecfda683d2;
646
+ const $054eb8030ebde76e$export$f39c2d165cd861fe = $054eb8030ebde76e$export$811e70f61c205839;
647
+
648
+
649
+
650
+
651
+ export {$054eb8030ebde76e$export$8a359da18fbc9073 as createToastScope, $054eb8030ebde76e$export$f5d03d415824e0e as ToastProvider, $054eb8030ebde76e$export$6192c2425ecfd989 as ToastViewport, $054eb8030ebde76e$export$8d8dc7d5f743331b as Toast, $054eb8030ebde76e$export$16d42d7c29b95a4 as ToastTitle, $054eb8030ebde76e$export$ecddd96c53621d9a as ToastDescription, $054eb8030ebde76e$export$3019feecfda683d2 as ToastAction, $054eb8030ebde76e$export$811e70f61c205839 as ToastClose, $054eb8030ebde76e$export$2881499e37b75b9a as Provider, $054eb8030ebde76e$export$d5c6c08dc2d3ca7 as Viewport, $054eb8030ebde76e$export$be92b6f5f03c0fe9 as Root, $054eb8030ebde76e$export$f99233281efd08a0 as Title, $054eb8030ebde76e$export$393edc798c47379d as Description, $054eb8030ebde76e$export$e19cd5f9376f8cee as Action, $054eb8030ebde76e$export$f39c2d165cd861fe as Close};
2
652
  //# sourceMappingURL=index.module.js.map