feather-toast-vue 3.0.1 → 3.0.2
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.
|
@@ -394,15 +394,16 @@
|
|
|
394
394
|
}
|
|
395
395
|
|
|
396
396
|
/* ============================================
|
|
397
|
-
Mobile — compact
|
|
398
|
-
actions drop to their own
|
|
397
|
+
Mobile — compact centered pill that shrinks to its
|
|
398
|
+
content, safe-area aware; actions drop to their own
|
|
399
|
+
row so text keeps its width
|
|
399
400
|
============================================ */
|
|
400
401
|
@media (max-width: 600px) {
|
|
401
402
|
.toast-viewport {
|
|
402
403
|
--toast-edge: 12px;
|
|
403
|
-
--toast-radius:
|
|
404
|
-
--toast-gap:
|
|
405
|
-
--toast-peek:
|
|
404
|
+
--toast-radius: 18px;
|
|
405
|
+
--toast-gap: 6px;
|
|
406
|
+
--toast-peek: 6px;
|
|
406
407
|
left: max(var(--toast-edge), env(safe-area-inset-left));
|
|
407
408
|
right: max(var(--toast-edge), env(safe-area-inset-right));
|
|
408
409
|
width: auto;
|
|
@@ -412,26 +413,34 @@
|
|
|
412
413
|
.toast-viewport[data-y='top'] { top: max(var(--toast-edge), env(safe-area-inset-top)); }
|
|
413
414
|
.toast-viewport[data-y='bottom'] { bottom: max(var(--toast-edge), env(safe-area-inset-bottom)); }
|
|
414
415
|
|
|
416
|
+
/* Shrink-to-fit, centered between left: 0 / right: 0 */
|
|
417
|
+
.toast-card {
|
|
418
|
+
width: fit-content;
|
|
419
|
+
max-width: 100%;
|
|
420
|
+
margin-inline: auto;
|
|
421
|
+
}
|
|
422
|
+
|
|
415
423
|
.toast-content {
|
|
416
424
|
flex-wrap: wrap;
|
|
417
|
-
|
|
418
|
-
|
|
425
|
+
align-items: center;
|
|
426
|
+
gap: 6px 8px;
|
|
427
|
+
padding: 8px 12px;
|
|
419
428
|
}
|
|
420
429
|
.toast-icon,
|
|
421
|
-
.toast-spinner { width:
|
|
430
|
+
.toast-spinner { width: 13px; height: 13px; margin-top: 0; }
|
|
422
431
|
|
|
423
|
-
.toast-title { font-size:
|
|
424
|
-
.toast-description { margin-top: 1px; font-size:
|
|
432
|
+
.toast-title { font-size: 12px; line-height: 1.35; }
|
|
433
|
+
.toast-description { margin-top: 1px; font-size: 11.5px; line-height: 1.35; }
|
|
425
434
|
|
|
426
435
|
.toast-actions {
|
|
427
436
|
order: 1;
|
|
428
437
|
flex-basis: 100%;
|
|
429
438
|
justify-content: flex-end;
|
|
430
439
|
}
|
|
431
|
-
.toast-action-btn { padding:
|
|
440
|
+
.toast-action-btn { padding: 3px 10px; font-size: 11.5px; border-radius: 999px; }
|
|
432
441
|
|
|
433
|
-
.toast-close { width:
|
|
434
|
-
.toast-close svg { width:
|
|
442
|
+
.toast-close { width: 20px; height: 20px; margin: -2px -6px -2px 0; }
|
|
443
|
+
.toast-close svg { width: 9px; height: 9px; }
|
|
435
444
|
}
|
|
436
445
|
|
|
437
446
|
/* ============================================
|
package/dist/feather-toast.es.js
CHANGED
|
@@ -685,7 +685,7 @@ var ie = Q, ae = [
|
|
|
685
685
|
"onPointerdown"
|
|
686
686
|
])), 64))])])) : a("", !0);
|
|
687
687
|
}
|
|
688
|
-
}), ve = ":root{--toast-bg:#fff;--toast-border:#00000014;--toast-text:#09090b;--toast-text-muted:#71717a;--toast-hover:#f4f4f5;--toast-shadow:0 4px 12px #00000014;--toast-radius:10px;--toast-width:356px;--toast-gap:14px;--toast-peek:14px;--toast-edge:24px;--toast-z:99999;--toast-c-success:#16a34a;--toast-c-error:#dc2626;--toast-c-warning:#d97706;--toast-c-info:#2563eb;--toast-c-muted:#71717a;--toast-c-offline:#6b7280;--toast-c-update:#8b5cf6;--toast-ease:cubic-bezier(.21, 1.02, .73, 1);--toast-duration:.4s}.toast-viewport[data-theme=dark]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}@media (prefers-color-scheme:dark){.toast-viewport[data-theme=system]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}}.toast-viewport[data-rich] .toast-card--success{--toast-bg:#ecfdf3;--toast-border:#bffcd9;--toast-text:#008a2e}.toast-viewport[data-rich] .toast-card--error{--toast-bg:#fff0f0;--toast-border:#ffe0e1;--toast-text:#e60000}.toast-viewport[data-rich] .toast-card--warning{--toast-bg:#fffcf0;--toast-border:#fdf5d3;--toast-text:#dc7609}.toast-viewport[data-rich] .toast-card--info{--toast-bg:#f0f8ff;--toast-border:#d3e0fd;--toast-text:#0973dc}.toast-viewport[data-rich] .toast-card--update{--toast-bg:#f5f3ff;--toast-border:#e4defe;--toast-text:#6d28d9}.toast-viewport[data-rich][data-theme=dark] .toast-card--success{--toast-bg:#001f0f;--toast-border:#003d1c;--toast-text:#59f3a6}.toast-viewport[data-rich][data-theme=dark] .toast-card--error{--toast-bg:#2d0607;--toast-border:#4d0408;--toast-text:#ff9ea1}.toast-viewport[data-rich][data-theme=dark] .toast-card--warning{--toast-bg:#1d1f00;--toast-border:#3d3d00;--toast-text:#f3cf58}.toast-viewport[data-rich][data-theme=dark] .toast-card--info{--toast-bg:#000d1f;--toast-border:#00113d;--toast-text:#5896f3}.toast-viewport[data-rich][data-theme=dark] .toast-card--update{--toast-bg:#170b2e;--toast-border:#2e1a5c;--toast-text:#c4b5fd}.toast-viewport[data-rich] .toast-description{color:var(--toast-text);opacity:.8}.toast-viewport{--lift:-1;z-index:var(--toast-z);width:var(--toast-width);max-width:calc(100vw - var(--toast-edge) * 2);height:0;margin:0;padding:0;font-family:inherit;list-style:none;position:fixed}.toast-viewport[data-y=top]{--lift:1;top:var(--toast-edge)}.toast-viewport[data-y=bottom]{--lift:-1;bottom:var(--toast-edge)}.toast-viewport--top-right,.toast-viewport--bottom-right{right:var(--toast-edge)}.toast-viewport--top-left,.toast-viewport--bottom-left{left:var(--toast-edge)}.toast-viewport--top-center,.toast-viewport--bottom-center{left:50%;transform:translate(-50%)}.toast-card{--y:calc(var(--lift) * -100%);--s:1;z-index:calc(1000 - var(--index,0));height:var(--h,auto);box-sizing:border-box;background:var(--toast-bg);border-radius:var(--toast-radius);box-shadow:0 0 0 1px var(--toast-border), var(--toast-shadow);color:var(--toast-text);opacity:0;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y;transform:translate3d(var(--swipe-x,0px), var(--y), 0) scale(var(--s));transition:transform var(--toast-duration) var(--toast-ease), opacity var(--toast-duration) var(--toast-ease), height var(--toast-duration) var(--toast-ease), box-shadow .2s ease;will-change:transform, opacity;outline:none;margin:0;position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card{transform-origin:bottom;bottom:0}.toast-viewport[data-y=top] .toast-card{transform-origin:top;top:0}.toast-card:focus-visible{box-shadow:0 0 0 1px var(--toast-border), 0 0 0 3px #71717a59, var(--toast-shadow)}.toast-card:after{content:\"\";height:calc(var(--toast-gap) + 1px);position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card:after{bottom:100%}.toast-viewport[data-y=top] .toast-card:after{top:100%}.toast-card[data-mounted]{--y:calc(var(--lift) * var(--index) * var(--toast-peek));--s:calc(1 - var(--index) * .05);opacity:1}.toast-viewport:not([data-expanded]) .toast-card:not([data-front]){height:var(--front-h);overflow:hidden}.toast-viewport:not([data-expanded]) .toast-card:not([data-front])>*{opacity:0}.toast-viewport[data-expanded] .toast-card[data-mounted]{--y:calc(var(--lift) * (var(--offset) + var(--index) * var(--toast-gap)));--s:1}.toast-card[data-mounted]:not([data-visible]){opacity:0;pointer-events:none}.toast-card[data-swiping]{opacity:calc(1 - var(--swipe-amount,0) * .8);transition:opacity 0s, height var(--toast-duration) var(--toast-ease);cursor:grabbing}.toast-viewport .toast-card[data-mounted].toast-leave-active{pointer-events:none}.toast-viewport .toast-card[data-mounted].toast-leave-to{opacity:0}.toast-viewport .toast-card[data-mounted][data-front].toast-leave-to:not([data-swiped]){--y:calc(var(--lift) * -100%)}.toast-viewport .toast-card[data-mounted]:not([data-front]).toast-leave-to{--s:calc(1 - var(--index) * .05 - .05)}.toast-content{transition:opacity var(--toast-duration) var(--toast-ease);align-items:flex-start;gap:10px;padding:14px 16px;display:flex}.toast-icon,.toast-spinner{flex-shrink:0;width:16px;height:16px;margin-top:1px}.toast-icon--success{color:var(--toast-c-success)}.toast-icon--error{color:var(--toast-c-error)}.toast-icon--warning{color:var(--toast-c-warning)}.toast-icon--info{color:var(--toast-c-info)}.toast-icon--offline{color:var(--toast-c-offline)}.toast-icon--update{color:var(--toast-c-update)}.toast-viewport[data-rich] .toast-icon{color:currentColor}.toast-icon{animation:toast-icon-in .3s var(--toast-ease)}@keyframes toast-icon-in{0%{opacity:0;transform:scale(.6)}}@keyframes toast-spin{to{transform:rotate(360deg)}}.toast-spinner{box-sizing:border-box;border:1.5px solid var(--toast-border);border-top-color:var(--toast-text-muted);border-radius:50%;animation:.7s linear infinite toast-spin}.toast-body{flex:1;min-width:0}.toast-count{vertical-align:1px;color:var(--toast-text-muted);background:var(--toast-hover);animation:toast-count-pop .3s var(--toast-ease);border-radius:999px;margin-left:6px;padding:0 6px;font-size:11px;font-weight:600;line-height:18px;display:inline-block}@keyframes toast-count-pop{0%{transform:scale(1.5)}}.toast-title{letter-spacing:-.01em;color:var(--toast-text);overflow-wrap:anywhere;margin:0;font-size:13px;font-weight:500;line-height:1.45}.toast-description{color:var(--toast-text-muted);overflow-wrap:anywhere;margin:2px 0 0;font-size:12.5px;line-height:1.5}.toast-actions{flex-shrink:0;align-self:center;gap:6px;display:flex}.toast-action-btn{font:inherit;color:var(--toast-bg);background:var(--toast-text);cursor:pointer;white-space:nowrap;border:0;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:500;line-height:1.4;transition:opacity .15s,background .15s}.toast-action-btn:hover{opacity:.88}.toast-action-btn--cancel{color:var(--toast-text);box-shadow:inset 0 0 0 1px var(--toast-border);background:0 0}.toast-action-btn--cancel:hover{opacity:1;background:var(--toast-hover)}.toast-close{width:20px;height:20px;color:var(--toast-text-muted);cursor:pointer;opacity:.5;background:0 0;border:0;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;margin:-1px -4px 0 0;padding:0;transition:opacity .15s,background .15s;display:flex}.toast-card:hover .toast-close,.toast-close:focus-visible{opacity:1}.toast-close:hover{background:var(--toast-hover);color:var(--toast-text)}.toast-close svg{width:11px;height:11px}.toast-progress-track{border-radius:0 0 var(--toast-radius) var(--toast-radius);background:var(--toast-border);height:2px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.toast-progress-fill{background:var(--toast-text-muted);transform-origin:0;height:100%;transition:transform .2s linear}.toast-card--success .toast-progress-fill{background:var(--toast-c-success)}.toast-card--error .toast-progress-fill{background:var(--toast-c-error)}.toast-card--warning .toast-progress-fill{background:var(--toast-c-warning)}.toast-card--info .toast-progress-fill{background:var(--toast-c-info)}.toast-card--update .toast-progress-fill{background:var(--toast-c-update)}@keyframes toast-countdown{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.toast-progress-fill--countdown{animation-name:toast-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@media (hover:none){.toast-close{opacity:1;width:28px;height:28px;margin:-5px -8px -5px 0}.toast-action-btn{padding:6px 12px}}@media (width<=600px){.toast-viewport{--toast-edge:12px;--toast-radius:
|
|
688
|
+
}), ve = ":root{--toast-bg:#fff;--toast-border:#00000014;--toast-text:#09090b;--toast-text-muted:#71717a;--toast-hover:#f4f4f5;--toast-shadow:0 4px 12px #00000014;--toast-radius:10px;--toast-width:356px;--toast-gap:14px;--toast-peek:14px;--toast-edge:24px;--toast-z:99999;--toast-c-success:#16a34a;--toast-c-error:#dc2626;--toast-c-warning:#d97706;--toast-c-info:#2563eb;--toast-c-muted:#71717a;--toast-c-offline:#6b7280;--toast-c-update:#8b5cf6;--toast-ease:cubic-bezier(.21, 1.02, .73, 1);--toast-duration:.4s}.toast-viewport[data-theme=dark]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}@media (prefers-color-scheme:dark){.toast-viewport[data-theme=system]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}}.toast-viewport[data-rich] .toast-card--success{--toast-bg:#ecfdf3;--toast-border:#bffcd9;--toast-text:#008a2e}.toast-viewport[data-rich] .toast-card--error{--toast-bg:#fff0f0;--toast-border:#ffe0e1;--toast-text:#e60000}.toast-viewport[data-rich] .toast-card--warning{--toast-bg:#fffcf0;--toast-border:#fdf5d3;--toast-text:#dc7609}.toast-viewport[data-rich] .toast-card--info{--toast-bg:#f0f8ff;--toast-border:#d3e0fd;--toast-text:#0973dc}.toast-viewport[data-rich] .toast-card--update{--toast-bg:#f5f3ff;--toast-border:#e4defe;--toast-text:#6d28d9}.toast-viewport[data-rich][data-theme=dark] .toast-card--success{--toast-bg:#001f0f;--toast-border:#003d1c;--toast-text:#59f3a6}.toast-viewport[data-rich][data-theme=dark] .toast-card--error{--toast-bg:#2d0607;--toast-border:#4d0408;--toast-text:#ff9ea1}.toast-viewport[data-rich][data-theme=dark] .toast-card--warning{--toast-bg:#1d1f00;--toast-border:#3d3d00;--toast-text:#f3cf58}.toast-viewport[data-rich][data-theme=dark] .toast-card--info{--toast-bg:#000d1f;--toast-border:#00113d;--toast-text:#5896f3}.toast-viewport[data-rich][data-theme=dark] .toast-card--update{--toast-bg:#170b2e;--toast-border:#2e1a5c;--toast-text:#c4b5fd}.toast-viewport[data-rich] .toast-description{color:var(--toast-text);opacity:.8}.toast-viewport{--lift:-1;z-index:var(--toast-z);width:var(--toast-width);max-width:calc(100vw - var(--toast-edge) * 2);height:0;margin:0;padding:0;font-family:inherit;list-style:none;position:fixed}.toast-viewport[data-y=top]{--lift:1;top:var(--toast-edge)}.toast-viewport[data-y=bottom]{--lift:-1;bottom:var(--toast-edge)}.toast-viewport--top-right,.toast-viewport--bottom-right{right:var(--toast-edge)}.toast-viewport--top-left,.toast-viewport--bottom-left{left:var(--toast-edge)}.toast-viewport--top-center,.toast-viewport--bottom-center{left:50%;transform:translate(-50%)}.toast-card{--y:calc(var(--lift) * -100%);--s:1;z-index:calc(1000 - var(--index,0));height:var(--h,auto);box-sizing:border-box;background:var(--toast-bg);border-radius:var(--toast-radius);box-shadow:0 0 0 1px var(--toast-border), var(--toast-shadow);color:var(--toast-text);opacity:0;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y;transform:translate3d(var(--swipe-x,0px), var(--y), 0) scale(var(--s));transition:transform var(--toast-duration) var(--toast-ease), opacity var(--toast-duration) var(--toast-ease), height var(--toast-duration) var(--toast-ease), box-shadow .2s ease;will-change:transform, opacity;outline:none;margin:0;position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card{transform-origin:bottom;bottom:0}.toast-viewport[data-y=top] .toast-card{transform-origin:top;top:0}.toast-card:focus-visible{box-shadow:0 0 0 1px var(--toast-border), 0 0 0 3px #71717a59, var(--toast-shadow)}.toast-card:after{content:\"\";height:calc(var(--toast-gap) + 1px);position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card:after{bottom:100%}.toast-viewport[data-y=top] .toast-card:after{top:100%}.toast-card[data-mounted]{--y:calc(var(--lift) * var(--index) * var(--toast-peek));--s:calc(1 - var(--index) * .05);opacity:1}.toast-viewport:not([data-expanded]) .toast-card:not([data-front]){height:var(--front-h);overflow:hidden}.toast-viewport:not([data-expanded]) .toast-card:not([data-front])>*{opacity:0}.toast-viewport[data-expanded] .toast-card[data-mounted]{--y:calc(var(--lift) * (var(--offset) + var(--index) * var(--toast-gap)));--s:1}.toast-card[data-mounted]:not([data-visible]){opacity:0;pointer-events:none}.toast-card[data-swiping]{opacity:calc(1 - var(--swipe-amount,0) * .8);transition:opacity 0s, height var(--toast-duration) var(--toast-ease);cursor:grabbing}.toast-viewport .toast-card[data-mounted].toast-leave-active{pointer-events:none}.toast-viewport .toast-card[data-mounted].toast-leave-to{opacity:0}.toast-viewport .toast-card[data-mounted][data-front].toast-leave-to:not([data-swiped]){--y:calc(var(--lift) * -100%)}.toast-viewport .toast-card[data-mounted]:not([data-front]).toast-leave-to{--s:calc(1 - var(--index) * .05 - .05)}.toast-content{transition:opacity var(--toast-duration) var(--toast-ease);align-items:flex-start;gap:10px;padding:14px 16px;display:flex}.toast-icon,.toast-spinner{flex-shrink:0;width:16px;height:16px;margin-top:1px}.toast-icon--success{color:var(--toast-c-success)}.toast-icon--error{color:var(--toast-c-error)}.toast-icon--warning{color:var(--toast-c-warning)}.toast-icon--info{color:var(--toast-c-info)}.toast-icon--offline{color:var(--toast-c-offline)}.toast-icon--update{color:var(--toast-c-update)}.toast-viewport[data-rich] .toast-icon{color:currentColor}.toast-icon{animation:toast-icon-in .3s var(--toast-ease)}@keyframes toast-icon-in{0%{opacity:0;transform:scale(.6)}}@keyframes toast-spin{to{transform:rotate(360deg)}}.toast-spinner{box-sizing:border-box;border:1.5px solid var(--toast-border);border-top-color:var(--toast-text-muted);border-radius:50%;animation:.7s linear infinite toast-spin}.toast-body{flex:1;min-width:0}.toast-count{vertical-align:1px;color:var(--toast-text-muted);background:var(--toast-hover);animation:toast-count-pop .3s var(--toast-ease);border-radius:999px;margin-left:6px;padding:0 6px;font-size:11px;font-weight:600;line-height:18px;display:inline-block}@keyframes toast-count-pop{0%{transform:scale(1.5)}}.toast-title{letter-spacing:-.01em;color:var(--toast-text);overflow-wrap:anywhere;margin:0;font-size:13px;font-weight:500;line-height:1.45}.toast-description{color:var(--toast-text-muted);overflow-wrap:anywhere;margin:2px 0 0;font-size:12.5px;line-height:1.5}.toast-actions{flex-shrink:0;align-self:center;gap:6px;display:flex}.toast-action-btn{font:inherit;color:var(--toast-bg);background:var(--toast-text);cursor:pointer;white-space:nowrap;border:0;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:500;line-height:1.4;transition:opacity .15s,background .15s}.toast-action-btn:hover{opacity:.88}.toast-action-btn--cancel{color:var(--toast-text);box-shadow:inset 0 0 0 1px var(--toast-border);background:0 0}.toast-action-btn--cancel:hover{opacity:1;background:var(--toast-hover)}.toast-close{width:20px;height:20px;color:var(--toast-text-muted);cursor:pointer;opacity:.5;background:0 0;border:0;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;margin:-1px -4px 0 0;padding:0;transition:opacity .15s,background .15s;display:flex}.toast-card:hover .toast-close,.toast-close:focus-visible{opacity:1}.toast-close:hover{background:var(--toast-hover);color:var(--toast-text)}.toast-close svg{width:11px;height:11px}.toast-progress-track{border-radius:0 0 var(--toast-radius) var(--toast-radius);background:var(--toast-border);height:2px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.toast-progress-fill{background:var(--toast-text-muted);transform-origin:0;height:100%;transition:transform .2s linear}.toast-card--success .toast-progress-fill{background:var(--toast-c-success)}.toast-card--error .toast-progress-fill{background:var(--toast-c-error)}.toast-card--warning .toast-progress-fill{background:var(--toast-c-warning)}.toast-card--info .toast-progress-fill{background:var(--toast-c-info)}.toast-card--update .toast-progress-fill{background:var(--toast-c-update)}@keyframes toast-countdown{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.toast-progress-fill--countdown{animation-name:toast-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@media (hover:none){.toast-close{opacity:1;width:28px;height:28px;margin:-5px -8px -5px 0}.toast-action-btn{padding:6px 12px}}@media (width<=600px){.toast-viewport{--toast-edge:12px;--toast-radius:18px;--toast-gap:6px;--toast-peek:6px;left:max(var(--toast-edge), env(safe-area-inset-left));right:max(var(--toast-edge), env(safe-area-inset-right));width:auto;max-width:none;transform:none}.toast-viewport[data-y=top]{top:max(var(--toast-edge), env(safe-area-inset-top))}.toast-viewport[data-y=bottom]{bottom:max(var(--toast-edge), env(safe-area-inset-bottom))}.toast-card{width:fit-content;max-width:100%;margin-inline:auto}.toast-content{flex-wrap:wrap;align-items:center;gap:6px 8px;padding:8px 12px}.toast-icon,.toast-spinner{width:13px;height:13px;margin-top:0}.toast-title{font-size:12px;line-height:1.35}.toast-description{margin-top:1px;font-size:11.5px;line-height:1.35}.toast-actions{flex-basis:100%;order:1;justify-content:flex-end}.toast-action-btn{border-radius:999px;padding:3px 10px;font-size:11.5px}.toast-close{width:20px;height:20px;margin:-2px -6px -2px 0}.toast-close svg{width:9px;height:9px}}@media (prefers-reduced-motion:reduce){.toast-card{transition:opacity .2s,height}.toast-icon,.toast-count,.toast-progress-fill--countdown{animation:none}}", ye = "feather-toast-root", be = "feather-toast-style", xe = { install(e, t = {}) {
|
|
689
689
|
let n = Q();
|
|
690
690
|
if (e.provide("toast", n), typeof document > "u") return;
|
|
691
691
|
if (t.injectStyles !== !1 && !document.getElementById(be)) {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue")):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.FeatherToast={},e.Vue))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=(0,t.ref)([]),r=0;function i(){return`toast-${++r}-${Date.now()}`}var a=5e3,o=`bottom-right`,s=5,c=()=>({max:s,duration:a,position:o}),l=(0,t.ref)(c());function u(e){return typeof e==`string`?e:e&&typeof e==`object`&&`message`in e&&typeof e.message==`string`?e.message:`Something went wrong`}function d(e){return typeof e==`string`||(0,t.isRef)(e)||typeof e==`function`?{title:e}:e instanceof Error||typeof e==`object`&&e&&`message`in e&&!(`title`in e)&&!(`description`in e)?{title:u(e)}:typeof e==`object`&&e?e:{title:String(e??``)}}function f(e,t){let r=t??l.value.max;if(!r||r<=0)return;let i=n.value.filter(t=>t.position===e),a=i.length-r+1;if(a>0){let e=i.slice(0,a);for(let t of e)h(t.id)}}function p(e){return!e.action&&!e.cancel&&!e.component&&e.progress===void 0&&!e.onDismiss}function m(e){let r=d(e);if(r.id&&n.value.some(e=>e.id===r.id))return E(r.id,r),r.id;let s=r.id??i(),c=r.variant??`default`,u=r.position??l.value.position??o;if(l.value.group!==!1&&!r.id&&c!==`loading`&&p(r)){let e=n.value.find(e=>e.position===u&&e.variant===c&&(0,t.toValue)(e.title)===(0,t.toValue)(r.title)&&(0,t.toValue)(e.description)===(0,t.toValue)(r.description)&&p(e));if(e)return e.count=(e.count??1)+1,e.id}let m=l.value.duration??a,h=r.duration??(c===`loading`?1/0:m);f(u);let g={id:s,title:r.title,description:r.description,variant:c,position:u,duration:h,dismissible:r.dismissible??!0,action:r.action,cancel:r.cancel,progress:r.progress,showProgress:r.showProgress,component:r.component,onDismiss:r.onDismiss};return n.value.push(g),s}function h(e){let t=n.value.findIndex(t=>t.id===e);t>-1&&(n.value[t]?.onDismiss?.(),n.value.splice(t,1),v.delete(e))}function g(){for(let e of n.value)e.onDismiss?.();n.value.splice(0,n.value.length),v.clear()}var _=`feather-toast:flash`,v=new Map,y=!1;function b(e){return{title:(0,t.toValue)(e.title),description:(0,t.toValue)(e.description),variant:e.variant,position:e.position,duration:Number.isFinite(e.duration)?e.duration:void 0}}function x(){let e=[...v.values()];if(v.clear(),e.length)try{sessionStorage.setItem(_,JSON.stringify(e))}catch{}}function S(){try{let e=sessionStorage.getItem(_);if(!e)return;sessionStorage.removeItem(_);for(let t of JSON.parse(e))m(t)}catch{}}function C(e){let t=d(e),n=m(t);return typeof window>`u`||(v.set(n,b(t)),y||(y=!0,window.addEventListener(`pagehide`,x))),n}var w=e=>t=>C({...d(t),variant:e});function T(){n.value.splice(0,n.value.length),v.clear(),l.value=c(),r=0}function E(e,t){let r=n.value.findIndex(t=>t.id===e);if(r>-1){let e=n.value[r];if(!e)return;n.value[r]={...e,...t,id:e.id,variant:t.variant??e.variant,position:t.position??e.position,duration:t.duration??e.duration,dismissible:t.dismissible??e.dismissible,progress:t.progress===void 0?e.progress:t.progress,showProgress:t.showProgress===void 0?e.showProgress:t.showProgress}}}function D(e){return m(e)}D.config=e=>{l.value={...l.value,...e}},D.getConfig=()=>({...l.value}),D.success=e=>m({...d(e),variant:`success`});function O(e){return m({...d(e),variant:`error`})}D.error=O,D.warning=e=>m({...d(e),variant:`warning`}),D.info=e=>m({...d(e),variant:`info`}),D.loading=e=>m({...d(e),variant:`loading`}),D.offline=e=>m({duration:1/0,dismissible:!1,...d(e),variant:`offline`}),D.update=e=>m({duration:8e3,...d(e),variant:`update`}),D.dismiss=h,D.dismissAll=g,D.flash=Object.assign(C,{success:w(`success`),error:w(`error`),warning:w(`warning`),info:w(`info`)}),D.updateToast=E,D.undo=(e,t)=>{let n=typeof e==`string`?{title:e,onUndo:t?.onUndo||(()=>{}),...t}:e,r=!1,i=n.duration??5e3,a=m({title:n.title,description:n.description,position:n.position,duration:i,dismissible:!0,showProgress:!0,action:{label:n.undoLabel||`Undo`,onClick:async()=>{r=!0;try{await n.onUndo()}finally{h(a)}}},onDismiss:()=>{r||n.onDismiss?.()}});return a},D.step=e=>{let t=m({variant:`loading`,duration:1/0,...d(e)});return{id:t,next:e=>{E(t,{variant:`loading`,duration:1/0,...e})},done:e=>{E(t,{variant:`success`,duration:a,...e})},fail:e=>{E(t,{variant:`error`,duration:a,...e})}}},D.custom=(e,t)=>m({...t,component:e}),D.progress=e=>{let t=d(e),n=m({variant:`loading`,duration:1/0,progress:t.progress??0,...t});return{id:n,setProgress:(e,t)=>{E(n,{progress:Math.min(100,Math.max(0,e)),...t})},done:e=>{E(n,{variant:`success`,duration:a,progress:100,...e})},fail:e=>{E(n,{variant:`error`,duration:a,...e})}}},D.copy=async(e,t)=>{let n=d(t||{title:`Copied to clipboard`});try{if(typeof navigator<`u`&&navigator.clipboard&&typeof navigator.clipboard.writeText==`function`)await navigator.clipboard.writeText(e);else throw Error(`Clipboard API unavailable`);return m({title:n.title||`Copied to clipboard`,description:n.description||e,variant:`success`,duration:3e3,...n})}catch(e){return m({title:`Failed to copy`,description:e instanceof Error?e.message:`Clipboard access denied`,variant:`error`,duration:4e3})}},D.network=e=>{let t=null;function n(){t||=m({title:e?.offline?.title??`You are offline`,description:e?.offline?.description??`Check your internet connection.`,variant:`offline`,duration:1/0,dismissible:!1,...e?.offline})}function r(){t&&=(h(t),null),e?.online!==null&&m({title:e?.online?.title??`Back online`,description:e?.online?.description??`Your internet connection was restored.`,variant:`success`,duration:4e3,...e?.online})}return typeof navigator<`u`&&navigator.onLine===!1&&n(),typeof window<`u`&&(window.addEventListener(`offline`,n),window.addEventListener(`online`,r)),{stop:()=>{typeof window<`u`&&(window.removeEventListener(`offline`,n),window.removeEventListener(`online`,r)),t&&=(h(t),null)}}},D.confirm=(e,t)=>{let n=typeof e==`string`?{title:e,...t}:e;return new Promise(e=>{let t=!1,r=n=>{t||(t=!0,e(n),h(i))},i=m({title:n.title??`Are you sure?`,description:n.description,variant:n.variant??`warning`,position:n.position,duration:n.duration??1/0,showProgress:n.duration!==void 0&&n.duration!==1/0,action:{label:n.confirmLabel??`Confirm`,onClick:()=>r(!0)},cancel:{label:n.cancelLabel??`Cancel`,onClick:()=>r(!1)},onDismiss:()=>r(!1)})})},D.retry=(e,t)=>new Promise((n,r)=>{let i=(e,t)=>d(typeof e==`function`?e(t):e),o={...d(t.loading),position:t.position},s=m({...o,variant:`loading`,duration:1/0,dismissible:!1}),c=0,l=async()=>{E(s,{...o,variant:`loading`,duration:1/0,dismissible:!1,action:void 0,onDismiss:void 0});try{let r=await e(),o=i(t.success,r);E(s,{...o,variant:`success`,dismissible:!0,duration:o.duration??a}),n(r)}catch(e){c++;let n=t.error?i(t.error,e):{title:u(e)},o=c<=(t.maxRetries??1/0);E(s,{description:void 0,...n,variant:`error`,dismissible:!0,duration:o?1/0:n.duration??a,action:o?{label:t.retryLabel??`Retry`,onClick:l}:void 0,onDismiss:()=>r(e)}),o||r(e)}};l()}),D.promise=async function(e,t){let n=m({...t.loading,variant:`loading`});try{let r=await e,i=typeof t.success==`function`?t.success(r):t.success;return E(n,{...i,variant:`success`,dismissible:!0,duration:i.duration??a}),r}catch(e){let r=typeof t.error==`function`?t.error(e):t.error;throw E(n,{...r,variant:`error`,dismissible:!0,duration:r.duration??a}),e}};function k(){return{toast:D,toasts:n,config:l,dismiss:h,dismissAll:g}}var A=k,j=[`data-mounted`,`data-front`,`data-visible`,`data-swiping`,`data-swiped`,`role`,`aria-hidden`],M={key:0,class:`toast-spinner`,"aria-hidden":`true`},N=[`innerHTML`],ee={class:`toast-body`},te={key:0,class:`toast-title`},P={key:1,class:`toast-description`},F={key:2,class:`toast-actions`},I={key:0,class:`toast-progress-track`,"aria-hidden":`true`},L=80,R=.4,z=(0,t.defineComponent)({__name:`Toast`,props:{toast:{},index:{},offset:{},height:{},frontHeight:{},visible:{type:Boolean},paused:{type:Boolean}},emits:[`close`,`height`],setup(e,{emit:n}){let r=e,i=n,a={success:`<circle cx="8" cy="8" r="7"/><path d="M5 8l2 2 4-4"/>`,error:`<circle cx="8" cy="8" r="7"/><path d="M5.5 5.5l5 5M10.5 5.5l-5 5"/>`,warning:`<path d="M8 2L14.5 13.5H1.5L8 2z"/><path d="M8 7v2.5M8 11.5v.01"/>`,info:`<circle cx="8" cy="8" r="7"/><path d="M8 7v4M8 5v.01"/>`,offline:`<path d="M2.5 5.5C4 4 5.8 3 8 3c1 0 1.9.2 2.7.5M4.5 8c.8-.7 1.9-1.2 3.2-1.2M8 12v.01M3 3l10 10"/>`,update:`<circle cx="8" cy="8" r="7"/><path d="M8 11V5.5M5.5 7.5L8 5l2.5 2.5"/>`},o=(0,t.computed)(()=>r.index===0),s=(0,t.computed)(()=>(0,t.toValue)(r.toast.title)),c=(0,t.computed)(()=>(0,t.toValue)(r.toast.description)),l=(0,t.computed)(()=>(0,t.toValue)(r.toast.progress)),u=(0,t.computed)(()=>r.toast.variant===`loading`||r.toast.variant===`offline`),d=(0,t.ref)(!1),f=0,p=r.toast.duration,m=0,h=null,g=(0,t.ref)(!1);function _(){h&&=(clearTimeout(h),null)}function v(e){_(),!(e===1/0||e<=0||u.value)&&(p=e,r.paused||E.value?g.value=!0:(g.value=!1,m=Date.now(),h=setTimeout(()=>i(`close`,r.toast.id),e)))}function y(){g.value=!0,h&&(_(),p=Math.max(500,p-(Date.now()-m)))}function b(){r.paused||E.value||v(p)}(0,t.watch)(()=>r.paused,e=>e?y():b()),(0,t.watch)(()=>[r.toast.variant,r.toast.duration,r.toast.count],()=>v(r.toast.duration));let x=(0,t.ref)(null),S=null;function C(){x.value&&i(`height`,r.toast.id,x.value.offsetHeight)}(0,t.onMounted)(()=>{C(),typeof ResizeObserver<`u`&&x.value&&(S=new ResizeObserver(C),S.observe(x.value)),f=requestAnimationFrame(()=>{f=requestAnimationFrame(()=>d.value=!0)}),v(r.toast.duration)});let w=(0,t.computed)(()=>l.value===void 0?r.toast.showProgress&&r.toast.duration!==1/0&&r.toast.duration>0?{animationDuration:`${r.toast.duration}ms`,animationPlayState:g.value?`paused`:`running`}:{}:{transform:`scaleX(${Math.min(100,Math.max(0,l.value))/100})`}),T=(0,t.ref)(0),E=(0,t.ref)(!1),D=(0,t.ref)(!1),O=null,k=0,A=0,z=0,B=null;function V(e){r.toast.dismissible&&e.button===0&&(e.target.closest(`button, a, input, textarea, select`)||(O=e.pointerId,k=e.clientX,A=e.clientY,z=performance.now(),B=null))}function H(e){if(e.pointerId!==O)return;let t=e.clientX-k,n=e.clientY-A;if(!B){if(Math.abs(t)<5&&Math.abs(n)<5)return;if(B=Math.abs(t)>Math.abs(n)?`x`:`y`,B===`y`){O=null;return}e.currentTarget.setPointerCapture(e.pointerId),E.value=!0,y()}T.value=t}function U(e){if(e.pointerId!==O||(O=null,!E.value))return;let t=T.value,n=Math.abs(t)/Math.max(1,performance.now()-z);E.value=!1,Math.abs(t)>L||n>R?(D.value=!0,T.value=Math.sign(t||1)*(Math.abs(t)+240),i(`close`,r.toast.id)):(T.value=0,b())}(0,t.onBeforeUnmount)(()=>{_(),cancelAnimationFrame(f),S?.disconnect()});function W(){i(`close`,r.toast.id)}async function G(e){try{await e?.()}catch(e){console.error(`[feather-toast-vue] Action handler error:`,e)}}let K=(0,t.computed)(()=>({"--index":r.index,"--offset":`${r.offset}px`,"--h":r.height===void 0?void 0:`${r.height}px`,"--front-h":`${r.frontHeight}px`,"--swipe-x":`${T.value}px`,"--swipe-amount":Math.min(1,Math.abs(T.value)/260)}));return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`li`,{class:(0,t.normalizeClass)([`toast-card`,`toast-card--${e.toast.variant}`]),style:(0,t.normalizeStyle)(K.value),"data-mounted":d.value||void 0,"data-front":o.value||void 0,"data-visible":e.visible||void 0,"data-swiping":E.value||void 0,"data-swiped":D.value||void 0,role:e.toast.variant===`error`?`alert`:`status`,"aria-hidden":!e.visible||void 0,tabindex:`0`,onPointerdown:V,onPointermove:H,onPointerup:U,onPointercancel:U,onKeydown:r[2]||=(0,t.withKeys)(t=>e.toast.dismissible&&W(),[`esc`])},[(0,t.createElementVNode)(`div`,{ref_key:`contentEl`,ref:x,class:`toast-content`},[e.toast.variant===`loading`?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,M)):a[e.toast.variant]?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{key:1,class:(0,t.normalizeClass)([`toast-icon`,`toast-icon--${e.toast.variant}`]),viewBox:`0 0 16 16`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.5`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`,innerHTML:a[e.toast.variant]},null,10,N)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,ee,[e.toast.component?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.toast.component),{key:0,toast:e.toast,close:W},null,8,[`toast`])):((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:1},[s.value?((0,t.openBlock)(),(0,t.createElementBlock)(`p`,te,[(0,t.createTextVNode)((0,t.toDisplayString)(s.value),1),(e.toast.count??1)>1?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{key:e.toast.count,class:`toast-count`},`×`+(0,t.toDisplayString)(e.toast.count),1)):(0,t.createCommentVNode)(``,!0)])):(0,t.createCommentVNode)(``,!0),c.value?((0,t.openBlock)(),(0,t.createElementBlock)(`p`,P,(0,t.toDisplayString)(c.value),1)):(0,t.createCommentVNode)(``,!0)],64))]),e.toast.action||e.toast.cancel?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,F,[e.toast.cancel?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`toast-action-btn toast-action-btn--cancel`,onClick:r[0]||=(0,t.withModifiers)(t=>G(e.toast.cancel.onClick),[`stop`])},(0,t.toDisplayString)(e.toast.cancel.label),1)):(0,t.createCommentVNode)(``,!0),e.toast.action?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`toast-action-btn`,onClick:r[1]||=(0,t.withModifiers)(t=>G(e.toast.action.onClick),[`stop`])},(0,t.toDisplayString)(e.toast.action.label),1)):(0,t.createCommentVNode)(``,!0)])):(0,t.createCommentVNode)(``,!0),e.toast.dismissible?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:3,class:`toast-close`,"aria-label":`Dismiss`,onClick:(0,t.withModifiers)(W,[`stop`])},[...r[3]||=[(0,t.createElementVNode)(`svg`,{viewBox:`0 0 14 14`,fill:`none`,"aria-hidden":`true`},[(0,t.createElementVNode)(`path`,{d:`M2 2l10 10M12 2L2 12`,stroke:`currentColor`,"stroke-width":`1.5`,"stroke-linecap":`round`})],-1)]])):(0,t.createCommentVNode)(``,!0)],512),e.toast.showProgress||l.value!==void 0?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,I,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`toast-progress-fill`,{"toast-progress-fill--countdown":e.toast.showProgress&&l.value===void 0}]),style:(0,t.normalizeStyle)(w.value)},null,6)])):(0,t.createCommentVNode)(``,!0)],46,j))}}),B={"aria-label":`Notifications`,class:`toast-region`},V=(0,t.defineComponent)({__name:`ToastContainer`,setup(e){let{toasts:n,config:r,dismiss:i}=A(),a=(0,t.ref)(!1),o=(0,t.ref)(!1),s=[`top-right`,`top-left`,`top-center`,`bottom-right`,`bottom-left`,`bottom-center`],c=(0,t.reactive)({}),l=(0,t.reactive)({}),u=(0,t.reactive)({}),d=(0,t.computed)(()=>{let e={};for(let t of s)e[t]=[];for(let t of n.value)e[t.position]?.unshift(t);return e});(0,t.watch)(()=>n.value.map(e=>e.id),e=>{for(let t of Object.keys(c))e.includes(t)||delete c[t]});function f(e){return!!(r.value.expand||l[e]||u[e])}function p(e,t){let n=0;for(let r=0;r<t;r++)n+=c[e[r].id]??0;return n}function m(e,t){c[e]=t}function h(e,t){t.pointerType===`mouse`&&(l[e]=!0)}function g(e,t){t.pointerType===`mouse`&&(l[e]=!1)}function _(e,t){t.pointerType!==`mouse`&&(u[e]=!0)}function v(e){if(e.pointerType!==`mouse`&&!e.target?.closest?.(`.toast-viewport`))for(let e of s)u[e]=!1}function y(){o.value=document.visibilityState===`hidden`}return(0,t.watch)(()=>n.value.length,e=>{if(e===0)for(let e of s)u[e]=l[e]=!1}),(0,t.onMounted)(()=>{a.value=!0,document.addEventListener(`pointerdown`,v),document.addEventListener(`visibilitychange`,y)}),(0,t.onBeforeUnmount)(()=>{document.removeEventListener(`pointerdown`,v),document.removeEventListener(`visibilitychange`,y)}),(e,n)=>a.value?((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{key:0,to:`body`},[(0,t.createElementVNode)(`section`,B,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(s,e=>(0,t.createVNode)(t.TransitionGroup,{key:e,tag:`ol`,name:`toast`,class:(0,t.normalizeClass)([`toast-viewport`,`toast-viewport--${e}`]),"data-y":e.startsWith(`top`)?`top`:`bottom`,"data-expanded":f(e)||void 0,"data-theme":(0,t.unref)(r).theme??`light`,"data-rich":(0,t.unref)(r).richColors||void 0,onPointerenter:t=>h(e,t),onPointerleave:t=>g(e,t),onPointerdown:t=>_(e,t)},{default:(0,t.withCtx)(()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(d.value[e],(n,a)=>((0,t.openBlock)(),(0,t.createBlock)(z,{key:n.id,toast:n,index:a,offset:p(d.value[e],a),"front-height":c[d.value[e][0]?.id??``]??0,height:c[n.id],visible:a<((0,t.unref)(r).visibleToasts??3),paused:o.value||!!l[e]||!!u[e],onClose:(0,t.unref)(i),onHeight:m},null,8,[`toast`,`index`,`offset`,`front-height`,`height`,`visible`,`paused`,`onClose`]))),128))]),_:2},1032,[`class`,`data-y`,`data-expanded`,`data-theme`,`data-rich`,`onPointerenter`,`onPointerleave`,`onPointerdown`])),64))])])):(0,t.createCommentVNode)(``,!0)}}),H=`:root{--toast-bg:#fff;--toast-border:#00000014;--toast-text:#09090b;--toast-text-muted:#71717a;--toast-hover:#f4f4f5;--toast-shadow:0 4px 12px #00000014;--toast-radius:10px;--toast-width:356px;--toast-gap:14px;--toast-peek:14px;--toast-edge:24px;--toast-z:99999;--toast-c-success:#16a34a;--toast-c-error:#dc2626;--toast-c-warning:#d97706;--toast-c-info:#2563eb;--toast-c-muted:#71717a;--toast-c-offline:#6b7280;--toast-c-update:#8b5cf6;--toast-ease:cubic-bezier(.21, 1.02, .73, 1);--toast-duration:.4s}.toast-viewport[data-theme=dark]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}@media (prefers-color-scheme:dark){.toast-viewport[data-theme=system]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}}.toast-viewport[data-rich] .toast-card--success{--toast-bg:#ecfdf3;--toast-border:#bffcd9;--toast-text:#008a2e}.toast-viewport[data-rich] .toast-card--error{--toast-bg:#fff0f0;--toast-border:#ffe0e1;--toast-text:#e60000}.toast-viewport[data-rich] .toast-card--warning{--toast-bg:#fffcf0;--toast-border:#fdf5d3;--toast-text:#dc7609}.toast-viewport[data-rich] .toast-card--info{--toast-bg:#f0f8ff;--toast-border:#d3e0fd;--toast-text:#0973dc}.toast-viewport[data-rich] .toast-card--update{--toast-bg:#f5f3ff;--toast-border:#e4defe;--toast-text:#6d28d9}.toast-viewport[data-rich][data-theme=dark] .toast-card--success{--toast-bg:#001f0f;--toast-border:#003d1c;--toast-text:#59f3a6}.toast-viewport[data-rich][data-theme=dark] .toast-card--error{--toast-bg:#2d0607;--toast-border:#4d0408;--toast-text:#ff9ea1}.toast-viewport[data-rich][data-theme=dark] .toast-card--warning{--toast-bg:#1d1f00;--toast-border:#3d3d00;--toast-text:#f3cf58}.toast-viewport[data-rich][data-theme=dark] .toast-card--info{--toast-bg:#000d1f;--toast-border:#00113d;--toast-text:#5896f3}.toast-viewport[data-rich][data-theme=dark] .toast-card--update{--toast-bg:#170b2e;--toast-border:#2e1a5c;--toast-text:#c4b5fd}.toast-viewport[data-rich] .toast-description{color:var(--toast-text);opacity:.8}.toast-viewport{--lift:-1;z-index:var(--toast-z);width:var(--toast-width);max-width:calc(100vw - var(--toast-edge) * 2);height:0;margin:0;padding:0;font-family:inherit;list-style:none;position:fixed}.toast-viewport[data-y=top]{--lift:1;top:var(--toast-edge)}.toast-viewport[data-y=bottom]{--lift:-1;bottom:var(--toast-edge)}.toast-viewport--top-right,.toast-viewport--bottom-right{right:var(--toast-edge)}.toast-viewport--top-left,.toast-viewport--bottom-left{left:var(--toast-edge)}.toast-viewport--top-center,.toast-viewport--bottom-center{left:50%;transform:translate(-50%)}.toast-card{--y:calc(var(--lift) * -100%);--s:1;z-index:calc(1000 - var(--index,0));height:var(--h,auto);box-sizing:border-box;background:var(--toast-bg);border-radius:var(--toast-radius);box-shadow:0 0 0 1px var(--toast-border), var(--toast-shadow);color:var(--toast-text);opacity:0;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y;transform:translate3d(var(--swipe-x,0px), var(--y), 0) scale(var(--s));transition:transform var(--toast-duration) var(--toast-ease), opacity var(--toast-duration) var(--toast-ease), height var(--toast-duration) var(--toast-ease), box-shadow .2s ease;will-change:transform, opacity;outline:none;margin:0;position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card{transform-origin:bottom;bottom:0}.toast-viewport[data-y=top] .toast-card{transform-origin:top;top:0}.toast-card:focus-visible{box-shadow:0 0 0 1px var(--toast-border), 0 0 0 3px #71717a59, var(--toast-shadow)}.toast-card:after{content:"";height:calc(var(--toast-gap) + 1px);position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card:after{bottom:100%}.toast-viewport[data-y=top] .toast-card:after{top:100%}.toast-card[data-mounted]{--y:calc(var(--lift) * var(--index) * var(--toast-peek));--s:calc(1 - var(--index) * .05);opacity:1}.toast-viewport:not([data-expanded]) .toast-card:not([data-front]){height:var(--front-h);overflow:hidden}.toast-viewport:not([data-expanded]) .toast-card:not([data-front])>*{opacity:0}.toast-viewport[data-expanded] .toast-card[data-mounted]{--y:calc(var(--lift) * (var(--offset) + var(--index) * var(--toast-gap)));--s:1}.toast-card[data-mounted]:not([data-visible]){opacity:0;pointer-events:none}.toast-card[data-swiping]{opacity:calc(1 - var(--swipe-amount,0) * .8);transition:opacity 0s, height var(--toast-duration) var(--toast-ease);cursor:grabbing}.toast-viewport .toast-card[data-mounted].toast-leave-active{pointer-events:none}.toast-viewport .toast-card[data-mounted].toast-leave-to{opacity:0}.toast-viewport .toast-card[data-mounted][data-front].toast-leave-to:not([data-swiped]){--y:calc(var(--lift) * -100%)}.toast-viewport .toast-card[data-mounted]:not([data-front]).toast-leave-to{--s:calc(1 - var(--index) * .05 - .05)}.toast-content{transition:opacity var(--toast-duration) var(--toast-ease);align-items:flex-start;gap:10px;padding:14px 16px;display:flex}.toast-icon,.toast-spinner{flex-shrink:0;width:16px;height:16px;margin-top:1px}.toast-icon--success{color:var(--toast-c-success)}.toast-icon--error{color:var(--toast-c-error)}.toast-icon--warning{color:var(--toast-c-warning)}.toast-icon--info{color:var(--toast-c-info)}.toast-icon--offline{color:var(--toast-c-offline)}.toast-icon--update{color:var(--toast-c-update)}.toast-viewport[data-rich] .toast-icon{color:currentColor}.toast-icon{animation:toast-icon-in .3s var(--toast-ease)}@keyframes toast-icon-in{0%{opacity:0;transform:scale(.6)}}@keyframes toast-spin{to{transform:rotate(360deg)}}.toast-spinner{box-sizing:border-box;border:1.5px solid var(--toast-border);border-top-color:var(--toast-text-muted);border-radius:50%;animation:.7s linear infinite toast-spin}.toast-body{flex:1;min-width:0}.toast-count{vertical-align:1px;color:var(--toast-text-muted);background:var(--toast-hover);animation:toast-count-pop .3s var(--toast-ease);border-radius:999px;margin-left:6px;padding:0 6px;font-size:11px;font-weight:600;line-height:18px;display:inline-block}@keyframes toast-count-pop{0%{transform:scale(1.5)}}.toast-title{letter-spacing:-.01em;color:var(--toast-text);overflow-wrap:anywhere;margin:0;font-size:13px;font-weight:500;line-height:1.45}.toast-description{color:var(--toast-text-muted);overflow-wrap:anywhere;margin:2px 0 0;font-size:12.5px;line-height:1.5}.toast-actions{flex-shrink:0;align-self:center;gap:6px;display:flex}.toast-action-btn{font:inherit;color:var(--toast-bg);background:var(--toast-text);cursor:pointer;white-space:nowrap;border:0;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:500;line-height:1.4;transition:opacity .15s,background .15s}.toast-action-btn:hover{opacity:.88}.toast-action-btn--cancel{color:var(--toast-text);box-shadow:inset 0 0 0 1px var(--toast-border);background:0 0}.toast-action-btn--cancel:hover{opacity:1;background:var(--toast-hover)}.toast-close{width:20px;height:20px;color:var(--toast-text-muted);cursor:pointer;opacity:.5;background:0 0;border:0;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;margin:-1px -4px 0 0;padding:0;transition:opacity .15s,background .15s;display:flex}.toast-card:hover .toast-close,.toast-close:focus-visible{opacity:1}.toast-close:hover{background:var(--toast-hover);color:var(--toast-text)}.toast-close svg{width:11px;height:11px}.toast-progress-track{border-radius:0 0 var(--toast-radius) var(--toast-radius);background:var(--toast-border);height:2px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.toast-progress-fill{background:var(--toast-text-muted);transform-origin:0;height:100%;transition:transform .2s linear}.toast-card--success .toast-progress-fill{background:var(--toast-c-success)}.toast-card--error .toast-progress-fill{background:var(--toast-c-error)}.toast-card--warning .toast-progress-fill{background:var(--toast-c-warning)}.toast-card--info .toast-progress-fill{background:var(--toast-c-info)}.toast-card--update .toast-progress-fill{background:var(--toast-c-update)}@keyframes toast-countdown{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.toast-progress-fill--countdown{animation-name:toast-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@media (hover:none){.toast-close{opacity:1;width:28px;height:28px;margin:-5px -8px -5px 0}.toast-action-btn{padding:6px 12px}}@media (width<=600px){.toast-viewport{--toast-edge:12px;--toast-radius:8px;--toast-gap:8px;--toast-peek:8px;left:max(var(--toast-edge), env(safe-area-inset-left));right:max(var(--toast-edge), env(safe-area-inset-right));width:auto;max-width:none;transform:none}.toast-viewport[data-y=top]{top:max(var(--toast-edge), env(safe-area-inset-top))}.toast-viewport[data-y=bottom]{bottom:max(var(--toast-edge), env(safe-area-inset-bottom))}.toast-content{flex-wrap:wrap;gap:8px;padding:10px 12px}.toast-icon,.toast-spinner{width:14px;height:14px;margin-top:1.5px}.toast-title{font-size:12.5px;line-height:1.4}.toast-description{margin-top:1px;font-size:12px;line-height:1.4}.toast-actions{flex-basis:100%;order:1;justify-content:flex-end}.toast-action-btn{padding:4px 10px;font-size:12px}.toast-close{width:24px;height:24px;margin:-4px -6px -4px 0}.toast-close svg{width:10px;height:10px}}@media (prefers-reduced-motion:reduce){.toast-card{transition:opacity .2s,height}.toast-icon,.toast-count,.toast-progress-fill--countdown{animation:none}}`,U=`feather-toast-root`,W=`feather-toast-style`,G={install(e,n={}){let r=k();if(e.provide(`toast`,r),typeof document>`u`)return;if(n.injectStyles!==!1&&!document.getElementById(W)){let e=document.createElement(`style`);e.id=W,e.textContent=H,document.head.appendChild(e)}let i=document.getElementById(U);i||(i=document.createElement(`div`),i.id=U,document.body.appendChild(i)),S();let a=(0,t.createVNode)(V);a.appContext=e._context,(0,t.render)(a,i);let o=e.unmount;e.unmount=(...e)=>{(0,t.render)(null,i),i?.parentNode&&i.parentNode.removeChild(i),o(...e)}}};function K(e){return{id:e.id,title:(0,t.toValue)(e.title),description:(0,t.toValue)(e.description),variant:e.variant,position:e.position,count:e.count??1,action:e.action?.label,cancel:e.cancel?.label}}function q(e,t){return t===void 0?!0:e===void 0?!1:typeof t==`string`?e===t:t.test(e)}function J(e,t){return q(e.title,t.title)&&q(e.description,t.description)&&(t.variant===void 0||e.variant===t.variant)&&(t.position===void 0||e.position===t.position)}function Y(e){return e.length?e.map(e=>` - [${e.variant}] ${JSON.stringify(e.title)}${e.description?` — ${JSON.stringify(e.description)}`:``}`).join(`
|
|
1
|
+
(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("vue")):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.FeatherToast={},e.Vue))})(this,function(e,t){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});var n=(0,t.ref)([]),r=0;function i(){return`toast-${++r}-${Date.now()}`}var a=5e3,o=`bottom-right`,s=5,c=()=>({max:s,duration:a,position:o}),l=(0,t.ref)(c());function u(e){return typeof e==`string`?e:e&&typeof e==`object`&&`message`in e&&typeof e.message==`string`?e.message:`Something went wrong`}function d(e){return typeof e==`string`||(0,t.isRef)(e)||typeof e==`function`?{title:e}:e instanceof Error||typeof e==`object`&&e&&`message`in e&&!(`title`in e)&&!(`description`in e)?{title:u(e)}:typeof e==`object`&&e?e:{title:String(e??``)}}function f(e,t){let r=t??l.value.max;if(!r||r<=0)return;let i=n.value.filter(t=>t.position===e),a=i.length-r+1;if(a>0){let e=i.slice(0,a);for(let t of e)h(t.id)}}function p(e){return!e.action&&!e.cancel&&!e.component&&e.progress===void 0&&!e.onDismiss}function m(e){let r=d(e);if(r.id&&n.value.some(e=>e.id===r.id))return E(r.id,r),r.id;let s=r.id??i(),c=r.variant??`default`,u=r.position??l.value.position??o;if(l.value.group!==!1&&!r.id&&c!==`loading`&&p(r)){let e=n.value.find(e=>e.position===u&&e.variant===c&&(0,t.toValue)(e.title)===(0,t.toValue)(r.title)&&(0,t.toValue)(e.description)===(0,t.toValue)(r.description)&&p(e));if(e)return e.count=(e.count??1)+1,e.id}let m=l.value.duration??a,h=r.duration??(c===`loading`?1/0:m);f(u);let g={id:s,title:r.title,description:r.description,variant:c,position:u,duration:h,dismissible:r.dismissible??!0,action:r.action,cancel:r.cancel,progress:r.progress,showProgress:r.showProgress,component:r.component,onDismiss:r.onDismiss};return n.value.push(g),s}function h(e){let t=n.value.findIndex(t=>t.id===e);t>-1&&(n.value[t]?.onDismiss?.(),n.value.splice(t,1),v.delete(e))}function g(){for(let e of n.value)e.onDismiss?.();n.value.splice(0,n.value.length),v.clear()}var _=`feather-toast:flash`,v=new Map,y=!1;function b(e){return{title:(0,t.toValue)(e.title),description:(0,t.toValue)(e.description),variant:e.variant,position:e.position,duration:Number.isFinite(e.duration)?e.duration:void 0}}function x(){let e=[...v.values()];if(v.clear(),e.length)try{sessionStorage.setItem(_,JSON.stringify(e))}catch{}}function S(){try{let e=sessionStorage.getItem(_);if(!e)return;sessionStorage.removeItem(_);for(let t of JSON.parse(e))m(t)}catch{}}function C(e){let t=d(e),n=m(t);return typeof window>`u`||(v.set(n,b(t)),y||(y=!0,window.addEventListener(`pagehide`,x))),n}var w=e=>t=>C({...d(t),variant:e});function T(){n.value.splice(0,n.value.length),v.clear(),l.value=c(),r=0}function E(e,t){let r=n.value.findIndex(t=>t.id===e);if(r>-1){let e=n.value[r];if(!e)return;n.value[r]={...e,...t,id:e.id,variant:t.variant??e.variant,position:t.position??e.position,duration:t.duration??e.duration,dismissible:t.dismissible??e.dismissible,progress:t.progress===void 0?e.progress:t.progress,showProgress:t.showProgress===void 0?e.showProgress:t.showProgress}}}function D(e){return m(e)}D.config=e=>{l.value={...l.value,...e}},D.getConfig=()=>({...l.value}),D.success=e=>m({...d(e),variant:`success`});function O(e){return m({...d(e),variant:`error`})}D.error=O,D.warning=e=>m({...d(e),variant:`warning`}),D.info=e=>m({...d(e),variant:`info`}),D.loading=e=>m({...d(e),variant:`loading`}),D.offline=e=>m({duration:1/0,dismissible:!1,...d(e),variant:`offline`}),D.update=e=>m({duration:8e3,...d(e),variant:`update`}),D.dismiss=h,D.dismissAll=g,D.flash=Object.assign(C,{success:w(`success`),error:w(`error`),warning:w(`warning`),info:w(`info`)}),D.updateToast=E,D.undo=(e,t)=>{let n=typeof e==`string`?{title:e,onUndo:t?.onUndo||(()=>{}),...t}:e,r=!1,i=n.duration??5e3,a=m({title:n.title,description:n.description,position:n.position,duration:i,dismissible:!0,showProgress:!0,action:{label:n.undoLabel||`Undo`,onClick:async()=>{r=!0;try{await n.onUndo()}finally{h(a)}}},onDismiss:()=>{r||n.onDismiss?.()}});return a},D.step=e=>{let t=m({variant:`loading`,duration:1/0,...d(e)});return{id:t,next:e=>{E(t,{variant:`loading`,duration:1/0,...e})},done:e=>{E(t,{variant:`success`,duration:a,...e})},fail:e=>{E(t,{variant:`error`,duration:a,...e})}}},D.custom=(e,t)=>m({...t,component:e}),D.progress=e=>{let t=d(e),n=m({variant:`loading`,duration:1/0,progress:t.progress??0,...t});return{id:n,setProgress:(e,t)=>{E(n,{progress:Math.min(100,Math.max(0,e)),...t})},done:e=>{E(n,{variant:`success`,duration:a,progress:100,...e})},fail:e=>{E(n,{variant:`error`,duration:a,...e})}}},D.copy=async(e,t)=>{let n=d(t||{title:`Copied to clipboard`});try{if(typeof navigator<`u`&&navigator.clipboard&&typeof navigator.clipboard.writeText==`function`)await navigator.clipboard.writeText(e);else throw Error(`Clipboard API unavailable`);return m({title:n.title||`Copied to clipboard`,description:n.description||e,variant:`success`,duration:3e3,...n})}catch(e){return m({title:`Failed to copy`,description:e instanceof Error?e.message:`Clipboard access denied`,variant:`error`,duration:4e3})}},D.network=e=>{let t=null;function n(){t||=m({title:e?.offline?.title??`You are offline`,description:e?.offline?.description??`Check your internet connection.`,variant:`offline`,duration:1/0,dismissible:!1,...e?.offline})}function r(){t&&=(h(t),null),e?.online!==null&&m({title:e?.online?.title??`Back online`,description:e?.online?.description??`Your internet connection was restored.`,variant:`success`,duration:4e3,...e?.online})}return typeof navigator<`u`&&navigator.onLine===!1&&n(),typeof window<`u`&&(window.addEventListener(`offline`,n),window.addEventListener(`online`,r)),{stop:()=>{typeof window<`u`&&(window.removeEventListener(`offline`,n),window.removeEventListener(`online`,r)),t&&=(h(t),null)}}},D.confirm=(e,t)=>{let n=typeof e==`string`?{title:e,...t}:e;return new Promise(e=>{let t=!1,r=n=>{t||(t=!0,e(n),h(i))},i=m({title:n.title??`Are you sure?`,description:n.description,variant:n.variant??`warning`,position:n.position,duration:n.duration??1/0,showProgress:n.duration!==void 0&&n.duration!==1/0,action:{label:n.confirmLabel??`Confirm`,onClick:()=>r(!0)},cancel:{label:n.cancelLabel??`Cancel`,onClick:()=>r(!1)},onDismiss:()=>r(!1)})})},D.retry=(e,t)=>new Promise((n,r)=>{let i=(e,t)=>d(typeof e==`function`?e(t):e),o={...d(t.loading),position:t.position},s=m({...o,variant:`loading`,duration:1/0,dismissible:!1}),c=0,l=async()=>{E(s,{...o,variant:`loading`,duration:1/0,dismissible:!1,action:void 0,onDismiss:void 0});try{let r=await e(),o=i(t.success,r);E(s,{...o,variant:`success`,dismissible:!0,duration:o.duration??a}),n(r)}catch(e){c++;let n=t.error?i(t.error,e):{title:u(e)},o=c<=(t.maxRetries??1/0);E(s,{description:void 0,...n,variant:`error`,dismissible:!0,duration:o?1/0:n.duration??a,action:o?{label:t.retryLabel??`Retry`,onClick:l}:void 0,onDismiss:()=>r(e)}),o||r(e)}};l()}),D.promise=async function(e,t){let n=m({...t.loading,variant:`loading`});try{let r=await e,i=typeof t.success==`function`?t.success(r):t.success;return E(n,{...i,variant:`success`,dismissible:!0,duration:i.duration??a}),r}catch(e){let r=typeof t.error==`function`?t.error(e):t.error;throw E(n,{...r,variant:`error`,dismissible:!0,duration:r.duration??a}),e}};function k(){return{toast:D,toasts:n,config:l,dismiss:h,dismissAll:g}}var A=k,j=[`data-mounted`,`data-front`,`data-visible`,`data-swiping`,`data-swiped`,`role`,`aria-hidden`],M={key:0,class:`toast-spinner`,"aria-hidden":`true`},N=[`innerHTML`],ee={class:`toast-body`},te={key:0,class:`toast-title`},P={key:1,class:`toast-description`},F={key:2,class:`toast-actions`},I={key:0,class:`toast-progress-track`,"aria-hidden":`true`},L=80,R=.4,z=(0,t.defineComponent)({__name:`Toast`,props:{toast:{},index:{},offset:{},height:{},frontHeight:{},visible:{type:Boolean},paused:{type:Boolean}},emits:[`close`,`height`],setup(e,{emit:n}){let r=e,i=n,a={success:`<circle cx="8" cy="8" r="7"/><path d="M5 8l2 2 4-4"/>`,error:`<circle cx="8" cy="8" r="7"/><path d="M5.5 5.5l5 5M10.5 5.5l-5 5"/>`,warning:`<path d="M8 2L14.5 13.5H1.5L8 2z"/><path d="M8 7v2.5M8 11.5v.01"/>`,info:`<circle cx="8" cy="8" r="7"/><path d="M8 7v4M8 5v.01"/>`,offline:`<path d="M2.5 5.5C4 4 5.8 3 8 3c1 0 1.9.2 2.7.5M4.5 8c.8-.7 1.9-1.2 3.2-1.2M8 12v.01M3 3l10 10"/>`,update:`<circle cx="8" cy="8" r="7"/><path d="M8 11V5.5M5.5 7.5L8 5l2.5 2.5"/>`},o=(0,t.computed)(()=>r.index===0),s=(0,t.computed)(()=>(0,t.toValue)(r.toast.title)),c=(0,t.computed)(()=>(0,t.toValue)(r.toast.description)),l=(0,t.computed)(()=>(0,t.toValue)(r.toast.progress)),u=(0,t.computed)(()=>r.toast.variant===`loading`||r.toast.variant===`offline`),d=(0,t.ref)(!1),f=0,p=r.toast.duration,m=0,h=null,g=(0,t.ref)(!1);function _(){h&&=(clearTimeout(h),null)}function v(e){_(),!(e===1/0||e<=0||u.value)&&(p=e,r.paused||E.value?g.value=!0:(g.value=!1,m=Date.now(),h=setTimeout(()=>i(`close`,r.toast.id),e)))}function y(){g.value=!0,h&&(_(),p=Math.max(500,p-(Date.now()-m)))}function b(){r.paused||E.value||v(p)}(0,t.watch)(()=>r.paused,e=>e?y():b()),(0,t.watch)(()=>[r.toast.variant,r.toast.duration,r.toast.count],()=>v(r.toast.duration));let x=(0,t.ref)(null),S=null;function C(){x.value&&i(`height`,r.toast.id,x.value.offsetHeight)}(0,t.onMounted)(()=>{C(),typeof ResizeObserver<`u`&&x.value&&(S=new ResizeObserver(C),S.observe(x.value)),f=requestAnimationFrame(()=>{f=requestAnimationFrame(()=>d.value=!0)}),v(r.toast.duration)});let w=(0,t.computed)(()=>l.value===void 0?r.toast.showProgress&&r.toast.duration!==1/0&&r.toast.duration>0?{animationDuration:`${r.toast.duration}ms`,animationPlayState:g.value?`paused`:`running`}:{}:{transform:`scaleX(${Math.min(100,Math.max(0,l.value))/100})`}),T=(0,t.ref)(0),E=(0,t.ref)(!1),D=(0,t.ref)(!1),O=null,k=0,A=0,z=0,B=null;function V(e){r.toast.dismissible&&e.button===0&&(e.target.closest(`button, a, input, textarea, select`)||(O=e.pointerId,k=e.clientX,A=e.clientY,z=performance.now(),B=null))}function H(e){if(e.pointerId!==O)return;let t=e.clientX-k,n=e.clientY-A;if(!B){if(Math.abs(t)<5&&Math.abs(n)<5)return;if(B=Math.abs(t)>Math.abs(n)?`x`:`y`,B===`y`){O=null;return}e.currentTarget.setPointerCapture(e.pointerId),E.value=!0,y()}T.value=t}function U(e){if(e.pointerId!==O||(O=null,!E.value))return;let t=T.value,n=Math.abs(t)/Math.max(1,performance.now()-z);E.value=!1,Math.abs(t)>L||n>R?(D.value=!0,T.value=Math.sign(t||1)*(Math.abs(t)+240),i(`close`,r.toast.id)):(T.value=0,b())}(0,t.onBeforeUnmount)(()=>{_(),cancelAnimationFrame(f),S?.disconnect()});function W(){i(`close`,r.toast.id)}async function G(e){try{await e?.()}catch(e){console.error(`[feather-toast-vue] Action handler error:`,e)}}let K=(0,t.computed)(()=>({"--index":r.index,"--offset":`${r.offset}px`,"--h":r.height===void 0?void 0:`${r.height}px`,"--front-h":`${r.frontHeight}px`,"--swipe-x":`${T.value}px`,"--swipe-amount":Math.min(1,Math.abs(T.value)/260)}));return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`li`,{class:(0,t.normalizeClass)([`toast-card`,`toast-card--${e.toast.variant}`]),style:(0,t.normalizeStyle)(K.value),"data-mounted":d.value||void 0,"data-front":o.value||void 0,"data-visible":e.visible||void 0,"data-swiping":E.value||void 0,"data-swiped":D.value||void 0,role:e.toast.variant===`error`?`alert`:`status`,"aria-hidden":!e.visible||void 0,tabindex:`0`,onPointerdown:V,onPointermove:H,onPointerup:U,onPointercancel:U,onKeydown:r[2]||=(0,t.withKeys)(t=>e.toast.dismissible&&W(),[`esc`])},[(0,t.createElementVNode)(`div`,{ref_key:`contentEl`,ref:x,class:`toast-content`},[e.toast.variant===`loading`?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,M)):a[e.toast.variant]?((0,t.openBlock)(),(0,t.createElementBlock)(`svg`,{key:1,class:(0,t.normalizeClass)([`toast-icon`,`toast-icon--${e.toast.variant}`]),viewBox:`0 0 16 16`,fill:`none`,stroke:`currentColor`,"stroke-width":`1.5`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`,innerHTML:a[e.toast.variant]},null,10,N)):(0,t.createCommentVNode)(``,!0),(0,t.createElementVNode)(`div`,ee,[e.toast.component?((0,t.openBlock)(),(0,t.createBlock)((0,t.resolveDynamicComponent)(e.toast.component),{key:0,toast:e.toast,close:W},null,8,[`toast`])):((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,{key:1},[s.value?((0,t.openBlock)(),(0,t.createElementBlock)(`p`,te,[(0,t.createTextVNode)((0,t.toDisplayString)(s.value),1),(e.toast.count??1)>1?((0,t.openBlock)(),(0,t.createElementBlock)(`span`,{key:e.toast.count,class:`toast-count`},`×`+(0,t.toDisplayString)(e.toast.count),1)):(0,t.createCommentVNode)(``,!0)])):(0,t.createCommentVNode)(``,!0),c.value?((0,t.openBlock)(),(0,t.createElementBlock)(`p`,P,(0,t.toDisplayString)(c.value),1)):(0,t.createCommentVNode)(``,!0)],64))]),e.toast.action||e.toast.cancel?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,F,[e.toast.cancel?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:0,class:`toast-action-btn toast-action-btn--cancel`,onClick:r[0]||=(0,t.withModifiers)(t=>G(e.toast.cancel.onClick),[`stop`])},(0,t.toDisplayString)(e.toast.cancel.label),1)):(0,t.createCommentVNode)(``,!0),e.toast.action?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:1,class:`toast-action-btn`,onClick:r[1]||=(0,t.withModifiers)(t=>G(e.toast.action.onClick),[`stop`])},(0,t.toDisplayString)(e.toast.action.label),1)):(0,t.createCommentVNode)(``,!0)])):(0,t.createCommentVNode)(``,!0),e.toast.dismissible?((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{key:3,class:`toast-close`,"aria-label":`Dismiss`,onClick:(0,t.withModifiers)(W,[`stop`])},[...r[3]||=[(0,t.createElementVNode)(`svg`,{viewBox:`0 0 14 14`,fill:`none`,"aria-hidden":`true`},[(0,t.createElementVNode)(`path`,{d:`M2 2l10 10M12 2L2 12`,stroke:`currentColor`,"stroke-width":`1.5`,"stroke-linecap":`round`})],-1)]])):(0,t.createCommentVNode)(``,!0)],512),e.toast.showProgress||l.value!==void 0?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,I,[(0,t.createElementVNode)(`div`,{class:(0,t.normalizeClass)([`toast-progress-fill`,{"toast-progress-fill--countdown":e.toast.showProgress&&l.value===void 0}]),style:(0,t.normalizeStyle)(w.value)},null,6)])):(0,t.createCommentVNode)(``,!0)],46,j))}}),B={"aria-label":`Notifications`,class:`toast-region`},V=(0,t.defineComponent)({__name:`ToastContainer`,setup(e){let{toasts:n,config:r,dismiss:i}=A(),a=(0,t.ref)(!1),o=(0,t.ref)(!1),s=[`top-right`,`top-left`,`top-center`,`bottom-right`,`bottom-left`,`bottom-center`],c=(0,t.reactive)({}),l=(0,t.reactive)({}),u=(0,t.reactive)({}),d=(0,t.computed)(()=>{let e={};for(let t of s)e[t]=[];for(let t of n.value)e[t.position]?.unshift(t);return e});(0,t.watch)(()=>n.value.map(e=>e.id),e=>{for(let t of Object.keys(c))e.includes(t)||delete c[t]});function f(e){return!!(r.value.expand||l[e]||u[e])}function p(e,t){let n=0;for(let r=0;r<t;r++)n+=c[e[r].id]??0;return n}function m(e,t){c[e]=t}function h(e,t){t.pointerType===`mouse`&&(l[e]=!0)}function g(e,t){t.pointerType===`mouse`&&(l[e]=!1)}function _(e,t){t.pointerType!==`mouse`&&(u[e]=!0)}function v(e){if(e.pointerType!==`mouse`&&!e.target?.closest?.(`.toast-viewport`))for(let e of s)u[e]=!1}function y(){o.value=document.visibilityState===`hidden`}return(0,t.watch)(()=>n.value.length,e=>{if(e===0)for(let e of s)u[e]=l[e]=!1}),(0,t.onMounted)(()=>{a.value=!0,document.addEventListener(`pointerdown`,v),document.addEventListener(`visibilitychange`,y)}),(0,t.onBeforeUnmount)(()=>{document.removeEventListener(`pointerdown`,v),document.removeEventListener(`visibilitychange`,y)}),(e,n)=>a.value?((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{key:0,to:`body`},[(0,t.createElementVNode)(`section`,B,[((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(s,e=>(0,t.createVNode)(t.TransitionGroup,{key:e,tag:`ol`,name:`toast`,class:(0,t.normalizeClass)([`toast-viewport`,`toast-viewport--${e}`]),"data-y":e.startsWith(`top`)?`top`:`bottom`,"data-expanded":f(e)||void 0,"data-theme":(0,t.unref)(r).theme??`light`,"data-rich":(0,t.unref)(r).richColors||void 0,onPointerenter:t=>h(e,t),onPointerleave:t=>g(e,t),onPointerdown:t=>_(e,t)},{default:(0,t.withCtx)(()=>[((0,t.openBlock)(!0),(0,t.createElementBlock)(t.Fragment,null,(0,t.renderList)(d.value[e],(n,a)=>((0,t.openBlock)(),(0,t.createBlock)(z,{key:n.id,toast:n,index:a,offset:p(d.value[e],a),"front-height":c[d.value[e][0]?.id??``]??0,height:c[n.id],visible:a<((0,t.unref)(r).visibleToasts??3),paused:o.value||!!l[e]||!!u[e],onClose:(0,t.unref)(i),onHeight:m},null,8,[`toast`,`index`,`offset`,`front-height`,`height`,`visible`,`paused`,`onClose`]))),128))]),_:2},1032,[`class`,`data-y`,`data-expanded`,`data-theme`,`data-rich`,`onPointerenter`,`onPointerleave`,`onPointerdown`])),64))])])):(0,t.createCommentVNode)(``,!0)}}),H=`:root{--toast-bg:#fff;--toast-border:#00000014;--toast-text:#09090b;--toast-text-muted:#71717a;--toast-hover:#f4f4f5;--toast-shadow:0 4px 12px #00000014;--toast-radius:10px;--toast-width:356px;--toast-gap:14px;--toast-peek:14px;--toast-edge:24px;--toast-z:99999;--toast-c-success:#16a34a;--toast-c-error:#dc2626;--toast-c-warning:#d97706;--toast-c-info:#2563eb;--toast-c-muted:#71717a;--toast-c-offline:#6b7280;--toast-c-update:#8b5cf6;--toast-ease:cubic-bezier(.21, 1.02, .73, 1);--toast-duration:.4s}.toast-viewport[data-theme=dark]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}@media (prefers-color-scheme:dark){.toast-viewport[data-theme=system]{--toast-bg:#09090b;--toast-border:#ffffff1a;--toast-text:#fafafa;--toast-text-muted:#a1a1aa;--toast-hover:#ffffff14;--toast-shadow:0 4px 12px #0006}}.toast-viewport[data-rich] .toast-card--success{--toast-bg:#ecfdf3;--toast-border:#bffcd9;--toast-text:#008a2e}.toast-viewport[data-rich] .toast-card--error{--toast-bg:#fff0f0;--toast-border:#ffe0e1;--toast-text:#e60000}.toast-viewport[data-rich] .toast-card--warning{--toast-bg:#fffcf0;--toast-border:#fdf5d3;--toast-text:#dc7609}.toast-viewport[data-rich] .toast-card--info{--toast-bg:#f0f8ff;--toast-border:#d3e0fd;--toast-text:#0973dc}.toast-viewport[data-rich] .toast-card--update{--toast-bg:#f5f3ff;--toast-border:#e4defe;--toast-text:#6d28d9}.toast-viewport[data-rich][data-theme=dark] .toast-card--success{--toast-bg:#001f0f;--toast-border:#003d1c;--toast-text:#59f3a6}.toast-viewport[data-rich][data-theme=dark] .toast-card--error{--toast-bg:#2d0607;--toast-border:#4d0408;--toast-text:#ff9ea1}.toast-viewport[data-rich][data-theme=dark] .toast-card--warning{--toast-bg:#1d1f00;--toast-border:#3d3d00;--toast-text:#f3cf58}.toast-viewport[data-rich][data-theme=dark] .toast-card--info{--toast-bg:#000d1f;--toast-border:#00113d;--toast-text:#5896f3}.toast-viewport[data-rich][data-theme=dark] .toast-card--update{--toast-bg:#170b2e;--toast-border:#2e1a5c;--toast-text:#c4b5fd}.toast-viewport[data-rich] .toast-description{color:var(--toast-text);opacity:.8}.toast-viewport{--lift:-1;z-index:var(--toast-z);width:var(--toast-width);max-width:calc(100vw - var(--toast-edge) * 2);height:0;margin:0;padding:0;font-family:inherit;list-style:none;position:fixed}.toast-viewport[data-y=top]{--lift:1;top:var(--toast-edge)}.toast-viewport[data-y=bottom]{--lift:-1;bottom:var(--toast-edge)}.toast-viewport--top-right,.toast-viewport--bottom-right{right:var(--toast-edge)}.toast-viewport--top-left,.toast-viewport--bottom-left{left:var(--toast-edge)}.toast-viewport--top-center,.toast-viewport--bottom-center{left:50%;transform:translate(-50%)}.toast-card{--y:calc(var(--lift) * -100%);--s:1;z-index:calc(1000 - var(--index,0));height:var(--h,auto);box-sizing:border-box;background:var(--toast-bg);border-radius:var(--toast-radius);box-shadow:0 0 0 1px var(--toast-border), var(--toast-shadow);color:var(--toast-text);opacity:0;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:pan-y;transform:translate3d(var(--swipe-x,0px), var(--y), 0) scale(var(--s));transition:transform var(--toast-duration) var(--toast-ease), opacity var(--toast-duration) var(--toast-ease), height var(--toast-duration) var(--toast-ease), box-shadow .2s ease;will-change:transform, opacity;outline:none;margin:0;position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card{transform-origin:bottom;bottom:0}.toast-viewport[data-y=top] .toast-card{transform-origin:top;top:0}.toast-card:focus-visible{box-shadow:0 0 0 1px var(--toast-border), 0 0 0 3px #71717a59, var(--toast-shadow)}.toast-card:after{content:"";height:calc(var(--toast-gap) + 1px);position:absolute;left:0;right:0}.toast-viewport[data-y=bottom] .toast-card:after{bottom:100%}.toast-viewport[data-y=top] .toast-card:after{top:100%}.toast-card[data-mounted]{--y:calc(var(--lift) * var(--index) * var(--toast-peek));--s:calc(1 - var(--index) * .05);opacity:1}.toast-viewport:not([data-expanded]) .toast-card:not([data-front]){height:var(--front-h);overflow:hidden}.toast-viewport:not([data-expanded]) .toast-card:not([data-front])>*{opacity:0}.toast-viewport[data-expanded] .toast-card[data-mounted]{--y:calc(var(--lift) * (var(--offset) + var(--index) * var(--toast-gap)));--s:1}.toast-card[data-mounted]:not([data-visible]){opacity:0;pointer-events:none}.toast-card[data-swiping]{opacity:calc(1 - var(--swipe-amount,0) * .8);transition:opacity 0s, height var(--toast-duration) var(--toast-ease);cursor:grabbing}.toast-viewport .toast-card[data-mounted].toast-leave-active{pointer-events:none}.toast-viewport .toast-card[data-mounted].toast-leave-to{opacity:0}.toast-viewport .toast-card[data-mounted][data-front].toast-leave-to:not([data-swiped]){--y:calc(var(--lift) * -100%)}.toast-viewport .toast-card[data-mounted]:not([data-front]).toast-leave-to{--s:calc(1 - var(--index) * .05 - .05)}.toast-content{transition:opacity var(--toast-duration) var(--toast-ease);align-items:flex-start;gap:10px;padding:14px 16px;display:flex}.toast-icon,.toast-spinner{flex-shrink:0;width:16px;height:16px;margin-top:1px}.toast-icon--success{color:var(--toast-c-success)}.toast-icon--error{color:var(--toast-c-error)}.toast-icon--warning{color:var(--toast-c-warning)}.toast-icon--info{color:var(--toast-c-info)}.toast-icon--offline{color:var(--toast-c-offline)}.toast-icon--update{color:var(--toast-c-update)}.toast-viewport[data-rich] .toast-icon{color:currentColor}.toast-icon{animation:toast-icon-in .3s var(--toast-ease)}@keyframes toast-icon-in{0%{opacity:0;transform:scale(.6)}}@keyframes toast-spin{to{transform:rotate(360deg)}}.toast-spinner{box-sizing:border-box;border:1.5px solid var(--toast-border);border-top-color:var(--toast-text-muted);border-radius:50%;animation:.7s linear infinite toast-spin}.toast-body{flex:1;min-width:0}.toast-count{vertical-align:1px;color:var(--toast-text-muted);background:var(--toast-hover);animation:toast-count-pop .3s var(--toast-ease);border-radius:999px;margin-left:6px;padding:0 6px;font-size:11px;font-weight:600;line-height:18px;display:inline-block}@keyframes toast-count-pop{0%{transform:scale(1.5)}}.toast-title{letter-spacing:-.01em;color:var(--toast-text);overflow-wrap:anywhere;margin:0;font-size:13px;font-weight:500;line-height:1.45}.toast-description{color:var(--toast-text-muted);overflow-wrap:anywhere;margin:2px 0 0;font-size:12.5px;line-height:1.5}.toast-actions{flex-shrink:0;align-self:center;gap:6px;display:flex}.toast-action-btn{font:inherit;color:var(--toast-bg);background:var(--toast-text);cursor:pointer;white-space:nowrap;border:0;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:500;line-height:1.4;transition:opacity .15s,background .15s}.toast-action-btn:hover{opacity:.88}.toast-action-btn--cancel{color:var(--toast-text);box-shadow:inset 0 0 0 1px var(--toast-border);background:0 0}.toast-action-btn--cancel:hover{opacity:1;background:var(--toast-hover)}.toast-close{width:20px;height:20px;color:var(--toast-text-muted);cursor:pointer;opacity:.5;background:0 0;border:0;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;margin:-1px -4px 0 0;padding:0;transition:opacity .15s,background .15s;display:flex}.toast-card:hover .toast-close,.toast-close:focus-visible{opacity:1}.toast-close:hover{background:var(--toast-hover);color:var(--toast-text)}.toast-close svg{width:11px;height:11px}.toast-progress-track{border-radius:0 0 var(--toast-radius) var(--toast-radius);background:var(--toast-border);height:2px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.toast-progress-fill{background:var(--toast-text-muted);transform-origin:0;height:100%;transition:transform .2s linear}.toast-card--success .toast-progress-fill{background:var(--toast-c-success)}.toast-card--error .toast-progress-fill{background:var(--toast-c-error)}.toast-card--warning .toast-progress-fill{background:var(--toast-c-warning)}.toast-card--info .toast-progress-fill{background:var(--toast-c-info)}.toast-card--update .toast-progress-fill{background:var(--toast-c-update)}@keyframes toast-countdown{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.toast-progress-fill--countdown{animation-name:toast-countdown;animation-timing-function:linear;animation-fill-mode:forwards}@media (hover:none){.toast-close{opacity:1;width:28px;height:28px;margin:-5px -8px -5px 0}.toast-action-btn{padding:6px 12px}}@media (width<=600px){.toast-viewport{--toast-edge:12px;--toast-radius:18px;--toast-gap:6px;--toast-peek:6px;left:max(var(--toast-edge), env(safe-area-inset-left));right:max(var(--toast-edge), env(safe-area-inset-right));width:auto;max-width:none;transform:none}.toast-viewport[data-y=top]{top:max(var(--toast-edge), env(safe-area-inset-top))}.toast-viewport[data-y=bottom]{bottom:max(var(--toast-edge), env(safe-area-inset-bottom))}.toast-card{width:fit-content;max-width:100%;margin-inline:auto}.toast-content{flex-wrap:wrap;align-items:center;gap:6px 8px;padding:8px 12px}.toast-icon,.toast-spinner{width:13px;height:13px;margin-top:0}.toast-title{font-size:12px;line-height:1.35}.toast-description{margin-top:1px;font-size:11.5px;line-height:1.35}.toast-actions{flex-basis:100%;order:1;justify-content:flex-end}.toast-action-btn{border-radius:999px;padding:3px 10px;font-size:11.5px}.toast-close{width:20px;height:20px;margin:-2px -6px -2px 0}.toast-close svg{width:9px;height:9px}}@media (prefers-reduced-motion:reduce){.toast-card{transition:opacity .2s,height}.toast-icon,.toast-count,.toast-progress-fill--countdown{animation:none}}`,U=`feather-toast-root`,W=`feather-toast-style`,G={install(e,n={}){let r=k();if(e.provide(`toast`,r),typeof document>`u`)return;if(n.injectStyles!==!1&&!document.getElementById(W)){let e=document.createElement(`style`);e.id=W,e.textContent=H,document.head.appendChild(e)}let i=document.getElementById(U);i||(i=document.createElement(`div`),i.id=U,document.body.appendChild(i)),S();let a=(0,t.createVNode)(V);a.appContext=e._context,(0,t.render)(a,i);let o=e.unmount;e.unmount=(...e)=>{(0,t.render)(null,i),i?.parentNode&&i.parentNode.removeChild(i),o(...e)}}};function K(e){return{id:e.id,title:(0,t.toValue)(e.title),description:(0,t.toValue)(e.description),variant:e.variant,position:e.position,count:e.count??1,action:e.action?.label,cancel:e.cancel?.label}}function q(e,t){return t===void 0?!0:e===void 0?!1:typeof t==`string`?e===t:t.test(e)}function J(e,t){return q(e.title,t.title)&&q(e.description,t.description)&&(t.variant===void 0||e.variant===t.variant)&&(t.position===void 0||e.position===t.position)}function Y(e){return e.length?e.map(e=>` - [${e.variant}] ${JSON.stringify(e.title)}${e.description?` — ${JSON.stringify(e.description)}`:``}`).join(`
|
|
2
2
|
`):` (no toasts)`}function X(){return k().toasts.value}function Z(){return X().map(K)}function Q(e){return Z().find(t=>J(t,e))}function $(e){let t=Q(e);if(t)return t;throw Error(`Expected a toast matching ${String(JSON.stringify(e,(e,t)=>t instanceof RegExp?String(t):t))}\nActive toasts:\n${Y(Z())}`)}function ne(){let e=Z();if(e.length)throw Error(`Expected no toasts, found ${e.length}:\n${Y(e)}`)}async function re(e,t=`action`){let{id:n}=$(e),r=X().find(e=>e.id===n)?.[t];if(!r)throw Error(`Toast ${JSON.stringify(n)} has no ${t} button`);await r.onClick()}var ie=T;e.CreateFeatherToast=G,e.ToastContainer=V,e.clickToastAction=re,e.expectNoToasts=ne,e.expectToast=$,e.findToast=Q,e.getToasts=Z,e.resetToasts=ie,e.useFeatherToast=k,e.useToast=A});
|
package/package.json
CHANGED