@samline/notify 1.0.2 → 2.0.0

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.
Files changed (84) hide show
  1. package/{LICENSE → LICENSE.md} +2 -2
  2. package/README.md +27 -163
  3. package/dist/_runtime.d.mts +87 -0
  4. package/dist/_runtime.d.ts +87 -0
  5. package/dist/_runtime.js +97 -0
  6. package/dist/_runtime.mjs +83 -0
  7. package/dist/browser/assets-client-B-VVPPYQ.js +114 -0
  8. package/dist/browser/assets-client-CUzxHubR.mjs +108 -0
  9. package/dist/browser/index-client-BBOQyMFk.mjs +173 -0
  10. package/dist/browser/index-client-Czb7hTpD.js +181 -0
  11. package/dist/browser/index.d.mts +134 -0
  12. package/dist/browser/index.d.ts +134 -0
  13. package/dist/browser/index.js +34 -0
  14. package/dist/browser/index.mjs +26 -0
  15. package/dist/browser/render-client-CjcQoukB.js +981 -0
  16. package/dist/browser/render-client-bGRSTd-L.mjs +974 -0
  17. package/dist/core/index.d.mts +68 -0
  18. package/dist/core/index.d.ts +68 -0
  19. package/dist/core/index.js +1 -0
  20. package/dist/core/index.mjs +1 -0
  21. package/dist/index.d.mts +131 -0
  22. package/dist/index.d.ts +131 -0
  23. package/dist/index.js +1240 -0
  24. package/dist/index.mjs +1228 -0
  25. package/dist/react/index.d.mts +158 -0
  26. package/dist/react/index.d.ts +158 -0
  27. package/dist/react/index.js +1116 -0
  28. package/dist/react/index.mjs +1107 -0
  29. package/dist/styles.css +589 -422
  30. package/dist/svelte/assets-client-B-VVPPYQ.js +114 -0
  31. package/dist/svelte/assets-client-CUzxHubR.mjs +108 -0
  32. package/dist/svelte/index-client-DbXbWMIe.js +177 -0
  33. package/dist/svelte/index-client-Dj_WfPK9.mjs +170 -0
  34. package/dist/svelte/index.d.mts +14 -0
  35. package/dist/svelte/index.d.ts +14 -0
  36. package/dist/svelte/index.js +43 -0
  37. package/dist/svelte/index.mjs +36 -0
  38. package/dist/svelte/render-client-CjcQoukB.js +981 -0
  39. package/dist/svelte/render-client-bGRSTd-L.mjs +974 -0
  40. package/dist/vue/assets-client-B-VVPPYQ.js +114 -0
  41. package/dist/vue/assets-client-CUzxHubR.mjs +108 -0
  42. package/dist/vue/index-client-DbXbWMIe.js +177 -0
  43. package/dist/vue/index-client-Dj_WfPK9.mjs +170 -0
  44. package/dist/vue/index.d.mts +50 -0
  45. package/dist/vue/index.d.ts +50 -0
  46. package/dist/vue/index.js +110 -0
  47. package/dist/vue/index.mjs +104 -0
  48. package/dist/vue/render-client-CjcQoukB.js +981 -0
  49. package/dist/vue/render-client-bGRSTd-L.mjs +974 -0
  50. package/package.json +140 -95
  51. package/dist/browser-notify.js +0 -68
  52. package/dist/cc-2Yt7NqMX.mjs +0 -21
  53. package/dist/cc-B6peeNak.mjs +0 -33
  54. package/dist/cc-BWuAzFJ6.js +0 -12
  55. package/dist/cc-CaBHsjUt.js +0 -34
  56. package/dist/cc-DGff5sSY.js +0 -21
  57. package/dist/cc-he3fHS3P.mjs +0 -12
  58. package/dist/notify.d.mts +0 -48
  59. package/dist/notify.d.mts.map +0 -1
  60. package/dist/notify.d.ts +0 -48
  61. package/dist/notify.d.ts.map +0 -1
  62. package/dist/notify.js +0 -206
  63. package/dist/notify.mjs +0 -202
  64. package/dist/react-notify-12s--2JK5UjB.mjs +0 -1244
  65. package/dist/react-notify-12s-Kv2M6zlv.js +0 -1247
  66. package/dist/react.d.mts +0 -70
  67. package/dist/react.d.mts.map +0 -1
  68. package/dist/react.d.ts +0 -70
  69. package/dist/react.d.ts.map +0 -1
  70. package/dist/react.js +0 -19
  71. package/dist/react.mjs +0 -10
  72. package/dist/render-notify-toasts.js +0 -213
  73. package/dist/svelte.d.mts +0 -49
  74. package/dist/svelte.d.mts.map +0 -1
  75. package/dist/svelte.d.ts +0 -49
  76. package/dist/svelte.d.ts.map +0 -1
  77. package/dist/svelte.js +0 -284
  78. package/dist/svelte.mjs +0 -280
  79. package/dist/vue.d.mts +0 -107
  80. package/dist/vue.d.mts.map +0 -1
  81. package/dist/vue.d.ts +0 -107
  82. package/dist/vue.d.ts.map +0 -1
  83. package/dist/vue.js +0 -2215
  84. package/dist/vue.mjs +0 -2211
