@react-stately/toast 3.0.0-nightly-c81a23ccd-250409 → 3.0.0-nightly-9723225d6-250412
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/types.d.ts +4 -2
- package/dist/types.d.ts.map +1 -1
- package/dist/useToastState.main.js +12 -6
- package/dist/useToastState.main.js.map +1 -1
- package/dist/useToastState.mjs +12 -6
- package/dist/useToastState.module.js +12 -6
- package/dist/useToastState.module.js.map +1 -1
- package/package.json +1 -1
- package/src/useToastState.ts +20 -12
package/dist/types.d.ts
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
type ToastAction = 'add' | 'remove' | 'clear';
|
|
1
2
|
export interface ToastStateProps {
|
|
2
3
|
/** The maximum number of toasts to display at a time. */
|
|
3
4
|
maxVisibleToasts?: number;
|
|
4
5
|
/** Function to wrap updates in (i.e. document.startViewTransition()). */
|
|
5
|
-
wrapUpdate?: (fn: () => void) => void;
|
|
6
|
+
wrapUpdate?: (fn: () => void, action: ToastAction) => void;
|
|
6
7
|
}
|
|
7
8
|
export interface ToastOptions {
|
|
8
9
|
/** Handler that is called when the toast is closed, either by the user or after a timeout. */
|
|
@@ -49,7 +50,7 @@ export class ToastQueue<T> {
|
|
|
49
50
|
visibleToasts: QueuedToast<T>[];
|
|
50
51
|
constructor(options?: ToastStateProps);
|
|
51
52
|
/** Subscribes to updates to the visible toasts. */
|
|
52
|
-
subscribe(fn: () => void): () =>
|
|
53
|
+
subscribe(fn: () => void): () => void;
|
|
53
54
|
/** Adds a new toast to the queue. */
|
|
54
55
|
add(content: T, options?: ToastOptions): string;
|
|
55
56
|
/**
|
|
@@ -60,6 +61,7 @@ export class ToastQueue<T> {
|
|
|
60
61
|
pauseAll(): void;
|
|
61
62
|
/** Resumes the timers for all visible toasts. */
|
|
62
63
|
resumeAll(): void;
|
|
64
|
+
clear(): void;
|
|
63
65
|
}
|
|
64
66
|
declare class Timer {
|
|
65
67
|
constructor(callback: () => void, delay: number);
|
package/dist/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":"AAgBA;IACE,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yEAAyE;IACzE,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,IAAI,KAAK,IAAI,CAAA;
|
|
1
|
+
{"mappings":"AAgBA,mBAAmB,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC9C;IACE,yDAAyD;IACzD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yEAAyE;IACzE,UAAU,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,IAAI,EAAE,MAAM,EAAE,WAAW,KAAK,IAAI,CAAA;CAC3D;AAED;IACE,8FAA8F;IAC9F,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,yEAAyE;IACzE,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AAED,6BAA6B,CAAC,CAAE,SAAQ,YAAY;IAClD,gCAAgC;IAChC,OAAO,EAAE,CAAC,CAAC;IACX,kCAAkC;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,mDAAmD;IACnD,KAAK,CAAC,EAAE,KAAK,CAAA;CACd;AAED,4BAA4B,CAAC;IAC3B,qCAAqC;IACrC,GAAG,CAAC,OAAO,EAAE,CAAC,EAAE,OAAO,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAChD;;OAEG;IACH,KAAK,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,gDAAgD;IAChD,QAAQ,IAAI,IAAI,CAAC;IACjB,iDAAiD;IACjD,SAAS,IAAI,IAAI,CAAC;IAClB,0BAA0B;IAC1B,aAAa,EAAE,YAAY,CAAC,CAAC,EAAE,CAAA;CAChC;AAED;;;GAGG;AACH,8BAA8B,CAAC,EAAE,KAAK,GAAE,eAAoB,GAAG,WAAW,CAAC,CAAC,CAI3E;AAED;;GAEG;AACH,8BAA8B,CAAC,EAAE,KAAK,EAAE,WAAW,CAAC,CAAC,GAAG,WAAW,CAAC,CAAC,CAYpE;AAED;;GAEG;AACH,wBAAwB,CAAC;IAKvB,oCAAoC;IACpC,aAAa,EAAE,YAAY,CAAC,CAAC,EAAE,CAAM;gBAEzB,OAAO,CAAC,EAAE,eAAe;IAarC,mDAAmD;IACnD,SAAS,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI;IAKrC,qCAAqC;IACrC,GAAG,CAAC,OAAO,EAAE,CAAC,EAAE,OAAO,GAAE,YAAiB,GAAG,MAAM;IAenD;;OAEG;IACH,KAAK,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAoBxB,gDAAgD;IAChD,QAAQ,IAAI,IAAI;IAQhB,iDAAiD;IACjD,SAAS,IAAI,IAAI;IAQjB,KAAK,IAAI,IAAI;CAId;AAED;gBAMc,QAAQ,EAAE,MAAM,IAAI,EAAE,KAAK,EAAE,MAAM;IAK/C,KAAK,CAAC,KAAK,EAAE,MAAM;IAKnB,KAAK;IAUL,MAAM;CAYP","sources":["packages/@react-stately/toast/src/packages/@react-stately/toast/src/useToastState.ts","packages/@react-stately/toast/src/packages/@react-stately/toast/src/index.ts","packages/@react-stately/toast/src/index.ts"],"sourcesContent":[null,null,"/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\nexport {useToastState, ToastQueue, useToastQueue} from './useToastState';\n\nexport type {ToastState, QueuedToast, ToastStateProps, ToastOptions} from './useToastState';\n"],"names":[],"version":3,"file":"types.d.ts.map"}
|
|
@@ -49,8 +49,8 @@ function $c995945a643dde76$export$84726ef35ca2129a(queue) {
|
|
|
49
49
|
};
|
|
50
50
|
}
|
|
51
51
|
class $c995945a643dde76$export$f1f8569633bbbec4 {
|
|
52
|
-
runWithWrapUpdate(fn) {
|
|
53
|
-
if (this.wrapUpdate) this.wrapUpdate(fn);
|
|
52
|
+
runWithWrapUpdate(fn, action) {
|
|
53
|
+
if (this.wrapUpdate) this.wrapUpdate(fn, action);
|
|
54
54
|
else fn();
|
|
55
55
|
}
|
|
56
56
|
/** Subscribes to updates to the visible toasts. */ subscribe(fn) {
|
|
@@ -66,7 +66,7 @@ class $c995945a643dde76$export$f1f8569633bbbec4 {
|
|
|
66
66
|
timer: options.timeout ? new $c995945a643dde76$var$Timer(()=>this.close(toastKey), options.timeout) : undefined
|
|
67
67
|
};
|
|
68
68
|
this.queue.unshift(toast);
|
|
69
|
-
this.updateVisibleToasts();
|
|
69
|
+
this.updateVisibleToasts('add');
|
|
70
70
|
return toastKey;
|
|
71
71
|
}
|
|
72
72
|
/**
|
|
@@ -78,11 +78,13 @@ class $c995945a643dde76$export$f1f8569633bbbec4 {
|
|
|
78
78
|
(_this_queue_index_onClose = (_this_queue_index = this.queue[index]).onClose) === null || _this_queue_index_onClose === void 0 ? void 0 : _this_queue_index_onClose.call(_this_queue_index);
|
|
79
79
|
this.queue.splice(index, 1);
|
|
80
80
|
}
|
|
81
|
-
this.updateVisibleToasts();
|
|
81
|
+
this.updateVisibleToasts('remove');
|
|
82
82
|
}
|
|
83
|
-
updateVisibleToasts() {
|
|
83
|
+
updateVisibleToasts(action) {
|
|
84
84
|
this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);
|
|
85
|
-
|
|
85
|
+
this.runWithWrapUpdate(()=>{
|
|
86
|
+
for (let fn of this.subscriptions)fn();
|
|
87
|
+
}, action);
|
|
86
88
|
}
|
|
87
89
|
/** Pauses the timers for all visible toasts. */ pauseAll() {
|
|
88
90
|
for (let toast of this.visibleToasts)if (toast.timer) toast.timer.pause();
|
|
@@ -90,6 +92,10 @@ class $c995945a643dde76$export$f1f8569633bbbec4 {
|
|
|
90
92
|
/** Resumes the timers for all visible toasts. */ resumeAll() {
|
|
91
93
|
for (let toast of this.visibleToasts)if (toast.timer) toast.timer.resume();
|
|
92
94
|
}
|
|
95
|
+
clear() {
|
|
96
|
+
this.queue = [];
|
|
97
|
+
this.updateVisibleToasts('clear');
|
|
98
|
+
}
|
|
93
99
|
constructor(options){
|
|
94
100
|
this.queue = [];
|
|
95
101
|
this.subscriptions = new Set();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/toast/src/useToastState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {useCallback, useMemo} from 'react';\n// Shim to support React 17 and below.\nimport {useSyncExternalStore} from 'use-sync-external-store/shim/index.js';\n\ntype ToastAction = 'add' | 'remove' | 'clear';\nexport interface ToastStateProps {\n /** The maximum number of toasts to display at a time. */\n maxVisibleToasts?: number,\n /** Function to wrap updates in (i.e. document.startViewTransition()). */\n wrapUpdate?: (fn: () => void, action: ToastAction) => void\n}\n\nexport interface ToastOptions {\n /** Handler that is called when the toast is closed, either by the user or after a timeout. */\n onClose?: () => void,\n /** A timeout to automatically close the toast after, in milliseconds. */\n timeout?: number\n}\n\nexport interface QueuedToast<T> extends ToastOptions {\n /** The content of the toast. */\n content: T,\n /** A unique key for the toast. */\n key: string,\n /** A timer for the toast, if a timeout was set. */\n timer?: Timer\n}\n\nexport interface ToastState<T> {\n /** Adds a new toast to the queue. */\n add(content: T, options?: ToastOptions): string,\n /**\n * Closes a toast.\n */\n close(key: string): void,\n /** Pauses the timers for all visible toasts. */\n pauseAll(): void,\n /** Resumes the timers for all visible toasts. */\n resumeAll(): void,\n /** The visible toasts. */\n visibleToasts: QueuedToast<T>[]\n}\n\n/**\n * Provides state management for a toast queue. Toasts display brief, temporary notifications\n * of actions, errors, or other events in an application.\n */\nexport function useToastState<T>(props: ToastStateProps = {}): ToastState<T> {\n let {maxVisibleToasts = 1, wrapUpdate} = props;\n let queue = useMemo(() => new ToastQueue<T>({maxVisibleToasts, wrapUpdate}), [maxVisibleToasts, wrapUpdate]);\n return useToastQueue(queue);\n}\n\n/**\n * Subscribes to a provided toast queue and provides methods to update it.\n */\nexport function useToastQueue<T>(queue: ToastQueue<T>): ToastState<T> {\n let subscribe = useCallback(fn => queue.subscribe(fn), [queue]);\n let getSnapshot = useCallback(() => queue.visibleToasts, [queue]);\n let visibleToasts = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n\n return {\n visibleToasts,\n add: (content, options) => queue.add(content, options),\n close: key => queue.close(key),\n pauseAll: () => queue.pauseAll(),\n resumeAll: () => queue.resumeAll()\n };\n}\n\n/**\n * A ToastQueue manages the order of toasts.\n */\nexport class ToastQueue<T> {\n private queue: QueuedToast<T>[] = [];\n private subscriptions: Set<() => void> = new Set();\n private maxVisibleToasts: number;\n private wrapUpdate?: (fn: () => void, action: ToastAction) => void;\n /** The currently visible toasts. */\n visibleToasts: QueuedToast<T>[] = [];\n\n constructor(options?: ToastStateProps) {\n this.maxVisibleToasts = options?.maxVisibleToasts ?? Infinity;\n this.wrapUpdate = options?.wrapUpdate;\n }\n\n private runWithWrapUpdate(fn: () => void, action: ToastAction): void {\n if (this.wrapUpdate) {\n this.wrapUpdate(fn, action);\n } else {\n fn();\n }\n }\n\n /** Subscribes to updates to the visible toasts. */\n subscribe(fn: () => void): () => void {\n this.subscriptions.add(fn);\n return () => this.subscriptions.delete(fn);\n }\n\n /** Adds a new toast to the queue. */\n add(content: T, options: ToastOptions = {}): string {\n let toastKey = '_' + Math.random().toString(36).slice(2);\n let toast: QueuedToast<T> = {\n ...options,\n content,\n key: toastKey,\n timer: options.timeout ? new Timer(() => this.close(toastKey), options.timeout) : undefined\n };\n\n this.queue.unshift(toast);\n\n this.updateVisibleToasts('add');\n return toastKey;\n }\n\n /**\n * Closes a toast.\n */\n close(key: string): void {\n let index = this.queue.findIndex(t => t.key === key);\n if (index >= 0) {\n this.queue[index].onClose?.();\n this.queue.splice(index, 1);\n }\n\n this.updateVisibleToasts('remove');\n }\n\n private updateVisibleToasts(action: ToastAction) {\n this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);\n\n this.runWithWrapUpdate(() => {\n for (let fn of this.subscriptions) {\n fn();\n }\n }, action);\n }\n\n /** Pauses the timers for all visible toasts. */\n pauseAll(): void {\n for (let toast of this.visibleToasts) {\n if (toast.timer) {\n toast.timer.pause();\n }\n }\n }\n\n /** Resumes the timers for all visible toasts. */\n resumeAll(): void {\n for (let toast of this.visibleToasts) {\n if (toast.timer) {\n toast.timer.resume();\n }\n }\n }\n\n clear(): void {\n this.queue = [];\n this.updateVisibleToasts('clear');\n }\n}\n\nclass Timer {\n private timerId;\n private startTime: number | null = null;\n private remaining: number;\n private callback: () => void;\n\n constructor(callback: () => void, delay: number) {\n this.remaining = delay;\n this.callback = callback;\n }\n\n reset(delay: number) {\n this.remaining = delay;\n this.resume();\n }\n\n pause() {\n if (this.timerId == null) {\n return;\n }\n\n clearTimeout(this.timerId);\n this.timerId = null;\n this.remaining -= Date.now() - this.startTime!;\n }\n\n resume() {\n if (this.remaining <= 0) {\n return;\n }\n\n this.startTime = Date.now();\n this.timerId = setTimeout(() => {\n this.timerId = null;\n this.remaining = 0;\n this.callback();\n }, this.remaining);\n }\n}\n"],"names":[],"version":3,"file":"useToastState.main.js.map"}
|
package/dist/useToastState.mjs
CHANGED
|
@@ -41,8 +41,8 @@ function $77b352cf12efcf73$export$84726ef35ca2129a(queue) {
|
|
|
41
41
|
};
|
|
42
42
|
}
|
|
43
43
|
class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
44
|
-
runWithWrapUpdate(fn) {
|
|
45
|
-
if (this.wrapUpdate) this.wrapUpdate(fn);
|
|
44
|
+
runWithWrapUpdate(fn, action) {
|
|
45
|
+
if (this.wrapUpdate) this.wrapUpdate(fn, action);
|
|
46
46
|
else fn();
|
|
47
47
|
}
|
|
48
48
|
/** Subscribes to updates to the visible toasts. */ subscribe(fn) {
|
|
@@ -58,7 +58,7 @@ class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
|
58
58
|
timer: options.timeout ? new $77b352cf12efcf73$var$Timer(()=>this.close(toastKey), options.timeout) : undefined
|
|
59
59
|
};
|
|
60
60
|
this.queue.unshift(toast);
|
|
61
|
-
this.updateVisibleToasts();
|
|
61
|
+
this.updateVisibleToasts('add');
|
|
62
62
|
return toastKey;
|
|
63
63
|
}
|
|
64
64
|
/**
|
|
@@ -70,11 +70,13 @@ class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
|
70
70
|
(_this_queue_index_onClose = (_this_queue_index = this.queue[index]).onClose) === null || _this_queue_index_onClose === void 0 ? void 0 : _this_queue_index_onClose.call(_this_queue_index);
|
|
71
71
|
this.queue.splice(index, 1);
|
|
72
72
|
}
|
|
73
|
-
this.updateVisibleToasts();
|
|
73
|
+
this.updateVisibleToasts('remove');
|
|
74
74
|
}
|
|
75
|
-
updateVisibleToasts() {
|
|
75
|
+
updateVisibleToasts(action) {
|
|
76
76
|
this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);
|
|
77
|
-
|
|
77
|
+
this.runWithWrapUpdate(()=>{
|
|
78
|
+
for (let fn of this.subscriptions)fn();
|
|
79
|
+
}, action);
|
|
78
80
|
}
|
|
79
81
|
/** Pauses the timers for all visible toasts. */ pauseAll() {
|
|
80
82
|
for (let toast of this.visibleToasts)if (toast.timer) toast.timer.pause();
|
|
@@ -82,6 +84,10 @@ class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
|
82
84
|
/** Resumes the timers for all visible toasts. */ resumeAll() {
|
|
83
85
|
for (let toast of this.visibleToasts)if (toast.timer) toast.timer.resume();
|
|
84
86
|
}
|
|
87
|
+
clear() {
|
|
88
|
+
this.queue = [];
|
|
89
|
+
this.updateVisibleToasts('clear');
|
|
90
|
+
}
|
|
85
91
|
constructor(options){
|
|
86
92
|
this.queue = [];
|
|
87
93
|
this.subscriptions = new Set();
|
|
@@ -41,8 +41,8 @@ function $77b352cf12efcf73$export$84726ef35ca2129a(queue) {
|
|
|
41
41
|
};
|
|
42
42
|
}
|
|
43
43
|
class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
44
|
-
runWithWrapUpdate(fn) {
|
|
45
|
-
if (this.wrapUpdate) this.wrapUpdate(fn);
|
|
44
|
+
runWithWrapUpdate(fn, action) {
|
|
45
|
+
if (this.wrapUpdate) this.wrapUpdate(fn, action);
|
|
46
46
|
else fn();
|
|
47
47
|
}
|
|
48
48
|
/** Subscribes to updates to the visible toasts. */ subscribe(fn) {
|
|
@@ -58,7 +58,7 @@ class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
|
58
58
|
timer: options.timeout ? new $77b352cf12efcf73$var$Timer(()=>this.close(toastKey), options.timeout) : undefined
|
|
59
59
|
};
|
|
60
60
|
this.queue.unshift(toast);
|
|
61
|
-
this.updateVisibleToasts();
|
|
61
|
+
this.updateVisibleToasts('add');
|
|
62
62
|
return toastKey;
|
|
63
63
|
}
|
|
64
64
|
/**
|
|
@@ -70,11 +70,13 @@ class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
|
70
70
|
(_this_queue_index_onClose = (_this_queue_index = this.queue[index]).onClose) === null || _this_queue_index_onClose === void 0 ? void 0 : _this_queue_index_onClose.call(_this_queue_index);
|
|
71
71
|
this.queue.splice(index, 1);
|
|
72
72
|
}
|
|
73
|
-
this.updateVisibleToasts();
|
|
73
|
+
this.updateVisibleToasts('remove');
|
|
74
74
|
}
|
|
75
|
-
updateVisibleToasts() {
|
|
75
|
+
updateVisibleToasts(action) {
|
|
76
76
|
this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);
|
|
77
|
-
|
|
77
|
+
this.runWithWrapUpdate(()=>{
|
|
78
|
+
for (let fn of this.subscriptions)fn();
|
|
79
|
+
}, action);
|
|
78
80
|
}
|
|
79
81
|
/** Pauses the timers for all visible toasts. */ pauseAll() {
|
|
80
82
|
for (let toast of this.visibleToasts)if (toast.timer) toast.timer.pause();
|
|
@@ -82,6 +84,10 @@ class $77b352cf12efcf73$export$f1f8569633bbbec4 {
|
|
|
82
84
|
/** Resumes the timers for all visible toasts. */ resumeAll() {
|
|
83
85
|
for (let toast of this.visibleToasts)if (toast.timer) toast.timer.resume();
|
|
84
86
|
}
|
|
87
|
+
clear() {
|
|
88
|
+
this.queue = [];
|
|
89
|
+
this.updateVisibleToasts('clear');
|
|
90
|
+
}
|
|
85
91
|
constructor(options){
|
|
86
92
|
this.queue = [];
|
|
87
93
|
this.subscriptions = new Set();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"mappings":";;;AAAA;;;;;;;;;;CAUC;;
|
|
1
|
+
{"mappings":"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","sources":["packages/@react-stately/toast/src/useToastState.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {useCallback, useMemo} from 'react';\n// Shim to support React 17 and below.\nimport {useSyncExternalStore} from 'use-sync-external-store/shim/index.js';\n\ntype ToastAction = 'add' | 'remove' | 'clear';\nexport interface ToastStateProps {\n /** The maximum number of toasts to display at a time. */\n maxVisibleToasts?: number,\n /** Function to wrap updates in (i.e. document.startViewTransition()). */\n wrapUpdate?: (fn: () => void, action: ToastAction) => void\n}\n\nexport interface ToastOptions {\n /** Handler that is called when the toast is closed, either by the user or after a timeout. */\n onClose?: () => void,\n /** A timeout to automatically close the toast after, in milliseconds. */\n timeout?: number\n}\n\nexport interface QueuedToast<T> extends ToastOptions {\n /** The content of the toast. */\n content: T,\n /** A unique key for the toast. */\n key: string,\n /** A timer for the toast, if a timeout was set. */\n timer?: Timer\n}\n\nexport interface ToastState<T> {\n /** Adds a new toast to the queue. */\n add(content: T, options?: ToastOptions): string,\n /**\n * Closes a toast.\n */\n close(key: string): void,\n /** Pauses the timers for all visible toasts. */\n pauseAll(): void,\n /** Resumes the timers for all visible toasts. */\n resumeAll(): void,\n /** The visible toasts. */\n visibleToasts: QueuedToast<T>[]\n}\n\n/**\n * Provides state management for a toast queue. Toasts display brief, temporary notifications\n * of actions, errors, or other events in an application.\n */\nexport function useToastState<T>(props: ToastStateProps = {}): ToastState<T> {\n let {maxVisibleToasts = 1, wrapUpdate} = props;\n let queue = useMemo(() => new ToastQueue<T>({maxVisibleToasts, wrapUpdate}), [maxVisibleToasts, wrapUpdate]);\n return useToastQueue(queue);\n}\n\n/**\n * Subscribes to a provided toast queue and provides methods to update it.\n */\nexport function useToastQueue<T>(queue: ToastQueue<T>): ToastState<T> {\n let subscribe = useCallback(fn => queue.subscribe(fn), [queue]);\n let getSnapshot = useCallback(() => queue.visibleToasts, [queue]);\n let visibleToasts = useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n\n return {\n visibleToasts,\n add: (content, options) => queue.add(content, options),\n close: key => queue.close(key),\n pauseAll: () => queue.pauseAll(),\n resumeAll: () => queue.resumeAll()\n };\n}\n\n/**\n * A ToastQueue manages the order of toasts.\n */\nexport class ToastQueue<T> {\n private queue: QueuedToast<T>[] = [];\n private subscriptions: Set<() => void> = new Set();\n private maxVisibleToasts: number;\n private wrapUpdate?: (fn: () => void, action: ToastAction) => void;\n /** The currently visible toasts. */\n visibleToasts: QueuedToast<T>[] = [];\n\n constructor(options?: ToastStateProps) {\n this.maxVisibleToasts = options?.maxVisibleToasts ?? Infinity;\n this.wrapUpdate = options?.wrapUpdate;\n }\n\n private runWithWrapUpdate(fn: () => void, action: ToastAction): void {\n if (this.wrapUpdate) {\n this.wrapUpdate(fn, action);\n } else {\n fn();\n }\n }\n\n /** Subscribes to updates to the visible toasts. */\n subscribe(fn: () => void): () => void {\n this.subscriptions.add(fn);\n return () => this.subscriptions.delete(fn);\n }\n\n /** Adds a new toast to the queue. */\n add(content: T, options: ToastOptions = {}): string {\n let toastKey = '_' + Math.random().toString(36).slice(2);\n let toast: QueuedToast<T> = {\n ...options,\n content,\n key: toastKey,\n timer: options.timeout ? new Timer(() => this.close(toastKey), options.timeout) : undefined\n };\n\n this.queue.unshift(toast);\n\n this.updateVisibleToasts('add');\n return toastKey;\n }\n\n /**\n * Closes a toast.\n */\n close(key: string): void {\n let index = this.queue.findIndex(t => t.key === key);\n if (index >= 0) {\n this.queue[index].onClose?.();\n this.queue.splice(index, 1);\n }\n\n this.updateVisibleToasts('remove');\n }\n\n private updateVisibleToasts(action: ToastAction) {\n this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);\n\n this.runWithWrapUpdate(() => {\n for (let fn of this.subscriptions) {\n fn();\n }\n }, action);\n }\n\n /** Pauses the timers for all visible toasts. */\n pauseAll(): void {\n for (let toast of this.visibleToasts) {\n if (toast.timer) {\n toast.timer.pause();\n }\n }\n }\n\n /** Resumes the timers for all visible toasts. */\n resumeAll(): void {\n for (let toast of this.visibleToasts) {\n if (toast.timer) {\n toast.timer.resume();\n }\n }\n }\n\n clear(): void {\n this.queue = [];\n this.updateVisibleToasts('clear');\n }\n}\n\nclass Timer {\n private timerId;\n private startTime: number | null = null;\n private remaining: number;\n private callback: () => void;\n\n constructor(callback: () => void, delay: number) {\n this.remaining = delay;\n this.callback = callback;\n }\n\n reset(delay: number) {\n this.remaining = delay;\n this.resume();\n }\n\n pause() {\n if (this.timerId == null) {\n return;\n }\n\n clearTimeout(this.timerId);\n this.timerId = null;\n this.remaining -= Date.now() - this.startTime!;\n }\n\n resume() {\n if (this.remaining <= 0) {\n return;\n }\n\n this.startTime = Date.now();\n this.timerId = setTimeout(() => {\n this.timerId = null;\n this.remaining = 0;\n this.callback();\n }, this.remaining);\n }\n}\n"],"names":[],"version":3,"file":"useToastState.module.js.map"}
|
package/package.json
CHANGED
package/src/useToastState.ts
CHANGED
|
@@ -14,11 +14,12 @@ import {useCallback, useMemo} from 'react';
|
|
|
14
14
|
// Shim to support React 17 and below.
|
|
15
15
|
import {useSyncExternalStore} from 'use-sync-external-store/shim/index.js';
|
|
16
16
|
|
|
17
|
+
type ToastAction = 'add' | 'remove' | 'clear';
|
|
17
18
|
export interface ToastStateProps {
|
|
18
19
|
/** The maximum number of toasts to display at a time. */
|
|
19
20
|
maxVisibleToasts?: number,
|
|
20
21
|
/** Function to wrap updates in (i.e. document.startViewTransition()). */
|
|
21
|
-
wrapUpdate?: (fn: () => void) => void
|
|
22
|
+
wrapUpdate?: (fn: () => void, action: ToastAction) => void
|
|
22
23
|
}
|
|
23
24
|
|
|
24
25
|
export interface ToastOptions {
|
|
@@ -86,7 +87,7 @@ export class ToastQueue<T> {
|
|
|
86
87
|
private queue: QueuedToast<T>[] = [];
|
|
87
88
|
private subscriptions: Set<() => void> = new Set();
|
|
88
89
|
private maxVisibleToasts: number;
|
|
89
|
-
private wrapUpdate?: (fn: () => void) => void;
|
|
90
|
+
private wrapUpdate?: (fn: () => void, action: ToastAction) => void;
|
|
90
91
|
/** The currently visible toasts. */
|
|
91
92
|
visibleToasts: QueuedToast<T>[] = [];
|
|
92
93
|
|
|
@@ -95,18 +96,18 @@ export class ToastQueue<T> {
|
|
|
95
96
|
this.wrapUpdate = options?.wrapUpdate;
|
|
96
97
|
}
|
|
97
98
|
|
|
98
|
-
private runWithWrapUpdate(fn: () => void): void {
|
|
99
|
+
private runWithWrapUpdate(fn: () => void, action: ToastAction): void {
|
|
99
100
|
if (this.wrapUpdate) {
|
|
100
|
-
this.wrapUpdate(fn);
|
|
101
|
+
this.wrapUpdate(fn, action);
|
|
101
102
|
} else {
|
|
102
103
|
fn();
|
|
103
104
|
}
|
|
104
105
|
}
|
|
105
106
|
|
|
106
107
|
/** Subscribes to updates to the visible toasts. */
|
|
107
|
-
subscribe(fn: () => void): () =>
|
|
108
|
+
subscribe(fn: () => void): () => void {
|
|
108
109
|
this.subscriptions.add(fn);
|
|
109
|
-
return ()
|
|
110
|
+
return () => this.subscriptions.delete(fn);
|
|
110
111
|
}
|
|
111
112
|
|
|
112
113
|
/** Adds a new toast to the queue. */
|
|
@@ -121,7 +122,7 @@ export class ToastQueue<T> {
|
|
|
121
122
|
|
|
122
123
|
this.queue.unshift(toast);
|
|
123
124
|
|
|
124
|
-
this.updateVisibleToasts();
|
|
125
|
+
this.updateVisibleToasts('add');
|
|
125
126
|
return toastKey;
|
|
126
127
|
}
|
|
127
128
|
|
|
@@ -135,15 +136,17 @@ export class ToastQueue<T> {
|
|
|
135
136
|
this.queue.splice(index, 1);
|
|
136
137
|
}
|
|
137
138
|
|
|
138
|
-
this.updateVisibleToasts();
|
|
139
|
+
this.updateVisibleToasts('remove');
|
|
139
140
|
}
|
|
140
141
|
|
|
141
|
-
private updateVisibleToasts() {
|
|
142
|
+
private updateVisibleToasts(action: ToastAction) {
|
|
142
143
|
this.visibleToasts = this.queue.slice(0, this.maxVisibleToasts);
|
|
143
144
|
|
|
144
|
-
|
|
145
|
-
this.
|
|
146
|
-
|
|
145
|
+
this.runWithWrapUpdate(() => {
|
|
146
|
+
for (let fn of this.subscriptions) {
|
|
147
|
+
fn();
|
|
148
|
+
}
|
|
149
|
+
}, action);
|
|
147
150
|
}
|
|
148
151
|
|
|
149
152
|
/** Pauses the timers for all visible toasts. */
|
|
@@ -163,6 +166,11 @@ export class ToastQueue<T> {
|
|
|
163
166
|
}
|
|
164
167
|
}
|
|
165
168
|
}
|
|
169
|
+
|
|
170
|
+
clear(): void {
|
|
171
|
+
this.queue = [];
|
|
172
|
+
this.updateVisibleToasts('clear');
|
|
173
|
+
}
|
|
166
174
|
}
|
|
167
175
|
|
|
168
176
|
class Timer {
|