@tamagui/v2-toast 2.0.0-1769464493958
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.
- package/dist/cjs/Toast.cjs +170 -0
- package/dist/cjs/Toast.js +119 -0
- package/dist/cjs/Toast.js.map +6 -0
- package/dist/cjs/Toast.native.js +174 -0
- package/dist/cjs/Toast.native.js.map +1 -0
- package/dist/cjs/ToastAnnounce.cjs +97 -0
- package/dist/cjs/ToastAnnounce.js +72 -0
- package/dist/cjs/ToastAnnounce.js.map +6 -0
- package/dist/cjs/ToastAnnounce.native.js +105 -0
- package/dist/cjs/ToastAnnounce.native.js.map +1 -0
- package/dist/cjs/ToastImperative.cjs +100 -0
- package/dist/cjs/ToastImperative.js +71 -0
- package/dist/cjs/ToastImperative.js.map +6 -0
- package/dist/cjs/ToastImperative.native.js +122 -0
- package/dist/cjs/ToastImperative.native.js.map +1 -0
- package/dist/cjs/ToastImpl.cjs +292 -0
- package/dist/cjs/ToastImpl.js +227 -0
- package/dist/cjs/ToastImpl.js.map +6 -0
- package/dist/cjs/ToastImpl.native.js +327 -0
- package/dist/cjs/ToastImpl.native.js.map +1 -0
- package/dist/cjs/ToastItem.cjs +466 -0
- package/dist/cjs/ToastItem.js +356 -0
- package/dist/cjs/ToastItem.js.map +6 -0
- package/dist/cjs/ToastItem.native.js +547 -0
- package/dist/cjs/ToastItem.native.js.map +1 -0
- package/dist/cjs/ToastPortal.cjs +44 -0
- package/dist/cjs/ToastPortal.js +26 -0
- package/dist/cjs/ToastPortal.js.map +6 -0
- package/dist/cjs/ToastPortal.native.js +47 -0
- package/dist/cjs/ToastPortal.native.js.map +1 -0
- package/dist/cjs/ToastProvider.cjs +146 -0
- package/dist/cjs/ToastProvider.js +105 -0
- package/dist/cjs/ToastProvider.js.map +6 -0
- package/dist/cjs/ToastProvider.native.js +159 -0
- package/dist/cjs/ToastProvider.native.js.map +1 -0
- package/dist/cjs/ToastState.cjs +248 -0
- package/dist/cjs/ToastState.js +160 -0
- package/dist/cjs/ToastState.js.map +6 -0
- package/dist/cjs/ToastState.native.js +257 -0
- package/dist/cjs/ToastState.native.js.map +1 -0
- package/dist/cjs/ToastViewport.cjs +278 -0
- package/dist/cjs/ToastViewport.js +263 -0
- package/dist/cjs/ToastViewport.js.map +6 -0
- package/dist/cjs/ToastViewport.native.js +316 -0
- package/dist/cjs/ToastViewport.native.js.map +1 -0
- package/dist/cjs/Toaster.cjs +219 -0
- package/dist/cjs/Toaster.js +177 -0
- package/dist/cjs/Toaster.js.map +6 -0
- package/dist/cjs/Toaster.native.js +279 -0
- package/dist/cjs/Toaster.native.js.map +1 -0
- package/dist/cjs/constants.cjs +28 -0
- package/dist/cjs/constants.js +22 -0
- package/dist/cjs/constants.js.map +6 -0
- package/dist/cjs/constants.native.js +31 -0
- package/dist/cjs/constants.native.js.map +1 -0
- package/dist/cjs/createNativeToast.cjs +51 -0
- package/dist/cjs/createNativeToast.js +44 -0
- package/dist/cjs/createNativeToast.js.map +6 -0
- package/dist/cjs/createNativeToast.native.js +47 -0
- package/dist/cjs/createNativeToast.native.js.map +1 -0
- package/dist/cjs/index.cjs +28 -0
- package/dist/cjs/index.js +22 -0
- package/dist/cjs/index.js.map +6 -0
- package/dist/cjs/index.native.js +31 -0
- package/dist/cjs/index.native.js.map +1 -0
- package/dist/cjs/types.cjs +16 -0
- package/dist/cjs/types.js +14 -0
- package/dist/cjs/types.js.map +6 -0
- package/dist/cjs/types.native.js +19 -0
- package/dist/cjs/types.native.js.map +1 -0
- package/dist/cjs/useDragGesture.cjs +129 -0
- package/dist/cjs/useDragGesture.js +100 -0
- package/dist/cjs/useDragGesture.js.map +6 -0
- package/dist/cjs/useDragGesture.native.js +146 -0
- package/dist/cjs/useDragGesture.native.js.map +1 -0
- package/dist/esm/Toast.js +107 -0
- package/dist/esm/Toast.js.map +6 -0
- package/dist/esm/Toast.mjs +131 -0
- package/dist/esm/Toast.mjs.map +1 -0
- package/dist/esm/Toast.native.js +132 -0
- package/dist/esm/Toast.native.js.map +1 -0
- package/dist/esm/ToastAnnounce.js +55 -0
- package/dist/esm/ToastAnnounce.js.map +6 -0
- package/dist/esm/ToastAnnounce.mjs +62 -0
- package/dist/esm/ToastAnnounce.mjs.map +1 -0
- package/dist/esm/ToastAnnounce.native.js +67 -0
- package/dist/esm/ToastAnnounce.native.js.map +1 -0
- package/dist/esm/ToastImperative.js +50 -0
- package/dist/esm/ToastImperative.js.map +6 -0
- package/dist/esm/ToastImperative.mjs +63 -0
- package/dist/esm/ToastImperative.mjs.map +1 -0
- package/dist/esm/ToastImperative.native.js +82 -0
- package/dist/esm/ToastImperative.native.js.map +1 -0
- package/dist/esm/ToastImpl.js +225 -0
- package/dist/esm/ToastImpl.js.map +6 -0
- package/dist/esm/ToastImpl.mjs +256 -0
- package/dist/esm/ToastImpl.mjs.map +1 -0
- package/dist/esm/ToastImpl.native.js +288 -0
- package/dist/esm/ToastImpl.native.js.map +1 -0
- package/dist/esm/ToastItem.js +339 -0
- package/dist/esm/ToastItem.js.map +6 -0
- package/dist/esm/ToastItem.mjs +432 -0
- package/dist/esm/ToastItem.mjs.map +1 -0
- package/dist/esm/ToastItem.native.js +510 -0
- package/dist/esm/ToastItem.native.js.map +1 -0
- package/dist/esm/ToastPortal.js +13 -0
- package/dist/esm/ToastPortal.js.map +6 -0
- package/dist/esm/ToastPortal.mjs +21 -0
- package/dist/esm/ToastPortal.mjs.map +1 -0
- package/dist/esm/ToastPortal.native.js +21 -0
- package/dist/esm/ToastPortal.native.js.map +1 -0
- package/dist/esm/ToastProvider.js +87 -0
- package/dist/esm/ToastProvider.js.map +6 -0
- package/dist/esm/ToastProvider.mjs +108 -0
- package/dist/esm/ToastProvider.mjs.map +1 -0
- package/dist/esm/ToastProvider.native.js +118 -0
- package/dist/esm/ToastProvider.native.js.map +1 -0
- package/dist/esm/ToastState.js +144 -0
- package/dist/esm/ToastState.js.map +6 -0
- package/dist/esm/ToastState.mjs +224 -0
- package/dist/esm/ToastState.mjs.map +1 -0
- package/dist/esm/ToastState.native.js +230 -0
- package/dist/esm/ToastState.native.js.map +1 -0
- package/dist/esm/ToastViewport.js +250 -0
- package/dist/esm/ToastViewport.js.map +6 -0
- package/dist/esm/ToastViewport.mjs +241 -0
- package/dist/esm/ToastViewport.mjs.map +1 -0
- package/dist/esm/ToastViewport.native.js +276 -0
- package/dist/esm/ToastViewport.native.js.map +1 -0
- package/dist/esm/Toaster.js +160 -0
- package/dist/esm/Toaster.js.map +6 -0
- package/dist/esm/Toaster.mjs +185 -0
- package/dist/esm/Toaster.mjs.map +1 -0
- package/dist/esm/Toaster.native.js +242 -0
- package/dist/esm/Toaster.native.js.map +1 -0
- package/dist/esm/constants.js +6 -0
- package/dist/esm/constants.js.map +6 -0
- package/dist/esm/constants.mjs +4 -0
- package/dist/esm/constants.mjs.map +1 -0
- package/dist/esm/constants.native.js +4 -0
- package/dist/esm/constants.native.js.map +1 -0
- package/dist/esm/createNativeToast.js +28 -0
- package/dist/esm/createNativeToast.js.map +6 -0
- package/dist/esm/createNativeToast.mjs +27 -0
- package/dist/esm/createNativeToast.mjs.map +1 -0
- package/dist/esm/createNativeToast.native.js +20 -0
- package/dist/esm/createNativeToast.native.js.map +1 -0
- package/dist/esm/index.js +7 -0
- package/dist/esm/index.js.map +6 -0
- package/dist/esm/index.mjs +4 -0
- package/dist/esm/index.mjs.map +1 -0
- package/dist/esm/index.native.js +4 -0
- package/dist/esm/index.native.js.map +1 -0
- package/dist/esm/types.js +1 -0
- package/dist/esm/types.js.map +6 -0
- package/dist/esm/types.mjs +2 -0
- package/dist/esm/types.mjs.map +1 -0
- package/dist/esm/types.native.js +2 -0
- package/dist/esm/types.native.js.map +1 -0
- package/dist/esm/useDragGesture.js +76 -0
- package/dist/esm/useDragGesture.js.map +6 -0
- package/dist/esm/useDragGesture.mjs +95 -0
- package/dist/esm/useDragGesture.mjs.map +1 -0
- package/dist/esm/useDragGesture.native.js +109 -0
- package/dist/esm/useDragGesture.native.js.map +1 -0
- package/dist/jsx/Toast.js +107 -0
- package/dist/jsx/Toast.js.map +6 -0
- package/dist/jsx/Toast.mjs +131 -0
- package/dist/jsx/Toast.mjs.map +1 -0
- package/dist/jsx/Toast.native.js +174 -0
- package/dist/jsx/Toast.native.js.map +1 -0
- package/dist/jsx/ToastAnnounce.js +55 -0
- package/dist/jsx/ToastAnnounce.js.map +6 -0
- package/dist/jsx/ToastAnnounce.mjs +62 -0
- package/dist/jsx/ToastAnnounce.mjs.map +1 -0
- package/dist/jsx/ToastAnnounce.native.js +105 -0
- package/dist/jsx/ToastAnnounce.native.js.map +1 -0
- package/dist/jsx/ToastImperative.js +50 -0
- package/dist/jsx/ToastImperative.js.map +6 -0
- package/dist/jsx/ToastImperative.mjs +63 -0
- package/dist/jsx/ToastImperative.mjs.map +1 -0
- package/dist/jsx/ToastImperative.native.js +122 -0
- package/dist/jsx/ToastImperative.native.js.map +1 -0
- package/dist/jsx/ToastImpl.js +225 -0
- package/dist/jsx/ToastImpl.js.map +6 -0
- package/dist/jsx/ToastImpl.mjs +256 -0
- package/dist/jsx/ToastImpl.mjs.map +1 -0
- package/dist/jsx/ToastImpl.native.js +327 -0
- package/dist/jsx/ToastImpl.native.js.map +1 -0
- package/dist/jsx/ToastItem.js +339 -0
- package/dist/jsx/ToastItem.js.map +6 -0
- package/dist/jsx/ToastItem.mjs +432 -0
- package/dist/jsx/ToastItem.mjs.map +1 -0
- package/dist/jsx/ToastItem.native.js +547 -0
- package/dist/jsx/ToastItem.native.js.map +1 -0
- package/dist/jsx/ToastPortal.js +13 -0
- package/dist/jsx/ToastPortal.js.map +6 -0
- package/dist/jsx/ToastPortal.mjs +21 -0
- package/dist/jsx/ToastPortal.mjs.map +1 -0
- package/dist/jsx/ToastPortal.native.js +47 -0
- package/dist/jsx/ToastPortal.native.js.map +1 -0
- package/dist/jsx/ToastProvider.js +87 -0
- package/dist/jsx/ToastProvider.js.map +6 -0
- package/dist/jsx/ToastProvider.mjs +108 -0
- package/dist/jsx/ToastProvider.mjs.map +1 -0
- package/dist/jsx/ToastProvider.native.js +159 -0
- package/dist/jsx/ToastProvider.native.js.map +1 -0
- package/dist/jsx/ToastState.js +144 -0
- package/dist/jsx/ToastState.js.map +6 -0
- package/dist/jsx/ToastState.mjs +224 -0
- package/dist/jsx/ToastState.mjs.map +1 -0
- package/dist/jsx/ToastState.native.js +257 -0
- package/dist/jsx/ToastState.native.js.map +1 -0
- package/dist/jsx/ToastViewport.js +250 -0
- package/dist/jsx/ToastViewport.js.map +6 -0
- package/dist/jsx/ToastViewport.mjs +241 -0
- package/dist/jsx/ToastViewport.mjs.map +1 -0
- package/dist/jsx/ToastViewport.native.js +316 -0
- package/dist/jsx/ToastViewport.native.js.map +1 -0
- package/dist/jsx/Toaster.js +160 -0
- package/dist/jsx/Toaster.js.map +6 -0
- package/dist/jsx/Toaster.mjs +185 -0
- package/dist/jsx/Toaster.mjs.map +1 -0
- package/dist/jsx/Toaster.native.js +279 -0
- package/dist/jsx/Toaster.native.js.map +1 -0
- package/dist/jsx/constants.js +6 -0
- package/dist/jsx/constants.js.map +6 -0
- package/dist/jsx/constants.mjs +4 -0
- package/dist/jsx/constants.mjs.map +1 -0
- package/dist/jsx/constants.native.js +31 -0
- package/dist/jsx/constants.native.js.map +1 -0
- package/dist/jsx/createNativeToast.js +28 -0
- package/dist/jsx/createNativeToast.js.map +6 -0
- package/dist/jsx/createNativeToast.mjs +27 -0
- package/dist/jsx/createNativeToast.mjs.map +1 -0
- package/dist/jsx/createNativeToast.native.js +47 -0
- package/dist/jsx/createNativeToast.native.js.map +1 -0
- package/dist/jsx/index.js +7 -0
- package/dist/jsx/index.js.map +6 -0
- package/dist/jsx/index.mjs +4 -0
- package/dist/jsx/index.mjs.map +1 -0
- package/dist/jsx/index.native.js +31 -0
- package/dist/jsx/index.native.js.map +1 -0
- package/dist/jsx/types.js +1 -0
- package/dist/jsx/types.js.map +6 -0
- package/dist/jsx/types.mjs +2 -0
- package/dist/jsx/types.mjs.map +1 -0
- package/dist/jsx/types.native.js +19 -0
- package/dist/jsx/types.native.js.map +1 -0
- package/dist/jsx/useDragGesture.js +76 -0
- package/dist/jsx/useDragGesture.js.map +6 -0
- package/dist/jsx/useDragGesture.mjs +95 -0
- package/dist/jsx/useDragGesture.mjs.map +1 -0
- package/dist/jsx/useDragGesture.native.js +146 -0
- package/dist/jsx/useDragGesture.native.js.map +1 -0
- package/package.json +77 -0
- package/src/Toast.tsx +219 -0
- package/src/ToastAnnounce.tsx +102 -0
- package/src/ToastImperative.tsx +190 -0
- package/src/ToastImpl.tsx +503 -0
- package/src/ToastItem.tsx +694 -0
- package/src/ToastPortal.tsx +19 -0
- package/src/ToastProvider.tsx +197 -0
- package/src/ToastState.ts +397 -0
- package/src/ToastViewport.tsx +430 -0
- package/src/Toaster.tsx +445 -0
- package/src/constants.ts +2 -0
- package/src/createNativeToast.native.tsx +22 -0
- package/src/createNativeToast.tsx +48 -0
- package/src/index.ts +17 -0
- package/src/types.ts +71 -0
- package/src/useDragGesture.native.ts +199 -0
- package/src/useDragGesture.ts +218 -0
- package/types/Toast.d.ts +84 -0
- package/types/Toast.d.ts.map +1 -0
- package/types/ToastAnnounce.d.ts +18 -0
- package/types/ToastAnnounce.d.ts.map +1 -0
- package/types/ToastImperative.d.ts +95 -0
- package/types/ToastImperative.d.ts.map +1 -0
- package/types/ToastImpl.d.ts +109 -0
- package/types/ToastImpl.d.ts.map +1 -0
- package/types/ToastItem.d.ts +34 -0
- package/types/ToastItem.d.ts.map +1 -0
- package/types/ToastPortal.d.ts +8 -0
- package/types/ToastPortal.d.ts.map +1 -0
- package/types/ToastProvider.d.ts +92 -0
- package/types/ToastProvider.d.ts.map +1 -0
- package/types/ToastState.d.ts +177 -0
- package/types/ToastState.d.ts.map +1 -0
- package/types/ToastViewport.d.ts +75 -0
- package/types/ToastViewport.d.ts.map +1 -0
- package/types/Toaster.d.ts +120 -0
- package/types/Toaster.d.ts.map +1 -0
- package/types/constants.d.ts +3 -0
- package/types/constants.d.ts.map +1 -0
- package/types/createNativeToast.d.ts +4 -0
- package/types/createNativeToast.d.ts.map +1 -0
- package/types/createNativeToast.native.d.ts +4 -0
- package/types/createNativeToast.native.d.ts.map +1 -0
- package/types/index.d.ts +7 -0
- package/types/index.d.ts.map +1 -0
- package/types/types.d.ts +61 -0
- package/types/types.d.ts.map +1 -0
- package/types/useDragGesture.d.ts +32 -0
- package/types/useDragGesture.d.ts.map +1 -0
- package/types/useDragGesture.native.d.ts +26 -0
- package/types/useDragGesture.native.d.ts.map +1 -0
|
@@ -0,0 +1,276 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { AnimatePresence } from "@tamagui/animate-presence";
|
|
3
|
+
import { useComposedRefs } from "@tamagui/compose-refs";
|
|
4
|
+
import { isWeb } from "@tamagui/constants";
|
|
5
|
+
import { styled } from "@tamagui/core";
|
|
6
|
+
import { PortalHost } from "@tamagui/portal";
|
|
7
|
+
import { YStack } from "@tamagui/stacks";
|
|
8
|
+
import { VisuallyHidden } from "@tamagui/visually-hidden";
|
|
9
|
+
import * as React from "react";
|
|
10
|
+
import { TOAST_CONTEXT } from "./constants.native.js";
|
|
11
|
+
import { ToastPortal } from "./ToastPortal.native.js";
|
|
12
|
+
import { Collection, useCollection, useToastProviderContext } from "./ToastProvider.native.js";
|
|
13
|
+
var VIEWPORT_NAME = "ToastViewport",
|
|
14
|
+
VIEWPORT_DEFAULT_HOTKEY = ["F8"],
|
|
15
|
+
VIEWPORT_PAUSE = "toast.viewportPause",
|
|
16
|
+
VIEWPORT_RESUME = "toast.viewportResume",
|
|
17
|
+
ToastViewportWrapperFrame = styled(YStack, {
|
|
18
|
+
name: "ViewportWrapper",
|
|
19
|
+
variants: {
|
|
20
|
+
unstyled: {
|
|
21
|
+
false: {
|
|
22
|
+
pointerEvents: "box-none",
|
|
23
|
+
top: 0,
|
|
24
|
+
bottom: 0,
|
|
25
|
+
left: 0,
|
|
26
|
+
right: 0,
|
|
27
|
+
position: isWeb ? "fixed" : "absolute",
|
|
28
|
+
maxWidth: "100%",
|
|
29
|
+
tabIndex: 0,
|
|
30
|
+
zIndex: 1e5
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
defaultVariants: {
|
|
35
|
+
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
36
|
+
}
|
|
37
|
+
}),
|
|
38
|
+
ToastViewportFrame = styled(YStack, {
|
|
39
|
+
name: VIEWPORT_NAME,
|
|
40
|
+
variants: {
|
|
41
|
+
unstyled: {
|
|
42
|
+
false: {
|
|
43
|
+
pointerEvents: "box-none",
|
|
44
|
+
position: isWeb ? "fixed" : "absolute",
|
|
45
|
+
maxWidth: "100%"
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
defaultVariants: {
|
|
50
|
+
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
51
|
+
}
|
|
52
|
+
}),
|
|
53
|
+
ToastViewport = /* @__PURE__ */React.memo(/* @__PURE__ */React.forwardRef(function (props, forwardedRef) {
|
|
54
|
+
var {
|
|
55
|
+
scope,
|
|
56
|
+
hotkey = VIEWPORT_DEFAULT_HOTKEY,
|
|
57
|
+
label = "Notifications ({hotkey})",
|
|
58
|
+
name = "default",
|
|
59
|
+
multipleToasts,
|
|
60
|
+
zIndex,
|
|
61
|
+
portalToRoot,
|
|
62
|
+
...viewportProps
|
|
63
|
+
} = props,
|
|
64
|
+
context = useToastProviderContext(scope),
|
|
65
|
+
getItems = useCollection(scope || TOAST_CONTEXT),
|
|
66
|
+
headFocusProxyRef = React.useRef(null),
|
|
67
|
+
tailFocusProxyRef = React.useRef(null),
|
|
68
|
+
wrapperRef = React.useRef(null),
|
|
69
|
+
ref = React.useRef(null),
|
|
70
|
+
onViewportChange = React.useCallback(function (el) {
|
|
71
|
+
context.viewports[name] !== el && context.onViewportChange(name, el);
|
|
72
|
+
}, [name, context.viewports]),
|
|
73
|
+
composedRefs = useComposedRefs(forwardedRef, ref, onViewportChange),
|
|
74
|
+
hotkeyLabel = hotkey.join("+").replace(/Key/g, "").replace(/Digit/g, ""),
|
|
75
|
+
hasToasts = context.toastCount > 0;
|
|
76
|
+
React.useEffect(function () {
|
|
77
|
+
if (isWeb && context.toastCount !== 0) {
|
|
78
|
+
var handleKeyDown = function (event) {
|
|
79
|
+
var _ref_current,
|
|
80
|
+
isHotkeyPressed = hotkey.every(function (key) {
|
|
81
|
+
return event[key] || event.code === key;
|
|
82
|
+
});
|
|
83
|
+
isHotkeyPressed && ((_ref_current = ref.current) === null || _ref_current === void 0 || _ref_current.focus());
|
|
84
|
+
};
|
|
85
|
+
return document.addEventListener("keydown", handleKeyDown), function () {
|
|
86
|
+
document.removeEventListener("keydown", handleKeyDown);
|
|
87
|
+
};
|
|
88
|
+
}
|
|
89
|
+
}, [hotkey, context.toastCount]), React.useEffect(function () {
|
|
90
|
+
if (isWeb && context.toastCount !== 0) {
|
|
91
|
+
var wrapper = wrapperRef.current,
|
|
92
|
+
viewport = ref.current;
|
|
93
|
+
if (hasToasts && wrapper && viewport) {
|
|
94
|
+
var handlePause = function () {
|
|
95
|
+
if (!context.isClosePausedRef.current) {
|
|
96
|
+
var pauseEvent = new CustomEvent(VIEWPORT_PAUSE);
|
|
97
|
+
viewport.dispatchEvent(pauseEvent), context.isClosePausedRef.current = !0;
|
|
98
|
+
}
|
|
99
|
+
},
|
|
100
|
+
handleResume = function () {
|
|
101
|
+
if (context.isClosePausedRef.current) {
|
|
102
|
+
var resumeEvent = new CustomEvent(VIEWPORT_RESUME);
|
|
103
|
+
viewport.dispatchEvent(resumeEvent), context.isClosePausedRef.current = !1;
|
|
104
|
+
}
|
|
105
|
+
},
|
|
106
|
+
handleFocusOutResume = function (event) {
|
|
107
|
+
var isFocusMovingOutside = !wrapper.contains(event.relatedTarget);
|
|
108
|
+
isFocusMovingOutside && handleResume();
|
|
109
|
+
},
|
|
110
|
+
handlePointerLeaveResume = function () {
|
|
111
|
+
var isFocusInside = wrapper.contains(document.activeElement);
|
|
112
|
+
isFocusInside || handleResume();
|
|
113
|
+
};
|
|
114
|
+
return wrapper.addEventListener("focusin", handlePause), wrapper.addEventListener("focusout", handleFocusOutResume), wrapper.addEventListener("pointermove", handlePause), wrapper.addEventListener("pointerleave", handlePointerLeaveResume), window.addEventListener("blur", handlePause), window.addEventListener("focus", handleResume), function () {
|
|
115
|
+
wrapper.removeEventListener("focusin", handlePause), wrapper.removeEventListener("focusout", handleFocusOutResume), wrapper.removeEventListener("pointermove", handlePause), wrapper.removeEventListener("pointerleave", handlePointerLeaveResume), window.removeEventListener("blur", handlePause), window.removeEventListener("focus", handleResume);
|
|
116
|
+
};
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
}, [hasToasts, context.isClosePausedRef, context.toastCount]);
|
|
120
|
+
var getSortedTabbableCandidates = React.useCallback(function (param) {
|
|
121
|
+
var {
|
|
122
|
+
tabbingDirection
|
|
123
|
+
} = param,
|
|
124
|
+
toastItems = getItems(),
|
|
125
|
+
tabbableCandidates = toastItems.map(function (toastItem) {
|
|
126
|
+
var toastNode = toastItem.ref.current,
|
|
127
|
+
toastTabbableCandidates = [toastNode, ...getTabbableCandidates(toastNode)];
|
|
128
|
+
return tabbingDirection === "forwards" ? toastTabbableCandidates : toastTabbableCandidates.reverse();
|
|
129
|
+
});
|
|
130
|
+
return (tabbingDirection === "forwards" ? tabbableCandidates.reverse() : tabbableCandidates).flat();
|
|
131
|
+
}, [getItems]);
|
|
132
|
+
React.useEffect(function () {
|
|
133
|
+
if (isWeb && context.toastCount !== 0) {
|
|
134
|
+
var viewport = ref.current;
|
|
135
|
+
if (viewport) {
|
|
136
|
+
var handleKeyDown = function (event) {
|
|
137
|
+
var isMetaKey = event.altKey || event.ctrlKey || event.metaKey,
|
|
138
|
+
isTabKey = event.key === "Tab" && !isMetaKey;
|
|
139
|
+
if (isTabKey) {
|
|
140
|
+
var focusedElement = document.activeElement,
|
|
141
|
+
isTabbingBackwards = event.shiftKey,
|
|
142
|
+
targetIsViewport = event.target === viewport;
|
|
143
|
+
if (targetIsViewport && isTabbingBackwards) {
|
|
144
|
+
var _headFocusProxyRef_current;
|
|
145
|
+
(_headFocusProxyRef_current = headFocusProxyRef.current) === null || _headFocusProxyRef_current === void 0 || _headFocusProxyRef_current.focus();
|
|
146
|
+
return;
|
|
147
|
+
}
|
|
148
|
+
var tabbingDirection = isTabbingBackwards ? "backwards" : "forwards",
|
|
149
|
+
sortedCandidates = getSortedTabbableCandidates({
|
|
150
|
+
tabbingDirection
|
|
151
|
+
}),
|
|
152
|
+
index = sortedCandidates.findIndex(function (candidate) {
|
|
153
|
+
return candidate === focusedElement;
|
|
154
|
+
});
|
|
155
|
+
if (focusFirst(sortedCandidates.slice(index + 1))) event.preventDefault();else {
|
|
156
|
+
var _headFocusProxyRef_current1, _tailFocusProxyRef_current;
|
|
157
|
+
isTabbingBackwards ? (_headFocusProxyRef_current1 = headFocusProxyRef.current) === null || _headFocusProxyRef_current1 === void 0 || _headFocusProxyRef_current1.focus() : (_tailFocusProxyRef_current = tailFocusProxyRef.current) === null || _tailFocusProxyRef_current === void 0 || _tailFocusProxyRef_current.focus();
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
};
|
|
161
|
+
return viewport.addEventListener("keydown", handleKeyDown), function () {
|
|
162
|
+
return viewport.removeEventListener("keydown", handleKeyDown);
|
|
163
|
+
};
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
}, [getItems, getSortedTabbableCandidates, context.toastCount]);
|
|
167
|
+
var contents = /* @__PURE__ */_jsxs(ToastViewportWrapperFrame, {
|
|
168
|
+
ref: wrapperRef,
|
|
169
|
+
// biome-ignore lint/a11y/useSemanticElements: <explanation>
|
|
170
|
+
role: "region",
|
|
171
|
+
"aria-label": label.replace("{hotkey}", hotkeyLabel),
|
|
172
|
+
// // Ensure virtual cursor from landmarks menus triggers focus/blur for pause/resume
|
|
173
|
+
tabIndex: -1,
|
|
174
|
+
children: [
|
|
175
|
+
// // incase list has size when empty (e.g. padding), we remove pointer events so
|
|
176
|
+
// // it doesn't prevent interactions with page elements that it overlays
|
|
177
|
+
// pointerEvents={hasToasts ? undefined : 'none'}
|
|
178
|
+
hasToasts && /* @__PURE__ */_jsx(FocusProxy, {
|
|
179
|
+
context,
|
|
180
|
+
viewportName: name,
|
|
181
|
+
ref: headFocusProxyRef,
|
|
182
|
+
onFocusFromOutsideViewport: function () {
|
|
183
|
+
var tabbableCandidates = getSortedTabbableCandidates({
|
|
184
|
+
tabbingDirection: "forwards"
|
|
185
|
+
});
|
|
186
|
+
focusFirst(tabbableCandidates);
|
|
187
|
+
}
|
|
188
|
+
}),
|
|
189
|
+
/**
|
|
190
|
+
* tabindex on the the list so that it can be focused when items are removed. we focus
|
|
191
|
+
* the list instead of the viewport so it announces number of items remaining.
|
|
192
|
+
*/
|
|
193
|
+
/* @__PURE__ */
|
|
194
|
+
_jsx(Collection.Slot, {
|
|
195
|
+
scope: context.toastScope,
|
|
196
|
+
children: /* @__PURE__ */_jsx(ToastViewportFrame, {
|
|
197
|
+
focusable: context.toastCount > 0,
|
|
198
|
+
ref: composedRefs,
|
|
199
|
+
...viewportProps,
|
|
200
|
+
children: /* @__PURE__ */_jsx(PortalHost, {
|
|
201
|
+
render: function (children) {
|
|
202
|
+
return /* @__PURE__ */_jsx(AnimatePresence, {
|
|
203
|
+
exitBeforeEnter: !multipleToasts,
|
|
204
|
+
children
|
|
205
|
+
});
|
|
206
|
+
},
|
|
207
|
+
name: name ?? "default"
|
|
208
|
+
})
|
|
209
|
+
})
|
|
210
|
+
}), hasToasts && /* @__PURE__ */_jsx(FocusProxy, {
|
|
211
|
+
context,
|
|
212
|
+
viewportName: name,
|
|
213
|
+
ref: tailFocusProxyRef,
|
|
214
|
+
onFocusFromOutsideViewport: function () {
|
|
215
|
+
var tabbableCandidates = getSortedTabbableCandidates({
|
|
216
|
+
tabbingDirection: "backwards"
|
|
217
|
+
});
|
|
218
|
+
focusFirst(tabbableCandidates);
|
|
219
|
+
}
|
|
220
|
+
})]
|
|
221
|
+
});
|
|
222
|
+
return portalToRoot ? /* @__PURE__ */_jsx(ToastPortal, {
|
|
223
|
+
context,
|
|
224
|
+
...(typeof zIndex == "number" ? {
|
|
225
|
+
zIndex
|
|
226
|
+
} : {}),
|
|
227
|
+
children: contents
|
|
228
|
+
}) : contents;
|
|
229
|
+
}));
|
|
230
|
+
ToastViewport.displayName = VIEWPORT_NAME;
|
|
231
|
+
var FOCUS_PROXY_NAME = "ToastFocusProxy",
|
|
232
|
+
FocusProxy = /* @__PURE__ */React.forwardRef(function (props, forwardedRef) {
|
|
233
|
+
var {
|
|
234
|
+
onFocusFromOutsideViewport,
|
|
235
|
+
viewportName,
|
|
236
|
+
context,
|
|
237
|
+
...proxyProps
|
|
238
|
+
} = props,
|
|
239
|
+
viewport = context.viewports[viewportName];
|
|
240
|
+
return /* @__PURE__ */_jsx(VisuallyHidden, {
|
|
241
|
+
"aria-hidden": !0,
|
|
242
|
+
tabIndex: 0,
|
|
243
|
+
...proxyProps,
|
|
244
|
+
ref: forwardedRef,
|
|
245
|
+
// Avoid page scrolling when focus is on the focus proxy
|
|
246
|
+
position: isWeb ? "fixed" : "absolute",
|
|
247
|
+
onFocus: function (event) {
|
|
248
|
+
if (isWeb) {
|
|
249
|
+
var prevFocusedElement = event.relatedTarget,
|
|
250
|
+
isFocusFromOutsideViewport = !viewport?.contains(prevFocusedElement);
|
|
251
|
+
isFocusFromOutsideViewport && onFocusFromOutsideViewport();
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
});
|
|
255
|
+
});
|
|
256
|
+
FocusProxy.displayName = FOCUS_PROXY_NAME;
|
|
257
|
+
function focusFirst(candidates) {
|
|
258
|
+
if (isWeb) {
|
|
259
|
+
var previouslyFocusedElement = document.activeElement;
|
|
260
|
+
return candidates.some(function (candidate) {
|
|
261
|
+
return candidate === previouslyFocusedElement ? !0 : (candidate.focus(), document.activeElement !== previouslyFocusedElement);
|
|
262
|
+
});
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
function getTabbableCandidates(container) {
|
|
266
|
+
if (!isWeb) return [];
|
|
267
|
+
for (var containerHtml = container, nodes = [], walker = document.createTreeWalker(containerHtml, NodeFilter.SHOW_ELEMENT, {
|
|
268
|
+
acceptNode: function (node) {
|
|
269
|
+
var isHiddenInput = node.tagName === "INPUT" && node.type === "hidden";
|
|
270
|
+
return node.disabled || node.hidden || isHiddenInput ? NodeFilter.FILTER_SKIP : node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
|
|
271
|
+
}
|
|
272
|
+
}); walker.nextNode();) nodes.push(walker.currentNode);
|
|
273
|
+
return nodes;
|
|
274
|
+
}
|
|
275
|
+
export { ToastViewport, VIEWPORT_DEFAULT_HOTKEY, VIEWPORT_PAUSE, VIEWPORT_RESUME };
|
|
276
|
+
//# sourceMappingURL=ToastViewport.native.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","AnimatePresence","useComposedRefs","isWeb","styled","PortalHost","YStack","VisuallyHidden","React","TOAST_CONTEXT","ToastPortal","Collection","useCollection","useToastProviderContext","VIEWPORT_NAME","VIEWPORT_DEFAULT_HOTKEY","VIEWPORT_PAUSE","VIEWPORT_RESUME","ToastViewportWrapperFrame","name","variants","unstyled","false","pointerEvents","top","bottom","left","right","position","maxWidth","tabIndex","zIndex","defaultVariants","process","env","TAMAGUI_HEADLESS","ToastViewportFrame","ToastViewport","memo","forwardRef","props","forwardedRef","scope","hotkey","label","multipleToasts","portalToRoot","viewportProps","context","getItems","headFocusProxyRef","useRef","tailFocusProxyRef","wrapperRef","ref","onViewportChange","useCallback","el","viewports","composedRefs","hotkeyLabel","join","replace","hasToasts","toastCount","useEffect","handleKeyDown","event","_ref_current","isHotkeyPressed","every","key","code","current","focus","document","addEventListener","removeEventListener","wrapper","viewport","handlePause","isClosePausedRef","pauseEvent","CustomEvent","dispatchEvent","handleResume","resumeEvent","handleFocusOutResume","isFocusMovingOutside","contains","relatedTarget","handlePointerLeaveResume","isFocusInside","activeElement","window","getSortedTabbableCandidates","param","tabbingDirection","toastItems","tabbableCandidates","map","toastItem","toastNode","toastTabbableCandidates","getTabbableCandidates","reverse","flat","isMetaKey","altKey","ctrlKey","metaKey","isTabKey","focusedElement","isTabbingBackwards","shiftKey","targetIsViewport","target","_headFocusProxyRef_current","sortedCandidates","index","findIndex","candidate","focusFirst","slice","preventDefault","_headFocusProxyRef_current1","_tailFocusProxyRef_current","contents","role","children","FocusProxy","viewportName","onFocusFromOutsideViewport","Slot","toastScope","focusable","render","exitBeforeEnter","displayName","FOCUS_PROXY_NAME","proxyProps","onFocus","prevFocusedElement","isFocusFromOutsideViewport","candidates","previouslyFocusedElement","some","container","containerHtml","nodes","walker","createTreeWalker","NodeFilter","SHOW_ELEMENT"],"sources":["../../src/ToastViewport.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAASA,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAuB;AAChC,SAASC,eAAA,QAAuB;AAChC,SAASC,eAAa;AAEtB,SAASC,KAAA,4BAAc;AACvB,SAASC,MAAA,uBAAkB;AAC3B,SAASC,UAAA,QAAc;AACvB,SAASC,MAAA,yBAAsB;AAC/B,SAAAC,cAAuB;AACvB,YAASC,KAAA,aAAqB;AAC9B,SAASC,aAAA,QAAmB;AAE5B,SAASC,WAAA,QAAY,yBAAe;AA0P5B,SAYIC,UAZJ,EAAAC,aAAA,EAAAC,uBAAA;AAxPR,IAAAC,aAAM,kBAAgB;EAAAC,uBAChB,IAKJ,KAAM;EAENC,cAAU;EAAAC,eAAA;EAAAC,yBAAA,GAAAd,MAAA,CAAAE,MAAA;IAAAa,IACR,mBAAU;IAAAC,QACR;MAAOC,QACL;QAAeC,KACf,EAAK;UACLC,aAAQ;UACRC,GAAA,GAAM;UACNC,MAAA,EAAO;UACPC,IAAA;UACAC,KAAA;UACAC,QAAA,EAAUzB,KAAA;UACV0B,QAAQ;UACVC,QAAA;UACFC,MAAA;QACF;MAEA;IAAiB;IAEjBC,eAAA;MAGIX,QAAA,EAAAY,OAAA,CAAAC,GAAqB,CAAAC,gBAAe;IACxC;EAAM,EAEN;EAAAC,kBAAU,GAAAhC,MAAA,CAAAE,MAAA;IAAAa,IACR,EAAAL,aAAU;IAAAM,QACR;MAAOC,QACL;QAAeC,KACf;UACAC,aAAU;UACZK,QAAA,EAAAzB,KAAA;UACF0B,QAAA;QACF;MAEA;IAAiB;IAEjBG,eAAA;MA8BIX,QAAA,EAAAY,OAAgB,CAAAC,GAAA,CAAMC,gBAAA;IAC1B;EAAM;EACJE,aAAyC,kBAAiB7B,KAAA,CAAA8B,IAAA,gBAAA9B,KAAA,CAAA+B,UAAA,WAAAC,KAAA,EAAAC,YAAA;IACxD;QAAAC,KAAM;QAAAC,MAAA,GAAA5B,uBAAA;QAAA6B,KAAA;QAAAzB,IAAA;QAAA0B,cAAA;QAAAd,MAAA;QAAAe,YAAA;QAAA,GAAAC;MAAA,IAAAP,KAAA;MAAAQ,OAAA,GAAAnC,uBAAA,CAAA6B,KAAA;MAAAO,QAAA,GAAArC,aAAA,CAAA8B,KAAA,IAAAjC,aAAA;MAAAyC,iBAAA,GAAA1C,KAAA,CAAA2C,MAAA;MAAAC,iBAAA,GAAA5C,KAAA,CAAA2C,MAAA;MAAAE,UAAA,GAAA7C,KAAA,CAAA2C,MAAA;MAAAG,GAAA,GAAA9C,KAAA,CAAA2C,MAAA;MAAAI,gBAAA,GAAA/C,KAAA,CAAAgD,WAAA,WAAAC,EAAA;QAAAT,OACJ,CAAAU,SAAA,CAAAvC,IAAA,MAAAsC,EAAA,IAAAT,OAAA,CAAAO,gBAAA,CAAApC,IAAA,EAAAsC,EAAA;MAAA,IACStC,IACT,EAAQ6B,OACR,CAAAU,SAAO;MAAAC,YACP,GAAAzD,eAAA,CAAAuC,YAAA,EAAAa,GAAA,EAAAC,gBAAA;MAAAK,WAAA,GAAAjB,MAAA,CAAAkB,IAAA,MAAAC,OAAA,aAAAA,OAAA;MAAAC,SAAA,GAAAf,OAAA,CAAAgB,UAAA;IAAAxD,KAAA,CACAyD,SAAA;MAAA,IACA9D,KAAA,IAAA6C,OAAA,CAAAgB,UAAA;QAAA,IACAE,aAAG,YAAAA,CAAAC,KAAA;UACL,IAAIC,YACE;YAAAC,eAAU,GAAA1B,MAAA,CAAwB2B,KAAK,WACvCC,GAAA,EAAW;cAMd,OAAuBJ,KAAA,CAAAI,GAAA,KAAAJ,KAAA,CAAAK,IAAA,KAAAD,GAAA;YACtB,EAAI;UACNF,eAAA,MAAAD,YAAA,GAAAd,GAAA,CAAAmB,OAAA,cAAAL,YAAA,eAAAA,YAAA,CAAAM,KAAA;QAAA;QAEF,OAEMC,QAAA,CAAAC,gBAAe,UAAgB,EAAAV,aAAmB,eAAgB;UAIxES,QAAM,CAAAE,mBAAgB,YAAAX,aAAA;QAEpB;MACA;IAME,IAH+BvB,MAAA,EACkBK,OACjD,CAAAgB,UACyB,CAAe,GAAAxD,KAC1C,CAAAyD,SAAA;MACA,IAAA9D,KAAA,IAAA6C,OAAS,CAAAgB,UAAA,MAAiB;QAExB,IAAAc,OAAA,GAASzB,UAAA,CAAAoB,OAAA;UAAoBM,QAAA,GAAWzB,GAAA,CAAAmB,OAAA;QAAa,IACvDV,SAAA,IAAAe,OAAA,IAAAC,QAAA;UACF,IAAIC,WAAQ,GAAQ,SAAAA,CAAA,EAAW;cAI7B,IADK,CAAAhC,OACD,CAAAiC,gBAAQ,CAAAR,OAAkB;gBAC9B,IAAMS,UAAU,OAAAC,WACV,CAAAnE,cAAe;gBACjB+D,QAAA,CAAAK,aAAa,CAAAF,UAAW,CAAU,EAAAlC,OAAA,CAAAiC,gBAAA,CAAAR,OAAA;cACpC;YACE;YAAAY,YAAK,GAAQ,SAAAA,CAAA;cACX,IAAArC,OAAM,CAAAiC,gBAAiB,CAAAR,OAAA;gBACvB,IAAAa,WAAS,OAAAH,WAAc,CAAAlE,eACf;gBACV8D,QAAA,CAAAK,aAAA,CAAAE,WAAA,GAAAtC,OAAA,CAAAiC,gBAAA,CAAAR,OAAA;cACF;YAGE;YAAAc,oBAAY,YAAAA,CAAiBpB,KAAA,EAAS;cACpC,IAAAqB,oBAAoB,IAAIV,OAAA,CAAAW,QAAY,CAAAtB,KAAA,CAAAuB,aAAe;cACnDF,oBAAS,IAAAH,YAAc,EAAW;YACC;YAAAM,wBACrC,YAAAA,CAAA;cACF,IAEMC,aAAA,GAAAd,OAAwB,CAAAW,QAAA,CAAsBd,QAAA,CAAAkB,aAAA;cAIlDD,aAHsC,IAAAP,YAAA;YAAA;UAC9B,OACRP,OAC0B,CAAAF,gBAAa,YAAAI,WAAA,GAAAF,OAAA,CAAAF,gBAAA,aAAAW,oBAAA,GAAAT,OAAA,CAAAF,gBAAA,gBAAAI,WAAA,GAAAF,OAAA,CAAAF,gBAAA,iBAAAe,wBAAA,GAAAG,MAAA,CAAAlB,gBAAA,SAAAI,WAAA,GAAAc,MAAA,CAAAlB,gBAAA,UAAAS,YAAA;YACzCP,OAEM,CAAAD,mBAAA,UAAiC,EAAAG,WAAA,GAAAF,OAAA,CAAAD,mBAAA,aAAAU,oBAAA,GAAAT,OAAA,CAAAD,mBAAA,gBAAAG,WAAA,GAAAF,OAAA,CAAAD,mBAAA,iBAAAc,wBAAA,GAAAG,MAAA,CAAAjB,mBAAA,SAAAG,WAAA,GAAAc,MAAA,CAAAjB,mBAAA,UAAAQ,YAAA;UAErC;QAAiC;MAInC;IAOE,IAKgDtB,SAClD,EAAAf,OACF,CAAAiC,gBAAA,EAAAjC,OACE,CAAAgB,UAAW,CAEf;IAA0C,IAAA+B,2BACpB,GAAsDvF,KAAA,CAAAgD,WAAA,WAAAwC,KAAA;MAExE;UAAAC;QAAM,IAAAD,KAAA;QADaE,UACmB,GAAAjD,QAAK;QAAAkD,kBAAc,GAAAD,UAAA,CAAAE,GAAA,WAAAC,SAAA;UACvD,IAAAC,SAAM,GAAAD,SAAY,CAAA/C,GAAA,CAAAmB,OAAU;YAAI8B,uBAC1B,IAA0BD,SAC9B,KAAAE,qBACG,CAAAF,SAAsB,EAAS;UAEpC,OAAAL,gBAAO,eAAqB,GAAAM,uBACxB,GAAAA,uBACA,CAAAE,OAAwB;QAAQ;MAEtC,QAAAR,gBACE,eAAqB,GAAAE,kBACjB,CAAAM,OAAmB,KAAAN,kBACnB,EAAAO,IAAA,EACJ;IAAK,IACTzD,QACC,CAAQ;IAGXzC,KAAA,CAAAyD,SAAM,aAAgB;MAEpB,IAAA9D,KADK,IAAA6C,OACD,CAAAgB,UAAQ;QAEZ,IAAAe,QAAM,GAAAzB,GAAA,CAAWmB,OAAI;QAIrB,IAAAM,QAAI;UACF,IAAAb,aAAM,YAAAA,CAAiBC,KAAA,EAAyB;YAC9C,IAAAwC,SAAM,GAAAxC,KAAY,CAAAyC,MAAM,IAAAzC,KAAU,CAAA0C,OAAM,IAAA1C,KAAW,CAAA2C,OAAM;cAAAC,QAAA,GAAA5C,KAAA,CAAAI,GAAA,eAAAoC,SAAA;YAGzD,IAAAI,QAFuB;cAGrB,IAAAC,cAAM,GAAArC,QAAiB,CAAAkB,aAAS;gBAAAoB,kBAC1B,GAAA9C,KAAqB,CAAA+C,QAAM;gBAAAC,gBAAA,GAAAhD,KAAA,CAAAiD,MAAA,KAAArC,QAAA;cAKjC,IAAAoC,gBAJ+B,IAAWF,kBAIlB;gBAEtB,IAAAI,0BAA2B;gBAC3B,CAAAA,0BAAA,GAAAnE,iBAAA,CAAAuB,OAAA,cAAA4C,0BAAA,eAAAA,0BAAA,CAAA3C,KAAA;gBACF;cAGA;cAC+B,IAC7BuB,gBAAe,GAAAgB,kBAAc;gBAAAK,gBAAA,GAAAvB,2BAAA;kBAC/BE;gBACA,EAAI;gBAAAsB,KAAA,GAAAD,gBAAW,CAAAE,SAAuB,WAAiBC,SAC/C;kBAKN,OAAAA,SAAA,KAAAT,cAAA;gBAAA;cAEqC,IAAAU,UAAA,CAAAJ,gBAAA,CAAAK,KAAA,CAAAJ,KAAA,QAAApD,KAAA,CAAAyD,cAAA,QAEjC;gBAAiC,IAAAC,2BAAA,EAAAC,0BAAA;gBAEzCb,kBAAA,IAAAY,2BAAA,GAAA3E,iBAAA,CAAAuB,OAAA,cAAAoD,2BAAA,eAAAA,2BAAA,CAAAnD,KAAA,MAAAoD,0BAAA,GAAA1E,iBAAA,CAAAqB,OAAA,cAAAqD,0BAAA,eAAAA,0BAAA,CAAApD,KAAA;cACF;YAGA;UAEF;UACF,OAAIK,QAAU,CAAAH,gBAAA,UAA6B,EAAAV,aAAQ,GAAW;YAE9D,OAAMa,QACJ,CAAAF,mBAAA,YAAAX,aAAA;UAAC;QAAA;MAAA;IACM,IAEAjB,QACL,EAAiD8C,2BAEvC,EAAA/C,OAKT,CAAAgB,UAAA;IACC,IAAA+D,QAAC,kBAAA/H,KAAA,CAAAkB,yBAAA;MAAAoC,GAAA,EAAAD,UAAA;MAAA;MACC2E,IAAA,UACA;MAAc,YACd,EAAApF,KAAK,CAAAkB,OAAA,aAAAF,WAAA;MAAA;MAEH9B,QAAA;MAAuDmG,QAAA;MACnC;MAEpB;MAAoC;MACtClE,SAAA,mBAAAjE,IAAA,CAAAoI,UAAA;QAAAlF,OACF;QAAAmF,YAMF,EAAAhH,IAAA;QACEmC,GAAA,EAAAJ,iBAAC;QAAAkF,0BAAA,WAAAA,CAAA;UAAA,IAAAjC,kBACY,GAAQJ,2BAAa;YAAAE,gBAC3B;UAAA;UACDyB,UAEJ,CAAAvB,kBAAA;QAAA;MAAC;MAAA;AAIG;AAEY;AAAA;MAChB;MAAArG,IAAA,CAAAa,UAAA,CAAA0H,IAAA;QAAA3F,KACF,EACFM,OAAA,CAAAsF,UAAA;QAAAL,QACC,iBACCnI,IAAA,CAAAsC,kBAAA;UAAAmG,SAAC,EAAAvF,OAAA,CAAAgB,UAAA;UAAAV,GAAA,EAAAK,YAAA;UAAA,GAAAZ,aACC;UAAAkF,QACA,iBAAcnI,IAAA,CAAAO,UAAA;YAAAmI,MACd,WAAAA,CAAKP,QAAA;cAAA,OACL,eAAAnI,IAAA,CAAAG,eAAkC;gBAChCwI,eAAM,GAAA5F,cAAqB;gBAA4BoF;cACnC;YAEpB;YAAoC9G,IACtC,EAAAA,IAAA;UAAA;QAAA;MACF,IAAA4C,SAAA,mBAAAjE,IAAA,CAAAoI,UAAA;QAEJlF,OAAA;QAGFmF,YAAI,EAAAhH,IAAA;QAECmC,GAAA,EAAAF,iBAAA;QAAAgF,0BAAA,WAAAA,CAAA;UACC,IAAAjC,kBAAA,GAAAJ,2BAAA;YACCE,gBAAW,EAAW;UAEtB;UAAAyB,UAAA,CAAAvB,kBAAA;QACH;MAKN;IAEJ;IAEA,OAAArD,YAAc,kBAAchD,IAAA,CAAAY,WAAA;MAI5BsC,OAAM;MAaH,WAAOjB,MAAA,YAAiB;QACvBA;MAGA;MACEkG,QAAC,EAAAF;IAAA,KAAAA,QAAA;EAAA;AACY1F,aACX,CAAAqG,WAAU,GAAA5H,aAAA;AAAA,IAAA6H,gBACN;EAAAT,UAAA,kBAAA1H,KAAA,CAAA+B,UAAA,WAAAC,KAAA,EAAAC,YAAA;IAAA;QACJ2F,0BAAK;QAAAD,YAAA;QAAAnF,OAAA;QAAA,GAAA4F;MAAA,IAAApG,KAAA;MAAAuC,QAAA,GAAA/B,OAAA,CAAAU,SAAA,CAAAyE,YAAA;IAAA,OAEL,eAAUrI,IAAS,CAAAS,cAAkB;MAAA,aAC5B,EAAC;MACRuB,QAAA,EAAI,CAAC;MACL,GAAA8G,UAAM;MAENtF,GAAA,EAAAb,YAD8C;MACa;MAC7Db,QAAA,EAAAzB,KAAA;MACF0I,OAAA,WAAAA,CAAA1E,KAAA;QAEJ,IAAAhE,KAAA;UACF,IAAA2I,kBAAA,GAAA3E,KAAA,CAAAuB,aAAA;YAAAqD,0BAAA,IAAAhE,QAAA,EAAAU,QAAA,CAAAqD,kBAAA;UAEAC,0BAAyB,IAAAX,0BAAA;QAIzB;MACE;IACA;EACA;AAMFF,UAAA,CAAAQ,WAAA,GAAAC,gBAAA;AAYA,SAASjB,WAAAsB,UAAA,EAAsB;EAC7B,IAAI7I,KAAC,EAAO;IACZ,IAAM8I,wBAAgB,GAChBtE,QAAuB,CAACkB,aACf;IACb,OAAAmD,UAAa,CAAAE,IAAc,WAAAzB,SAAA;MACzB,OAAMA,SAAA,KAAAwB,wBAAiC,KAAW,IAAAxB,SAAK,CAAS/C,KAAA,IAAAC,QAAA,CAAAkB,aAAA,KAAAoD,wBAAA;IAChE;EAIkE;AACpE;AAEF,SAAOzC,qBAAmBA,CAAA2C,SAAM,EAAK;EAGrC,KAAAhJ,KAAO;EACT,SAAAiJ,aAAA,GAAAD,SAAA,EAAAE,KAAA,OAAAC,MAAA,GAAA3E,QAAA,CAAA4E,gBAAA,CAAAH,aAAA,EAAAI,UAAA,CAAAC,YAAA","ignoreList":[]}
|
|
@@ -0,0 +1,160 @@
|
|
|
1
|
+
import { AnimatePresence } from "@tamagui/animate-presence";
|
|
2
|
+
import { isWeb } from "@tamagui/constants";
|
|
3
|
+
import { Theme, View, styled, useThemeName } from "@tamagui/core";
|
|
4
|
+
import { Portal } from "@tamagui/portal";
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import { ToastItem } from "./ToastItem";
|
|
7
|
+
import { ToastState } from "./ToastState";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
const VISIBLE_TOASTS_AMOUNT = 4, VIEWPORT_OFFSET = 24, TOAST_GAP = 14, TOAST_LIFETIME = 4e3, TOAST_WIDTH = 356, ToasterFrame = styled(View, {
|
|
10
|
+
name: "Toaster",
|
|
11
|
+
variants: {
|
|
12
|
+
unstyled: {
|
|
13
|
+
false: {
|
|
14
|
+
position: "fixed",
|
|
15
|
+
zIndex: 1e5,
|
|
16
|
+
pointerEvents: "box-none",
|
|
17
|
+
maxWidth: "100%",
|
|
18
|
+
// need min-height to contain absolutely positioned toasts
|
|
19
|
+
// toasts will overflow upward/downward from their anchor position
|
|
20
|
+
minHeight: 1
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
},
|
|
24
|
+
defaultVariants: {
|
|
25
|
+
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
26
|
+
}
|
|
27
|
+
}), Toaster = React.forwardRef(
|
|
28
|
+
function(props, _ref) {
|
|
29
|
+
const {
|
|
30
|
+
position = "bottom-right",
|
|
31
|
+
width = TOAST_WIDTH,
|
|
32
|
+
expand = !1,
|
|
33
|
+
visibleToasts = VISIBLE_TOASTS_AMOUNT,
|
|
34
|
+
gap = TOAST_GAP,
|
|
35
|
+
duration = TOAST_LIFETIME,
|
|
36
|
+
offset = VIEWPORT_OFFSET,
|
|
37
|
+
hotkey = ["altKey", "KeyT"],
|
|
38
|
+
swipeDirection = "right",
|
|
39
|
+
swipeThreshold = 50,
|
|
40
|
+
closeButton = !1,
|
|
41
|
+
theme: themeProp,
|
|
42
|
+
icons,
|
|
43
|
+
toastOptions,
|
|
44
|
+
containerAriaLabel = "Notifications",
|
|
45
|
+
disableNative = !1,
|
|
46
|
+
burntOptions,
|
|
47
|
+
notificationOptions,
|
|
48
|
+
className,
|
|
49
|
+
style
|
|
50
|
+
} = props, [toasts, setToasts] = React.useState([]), [heights, setHeights] = React.useState([]), [expanded, setExpanded] = React.useState(!1), [interacting, setInteracting] = React.useState(!1), listRef = React.useRef(null), lastFocusedElementRef = React.useRef(null), isFocusWithinRef = React.useRef(!1);
|
|
51
|
+
React.useEffect(() => ToastState.subscribe((toast) => {
|
|
52
|
+
if (toast.dismiss) {
|
|
53
|
+
setToasts(
|
|
54
|
+
(toasts2) => toasts2.map((t) => t.id === toast.id ? { ...t, delete: !0 } : t)
|
|
55
|
+
);
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
setToasts((toasts2) => {
|
|
59
|
+
const indexOfExistingToast = toasts2.findIndex((t) => t.id === toast.id);
|
|
60
|
+
return indexOfExistingToast !== -1 ? [
|
|
61
|
+
...toasts2.slice(0, indexOfExistingToast),
|
|
62
|
+
{ ...toasts2[indexOfExistingToast], ...toast },
|
|
63
|
+
...toasts2.slice(indexOfExistingToast + 1)
|
|
64
|
+
] : [toast, ...toasts2];
|
|
65
|
+
});
|
|
66
|
+
}), []), React.useEffect(() => {
|
|
67
|
+
toasts.length <= 1 && setExpanded(!1);
|
|
68
|
+
}, [toasts.length]), React.useEffect(() => {
|
|
69
|
+
if (!isWeb) return;
|
|
70
|
+
const handleKeyDown = (event) => {
|
|
71
|
+
hotkey.length > 0 && hotkey.every((key) => event[key] || event.code === key) && (setExpanded(!0), listRef.current?.focus()), event.code === "Escape" && (document.activeElement === listRef.current || listRef.current?.contains(document.activeElement)) && setExpanded(!1);
|
|
72
|
+
};
|
|
73
|
+
return document.addEventListener("keydown", handleKeyDown), () => document.removeEventListener("keydown", handleKeyDown);
|
|
74
|
+
}, [hotkey]), React.useEffect(() => {
|
|
75
|
+
if (!(!isWeb || !listRef.current))
|
|
76
|
+
return () => {
|
|
77
|
+
lastFocusedElementRef.current && (lastFocusedElementRef.current.focus({ preventScroll: !0 }), lastFocusedElementRef.current = null, isFocusWithinRef.current = !1);
|
|
78
|
+
};
|
|
79
|
+
}, []);
|
|
80
|
+
const removeToast = React.useCallback((toastToRemove) => {
|
|
81
|
+
setToasts((toasts2) => (toasts2.find((toast) => toast.id === toastToRemove.id)?.delete || ToastState.dismiss(toastToRemove.id), toasts2.filter(({ id }) => id !== toastToRemove.id)));
|
|
82
|
+
}, []), [yPosition, xPosition] = position.split("-"), offsetStyles = React.useMemo(() => {
|
|
83
|
+
const styles = {}, defaultOffset = typeof offset == "number" ? offset : VIEWPORT_OFFSET, offsetObj = typeof offset == "object" ? offset : {
|
|
84
|
+
top: defaultOffset,
|
|
85
|
+
right: defaultOffset,
|
|
86
|
+
bottom: defaultOffset,
|
|
87
|
+
left: defaultOffset
|
|
88
|
+
};
|
|
89
|
+
return yPosition === "top" ? styles.top = offsetObj.top ?? defaultOffset : styles.bottom = offsetObj.bottom ?? defaultOffset, xPosition === "left" ? styles.left = offsetObj.left ?? defaultOffset : xPosition === "right" ? styles.right = offsetObj.right ?? defaultOffset : (styles.left = "50%", styles.transform = "translateX(-50%)"), styles;
|
|
90
|
+
}, [offset, yPosition, xPosition]), currentTheme = useThemeName(), resolvedTheme = themeProp === "system" || !themeProp ? currentTheme?.includes("dark") ? "dark" : "light" : themeProp, hotkeyLabel = hotkey.join("+").replace(/Key/g, "").replace(/Digit/g, "");
|
|
91
|
+
if (toasts.length === 0)
|
|
92
|
+
return null;
|
|
93
|
+
const content = /* @__PURE__ */ jsx(
|
|
94
|
+
ToasterFrame,
|
|
95
|
+
{
|
|
96
|
+
ref: listRef,
|
|
97
|
+
width,
|
|
98
|
+
"aria-label": `${containerAriaLabel} ${hotkeyLabel}`,
|
|
99
|
+
tabIndex: -1,
|
|
100
|
+
"aria-live": "polite",
|
|
101
|
+
"aria-relevant": "additions text",
|
|
102
|
+
"aria-atomic": !1,
|
|
103
|
+
style: { ...offsetStyles, ...style },
|
|
104
|
+
className,
|
|
105
|
+
"data-y-position": yPosition,
|
|
106
|
+
"data-x-position": xPosition,
|
|
107
|
+
onMouseEnter: () => setExpanded(!0),
|
|
108
|
+
onMouseMove: () => setExpanded(!0),
|
|
109
|
+
onMouseLeave: () => {
|
|
110
|
+
interacting || setExpanded(!1);
|
|
111
|
+
},
|
|
112
|
+
onPointerDown: () => setInteracting(!0),
|
|
113
|
+
onPointerUp: () => setInteracting(!1),
|
|
114
|
+
...isWeb && {
|
|
115
|
+
onBlur: (event) => {
|
|
116
|
+
isFocusWithinRef.current && !event.currentTarget.contains(
|
|
117
|
+
event.relatedTarget
|
|
118
|
+
) && (isFocusWithinRef.current = !1, lastFocusedElementRef.current && (lastFocusedElementRef.current.focus({ preventScroll: !0 }), lastFocusedElementRef.current = null));
|
|
119
|
+
},
|
|
120
|
+
onFocus: (event) => {
|
|
121
|
+
isFocusWithinRef.current || (isFocusWithinRef.current = !0, lastFocusedElementRef.current = event.relatedTarget);
|
|
122
|
+
}
|
|
123
|
+
},
|
|
124
|
+
children: /* @__PURE__ */ jsx(AnimatePresence, { children: toasts.map((toast, index) => {
|
|
125
|
+
const isVisible = index < visibleToasts, isFront = index === 0;
|
|
126
|
+
return /* @__PURE__ */ jsx(
|
|
127
|
+
ToastItem,
|
|
128
|
+
{
|
|
129
|
+
toast,
|
|
130
|
+
index,
|
|
131
|
+
expanded: expanded || expand,
|
|
132
|
+
interacting,
|
|
133
|
+
position,
|
|
134
|
+
visibleToasts,
|
|
135
|
+
removeToast,
|
|
136
|
+
heights,
|
|
137
|
+
setHeights,
|
|
138
|
+
duration: toast.duration ?? toastOptions?.duration ?? duration,
|
|
139
|
+
gap,
|
|
140
|
+
swipeDirection,
|
|
141
|
+
swipeThreshold,
|
|
142
|
+
closeButton: toast.closeButton ?? closeButton,
|
|
143
|
+
icons,
|
|
144
|
+
disableNative,
|
|
145
|
+
burntOptions,
|
|
146
|
+
notificationOptions
|
|
147
|
+
},
|
|
148
|
+
toast.id
|
|
149
|
+
);
|
|
150
|
+
}) })
|
|
151
|
+
}
|
|
152
|
+
);
|
|
153
|
+
return isWeb ? /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Theme, { name: resolvedTheme, children: content }) }) : /* @__PURE__ */ jsx(Theme, { name: resolvedTheme, children: content });
|
|
154
|
+
}
|
|
155
|
+
);
|
|
156
|
+
Toaster.displayName = "Toaster";
|
|
157
|
+
export {
|
|
158
|
+
Toaster
|
|
159
|
+
};
|
|
160
|
+
//# sourceMappingURL=Toaster.js.map
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/Toaster.tsx"],
|
|
4
|
+
"mappings": "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",
|
|
5
|
+
"names": ["toasts"]
|
|
6
|
+
}
|
|
@@ -0,0 +1,185 @@
|
|
|
1
|
+
import { AnimatePresence } from "@tamagui/animate-presence";
|
|
2
|
+
import { isWeb } from "@tamagui/constants";
|
|
3
|
+
import { Theme, View, styled, useThemeName } from "@tamagui/core";
|
|
4
|
+
import { Portal } from "@tamagui/portal";
|
|
5
|
+
import * as React from "react";
|
|
6
|
+
import { ToastItem } from "./ToastItem.mjs";
|
|
7
|
+
import { ToastState } from "./ToastState.mjs";
|
|
8
|
+
import { jsx } from "react/jsx-runtime";
|
|
9
|
+
const VISIBLE_TOASTS_AMOUNT = 4,
|
|
10
|
+
VIEWPORT_OFFSET = 24,
|
|
11
|
+
TOAST_GAP = 14,
|
|
12
|
+
TOAST_LIFETIME = 4e3,
|
|
13
|
+
TOAST_WIDTH = 356,
|
|
14
|
+
ToasterFrame = styled(View, {
|
|
15
|
+
name: "Toaster",
|
|
16
|
+
variants: {
|
|
17
|
+
unstyled: {
|
|
18
|
+
false: {
|
|
19
|
+
position: "fixed",
|
|
20
|
+
zIndex: 1e5,
|
|
21
|
+
pointerEvents: "box-none",
|
|
22
|
+
maxWidth: "100%",
|
|
23
|
+
// need min-height to contain absolutely positioned toasts
|
|
24
|
+
// toasts will overflow upward/downward from their anchor position
|
|
25
|
+
minHeight: 1
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
},
|
|
29
|
+
defaultVariants: {
|
|
30
|
+
unstyled: process.env.TAMAGUI_HEADLESS === "1"
|
|
31
|
+
}
|
|
32
|
+
}),
|
|
33
|
+
Toaster = React.forwardRef(function (props, _ref) {
|
|
34
|
+
const {
|
|
35
|
+
position = "bottom-right",
|
|
36
|
+
width = TOAST_WIDTH,
|
|
37
|
+
expand = !1,
|
|
38
|
+
visibleToasts = VISIBLE_TOASTS_AMOUNT,
|
|
39
|
+
gap = TOAST_GAP,
|
|
40
|
+
duration = TOAST_LIFETIME,
|
|
41
|
+
offset = VIEWPORT_OFFSET,
|
|
42
|
+
hotkey = ["altKey", "KeyT"],
|
|
43
|
+
swipeDirection = "right",
|
|
44
|
+
swipeThreshold = 50,
|
|
45
|
+
closeButton = !1,
|
|
46
|
+
theme: themeProp,
|
|
47
|
+
icons,
|
|
48
|
+
toastOptions,
|
|
49
|
+
containerAriaLabel = "Notifications",
|
|
50
|
+
disableNative = !1,
|
|
51
|
+
burntOptions,
|
|
52
|
+
notificationOptions,
|
|
53
|
+
className,
|
|
54
|
+
style
|
|
55
|
+
} = props,
|
|
56
|
+
[toasts, setToasts] = React.useState([]),
|
|
57
|
+
[heights, setHeights] = React.useState([]),
|
|
58
|
+
[expanded, setExpanded] = React.useState(!1),
|
|
59
|
+
[interacting, setInteracting] = React.useState(!1),
|
|
60
|
+
listRef = React.useRef(null),
|
|
61
|
+
lastFocusedElementRef = React.useRef(null),
|
|
62
|
+
isFocusWithinRef = React.useRef(!1);
|
|
63
|
+
React.useEffect(() => ToastState.subscribe(toast => {
|
|
64
|
+
if (toast.dismiss) {
|
|
65
|
+
setToasts(toasts2 => toasts2.map(t => t.id === toast.id ? {
|
|
66
|
+
...t,
|
|
67
|
+
delete: !0
|
|
68
|
+
} : t));
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
setToasts(toasts2 => {
|
|
72
|
+
const indexOfExistingToast = toasts2.findIndex(t => t.id === toast.id);
|
|
73
|
+
return indexOfExistingToast !== -1 ? [...toasts2.slice(0, indexOfExistingToast), {
|
|
74
|
+
...toasts2[indexOfExistingToast],
|
|
75
|
+
...toast
|
|
76
|
+
}, ...toasts2.slice(indexOfExistingToast + 1)] : [toast, ...toasts2];
|
|
77
|
+
});
|
|
78
|
+
}), []), React.useEffect(() => {
|
|
79
|
+
toasts.length <= 1 && setExpanded(!1);
|
|
80
|
+
}, [toasts.length]), React.useEffect(() => {
|
|
81
|
+
if (!isWeb) return;
|
|
82
|
+
const handleKeyDown = event => {
|
|
83
|
+
hotkey.length > 0 && hotkey.every(key => event[key] || event.code === key) && (setExpanded(!0), listRef.current?.focus()), event.code === "Escape" && (document.activeElement === listRef.current || listRef.current?.contains(document.activeElement)) && setExpanded(!1);
|
|
84
|
+
};
|
|
85
|
+
return document.addEventListener("keydown", handleKeyDown), () => document.removeEventListener("keydown", handleKeyDown);
|
|
86
|
+
}, [hotkey]), React.useEffect(() => {
|
|
87
|
+
if (!(!isWeb || !listRef.current)) return () => {
|
|
88
|
+
lastFocusedElementRef.current && (lastFocusedElementRef.current.focus({
|
|
89
|
+
preventScroll: !0
|
|
90
|
+
}), lastFocusedElementRef.current = null, isFocusWithinRef.current = !1);
|
|
91
|
+
};
|
|
92
|
+
}, []);
|
|
93
|
+
const removeToast = React.useCallback(toastToRemove => {
|
|
94
|
+
setToasts(toasts2 => (toasts2.find(toast => toast.id === toastToRemove.id)?.delete || ToastState.dismiss(toastToRemove.id), toasts2.filter(({
|
|
95
|
+
id
|
|
96
|
+
}) => id !== toastToRemove.id)));
|
|
97
|
+
}, []),
|
|
98
|
+
[yPosition, xPosition] = position.split("-"),
|
|
99
|
+
offsetStyles = React.useMemo(() => {
|
|
100
|
+
const styles = {},
|
|
101
|
+
defaultOffset = typeof offset == "number" ? offset : VIEWPORT_OFFSET,
|
|
102
|
+
offsetObj = typeof offset == "object" ? offset : {
|
|
103
|
+
top: defaultOffset,
|
|
104
|
+
right: defaultOffset,
|
|
105
|
+
bottom: defaultOffset,
|
|
106
|
+
left: defaultOffset
|
|
107
|
+
};
|
|
108
|
+
return yPosition === "top" ? styles.top = offsetObj.top ?? defaultOffset : styles.bottom = offsetObj.bottom ?? defaultOffset, xPosition === "left" ? styles.left = offsetObj.left ?? defaultOffset : xPosition === "right" ? styles.right = offsetObj.right ?? defaultOffset : (styles.left = "50%", styles.transform = "translateX(-50%)"), styles;
|
|
109
|
+
}, [offset, yPosition, xPosition]),
|
|
110
|
+
currentTheme = useThemeName(),
|
|
111
|
+
resolvedTheme = themeProp === "system" || !themeProp ? currentTheme?.includes("dark") ? "dark" : "light" : themeProp,
|
|
112
|
+
hotkeyLabel = hotkey.join("+").replace(/Key/g, "").replace(/Digit/g, "");
|
|
113
|
+
if (toasts.length === 0) return null;
|
|
114
|
+
const content = /* @__PURE__ */jsx(ToasterFrame, {
|
|
115
|
+
ref: listRef,
|
|
116
|
+
width,
|
|
117
|
+
"aria-label": `${containerAriaLabel} ${hotkeyLabel}`,
|
|
118
|
+
tabIndex: -1,
|
|
119
|
+
"aria-live": "polite",
|
|
120
|
+
"aria-relevant": "additions text",
|
|
121
|
+
"aria-atomic": !1,
|
|
122
|
+
style: {
|
|
123
|
+
...offsetStyles,
|
|
124
|
+
...style
|
|
125
|
+
},
|
|
126
|
+
className,
|
|
127
|
+
"data-y-position": yPosition,
|
|
128
|
+
"data-x-position": xPosition,
|
|
129
|
+
onMouseEnter: () => setExpanded(!0),
|
|
130
|
+
onMouseMove: () => setExpanded(!0),
|
|
131
|
+
onMouseLeave: () => {
|
|
132
|
+
interacting || setExpanded(!1);
|
|
133
|
+
},
|
|
134
|
+
onPointerDown: () => setInteracting(!0),
|
|
135
|
+
onPointerUp: () => setInteracting(!1),
|
|
136
|
+
...(isWeb && {
|
|
137
|
+
onBlur: event => {
|
|
138
|
+
isFocusWithinRef.current && !event.currentTarget.contains(event.relatedTarget) && (isFocusWithinRef.current = !1, lastFocusedElementRef.current && (lastFocusedElementRef.current.focus({
|
|
139
|
+
preventScroll: !0
|
|
140
|
+
}), lastFocusedElementRef.current = null));
|
|
141
|
+
},
|
|
142
|
+
onFocus: event => {
|
|
143
|
+
isFocusWithinRef.current || (isFocusWithinRef.current = !0, lastFocusedElementRef.current = event.relatedTarget);
|
|
144
|
+
}
|
|
145
|
+
}),
|
|
146
|
+
children: /* @__PURE__ */jsx(AnimatePresence, {
|
|
147
|
+
children: toasts.map((toast, index) => {
|
|
148
|
+
const isVisible = index < visibleToasts,
|
|
149
|
+
isFront = index === 0;
|
|
150
|
+
return /* @__PURE__ */jsx(ToastItem, {
|
|
151
|
+
toast,
|
|
152
|
+
index,
|
|
153
|
+
expanded: expanded || expand,
|
|
154
|
+
interacting,
|
|
155
|
+
position,
|
|
156
|
+
visibleToasts,
|
|
157
|
+
removeToast,
|
|
158
|
+
heights,
|
|
159
|
+
setHeights,
|
|
160
|
+
duration: toast.duration ?? toastOptions?.duration ?? duration,
|
|
161
|
+
gap,
|
|
162
|
+
swipeDirection,
|
|
163
|
+
swipeThreshold,
|
|
164
|
+
closeButton: toast.closeButton ?? closeButton,
|
|
165
|
+
icons,
|
|
166
|
+
disableNative,
|
|
167
|
+
burntOptions,
|
|
168
|
+
notificationOptions
|
|
169
|
+
}, toast.id);
|
|
170
|
+
})
|
|
171
|
+
})
|
|
172
|
+
});
|
|
173
|
+
return isWeb ? /* @__PURE__ */jsx(Portal, {
|
|
174
|
+
children: /* @__PURE__ */jsx(Theme, {
|
|
175
|
+
name: resolvedTheme,
|
|
176
|
+
children: content
|
|
177
|
+
})
|
|
178
|
+
}) : /* @__PURE__ */jsx(Theme, {
|
|
179
|
+
name: resolvedTheme,
|
|
180
|
+
children: content
|
|
181
|
+
});
|
|
182
|
+
});
|
|
183
|
+
Toaster.displayName = "Toaster";
|
|
184
|
+
export { Toaster };
|
|
185
|
+
//# sourceMappingURL=Toaster.mjs.map
|