@zag-js/toast 0.1.10 → 0.1.13
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/LICENSE +21 -0
- package/dist/index.d.ts +198 -8
- package/dist/index.js +166 -194
- package/dist/index.mjs +160 -198
- package/package.json +12 -11
- package/dist/toast-group.connect.d.ts +0 -24
- package/dist/toast-group.machine.d.ts +0 -2
- package/dist/toast.connect.d.ts +0 -17
- package/dist/toast.dom.d.ts +0 -26
- package/dist/toast.machine.d.ts +0 -2
- package/dist/toast.types.d.ts +0 -154
- package/dist/toast.utils.d.ts +0 -6
package/dist/index.js
CHANGED
|
@@ -1,37 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
-
var __defProps = Object.defineProperties;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
6
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
-
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
8
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
10
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
11
|
-
var __spreadValues = (a, b) => {
|
|
12
|
-
for (var prop in b || (b = {}))
|
|
13
|
-
if (__hasOwnProp.call(b, prop))
|
|
14
|
-
__defNormalProp(a, prop, b[prop]);
|
|
15
|
-
if (__getOwnPropSymbols)
|
|
16
|
-
for (var prop of __getOwnPropSymbols(b)) {
|
|
17
|
-
if (__propIsEnum.call(b, prop))
|
|
18
|
-
__defNormalProp(a, prop, b[prop]);
|
|
19
|
-
}
|
|
20
|
-
return a;
|
|
21
|
-
};
|
|
22
|
-
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
23
|
-
var __objRest = (source, exclude) => {
|
|
24
|
-
var target = {};
|
|
25
|
-
for (var prop in source)
|
|
26
|
-
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
27
|
-
target[prop] = source[prop];
|
|
28
|
-
if (source != null && __getOwnPropSymbols)
|
|
29
|
-
for (var prop of __getOwnPropSymbols(source)) {
|
|
30
|
-
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
31
|
-
target[prop] = source[prop];
|
|
32
|
-
}
|
|
33
|
-
return target;
|
|
34
|
-
};
|
|
35
6
|
var __export = (target, all) => {
|
|
36
7
|
for (var name in all)
|
|
37
8
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -57,29 +28,13 @@ __export(src_exports, {
|
|
|
57
28
|
module.exports = __toCommonJS(src_exports);
|
|
58
29
|
|
|
59
30
|
// ../../utilities/dom/dist/index.mjs
|
|
60
|
-
var __defProp2 = Object.defineProperty;
|
|
61
|
-
var __getOwnPropSymbols2 = Object.getOwnPropertySymbols;
|
|
62
|
-
var __hasOwnProp2 = Object.prototype.hasOwnProperty;
|
|
63
|
-
var __propIsEnum2 = Object.prototype.propertyIsEnumerable;
|
|
64
|
-
var __defNormalProp2 = (obj, key, value) => key in obj ? __defProp2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
65
|
-
var __spreadValues2 = (a, b) => {
|
|
66
|
-
for (var prop in b || (b = {}))
|
|
67
|
-
if (__hasOwnProp2.call(b, prop))
|
|
68
|
-
__defNormalProp2(a, prop, b[prop]);
|
|
69
|
-
if (__getOwnPropSymbols2)
|
|
70
|
-
for (var prop of __getOwnPropSymbols2(b)) {
|
|
71
|
-
if (__propIsEnum2.call(b, prop))
|
|
72
|
-
__defNormalProp2(a, prop, b[prop]);
|
|
73
|
-
}
|
|
74
|
-
return a;
|
|
75
|
-
};
|
|
76
31
|
var dataAttr = (guard) => {
|
|
77
32
|
return guard ? "" : void 0;
|
|
78
33
|
};
|
|
79
34
|
var MAX_Z_INDEX = 2147483647;
|
|
80
35
|
var runIfFn = (v, ...a) => {
|
|
81
36
|
const res = typeof v === "function" ? v(...a) : v;
|
|
82
|
-
return res
|
|
37
|
+
return res ?? void 0;
|
|
83
38
|
};
|
|
84
39
|
var cast = (v) => v;
|
|
85
40
|
var hasProp = (obj, prop) => Object.prototype.hasOwnProperty.call(obj, prop);
|
|
@@ -91,28 +46,27 @@ function isWindow(value) {
|
|
|
91
46
|
return (value == null ? void 0 : value.toString()) === "[object Window]";
|
|
92
47
|
}
|
|
93
48
|
function getDocument(el) {
|
|
94
|
-
var _a;
|
|
95
49
|
if (isWindow(el))
|
|
96
50
|
return el.document;
|
|
97
51
|
if (isDocument(el))
|
|
98
52
|
return el;
|
|
99
|
-
return (
|
|
53
|
+
return (el == null ? void 0 : el.ownerDocument) ?? document;
|
|
100
54
|
}
|
|
101
55
|
function defineDomHelpers(helpers) {
|
|
102
56
|
const dom2 = {
|
|
103
57
|
getRootNode: (ctx) => {
|
|
104
|
-
var _a, _b;
|
|
105
|
-
return (_b = (_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) != null ? _b : document;
|
|
106
|
-
},
|
|
107
|
-
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
108
|
-
getWin: (ctx) => {
|
|
109
58
|
var _a;
|
|
110
|
-
return (_a =
|
|
59
|
+
return ((_a = ctx.getRootNode) == null ? void 0 : _a.call(ctx)) ?? document;
|
|
111
60
|
},
|
|
61
|
+
getDoc: (ctx) => getDocument(dom2.getRootNode(ctx)),
|
|
62
|
+
getWin: (ctx) => dom2.getDoc(ctx).defaultView ?? window,
|
|
112
63
|
getActiveElement: (ctx) => dom2.getDoc(ctx).activeElement,
|
|
113
64
|
getById: (ctx, id) => dom2.getRootNode(ctx).getElementById(id)
|
|
114
65
|
};
|
|
115
|
-
return
|
|
66
|
+
return {
|
|
67
|
+
...dom2,
|
|
68
|
+
...helpers
|
|
69
|
+
};
|
|
116
70
|
}
|
|
117
71
|
var isRef = (v) => hasProp(v, "current");
|
|
118
72
|
function addDomEvent(target, eventName, handler, options) {
|
|
@@ -133,7 +87,7 @@ function trackDocumentVisibility(_doc, callback) {
|
|
|
133
87
|
// ../../utilities/core/dist/index.mjs
|
|
134
88
|
var runIfFn2 = (v, ...a) => {
|
|
135
89
|
const res = typeof v === "function" ? v(...a) : v;
|
|
136
|
-
return res
|
|
90
|
+
return res ?? void 0;
|
|
137
91
|
};
|
|
138
92
|
var uuid = /* @__PURE__ */ (() => {
|
|
139
93
|
let id = 0;
|
|
@@ -145,7 +99,7 @@ var uuid = /* @__PURE__ */ (() => {
|
|
|
145
99
|
function warn(...a) {
|
|
146
100
|
const m = a.length === 1 ? a[0] : a[1];
|
|
147
101
|
const c = a.length === 2 ? a[0] : true;
|
|
148
|
-
if (c &&
|
|
102
|
+
if (c && process.env.NODE_ENV !== "production") {
|
|
149
103
|
console.warn(m);
|
|
150
104
|
}
|
|
151
105
|
}
|
|
@@ -158,6 +112,7 @@ var dom = defineDomHelpers({
|
|
|
158
112
|
getGroupId: (placement) => `toast-group:${placement}`,
|
|
159
113
|
getContainerId: (ctx) => `toast:${ctx.id}`,
|
|
160
114
|
getTitleId: (ctx) => `toast-title:${ctx.id}`,
|
|
115
|
+
getDescriptionId: (ctx) => `toast-description:${ctx.id}`,
|
|
161
116
|
getCloseButtonId: (ctx) => `toast-close-button:${ctx.id}`,
|
|
162
117
|
getPortalId: (ctx) => `toast-portal:${ctx.id}`,
|
|
163
118
|
getPortalEl: (ctx) => dom.getDoc(ctx).getElementById(dom.getPortalId(ctx)),
|
|
@@ -189,7 +144,7 @@ var defaultTimeouts = {
|
|
|
189
144
|
custom: 5e3
|
|
190
145
|
};
|
|
191
146
|
function getToastDuration(duration, type) {
|
|
192
|
-
return duration
|
|
147
|
+
return duration ?? defaultTimeouts[type];
|
|
193
148
|
}
|
|
194
149
|
function getGroupPlacementStyle(ctx, placement) {
|
|
195
150
|
const offset = ctx.offsets;
|
|
@@ -248,7 +203,7 @@ function groupConnect(state, send, normalize) {
|
|
|
248
203
|
const id = options.id ? options.id : uid;
|
|
249
204
|
if (group2.isVisible(id))
|
|
250
205
|
return;
|
|
251
|
-
send({ type: "ADD_TOAST", toast:
|
|
206
|
+
send({ type: "ADD_TOAST", toast: { ...options, id } });
|
|
252
207
|
return id;
|
|
253
208
|
},
|
|
254
209
|
upsert(options) {
|
|
@@ -299,13 +254,13 @@ function groupConnect(state, send, normalize) {
|
|
|
299
254
|
return group2.upsert(options);
|
|
300
255
|
},
|
|
301
256
|
promise(promise, options, shared = {}) {
|
|
302
|
-
const id = group2.loading(
|
|
257
|
+
const id = group2.loading({ ...shared, ...options.loading });
|
|
303
258
|
promise.then((response) => {
|
|
304
259
|
const successOptions = runIfFn2(options.success, response);
|
|
305
|
-
group2.success(
|
|
260
|
+
group2.success({ ...shared, ...successOptions, id });
|
|
306
261
|
}).catch((error) => {
|
|
307
262
|
const errorOptions = runIfFn2(options.error, error);
|
|
308
|
-
group2.error(
|
|
263
|
+
group2.error({ ...shared, ...errorOptions, id });
|
|
309
264
|
});
|
|
310
265
|
return promise;
|
|
311
266
|
},
|
|
@@ -361,147 +316,151 @@ var import_core3 = require("@zag-js/core");
|
|
|
361
316
|
var import_core2 = require("@zag-js/core");
|
|
362
317
|
var { not, and, or } = import_core2.guards;
|
|
363
318
|
function createToastMachine(options = {}) {
|
|
364
|
-
const
|
|
319
|
+
const { type = "info", duration, id = "toast", placement = "bottom", removeDelay = 500, ...rest } = options;
|
|
365
320
|
const __duration = getToastDuration(duration, type);
|
|
366
|
-
return (0, import_core2.createMachine)(
|
|
367
|
-
|
|
368
|
-
entry: "invokeOnOpen",
|
|
369
|
-
initial: type === "loading" ? "persist" : "active",
|
|
370
|
-
context: __spreadValues({
|
|
321
|
+
return (0, import_core2.createMachine)(
|
|
322
|
+
{
|
|
371
323
|
id,
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
target: "persist",
|
|
384
|
-
actions: ["setContext", "invokeOnUpdate"]
|
|
385
|
-
},
|
|
386
|
-
{
|
|
387
|
-
guard: or("hasDurationChanged", "hasTypeChanged"),
|
|
388
|
-
target: "active:temp",
|
|
389
|
-
actions: ["setContext", "invokeOnUpdate"]
|
|
390
|
-
},
|
|
391
|
-
{
|
|
392
|
-
actions: ["setContext", "invokeOnUpdate"]
|
|
393
|
-
}
|
|
394
|
-
]
|
|
395
|
-
},
|
|
396
|
-
states: {
|
|
397
|
-
"active:temp": {
|
|
398
|
-
tags: ["visible", "updating"],
|
|
399
|
-
after: {
|
|
400
|
-
0: "active"
|
|
401
|
-
}
|
|
324
|
+
entry: "invokeOnOpen",
|
|
325
|
+
initial: type === "loading" ? "persist" : "active",
|
|
326
|
+
context: {
|
|
327
|
+
id,
|
|
328
|
+
type,
|
|
329
|
+
remaining: __duration,
|
|
330
|
+
duration: __duration,
|
|
331
|
+
removeDelay,
|
|
332
|
+
createdAt: Date.now(),
|
|
333
|
+
placement,
|
|
334
|
+
...rest
|
|
402
335
|
},
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
target: "active",
|
|
410
|
-
actions: ["setCreatedAt"]
|
|
336
|
+
on: {
|
|
337
|
+
UPDATE: [
|
|
338
|
+
{
|
|
339
|
+
guard: and("hasTypeChanged", "isChangingToLoading"),
|
|
340
|
+
target: "persist",
|
|
341
|
+
actions: ["setContext", "invokeOnUpdate"]
|
|
411
342
|
},
|
|
412
|
-
|
|
413
|
-
|
|
343
|
+
{
|
|
344
|
+
guard: or("hasDurationChanged", "hasTypeChanged"),
|
|
345
|
+
target: "active:temp",
|
|
346
|
+
actions: ["setContext", "invokeOnUpdate"]
|
|
347
|
+
},
|
|
348
|
+
{
|
|
349
|
+
actions: ["setContext", "invokeOnUpdate"]
|
|
350
|
+
}
|
|
351
|
+
]
|
|
414
352
|
},
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
353
|
+
states: {
|
|
354
|
+
"active:temp": {
|
|
355
|
+
tags: ["visible", "updating"],
|
|
356
|
+
after: {
|
|
357
|
+
0: "active"
|
|
358
|
+
}
|
|
420
359
|
},
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
360
|
+
persist: {
|
|
361
|
+
tags: ["visible", "paused"],
|
|
362
|
+
activities: "trackDocumentVisibility",
|
|
363
|
+
on: {
|
|
364
|
+
RESUME: {
|
|
365
|
+
guard: not("isLoadingType"),
|
|
366
|
+
target: "active",
|
|
367
|
+
actions: ["setCreatedAt"]
|
|
368
|
+
},
|
|
369
|
+
DISMISS: "dismissing"
|
|
426
370
|
}
|
|
427
|
-
}
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
371
|
+
},
|
|
372
|
+
active: {
|
|
373
|
+
tags: ["visible"],
|
|
374
|
+
activities: "trackDocumentVisibility",
|
|
375
|
+
after: {
|
|
376
|
+
VISIBLE_DURATION: "dismissing"
|
|
377
|
+
},
|
|
378
|
+
on: {
|
|
379
|
+
DISMISS: "dismissing",
|
|
380
|
+
PAUSE: {
|
|
381
|
+
target: "persist",
|
|
382
|
+
actions: "setRemainingDuration"
|
|
383
|
+
}
|
|
384
|
+
}
|
|
385
|
+
},
|
|
386
|
+
dismissing: {
|
|
387
|
+
entry: "invokeOnClosing",
|
|
388
|
+
after: {
|
|
389
|
+
REMOVE_DELAY: {
|
|
390
|
+
target: "inactive",
|
|
391
|
+
actions: "notifyParentToRemove"
|
|
392
|
+
}
|
|
435
393
|
}
|
|
394
|
+
},
|
|
395
|
+
inactive: {
|
|
396
|
+
entry: "invokeOnClose",
|
|
397
|
+
type: "final"
|
|
436
398
|
}
|
|
437
|
-
},
|
|
438
|
-
inactive: {
|
|
439
|
-
entry: "invokeOnClose",
|
|
440
|
-
type: "final"
|
|
441
|
-
}
|
|
442
|
-
}
|
|
443
|
-
}, {
|
|
444
|
-
activities: {
|
|
445
|
-
trackDocumentVisibility(ctx, _evt, { send }) {
|
|
446
|
-
if (!ctx.pauseOnPageIdle)
|
|
447
|
-
return;
|
|
448
|
-
return trackDocumentVisibility(dom.getDoc(ctx), function(hidden) {
|
|
449
|
-
send(hidden ? "PAUSE" : "RESUME");
|
|
450
|
-
});
|
|
451
399
|
}
|
|
452
400
|
},
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
},
|
|
463
|
-
hasDurationChanged: (ctx, evt) => {
|
|
464
|
-
var _a2;
|
|
465
|
-
return ((_a2 = evt.toast) == null ? void 0 : _a2.duration) !== ctx.duration;
|
|
466
|
-
}
|
|
467
|
-
},
|
|
468
|
-
delays: {
|
|
469
|
-
VISIBLE_DURATION: (ctx) => ctx.remaining,
|
|
470
|
-
REMOVE_DELAY: (ctx) => ctx.removeDelay
|
|
471
|
-
},
|
|
472
|
-
actions: {
|
|
473
|
-
setRemainingDuration(ctx) {
|
|
474
|
-
ctx.remaining -= Date.now() - ctx.createdAt;
|
|
475
|
-
},
|
|
476
|
-
setCreatedAt(ctx) {
|
|
477
|
-
ctx.createdAt = Date.now();
|
|
478
|
-
},
|
|
479
|
-
notifyParentToRemove(_ctx, _evt, { self }) {
|
|
480
|
-
self.sendParent({ type: "REMOVE_TOAST", id: self.id });
|
|
481
|
-
},
|
|
482
|
-
invokeOnClosing(ctx) {
|
|
483
|
-
var _a2;
|
|
484
|
-
(_a2 = ctx.onClosing) == null ? void 0 : _a2.call(ctx);
|
|
485
|
-
},
|
|
486
|
-
invokeOnClose(ctx) {
|
|
487
|
-
var _a2;
|
|
488
|
-
(_a2 = ctx.onClose) == null ? void 0 : _a2.call(ctx);
|
|
401
|
+
{
|
|
402
|
+
activities: {
|
|
403
|
+
trackDocumentVisibility(ctx, _evt, { send }) {
|
|
404
|
+
if (!ctx.pauseOnPageIdle)
|
|
405
|
+
return;
|
|
406
|
+
return trackDocumentVisibility(dom.getDoc(ctx), function(hidden) {
|
|
407
|
+
send(hidden ? "PAUSE" : "RESUME");
|
|
408
|
+
});
|
|
409
|
+
}
|
|
489
410
|
},
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
411
|
+
guards: {
|
|
412
|
+
isChangingToLoading: (_, evt) => {
|
|
413
|
+
var _a;
|
|
414
|
+
return ((_a = evt.toast) == null ? void 0 : _a.type) === "loading";
|
|
415
|
+
},
|
|
416
|
+
isLoadingType: (ctx) => ctx.type === "loading",
|
|
417
|
+
hasTypeChanged: (ctx, evt) => {
|
|
418
|
+
var _a;
|
|
419
|
+
return ((_a = evt.toast) == null ? void 0 : _a.type) !== ctx.type;
|
|
420
|
+
},
|
|
421
|
+
hasDurationChanged: (ctx, evt) => {
|
|
422
|
+
var _a;
|
|
423
|
+
return ((_a = evt.toast) == null ? void 0 : _a.duration) !== ctx.duration;
|
|
424
|
+
}
|
|
493
425
|
},
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
(
|
|
426
|
+
delays: {
|
|
427
|
+
VISIBLE_DURATION: (ctx) => ctx.remaining,
|
|
428
|
+
REMOVE_DELAY: (ctx) => ctx.removeDelay
|
|
497
429
|
},
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
430
|
+
actions: {
|
|
431
|
+
setRemainingDuration(ctx) {
|
|
432
|
+
ctx.remaining -= Date.now() - ctx.createdAt;
|
|
433
|
+
},
|
|
434
|
+
setCreatedAt(ctx) {
|
|
435
|
+
ctx.createdAt = Date.now();
|
|
436
|
+
},
|
|
437
|
+
notifyParentToRemove(_ctx, _evt, { self }) {
|
|
438
|
+
self.sendParent({ type: "REMOVE_TOAST", id: self.id });
|
|
439
|
+
},
|
|
440
|
+
invokeOnClosing(ctx) {
|
|
441
|
+
var _a;
|
|
442
|
+
(_a = ctx.onClosing) == null ? void 0 : _a.call(ctx);
|
|
443
|
+
},
|
|
444
|
+
invokeOnClose(ctx) {
|
|
445
|
+
var _a;
|
|
446
|
+
(_a = ctx.onClose) == null ? void 0 : _a.call(ctx);
|
|
447
|
+
},
|
|
448
|
+
invokeOnOpen(ctx) {
|
|
449
|
+
var _a;
|
|
450
|
+
(_a = ctx.onOpen) == null ? void 0 : _a.call(ctx);
|
|
451
|
+
},
|
|
452
|
+
invokeOnUpdate(ctx) {
|
|
453
|
+
var _a;
|
|
454
|
+
(_a = ctx.onUpdate) == null ? void 0 : _a.call(ctx);
|
|
455
|
+
},
|
|
456
|
+
setContext(ctx, evt) {
|
|
457
|
+
const { duration: duration2, type: type2 } = evt.toast;
|
|
458
|
+
const time = getToastDuration(duration2, type2);
|
|
459
|
+
Object.assign(ctx, { ...evt.toast, duration: time, remaining: time });
|
|
460
|
+
}
|
|
502
461
|
}
|
|
503
462
|
}
|
|
504
|
-
|
|
463
|
+
);
|
|
505
464
|
}
|
|
506
465
|
|
|
507
466
|
// src/toast-group.machine.ts
|
|
@@ -509,7 +468,7 @@ function groupMachine(ctx) {
|
|
|
509
468
|
return (0, import_core3.createMachine)({
|
|
510
469
|
id: "toaster",
|
|
511
470
|
initial: "active",
|
|
512
|
-
context:
|
|
471
|
+
context: {
|
|
513
472
|
dir: "ltr",
|
|
514
473
|
max: Number.MAX_SAFE_INTEGER,
|
|
515
474
|
toasts: [],
|
|
@@ -517,8 +476,9 @@ function groupMachine(ctx) {
|
|
|
517
476
|
zIndex: MAX_Z_INDEX,
|
|
518
477
|
pauseOnPageIdle: false,
|
|
519
478
|
pauseOnInteraction: true,
|
|
520
|
-
offsets: { left: "0px", right: "0px", top: "0px", bottom: "0px" }
|
|
521
|
-
|
|
479
|
+
offsets: { left: "0px", right: "0px", top: "0px", bottom: "0px" },
|
|
480
|
+
...ctx
|
|
481
|
+
},
|
|
522
482
|
computed: {
|
|
523
483
|
count: (ctx2) => ctx2.toasts.length
|
|
524
484
|
},
|
|
@@ -547,13 +507,13 @@ function groupMachine(ctx) {
|
|
|
547
507
|
ADD_TOAST: {
|
|
548
508
|
guard: (ctx2) => ctx2.toasts.length < ctx2.max,
|
|
549
509
|
actions: (ctx2, evt, { self }) => {
|
|
550
|
-
|
|
551
|
-
|
|
510
|
+
const options = {
|
|
511
|
+
...evt.toast,
|
|
552
512
|
pauseOnPageIdle: ctx2.pauseOnPageIdle,
|
|
553
513
|
pauseOnInteraction: ctx2.pauseOnInteraction,
|
|
554
514
|
dir: ctx2.dir,
|
|
555
|
-
|
|
556
|
-
}
|
|
515
|
+
getRootNode: ctx2.getRootNode
|
|
516
|
+
};
|
|
557
517
|
const toast = createToastMachine(options);
|
|
558
518
|
const actor = self.spawn(toast);
|
|
559
519
|
ctx2.toasts.push(actor);
|
|
@@ -604,6 +564,7 @@ function connect(state, send, normalize) {
|
|
|
604
564
|
return {
|
|
605
565
|
type: state.context.type,
|
|
606
566
|
title: state.context.title,
|
|
567
|
+
description: state.context.description,
|
|
607
568
|
placement,
|
|
608
569
|
isVisible,
|
|
609
570
|
isPaused,
|
|
@@ -676,6 +637,10 @@ function connect(state, send, normalize) {
|
|
|
676
637
|
"data-part": "title",
|
|
677
638
|
id: dom.getTitleId(state.context)
|
|
678
639
|
}),
|
|
640
|
+
descriptionProps: normalize.element({
|
|
641
|
+
"data-part": "description",
|
|
642
|
+
id: dom.getDescriptionId(state.context)
|
|
643
|
+
}),
|
|
679
644
|
closeButtonProps: normalize.button({
|
|
680
645
|
id: dom.getCloseButtonId(state.context),
|
|
681
646
|
"data-part": "close-button",
|
|
@@ -714,3 +679,10 @@ function api() {
|
|
|
714
679
|
return toaster;
|
|
715
680
|
}
|
|
716
681
|
}
|
|
682
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
683
|
+
0 && (module.exports = {
|
|
684
|
+
api,
|
|
685
|
+
connect,
|
|
686
|
+
createMachine,
|
|
687
|
+
group
|
|
688
|
+
});
|