@@ -0,0 +1,981 @@
1
+ 'use client';
2
+ function __insertCSS(code) {
3
+ if (!code || typeof document == 'undefined') return
4
+ let head = document.head || document.getElementsByTagName('head')[0]
5
+ let style = document.createElement('style')
6
+ style.type = 'text/css'
7
+ head.appendChild(style)
8
+ ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code))
9
+ }
10
+
11
+ var React = require('react');
12
+ var ReactDOM = require('react-dom');
13
+ var assetsClient = require('./assets-client-B-VVPPYQ.js');
14
+
15
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
16
+
17
+ var React__default = /*#__PURE__*/_interopDefault(React);
18
+ var ReactDOM__default = /*#__PURE__*/_interopDefault(ReactDOM);
19
+
20
+ // Visible toasts amount
21
+ const VISIBLE_TOASTS_AMOUNT = 3;
22
+ // Viewport padding
23
+ const VIEWPORT_OFFSET = '24px';
24
+ // Mobile viewport padding
25
+ const MOBILE_VIEWPORT_OFFSET = '16px';
26
+ // Default lifetime of a toasts (in ms)
27
+ const TOAST_LIFETIME = 4000;
28
+ // Default toast width
29
+ const TOAST_WIDTH = 356;
30
+ // Default gap between toasts
31
+ const GAP = 14;
32
+ // Threshold to dismiss a toast
33
+ const SWIPE_THRESHOLD = 45;
34
+ // Equal to exit animation duration
35
+ const TIME_BEFORE_UNMOUNT = 200;
36
+ function cn(...classes) {
37
+ return classes.filter(Boolean).join(' ');
38
+ }
39
+ function canUseDOM() {
40
+ return typeof window !== 'undefined' && typeof document !== 'undefined';
41
+ }
42
+ function getDefaultSwipeDirections(position) {
43
+ const [y, x] = position.split('-');
44
+ const directions = [];
45
+ if (y) {
46
+ directions.push(y);
47
+ }
48
+ if (x) {
49
+ directions.push(x);
50
+ }
51
+ return directions;
52
+ }
53
+ function getDocumentDirection() {
54
+ if (!canUseDOM()) return 'ltr';
55
+ const dirAttribute = document.documentElement.getAttribute('dir');
56
+ if (dirAttribute === 'auto' || !dirAttribute) {
57
+ return window.getComputedStyle(document.documentElement).direction;
58
+ }
59
+ return dirAttribute;
60
+ }
61
+ function assignOffset(defaultOffset, mobileOffset) {
62
+ const styles = {};
63
+ [
64
+ defaultOffset,
65
+ mobileOffset
66
+ ].forEach((offset, index)=>{
67
+ const isMobile = index === 1;
68
+ const prefix = isMobile ? '--mobile-offset' : '--offset';
69
+ const defaultValue = isMobile ? MOBILE_VIEWPORT_OFFSET : VIEWPORT_OFFSET;
70
+ function assignAll(value) {
71
+ [
72
+ 'top',
73
+ 'right',
74
+ 'bottom',
75
+ 'left'
76
+ ].forEach((key)=>{
77
+ styles[`${prefix}-${key}`] = typeof value === 'number' ? `${value}px` : value;
78
+ });
79
+ }
80
+ if (typeof offset === 'number' || typeof offset === 'string') {
81
+ assignAll(offset);
82
+ } else if (typeof offset === 'object') {
83
+ [
84
+ 'top',
85
+ 'right',
86
+ 'bottom',
87
+ 'left'
88
+ ].forEach((key)=>{
89
+ if (offset[key] === undefined) {
90
+ styles[`${prefix}-${key}`] = defaultValue;
91
+ } else {
92
+ styles[`${prefix}-${key}`] = typeof offset[key] === 'number' ? `${offset[key]}px` : offset[key];
93
+ }
94
+ });
95
+ } else {
96
+ assignAll(defaultValue);
97
+ }
98
+ });
99
+ return styles;
100
+ }
101
+
102
+ let toastsCounter = 1;
103
+ class Observer {
104
+ constructor(){
105
+ // We use arrow functions to maintain the correct `this` reference
106
+ this.subscribe = (subscriber)=>{
107
+ this.subscribers.push(subscriber);
108
+ return ()=>{
109
+ const index = this.subscribers.indexOf(subscriber);
110
+ this.subscribers.splice(index, 1);
111
+ };
112
+ };
113
+ this.publish = (data)=>{
114
+ this.subscribers.forEach((subscriber)=>subscriber(data));
115
+ };
116
+ this.addToast = (data)=>{
117
+ this.publish(data);
118
+ this.toasts = [
119
+ ...this.toasts,
120
+ data
121
+ ];
122
+ };
123
+ this.create = (data)=>{
124
+ const { message, ...rest } = data;
125
+ const id = typeof data?.id === 'number' || data.id?.length > 0 ? data.id : toastsCounter++;
126
+ const alreadyExists = this.toasts.find((toast)=>{
127
+ return toast.id === id;
128
+ });
129
+ const dismissible = data.dismissible === undefined ? true : data.dismissible;
130
+ if (this.dismissedToasts.has(id)) {
131
+ this.dismissedToasts.delete(id);
132
+ }
133
+ if (alreadyExists) {
134
+ this.toasts = this.toasts.map((toast)=>{
135
+ if (toast.id === id) {
136
+ this.publish({
137
+ ...toast,
138
+ ...data,
139
+ id,
140
+ title: message
141
+ });
142
+ return {
143
+ ...toast,
144
+ ...data,
145
+ id,
146
+ dismissible,
147
+ title: message
148
+ };
149
+ }
150
+ return toast;
151
+ });
152
+ } else {
153
+ this.addToast({
154
+ title: message,
155
+ ...rest,
156
+ dismissible,
157
+ id
158
+ });
159
+ }
160
+ return id;
161
+ };
162
+ this.dismiss = (id)=>{
163
+ if (id) {
164
+ this.dismissedToasts.add(id);
165
+ requestAnimationFrame(()=>this.subscribers.forEach((subscriber)=>subscriber({
166
+ id,
167
+ dismiss: true
168
+ })));
169
+ } else {
170
+ this.toasts.forEach((toast)=>{
171
+ this.subscribers.forEach((subscriber)=>subscriber({
172
+ id: toast.id,
173
+ dismiss: true
174
+ }));
175
+ });
176
+ }
177
+ return id;
178
+ };
179
+ this.message = (message, data)=>{
180
+ return this.create({
181
+ ...data,
182
+ message
183
+ });
184
+ };
185
+ this.error = (message, data)=>{
186
+ return this.create({
187
+ ...data,
188
+ message,
189
+ type: 'error'
190
+ });
191
+ };
192
+ this.success = (message, data)=>{
193
+ return this.create({
194
+ ...data,
195
+ type: 'success',
196
+ message
197
+ });
198
+ };
199
+ this.info = (message, data)=>{
200
+ return this.create({
201
+ ...data,
202
+ type: 'info',
203
+ message
204
+ });
205
+ };
206
+ this.warning = (message, data)=>{
207
+ return this.create({
208
+ ...data,
209
+ type: 'warning',
210
+ message
211
+ });
212
+ };
213
+ this.loading = (message, data)=>{
214
+ return this.create({
215
+ ...data,
216
+ type: 'loading',
217
+ message
218
+ });
219
+ };
220
+ this.promise = (promise, data)=>{
221
+ if (!data) {
222
+ // Nothing to show
223
+ return;
224
+ }
225
+ let id = undefined;
226
+ if (data.loading !== undefined) {
227
+ id = this.create({
228
+ ...data,
229
+ promise,
230
+ type: 'loading',
231
+ message: data.loading,
232
+ description: typeof data.description !== 'function' ? data.description : undefined
233
+ });
234
+ }
235
+ const p = Promise.resolve(promise instanceof Function ? promise() : promise);
236
+ let shouldDismiss = id !== undefined;
237
+ let result;
238
+ const originalPromise = p.then(async (response)=>{
239
+ result = [
240
+ 'resolve',
241
+ response
242
+ ];
243
+ const isReactElementResponse = React__default.default.isValidElement(response);
244
+ if (isReactElementResponse) {
245
+ shouldDismiss = false;
246
+ this.create({
247
+ id,
248
+ type: 'default',
249
+ message: response
250
+ });
251
+ } else if (isHttpResponse(response) && !response.ok) {
252
+ shouldDismiss = false;
253
+ const promiseData = typeof data.error === 'function' ? await data.error(`HTTP error! status: ${response.status}`) : data.error;
254
+ const description = typeof data.description === 'function' ? await data.description(`HTTP error! status: ${response.status}`) : data.description;
255
+ const isExtendedResult = typeof promiseData === 'object' && !React__default.default.isValidElement(promiseData);
256
+ const toastSettings = isExtendedResult ? promiseData : {
257
+ message: promiseData
258
+ };
259
+ this.create({
260
+ id,
261
+ type: 'error',
262
+ description,
263
+ ...toastSettings
264
+ });
265
+ } else if (response instanceof Error) {
266
+ shouldDismiss = false;
267
+ const promiseData = typeof data.error === 'function' ? await data.error(response) : data.error;
268
+ const description = typeof data.description === 'function' ? await data.description(response) : data.description;
269
+ const isExtendedResult = typeof promiseData === 'object' && !React__default.default.isValidElement(promiseData);
270
+ const toastSettings = isExtendedResult ? promiseData : {
271
+ message: promiseData
272
+ };
273
+ this.create({
274
+ id,
275
+ type: 'error',
276
+ description,
277
+ ...toastSettings
278
+ });
279
+ } else if (data.success !== undefined) {
280
+ shouldDismiss = false;
281
+ const promiseData = typeof data.success === 'function' ? await data.success(response) : data.success;
282
+ const description = typeof data.description === 'function' ? await data.description(response) : data.description;
283
+ const isExtendedResult = typeof promiseData === 'object' && !React__default.default.isValidElement(promiseData);
284
+ const toastSettings = isExtendedResult ? promiseData : {
285
+ message: promiseData
286
+ };
287
+ this.create({
288
+ id,
289
+ type: 'success',
290
+ description,
291
+ ...toastSettings
292
+ });
293
+ }
294
+ }).catch(async (error)=>{
295
+ result = [
296
+ 'reject',
297
+ error
298
+ ];
299
+ if (data.error !== undefined) {
300
+ shouldDismiss = false;
301
+ const promiseData = typeof data.error === 'function' ? await data.error(error) : data.error;
302
+ const description = typeof data.description === 'function' ? await data.description(error) : data.description;
303
+ const isExtendedResult = typeof promiseData === 'object' && !React__default.default.isValidElement(promiseData);
304
+ const toastSettings = isExtendedResult ? promiseData : {
305
+ message: promiseData
306
+ };
307
+ this.create({
308
+ id,
309
+ type: 'error',
310
+ description,
311
+ ...toastSettings
312
+ });
313
+ }
314
+ }).finally(()=>{
315
+ if (shouldDismiss) {
316
+ // Toast is still in load state (and will be indefinitely — dismiss it)
317
+ this.dismiss(id);
318
+ id = undefined;
319
+ }
320
+ data.finally?.();
321
+ });
322
+ const unwrap = ()=>new Promise((resolve, reject)=>originalPromise.then(()=>result[0] === 'reject' ? reject(result[1]) : resolve(result[1])).catch(reject));
323
+ if (typeof id !== 'string' && typeof id !== 'number') {
324
+ // cannot Object.assign on undefined
325
+ return {
326
+ unwrap
327
+ };
328
+ } else {
329
+ return Object.assign(id, {
330
+ unwrap
331
+ });
332
+ }
333
+ };
334
+ this.custom = (jsx, data)=>{
335
+ const id = data?.id || toastsCounter++;
336
+ this.create({
337
+ jsx: jsx(id),
338
+ ...data,
339
+ id
340
+ });
341
+ return id;
342
+ };
343
+ this.getActiveToasts = ()=>{
344
+ return this.toasts.filter((toast)=>!this.dismissedToasts.has(toast.id));
345
+ };
346
+ this.subscribers = [];
347
+ this.toasts = [];
348
+ this.dismissedToasts = new Set();
349
+ }
350
+ }
351
+ const ToastState = new Observer();
352
+ // bind this to the toast function
353
+ const toastFunction = (message, data)=>{
354
+ return ToastState.create({
355
+ ...data,
356
+ message
357
+ });
358
+ };
359
+ const isHttpResponse = (data)=>{
360
+ return data && typeof data === 'object' && 'ok' in data && typeof data.ok === 'boolean' && 'status' in data && typeof data.status === 'number';
361
+ };
362
+ const basicToast = toastFunction;
363
+ const getHistory = ()=>ToastState.toasts;
364
+ const getToasts = ()=>ToastState.getActiveToasts();
365
+ // We use `Object.assign` to maintain the correct types as we would lose them otherwise
366
+ const toast = Object.assign(basicToast, {
367
+ success: ToastState.success,
368
+ info: ToastState.info,
369
+ warning: ToastState.warning,
370
+ error: ToastState.error,
371
+ custom: ToastState.custom,
372
+ message: ToastState.message,
373
+ promise: ToastState.promise,
374
+ dismiss: ToastState.dismiss,
375
+ loading: ToastState.loading
376
+ }, {
377
+ getHistory,
378
+ getToasts
379
+ });
380
+
381
+ const useIsDocumentHidden = ()=>{
382
+ const [isDocumentHidden, setIsDocumentHidden] = React__default.default.useState(document.hidden);
383
+ React__default.default.useEffect(()=>{
384
+ const callback = ()=>{
385
+ setIsDocumentHidden(document.hidden);
386
+ };
387
+ document.addEventListener('visibilitychange', callback);
388
+ return ()=>document.removeEventListener('visibilitychange', callback);
389
+ }, []);
390
+ return isDocumentHidden;
391
+ };
392
+
393
+ __insertCSS("[data-notify-toaster][dir=ltr],html[dir=ltr]{--toast-icon-margin-start:-3px;--toast-icon-margin-end:4px;--toast-svg-margin-start:-1px;--toast-svg-margin-end:0px;--toast-button-margin-start:auto;--toast-button-margin-end:0;--toast-close-button-start:0;--toast-close-button-end:unset;--toast-close-button-transform:translate(-35%, -35%)}[data-notify-toaster][dir=rtl],html[dir=rtl]{--toast-icon-margin-start:4px;--toast-icon-margin-end:-3px;--toast-svg-margin-start:0px;--toast-svg-margin-end:-1px;--toast-button-margin-start:0;--toast-button-margin-end:auto;--toast-close-button-start:unset;--toast-close-button-end:0;--toast-close-button-transform:translate(35%, -35%)}[data-notify-toaster]{position:fixed;width:var(--width);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;--gray1:hsl(0, 0%, 99%);--gray2:hsl(0, 0%, 97.3%);--gray3:hsl(0, 0%, 95.1%);--gray4:hsl(0, 0%, 93%);--gray5:hsl(0, 0%, 90.9%);--gray6:hsl(0, 0%, 88.7%);--gray7:hsl(0, 0%, 85.8%);--gray8:hsl(0, 0%, 78%);--gray9:hsl(0, 0%, 56.1%);--gray10:hsl(0, 0%, 52.3%);--gray11:hsl(0, 0%, 43.5%);--gray12:hsl(0, 0%, 9%);--border-radius:8px;box-sizing:border-box;padding:0;margin:0;list-style:none;outline:0;z-index:999999999;transition:transform .4s ease}@media (hover:none) and (pointer:coarse){[data-notify-toaster][data-lifted=true]{transform:none}}[data-notify-toaster][data-x-position=right]{right:var(--offset-right)}[data-notify-toaster][data-x-position=left]{left:var(--offset-left)}[data-notify-toaster][data-x-position=center]{left:50%;transform:translateX(-50%)}[data-notify-toaster][data-y-position=top]{top:var(--offset-top)}[data-notify-toaster][data-y-position=bottom]{bottom:var(--offset-bottom)}[data-notify-toast]{--y:translateY(100%);--lift-amount:calc(var(--lift) * var(--gap));z-index:var(--z-index);position:absolute;opacity:0;transform:var(--y);touch-action:none;transition:transform .4s,opacity .4s,height .4s,box-shadow .2s;box-sizing:border-box;outline:0;overflow-wrap:anywhere}[data-notify-toast][data-styled=true]{padding:16px;background:var(--normal-bg);border:1px solid var(--normal-border);color:var(--normal-text);border-radius:var(--border-radius);box-shadow:0 4px 12px rgba(0,0,0,.1);width:var(--width);font-size:13px;display:flex;align-items:center;gap:6px}[data-notify-toast]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-notify-toast][data-y-position=top]{top:0;--y:translateY(-100%);--lift:1;--lift-amount:calc(1 * var(--gap))}[data-notify-toast][data-y-position=bottom]{bottom:0;--y:translateY(100%);--lift:-1;--lift-amount:calc(var(--lift) * var(--gap))}[data-notify-toast][data-styled=true] [data-description]{font-weight:400;line-height:1.4;color:#3f3f3f}[data-rich-colors=true][data-notify-toast][data-styled=true] [data-description]{color:inherit}[data-notify-toaster][data-notify-theme=dark] [data-description]{color:#e8e8e8}[data-notify-toast][data-styled=true] [data-title]{font-weight:500;line-height:1.5;color:inherit}[data-notify-toast][data-styled=true] [data-icon]{display:flex;height:16px;width:16px;position:relative;justify-content:flex-start;align-items:center;flex-shrink:0;margin-left:var(--toast-icon-margin-start);margin-right:var(--toast-icon-margin-end)}[data-notify-toast][data-promise=true] [data-icon]>svg{opacity:0;transform:scale(.8);transform-origin:center;animation:notify-fade-in .3s ease forwards}[data-notify-toast][data-styled=true] [data-icon]>*{flex-shrink:0}[data-notify-toast][data-styled=true] [data-icon] svg{margin-left:var(--toast-svg-margin-start);margin-right:var(--toast-svg-margin-end)}[data-notify-toast][data-styled=true] [data-content]{display:flex;flex-direction:column;gap:2px}[data-notify-toast][data-styled=true] [data-button]{border-radius:4px;padding-left:8px;padding-right:8px;height:24px;font-size:12px;color:var(--normal-bg);background:var(--normal-text);margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end);border:none;font-weight:500;cursor:pointer;outline:0;display:flex;align-items:center;flex-shrink:0;transition:opacity .4s,box-shadow .2s}[data-notify-toast][data-styled=true] [data-button]:focus-visible{box-shadow:0 0 0 2px rgba(0,0,0,.4)}[data-notify-toast][data-styled=true] [data-button]:first-of-type{margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end)}[data-notify-toast][data-styled=true] [data-cancel]{color:var(--normal-text);background:rgba(0,0,0,.08)}[data-notify-toaster][data-notify-theme=dark] [data-notify-toast][data-styled=true] [data-cancel]{background:rgba(255,255,255,.3)}[data-notify-toast][data-styled=true] [data-close-button]{position:absolute;left:var(--toast-close-button-start);right:var(--toast-close-button-end);top:0;height:20px;width:20px;display:flex;justify-content:center;align-items:center;padding:0;color:var(--normal-text);background:var(--normal-bg);border:1px solid var(--normal-border);transform:var(--toast-close-button-transform);border-radius:50%;cursor:pointer;z-index:1;transition:opacity .1s,background .2s,border-color .2s}[data-notify-toast][data-styled=true] [data-close-button]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-notify-toast][data-styled=true] [data-disabled=true]{cursor:not-allowed}[data-notify-toast][data-styled=true]:hover [data-close-button]:hover{background:var(--gray2);border-color:var(--gray5)}[data-notify-toast][data-swiping=true]::before{content:'';position:absolute;left:-100%;right:-100%;height:100%;z-index:-1}[data-notify-toast][data-y-position=top][data-swiping=true]::before{bottom:50%;transform:scaleY(3) translateY(50%)}[data-notify-toast][data-y-position=bottom][data-swiping=true]::before{top:50%;transform:scaleY(3) translateY(-50%)}[data-notify-toast][data-swiping=false][data-removed=true]::before{content:'';position:absolute;inset:0;transform:scaleY(2)}[data-notify-toast][data-expanded=true]::after{content:'';position:absolute;left:0;height:calc(var(--gap) + 1px);bottom:100%;width:100%}[data-notify-toast][data-mounted=true]{--y:translateY(0);opacity:1}[data-notify-toast][data-expanded=false][data-front=false]{--scale:var(--toasts-before) * 0.05 + 1;--y:translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));height:var(--front-toast-height)}[data-notify-toast]>*{transition:opacity .4s}[data-notify-toast][data-x-position=right]{right:0}[data-notify-toast][data-x-position=left]{left:0}[data-notify-toast][data-expanded=false][data-front=false][data-styled=true]>*{opacity:0}[data-notify-toast][data-visible=false]{opacity:0;pointer-events:none}[data-notify-toast][data-mounted=true][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset)));height:var(--initial-height)}[data-notify-toast][data-removed=true][data-front=true][data-swipe-out=false]{--y:translateY(calc(var(--lift) * -100%));opacity:0}[data-notify-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));opacity:0}[data-notify-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=false]{--y:translateY(40%);opacity:0;transition:transform .5s,opacity .2s}[data-notify-toast][data-removed=true][data-front=false]::before{height:calc(var(--initial-height) + 20%)}[data-notify-toast][data-swiping=true]{transform:var(--y) translateY(var(--swipe-amount-y,0)) translateX(var(--swipe-amount-x,0));transition:none}[data-notify-toast][data-swiped=true]{-webkit-user-select:none;user-select:none}[data-notify-toast][data-swipe-out=true][data-y-position=bottom],[data-notify-toast][data-swipe-out=true][data-y-position=top]{animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}[data-notify-toast][data-swipe-out=true][data-swipe-direction=left]{animation-name:swipe-out-left}[data-notify-toast][data-swipe-out=true][data-swipe-direction=right]{animation-name:swipe-out-right}[data-notify-toast][data-swipe-out=true][data-swipe-direction=up]{animation-name:swipe-out-up}[data-notify-toast][data-swipe-out=true][data-swipe-direction=down]{animation-name:swipe-out-down}@keyframes swipe-out-left{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) - 100%));opacity:0}}@keyframes swipe-out-right{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) + 100%));opacity:0}}@keyframes swipe-out-up{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) - 100%));opacity:0}}@keyframes swipe-out-down{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) + 100%));opacity:0}}@media (max-width:600px){[data-notify-toaster]{position:fixed;right:var(--mobile-offset-right);left:var(--mobile-offset-left);width:100%}[data-notify-toaster][dir=rtl]{left:calc(var(--mobile-offset-left) * -1)}[data-notify-toaster] [data-notify-toast]{left:0;right:0;width:calc(100% - var(--mobile-offset-left) * 2)}[data-notify-toaster][data-x-position=left]{left:var(--mobile-offset-left)}[data-notify-toaster][data-y-position=bottom]{bottom:var(--mobile-offset-bottom)}[data-notify-toaster][data-y-position=top]{top:var(--mobile-offset-top)}[data-notify-toaster][data-x-position=center]{left:var(--mobile-offset-left);right:var(--mobile-offset-right);transform:none}}[data-notify-toaster][data-notify-theme=light]{--normal-bg:#fff;--normal-border:var(--gray4);--normal-text:var(--gray12);--success-bg:hsl(143, 85%, 96%);--success-border:hsl(145, 92%, 87%);--success-text:hsl(140, 100%, 27%);--info-bg:hsl(208, 100%, 97%);--info-border:hsl(221, 91%, 93%);--info-text:hsl(210, 92%, 45%);--warning-bg:hsl(49, 100%, 97%);--warning-border:hsl(49, 91%, 84%);--warning-text:hsl(31, 92%, 45%);--error-bg:hsl(359, 100%, 97%);--error-border:hsl(359, 100%, 94%);--error-text:hsl(360, 100%, 45%)}[data-notify-toaster][data-notify-theme=light] [data-notify-toast][data-invert=true]{--normal-bg:#000;--normal-border:hsl(0, 0%, 20%);--normal-text:var(--gray1)}[data-notify-toaster][data-notify-theme=dark] [data-notify-toast][data-invert=true]{--normal-bg:#fff;--normal-border:var(--gray3);--normal-text:var(--gray12)}[data-notify-toaster][data-notify-theme=dark]{--normal-bg:#000;--normal-bg-hover:hsl(0, 0%, 12%);--normal-border:hsl(0, 0%, 20%);--normal-border-hover:hsl(0, 0%, 25%);--normal-text:var(--gray1);--success-bg:hsl(150, 100%, 6%);--success-border:hsl(147, 100%, 12%);--success-text:hsl(150, 86%, 65%);--info-bg:hsl(215, 100%, 6%);--info-border:hsl(223, 43%, 17%);--info-text:hsl(216, 87%, 65%);--warning-bg:hsl(64, 100%, 6%);--warning-border:hsl(60, 100%, 9%);--warning-text:hsl(46, 87%, 65%);--error-bg:hsl(358, 76%, 10%);--error-border:hsl(357, 89%, 16%);--error-text:hsl(358, 100%, 81%)}[data-notify-toaster][data-notify-theme=dark] [data-notify-toast] [data-close-button]{background:var(--normal-bg);border-color:var(--normal-border);color:var(--normal-text)}[data-notify-toaster][data-notify-theme=dark] [data-notify-toast] [data-close-button]:hover{background:var(--normal-bg-hover);border-color:var(--normal-border-hover)}[data-rich-colors=true][data-notify-toast][data-type=success]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-notify-toast][data-type=success] [data-close-button]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-notify-toast][data-type=info]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-notify-toast][data-type=info] [data-close-button]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-notify-toast][data-type=warning]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-notify-toast][data-type=warning] [data-close-button]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-notify-toast][data-type=error]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}[data-rich-colors=true][data-notify-toast][data-type=error] [data-close-button]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}.notify-loading-wrapper{--size:16px;height:var(--size);width:var(--size);position:absolute;inset:0;z-index:10}.notify-loading-wrapper[data-visible=false]{transform-origin:center;animation:notify-fade-out .2s ease forwards}.notify-spinner{position:relative;top:50%;left:50%;height:var(--size);width:var(--size)}.notify-loading-bar{animation:notify-spin 1.2s linear infinite;background:var(--gray11);border-radius:6px;height:8%;left:-10%;position:absolute;top:-3.9%;width:24%}.notify-loading-bar:first-child{animation-delay:-1.2s;transform:rotate(.0001deg) translate(146%)}.notify-loading-bar:nth-child(2){animation-delay:-1.1s;transform:rotate(30deg) translate(146%)}.notify-loading-bar:nth-child(3){animation-delay:-1s;transform:rotate(60deg) translate(146%)}.notify-loading-bar:nth-child(4){animation-delay:-.9s;transform:rotate(90deg) translate(146%)}.notify-loading-bar:nth-child(5){animation-delay:-.8s;transform:rotate(120deg) translate(146%)}.notify-loading-bar:nth-child(6){animation-delay:-.7s;transform:rotate(150deg) translate(146%)}.notify-loading-bar:nth-child(7){animation-delay:-.6s;transform:rotate(180deg) translate(146%)}.notify-loading-bar:nth-child(8){animation-delay:-.5s;transform:rotate(210deg) translate(146%)}.notify-loading-bar:nth-child(9){animation-delay:-.4s;transform:rotate(240deg) translate(146%)}.notify-loading-bar:nth-child(10){animation-delay:-.3s;transform:rotate(270deg) translate(146%)}.notify-loading-bar:nth-child(11){animation-delay:-.2s;transform:rotate(300deg) translate(146%)}.notify-loading-bar:nth-child(12){animation-delay:-.1s;transform:rotate(330deg) translate(146%)}@keyframes notify-fade-in{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}@keyframes notify-fade-out{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8)}}@keyframes notify-spin{0%{opacity:1}100%{opacity:.15}}@media (prefers-reduced-motion){.notify-loading-bar,[data-notify-toast],[data-notify-toast]>*{transition:none!important;animation:none!important}}.notify-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center;transition:opacity .2s,transform .2s}.notify-loader[data-visible=false]{opacity:0;transform:scale(.8) translate(-50%,-50%)}");
394
+
395
+ function isAction(action) {
396
+ return action.label !== undefined;
397
+ }
398
+
399
+ const Toast = (props)=>{
400
+ const { invert: ToasterInvert, toast, unstyled, interacting, setHeights, visibleToasts, heights, index, toasts, expanded, removeToast, defaultRichColors, closeButton: closeButtonFromToaster, style, cancelButtonStyle, actionButtonStyle, className = '', descriptionClassName = '', duration: durationFromToaster, position, gap, expandByDefault, classNames, icons, closeButtonAriaLabel = 'Close toast' } = props;
401
+ const [swipeDirection, setSwipeDirection] = React__default.default.useState(null);
402
+ const [swipeOutDirection, setSwipeOutDirection] = React__default.default.useState(null);
403
+ const [mounted, setMounted] = React__default.default.useState(false);
404
+ const [removed, setRemoved] = React__default.default.useState(false);
405
+ const [swiping, setSwiping] = React__default.default.useState(false);
406
+ const [swipeOut, setSwipeOut] = React__default.default.useState(false);
407
+ const [isSwiped, setIsSwiped] = React__default.default.useState(false);
408
+ const [offsetBeforeRemove, setOffsetBeforeRemove] = React__default.default.useState(0);
409
+ const [initialHeight, setInitialHeight] = React__default.default.useState(0);
410
+ const remainingTime = React__default.default.useRef(toast.duration || durationFromToaster || TOAST_LIFETIME);
411
+ const dragStartTime = React__default.default.useRef(null);
412
+ const toastRef = React__default.default.useRef(null);
413
+ const isFront = index === 0;
414
+ const isVisible = index + 1 <= visibleToasts;
415
+ const toastType = toast.type;
416
+ const dismissible = toast.dismissible !== false;
417
+ const toastClassname = toast.className || '';
418
+ const toastDescriptionClassname = toast.descriptionClassName || '';
419
+ const heightIndex = React__default.default.useMemo(()=>heights.findIndex((height)=>height.toastId === toast.id) || 0, [
420
+ heights,
421
+ toast.id
422
+ ]);
423
+ const closeButton = React__default.default.useMemo(()=>toast.closeButton ?? closeButtonFromToaster, [
424
+ toast.closeButton,
425
+ closeButtonFromToaster
426
+ ]);
427
+ const duration = React__default.default.useMemo(()=>toast.duration || durationFromToaster || TOAST_LIFETIME, [
428
+ toast.duration,
429
+ durationFromToaster
430
+ ]);
431
+ const closeTimerStartTimeRef = React__default.default.useRef(0);
432
+ const offset = React__default.default.useRef(0);
433
+ const lastCloseTimerStartTimeRef = React__default.default.useRef(0);
434
+ const pointerStartRef = React__default.default.useRef(null);
435
+ const [y, x] = position.split('-');
436
+ const toastsHeightBefore = React__default.default.useMemo(()=>{
437
+ return heights.reduce((prev, curr, reducerIndex)=>{
438
+ if (reducerIndex >= heightIndex) {
439
+ return prev;
440
+ }
441
+ return prev + curr.height;
442
+ }, 0);
443
+ }, [
444
+ heights,
445
+ heightIndex
446
+ ]);
447
+ const isDocumentHidden = useIsDocumentHidden();
448
+ const invert = toast.invert || ToasterInvert;
449
+ const disabled = toastType === 'loading';
450
+ offset.current = React__default.default.useMemo(()=>heightIndex * gap + toastsHeightBefore, [
451
+ heightIndex,
452
+ toastsHeightBefore
453
+ ]);
454
+ React__default.default.useEffect(()=>{
455
+ remainingTime.current = duration;
456
+ }, [
457
+ duration
458
+ ]);
459
+ React__default.default.useEffect(()=>{
460
+ setMounted(true);
461
+ }, []);
462
+ React__default.default.useEffect(()=>{
463
+ const toastNode = toastRef.current;
464
+ if (toastNode) {
465
+ const height = toastNode.getBoundingClientRect().height;
466
+ setInitialHeight(height);
467
+ setHeights((h)=>[
468
+ {
469
+ toastId: toast.id,
470
+ height,
471
+ position: toast.position
472
+ },
473
+ ...h
474
+ ]);
475
+ return ()=>setHeights((h)=>h.filter((height)=>height.toastId !== toast.id));
476
+ }
477
+ }, [
478
+ setHeights,
479
+ toast.id
480
+ ]);
481
+ React__default.default.useLayoutEffect(()=>{
482
+ if (!mounted) return;
483
+ const toastNode = toastRef.current;
484
+ const originalHeight = toastNode.style.height;
485
+ toastNode.style.height = 'auto';
486
+ const newHeight = toastNode.getBoundingClientRect().height;
487
+ toastNode.style.height = originalHeight;
488
+ setInitialHeight(newHeight);
489
+ setHeights((currentHeights)=>{
490
+ const alreadyExists = currentHeights.find((height)=>height.toastId === toast.id);
491
+ if (!alreadyExists) {
492
+ return [
493
+ {
494
+ toastId: toast.id,
495
+ height: newHeight,
496
+ position: toast.position
497
+ },
498
+ ...currentHeights
499
+ ];
500
+ }
501
+ return currentHeights.map((height)=>height.toastId === toast.id ? {
502
+ ...height,
503
+ height: newHeight
504
+ } : height);
505
+ });
506
+ }, [
507
+ mounted,
508
+ toast.title,
509
+ toast.description,
510
+ setHeights,
511
+ toast.id,
512
+ toast.jsx,
513
+ toast.action,
514
+ toast.cancel
515
+ ]);
516
+ const deleteToast = React__default.default.useCallback(()=>{
517
+ setRemoved(true);
518
+ setOffsetBeforeRemove(offset.current);
519
+ setHeights((h)=>h.filter((height)=>height.toastId !== toast.id));
520
+ setTimeout(()=>{
521
+ removeToast(toast);
522
+ }, TIME_BEFORE_UNMOUNT);
523
+ }, [
524
+ toast,
525
+ removeToast,
526
+ setHeights,
527
+ offset
528
+ ]);
529
+ React__default.default.useEffect(()=>{
530
+ if (toast.promise && toastType === 'loading' || toast.duration === Infinity || toast.type === 'loading') return;
531
+ let timeoutId;
532
+ const pauseTimer = ()=>{
533
+ if (lastCloseTimerStartTimeRef.current < closeTimerStartTimeRef.current) {
534
+ const elapsedTime = new Date().getTime() - closeTimerStartTimeRef.current;
535
+ remainingTime.current = remainingTime.current - elapsedTime;
536
+ }
537
+ lastCloseTimerStartTimeRef.current = new Date().getTime();
538
+ };
539
+ const startTimer = ()=>{
540
+ if (remainingTime.current === Infinity) return;
541
+ closeTimerStartTimeRef.current = new Date().getTime();
542
+ timeoutId = setTimeout(()=>{
543
+ toast.onAutoClose?.(toast);
544
+ deleteToast();
545
+ }, remainingTime.current);
546
+ };
547
+ if (expanded || interacting || isDocumentHidden) {
548
+ pauseTimer();
549
+ } else {
550
+ startTimer();
551
+ }
552
+ return ()=>clearTimeout(timeoutId);
553
+ }, [
554
+ expanded,
555
+ interacting,
556
+ toast,
557
+ toastType,
558
+ isDocumentHidden,
559
+ deleteToast
560
+ ]);
561
+ React__default.default.useEffect(()=>{
562
+ if (toast.delete) {
563
+ deleteToast();
564
+ toast.onDismiss?.(toast);
565
+ }
566
+ }, [
567
+ deleteToast,
568
+ toast.delete
569
+ ]);
570
+ function getLoadingIcon() {
571
+ if (icons?.loading) {
572
+ return /*#__PURE__*/ React__default.default.createElement("div", {
573
+ className: cn(classNames?.loader, toast?.classNames?.loader, 'notify-loader'),
574
+ "data-visible": toastType === 'loading'
575
+ }, icons.loading);
576
+ }
577
+ return /*#__PURE__*/ React__default.default.createElement(assetsClient.Loader, {
578
+ className: cn(classNames?.loader, toast?.classNames?.loader),
579
+ visible: toastType === 'loading'
580
+ });
581
+ }
582
+ const icon = toast.icon || icons?.[toastType] || assetsClient.getAsset(toastType);
583
+ return /*#__PURE__*/ React__default.default.createElement("li", {
584
+ tabIndex: 0,
585
+ ref: toastRef,
586
+ className: cn(className, toastClassname, classNames?.toast, toast?.classNames?.toast, classNames?.default, classNames?.[toastType], toast?.classNames?.[toastType]),
587
+ "data-notify-toast": "",
588
+ "data-rich-colors": toast.richColors ?? defaultRichColors,
589
+ "data-styled": !Boolean(toast.jsx || toast.unstyled || unstyled),
590
+ "data-mounted": mounted,
591
+ "data-promise": Boolean(toast.promise),
592
+ "data-swiped": isSwiped,
593
+ "data-removed": removed,
594
+ "data-visible": isVisible,
595
+ "data-y-position": y,
596
+ "data-x-position": x,
597
+ "data-index": index,
598
+ "data-front": isFront,
599
+ "data-swiping": swiping,
600
+ "data-dismissible": dismissible,
601
+ "data-type": toastType,
602
+ "data-invert": invert,
603
+ "data-swipe-out": swipeOut,
604
+ "data-swipe-direction": swipeOutDirection,
605
+ "data-expanded": Boolean(expanded || expandByDefault && mounted),
606
+ "data-testid": toast.testId,
607
+ style: {
608
+ '--index': index,
609
+ '--toasts-before': index,
610
+ '--z-index': toasts.length - index,
611
+ '--offset': `${removed ? offsetBeforeRemove : offset.current}px`,
612
+ '--initial-height': expandByDefault ? 'auto' : `${initialHeight}px`,
613
+ ...style,
614
+ ...toast.style
615
+ },
616
+ onDragEnd: ()=>{
617
+ setSwiping(false);
618
+ setSwipeDirection(null);
619
+ pointerStartRef.current = null;
620
+ },
621
+ onPointerDown: (event)=>{
622
+ if (event.button === 2) return;
623
+ if (disabled || !dismissible) return;
624
+ dragStartTime.current = new Date();
625
+ setOffsetBeforeRemove(offset.current);
626
+ event.target.setPointerCapture(event.pointerId);
627
+ if (event.target.tagName === 'BUTTON') return;
628
+ setSwiping(true);
629
+ pointerStartRef.current = {
630
+ x: event.clientX,
631
+ y: event.clientY
632
+ };
633
+ },
634
+ onPointerUp: ()=>{
635
+ if (swipeOut || !dismissible) return;
636
+ pointerStartRef.current = null;
637
+ const swipeAmountX = Number(toastRef.current?.style.getPropertyValue('--swipe-amount-x').replace('px', '') || 0);
638
+ const swipeAmountY = Number(toastRef.current?.style.getPropertyValue('--swipe-amount-y').replace('px', '') || 0);
639
+ const timeTaken = new Date().getTime() - dragStartTime.current?.getTime();
640
+ const swipeAmount = swipeDirection === 'x' ? swipeAmountX : swipeAmountY;
641
+ const velocity = Math.abs(swipeAmount) / timeTaken;
642
+ if (Math.abs(swipeAmount) >= SWIPE_THRESHOLD || velocity > 0.11) {
643
+ setOffsetBeforeRemove(offset.current);
644
+ toast.onDismiss?.(toast);
645
+ if (swipeDirection === 'x') {
646
+ setSwipeOutDirection(swipeAmountX > 0 ? 'right' : 'left');
647
+ } else {
648
+ setSwipeOutDirection(swipeAmountY > 0 ? 'down' : 'up');
649
+ }
650
+ deleteToast();
651
+ setSwipeOut(true);
652
+ return;
653
+ }
654
+ toastRef.current?.style.setProperty('--swipe-amount-x', '0px');
655
+ toastRef.current?.style.setProperty('--swipe-amount-y', '0px');
656
+ setIsSwiped(false);
657
+ setSwiping(false);
658
+ setSwipeDirection(null);
659
+ },
660
+ onPointerMove: (event)=>{
661
+ if (!pointerStartRef.current || !dismissible) return;
662
+ const isHighlighted = window.getSelection()?.toString().length > 0;
663
+ if (isHighlighted) return;
664
+ const yDelta = event.clientY - pointerStartRef.current.y;
665
+ const xDelta = event.clientX - pointerStartRef.current.x;
666
+ const swipeDirections = props.swipeDirections ?? getDefaultSwipeDirections(position);
667
+ if (!swipeDirection && (Math.abs(xDelta) > 1 || Math.abs(yDelta) > 1)) {
668
+ setSwipeDirection(Math.abs(xDelta) > Math.abs(yDelta) ? 'x' : 'y');
669
+ }
670
+ let swipeAmount = {
671
+ x: 0,
672
+ y: 0
673
+ };
674
+ const getDampening = (delta)=>{
675
+ const factor = Math.abs(delta) / 20;
676
+ return 1 / (1.5 + factor);
677
+ };
678
+ if (swipeDirection === 'y') {
679
+ if (swipeDirections.includes('top') || swipeDirections.includes('bottom')) {
680
+ if (swipeDirections.includes('top') && yDelta < 0 || swipeDirections.includes('bottom') && yDelta > 0) {
681
+ swipeAmount.y = yDelta;
682
+ } else {
683
+ const dampenedDelta = yDelta * getDampening(yDelta);
684
+ swipeAmount.y = Math.abs(dampenedDelta) < Math.abs(yDelta) ? dampenedDelta : yDelta;
685
+ }
686
+ }
687
+ } else if (swipeDirection === 'x') {
688
+ if (swipeDirections.includes('left') || swipeDirections.includes('right')) {
689
+ if (swipeDirections.includes('left') && xDelta < 0 || swipeDirections.includes('right') && xDelta > 0) {
690
+ swipeAmount.x = xDelta;
691
+ } else {
692
+ const dampenedDelta = xDelta * getDampening(xDelta);
693
+ swipeAmount.x = Math.abs(dampenedDelta) < Math.abs(xDelta) ? dampenedDelta : xDelta;
694
+ }
695
+ }
696
+ }
697
+ if (Math.abs(swipeAmount.x) > 0 || Math.abs(swipeAmount.y) > 0) {
698
+ setIsSwiped(true);
699
+ }
700
+ toastRef.current?.style.setProperty('--swipe-amount-x', `${swipeAmount.x}px`);
701
+ toastRef.current?.style.setProperty('--swipe-amount-y', `${swipeAmount.y}px`);
702
+ }
703
+ }, closeButton && !toast.jsx && toastType !== 'loading' ? /*#__PURE__*/ React__default.default.createElement("button", {
704
+ "aria-label": closeButtonAriaLabel,
705
+ "data-disabled": disabled,
706
+ "data-close-button": true,
707
+ onClick: disabled || !dismissible ? ()=>{} : ()=>{
708
+ deleteToast();
709
+ toast.onDismiss?.(toast);
710
+ },
711
+ className: cn(classNames?.closeButton, toast?.classNames?.closeButton)
712
+ }, icons?.close ?? assetsClient.CloseIcon) : null, (toastType || toast.icon || toast.promise) && toast.icon !== null && (icons?.[toastType] !== null || toast.icon) ? /*#__PURE__*/ React__default.default.createElement("div", {
713
+ "data-icon": "",
714
+ className: cn(classNames?.icon, toast?.classNames?.icon)
715
+ }, toast.promise || toast.type === 'loading' && !toast.icon ? toast.icon || getLoadingIcon() : null, toast.type !== 'loading' ? icon : null) : null, /*#__PURE__*/ React__default.default.createElement("div", {
716
+ "data-content": "",
717
+ className: cn(classNames?.content, toast?.classNames?.content)
718
+ }, /*#__PURE__*/ React__default.default.createElement("div", {
719
+ "data-title": "",
720
+ className: cn(classNames?.title, toast?.classNames?.title)
721
+ }, toast.jsx ? toast.jsx : typeof toast.title === 'function' ? toast.title() : toast.title), toast.description ? /*#__PURE__*/ React__default.default.createElement("div", {
722
+ "data-description": "",
723
+ className: cn(descriptionClassName, toastDescriptionClassname, classNames?.description, toast?.classNames?.description)
724
+ }, typeof toast.description === 'function' ? toast.description() : toast.description) : null), /*#__PURE__*/ React__default.default.isValidElement(toast.cancel) ? toast.cancel : toast.cancel && isAction(toast.cancel) ? /*#__PURE__*/ React__default.default.createElement("button", {
725
+ "data-button": true,
726
+ "data-cancel": true,
727
+ style: toast.cancelButtonStyle || cancelButtonStyle,
728
+ onClick: (event)=>{
729
+ if (!isAction(toast.cancel)) return;
730
+ if (!dismissible) return;
731
+ toast.cancel.onClick?.(event);
732
+ deleteToast();
733
+ },
734
+ className: cn(classNames?.cancelButton, toast?.classNames?.cancelButton)
735
+ }, toast.cancel.label) : null, /*#__PURE__*/ React__default.default.isValidElement(toast.action) ? toast.action : toast.action && isAction(toast.action) ? /*#__PURE__*/ React__default.default.createElement("button", {
736
+ "data-button": true,
737
+ "data-action": true,
738
+ style: toast.actionButtonStyle || actionButtonStyle,
739
+ onClick: (event)=>{
740
+ if (!isAction(toast.action)) return;
741
+ toast.action.onClick?.(event);
742
+ if (event.defaultPrevented) return;
743
+ deleteToast();
744
+ },
745
+ className: cn(classNames?.actionButton, toast?.classNames?.actionButton)
746
+ }, toast.action.label) : null);
747
+ };
748
+ const Toaster = /*#__PURE__*/ React__default.default.forwardRef(function Toaster(props, ref) {
749
+ const { id, invert, position = 'bottom-right', hotkey = [
750
+ 'altKey',
751
+ 'KeyT'
752
+ ], expand, closeButton, className, offset, mobileOffset, theme = 'light', richColors, duration, style, visibleToasts = VISIBLE_TOASTS_AMOUNT, toastOptions, dir = getDocumentDirection(), gap = GAP, icons, customAriaLabel, containerAriaLabel = 'Notifications' } = props;
753
+ const [toasts, setToasts] = React__default.default.useState([]);
754
+ const filteredToasts = React__default.default.useMemo(()=>{
755
+ if (id) {
756
+ return toasts.filter((toast)=>toast.toasterId === id);
757
+ }
758
+ return toasts.filter((toast)=>!toast.toasterId);
759
+ }, [
760
+ toasts,
761
+ id
762
+ ]);
763
+ const possiblePositions = React__default.default.useMemo(()=>{
764
+ return Array.from(new Set([
765
+ position
766
+ ].concat(filteredToasts.filter((toast)=>toast.position).map((toast)=>toast.position))));
767
+ }, [
768
+ filteredToasts,
769
+ position
770
+ ]);
771
+ const [heights, setHeights] = React__default.default.useState([]);
772
+ const [expanded, setExpanded] = React__default.default.useState(false);
773
+ const [interacting, setInteracting] = React__default.default.useState(false);
774
+ const [actualTheme, setActualTheme] = React__default.default.useState(theme !== 'system' ? theme : typeof window !== 'undefined' ? window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light' : 'light');
775
+ const listRef = React__default.default.useRef(null);
776
+ const hotkeyLabel = hotkey.join('+').replace(/Key/g, '').replace(/Digit/g, '');
777
+ const lastFocusedElementRef = React__default.default.useRef(null);
778
+ const isFocusWithinRef = React__default.default.useRef(false);
779
+ const removeToast = React__default.default.useCallback((toastToRemove)=>{
780
+ setToasts((currentToasts)=>{
781
+ if (!currentToasts.find((toast)=>toast.id === toastToRemove.id)?.delete) {
782
+ ToastState.dismiss(toastToRemove.id);
783
+ }
784
+ return currentToasts.filter(({ id: toastId })=>toastId !== toastToRemove.id);
785
+ });
786
+ }, []);
787
+ React__default.default.useEffect(()=>{
788
+ return ToastState.subscribe((toast)=>{
789
+ if (toast.dismiss) {
790
+ requestAnimationFrame(()=>{
791
+ setToasts((currentToasts)=>currentToasts.map((t)=>t.id === toast.id ? {
792
+ ...t,
793
+ delete: true
794
+ } : t));
795
+ });
796
+ return;
797
+ }
798
+ setTimeout(()=>{
799
+ ReactDOM__default.default.flushSync(()=>{
800
+ setToasts((currentToasts)=>{
801
+ const indexOfExistingToast = currentToasts.findIndex((t)=>t.id === toast.id);
802
+ if (indexOfExistingToast !== -1) {
803
+ return [
804
+ ...currentToasts.slice(0, indexOfExistingToast),
805
+ {
806
+ ...currentToasts[indexOfExistingToast],
807
+ ...toast
808
+ },
809
+ ...currentToasts.slice(indexOfExistingToast + 1)
810
+ ];
811
+ }
812
+ return [
813
+ toast,
814
+ ...currentToasts
815
+ ];
816
+ });
817
+ });
818
+ });
819
+ });
820
+ }, []);
821
+ React__default.default.useEffect(()=>{
822
+ if (theme !== 'system') {
823
+ setActualTheme(theme);
824
+ return;
825
+ }
826
+ if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
827
+ setActualTheme('dark');
828
+ } else {
829
+ setActualTheme('light');
830
+ }
831
+ if (typeof window === 'undefined') return;
832
+ const darkMediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
833
+ try {
834
+ darkMediaQuery.addEventListener('change', ({ matches })=>{
835
+ setActualTheme(matches ? 'dark' : 'light');
836
+ });
837
+ } catch (error) {
838
+ darkMediaQuery.addListener(({ matches })=>{
839
+ try {
840
+ setActualTheme(matches ? 'dark' : 'light');
841
+ } catch (listenerError) {
842
+ console.error(listenerError);
843
+ }
844
+ });
845
+ }
846
+ }, [
847
+ theme
848
+ ]);
849
+ React__default.default.useEffect(()=>{
850
+ if (toasts.length <= 1) {
851
+ setExpanded(false);
852
+ }
853
+ }, [
854
+ toasts
855
+ ]);
856
+ React__default.default.useEffect(()=>{
857
+ const handleKeyDown = (event)=>{
858
+ const isHotkeyPressed = hotkey.length > 0 && hotkey.every((key)=>event[key] || event.code === key);
859
+ if (isHotkeyPressed) {
860
+ setExpanded(true);
861
+ listRef.current?.focus();
862
+ }
863
+ if (event.code === 'Escape' && (document.activeElement === listRef.current || listRef.current?.contains(document.activeElement))) {
864
+ setExpanded(false);
865
+ }
866
+ };
867
+ document.addEventListener('keydown', handleKeyDown);
868
+ return ()=>document.removeEventListener('keydown', handleKeyDown);
869
+ }, [
870
+ hotkey
871
+ ]);
872
+ React__default.default.useEffect(()=>{
873
+ if (listRef.current) {
874
+ return ()=>{
875
+ if (lastFocusedElementRef.current) {
876
+ lastFocusedElementRef.current.focus({
877
+ preventScroll: true
878
+ });
879
+ lastFocusedElementRef.current = null;
880
+ isFocusWithinRef.current = false;
881
+ }
882
+ };
883
+ }
884
+ }, []);
885
+ return /*#__PURE__*/ React__default.default.createElement("section", {
886
+ ref: ref,
887
+ "aria-label": customAriaLabel ?? `${containerAriaLabel} ${hotkeyLabel}`,
888
+ tabIndex: -1,
889
+ "aria-live": "polite",
890
+ "aria-relevant": "additions text",
891
+ "aria-atomic": "false",
892
+ suppressHydrationWarning: true,
893
+ "data-react-aria-top-layer": true
894
+ }, possiblePositions.map((currentPosition, index)=>{
895
+ const [y, x] = currentPosition.split('-');
896
+ if (!filteredToasts.length) return null;
897
+ return /*#__PURE__*/ React__default.default.createElement("ol", {
898
+ key: currentPosition,
899
+ dir: dir === 'auto' ? getDocumentDirection() : dir,
900
+ tabIndex: -1,
901
+ ref: listRef,
902
+ className: className,
903
+ "data-notify-toaster": true,
904
+ "data-notify-theme": actualTheme,
905
+ "data-y-position": y,
906
+ "data-x-position": x,
907
+ style: {
908
+ '--front-toast-height': `${heights[0]?.height || 0}px`,
909
+ '--width': `${TOAST_WIDTH}px`,
910
+ '--gap': `${gap}px`,
911
+ ...style,
912
+ ...assignOffset(offset, mobileOffset)
913
+ },
914
+ onBlur: (event)=>{
915
+ if (isFocusWithinRef.current && !event.currentTarget.contains(event.relatedTarget)) {
916
+ isFocusWithinRef.current = false;
917
+ if (lastFocusedElementRef.current) {
918
+ lastFocusedElementRef.current.focus({
919
+ preventScroll: true
920
+ });
921
+ lastFocusedElementRef.current = null;
922
+ }
923
+ }
924
+ },
925
+ onFocus: (event)=>{
926
+ const isNotDismissible = event.target instanceof HTMLElement && event.target.dataset.dismissible === 'false';
927
+ if (isNotDismissible) return;
928
+ if (!isFocusWithinRef.current) {
929
+ isFocusWithinRef.current = true;
930
+ lastFocusedElementRef.current = event.relatedTarget;
931
+ }
932
+ },
933
+ onMouseEnter: ()=>setExpanded(true),
934
+ onMouseMove: ()=>setExpanded(true),
935
+ onMouseLeave: ()=>{
936
+ if (!interacting) {
937
+ setExpanded(false);
938
+ }
939
+ },
940
+ onDragEnd: ()=>setExpanded(false),
941
+ onPointerDown: (event)=>{
942
+ const isNotDismissible = event.target instanceof HTMLElement && event.target.dataset.dismissible === 'false';
943
+ if (isNotDismissible) return;
944
+ setInteracting(true);
945
+ },
946
+ onPointerUp: ()=>setInteracting(false)
947
+ }, filteredToasts.filter((toast)=>!toast.position && index === 0 || toast.position === currentPosition).map((toast, toastIndex)=>/*#__PURE__*/ React__default.default.createElement(Toast, {
948
+ key: toast.id,
949
+ icons: icons,
950
+ index: toastIndex,
951
+ toast: toast,
952
+ defaultRichColors: richColors,
953
+ duration: toastOptions?.duration ?? duration,
954
+ className: toastOptions?.className,
955
+ descriptionClassName: toastOptions?.descriptionClassName,
956
+ invert: invert,
957
+ visibleToasts: visibleToasts,
958
+ closeButton: toastOptions?.closeButton ?? closeButton,
959
+ interacting: interacting,
960
+ position: currentPosition,
961
+ style: toastOptions?.style,
962
+ unstyled: toastOptions?.unstyled,
963
+ classNames: toastOptions?.classNames,
964
+ cancelButtonStyle: toastOptions?.cancelButtonStyle,
965
+ actionButtonStyle: toastOptions?.actionButtonStyle,
966
+ closeButtonAriaLabel: toastOptions?.closeButtonAriaLabel,
967
+ removeToast: removeToast,
968
+ toasts: filteredToasts.filter((t)=>t.position == toast.position),
969
+ heights: heights.filter((h)=>h.position == toast.position),
970
+ setHeights: setHeights,
971
+ expandByDefault: expand,
972
+ gap: gap,
973
+ expanded: expanded,
974
+ swipeDirections: props.swipeDirections
975
+ })));
976
+ }));
977
+ });
978
+
979
+ exports.Toaster = Toaster;
980
+ exports.canUseDOM = canUseDOM;
981
+ exports.toast = toast;