sonner-wc 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -0
- package/dist/constants.d.ts +0 -2
- package/dist/icons.d.ts +0 -1
- package/dist/sonner-toast.d.ts +1 -2
- package/dist/sonner-toaster.d.ts +1 -2
- package/dist/sonner-wc.bundle.js +33 -25
- package/dist/sonner-wc.bundle.js.map +8 -7
- package/dist/sonner-wc.js +137 -136
- package/dist/sonner-wc.js.map +8 -7
- package/dist/ssr.d.ts +1 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
[Sonner](https://github.com/emilkowalski/sonner)'s toast UX as a framework-agnostic web component.
|
|
4
4
|
Drop it into anything — vanilla HTML, Vue, Svelte, htmx — same API, same look.
|
|
5
5
|
|
|
6
|
+
**[Docs & live demo →](https://clickblipclick.github.io/sonner-wc)**
|
|
7
|
+
|
|
6
8
|
```html
|
|
7
9
|
<script type="module" src="https://unpkg.com/sonner-wc/dist/sonner-wc.bundle.js"></script>
|
|
8
10
|
|
package/dist/constants.d.ts
CHANGED
|
@@ -1,6 +1,4 @@
|
|
|
1
1
|
export declare const VISIBLE_TOASTS_AMOUNT = 3;
|
|
2
|
-
export declare const VIEWPORT_OFFSET = "24px";
|
|
3
|
-
export declare const MOBILE_VIEWPORT_OFFSET = "16px";
|
|
4
2
|
export declare const TOAST_LIFETIME = 4000;
|
|
5
3
|
export declare const TOAST_WIDTH = 356;
|
|
6
4
|
export declare const GAP = 14;
|
package/dist/icons.d.ts
CHANGED
|
@@ -4,5 +4,4 @@ export declare const WARNING_ICON = "<svg xmlns=\"http://www.w3.org/2000/svg\" v
|
|
|
4
4
|
export declare const INFO_ICON = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" height=\"20\" width=\"20\"><path fill-rule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z\" clip-rule=\"evenodd\"/></svg>";
|
|
5
5
|
export declare const ERROR_ICON = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\" height=\"20\" width=\"20\"><path fill-rule=\"evenodd\" d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z\" clip-rule=\"evenodd\"/></svg>";
|
|
6
6
|
export declare const CLOSE_ICON = "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\"></line><line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\"></line></svg>";
|
|
7
|
-
export declare const LOADING_SPINNER: string;
|
|
8
7
|
export declare function getTypeIcon(type: ToastType): string | null;
|
package/dist/sonner-toast.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { HTMLElementCtor } from './ssr.js';
|
|
1
2
|
import type { SonnerToastElement, ToastContent, ToastOptions, ToastType } from './types.js';
|
|
2
|
-
declare const HTMLElementCtor: typeof HTMLElement;
|
|
3
3
|
export declare class SonnerToast extends HTMLElementCtor implements SonnerToastElement {
|
|
4
4
|
#private;
|
|
5
5
|
static get observedAttributes(): string[];
|
|
@@ -26,4 +26,3 @@ export declare class SonnerToast extends HTMLElementCtor implements SonnerToastE
|
|
|
26
26
|
/** Called by the toaster to pause/resume this toast's auto-dismiss timer. */
|
|
27
27
|
setPaused(paused: boolean): void;
|
|
28
28
|
}
|
|
29
|
-
export {};
|
package/dist/sonner-toaster.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
+
import { HTMLElementCtor } from './ssr.js';
|
|
1
2
|
import type { SonnerToastElement, SonnerToasterElement } from './types.js';
|
|
2
|
-
declare const HTMLElementCtor: typeof HTMLElement;
|
|
3
3
|
export declare class SonnerToaster extends HTMLElementCtor implements SonnerToasterElement {
|
|
4
4
|
#private;
|
|
5
5
|
static get observedAttributes(): string[];
|
|
@@ -17,4 +17,3 @@ export declare class SonnerToaster extends HTMLElementCtor implements SonnerToas
|
|
|
17
17
|
announceUrgent(text: string): void;
|
|
18
18
|
dismissAll(): void;
|
|
19
19
|
}
|
|
20
|
-
export {};
|
package/dist/sonner-wc.bundle.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var
|
|
1
|
+
var E=3,y=4000,V=356,l=14,W=45,U=0.11,C=200,j=["altKey","KeyT"];var L='<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>';function H(a){switch(a){case"success":return'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" height="20" width="20"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z" clip-rule="evenodd"/></svg>';case"info":return'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" height="20" width="20"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z" clip-rule="evenodd"/></svg>';case"warning":return'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" height="20" width="20"><path fill-rule="evenodd" d="M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z" clip-rule="evenodd"/></svg>';case"error":return'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" height="20" width="20"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd"/></svg>';case"loading":return null;default:return null}}var w=new Map,u=new Set,ia=1;function k(){return ia++}function M(a){w.set(a.toastId,a)}function R(a){if(w.get(a.toastId)===a)w.delete(a.toastId)}function v(a){return w.get(a)}function q(a){u.add(a)}function B(a){u.delete(a)}function P(){let a;for(let r of u)a=r;return a}function N(){for(let a of u)a.dismissAll()}var S=typeof HTMLElement!=="undefined"?HTMLElement:class{};var O=`:host {
|
|
2
2
|
position: fixed;
|
|
3
3
|
width: var(--width);
|
|
4
4
|
font-family:
|
|
@@ -48,15 +48,24 @@ var $=3;var y=4000,K=356,l=14,V=45,W=0.11,E=200,G=["altKey","KeyT"];var j='<svg
|
|
|
48
48
|
--toast-close-button-start: 0;
|
|
49
49
|
--toast-close-button-end: unset;
|
|
50
50
|
--toast-close-button-transform: translate(-35%, -35%);
|
|
51
|
+
inset: unset;
|
|
52
|
+
border: none;
|
|
53
|
+
overflow: visible;
|
|
54
|
+
background: transparent;
|
|
51
55
|
box-sizing: border-box;
|
|
52
56
|
padding: 0;
|
|
53
57
|
margin: 0;
|
|
54
58
|
outline: none;
|
|
59
|
+
contain: layout style;
|
|
55
60
|
z-index: 999999999;
|
|
56
61
|
transition: transform 400ms ease;
|
|
57
62
|
display: block;
|
|
58
63
|
}
|
|
59
64
|
|
|
65
|
+
::backdrop {
|
|
66
|
+
display: none;
|
|
67
|
+
}
|
|
68
|
+
|
|
60
69
|
:host(:focus-visible) {
|
|
61
70
|
outline: 2px solid var(--gray9);
|
|
62
71
|
outline-offset: 4px;
|
|
@@ -170,13 +179,15 @@ var $=3;var y=4000,K=356,l=14,V=45,W=0.11,E=200,G=["altKey","KeyT"];var j='<svg
|
|
|
170
179
|
transform: none;
|
|
171
180
|
}
|
|
172
181
|
}
|
|
173
|
-
`;var
|
|
182
|
+
`;var F=`:host {
|
|
174
183
|
--y: translateY(100%);
|
|
175
184
|
--lift-amount: calc(var(--lift) * var(--gap, 14px));
|
|
176
185
|
z-index: var(--z-index);
|
|
177
186
|
position: absolute;
|
|
178
187
|
opacity: 0;
|
|
179
188
|
transform: var(--y);
|
|
189
|
+
contain: layout style;
|
|
190
|
+
will-change: transform, opacity;
|
|
180
191
|
touch-action: none;
|
|
181
192
|
transition:
|
|
182
193
|
transform 400ms,
|
|
@@ -331,16 +342,14 @@ var $=3;var y=4000,K=356,l=14,V=45,W=0.11,E=200,G=["altKey","KeyT"];var j='<svg
|
|
|
331
342
|
animation: sonner-fade-in 300ms ease forwards;
|
|
332
343
|
}
|
|
333
344
|
|
|
334
|
-
[data-button]
|
|
335
|
-
::slotted(button[slot='action']),
|
|
336
|
-
::slotted(button[slot='cancel']) {
|
|
345
|
+
[data-button] {
|
|
337
346
|
border-radius: 4px;
|
|
338
347
|
padding-left: 8px;
|
|
339
348
|
padding-right: 8px;
|
|
340
349
|
height: 24px;
|
|
341
350
|
font-size: 12px;
|
|
342
351
|
background: var(--normal-text);
|
|
343
|
-
color:
|
|
352
|
+
color: var(--normal-bg);
|
|
344
353
|
margin-left: var(--toast-button-margin-start);
|
|
345
354
|
margin-right: var(--toast-button-margin-end);
|
|
346
355
|
border: none;
|
|
@@ -358,8 +367,7 @@ var $=3;var y=4000,K=356,l=14,V=45,W=0.11,E=200,G=["altKey","KeyT"];var j='<svg
|
|
|
358
367
|
[data-button]:focus-visible {
|
|
359
368
|
box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.4);
|
|
360
369
|
}
|
|
361
|
-
[data-cancel]
|
|
362
|
-
::slotted(button[slot='cancel']) {
|
|
370
|
+
[data-cancel] {
|
|
363
371
|
color: var(--normal-text);
|
|
364
372
|
background: var(--cancel-bg, rgba(0, 0, 0, 0.08));
|
|
365
373
|
}
|
|
@@ -725,24 +733,24 @@ var $=3;var y=4000,K=356,l=14,V=45,W=0.11,E=200,G=["altKey","KeyT"];var j='<svg
|
|
|
725
733
|
width: 100%;
|
|
726
734
|
}
|
|
727
735
|
}
|
|
728
|
-
`;var
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
736
|
+
`;var Y=null,z=null;function A(){if(!Y)Y=new CSSStyleSheet,Y.replaceSync(O);return Y}function I(){if(!z)z=new CSSStyleSheet,z.replaceSync(F);return z}function $(a){return a==="error"||a==="warning"}function p(a,r){return a.hasAttribute(r)&&a.getAttribute(r)!=="false"}function X(a,r,t){if(t)a.setAttribute(r,"");else a.removeAttribute(r)}function K(a,r){for(let t of Array.from(a.children))if(t.getAttribute("slot")===r)a.removeChild(t)}function D(a,r){let t=document.createElement("template");t.innerHTML=a;let n=t.content.firstElementChild;if(n)n.setAttribute("slot",r);return n}function T(a,r,t){if(K(a,r),t==null||t==="")return;let n=typeof t==="function"?t():t;if(n instanceof Node){if(n instanceof Element)n.setAttribute("slot",r);a.appendChild(n)}else{let i=document.createElement("span");i.setAttribute("slot",r),i.textContent=String(n),a.appendChild(i)}}function aa(a,r,t,n,i){K(a,t);let o=r.querySelector(`[data-${t}-host]`);if(o){for(let d of Array.from(o.children))if(d.tagName==="BUTTON")o.removeChild(d)}if(!n)return;if(n instanceof HTMLElement){n.setAttribute("slot",t),a.appendChild(n);return}if(!o)return;let f=document.createElement("button");f.setAttribute("type","button"),f.setAttribute("data-button",""),f.setAttribute(t==="cancel"?"data-cancel":"data-action",""),f.textContent=n.label,f.addEventListener("click",(d)=>{if(n.onClick?.(d),d.defaultPrevented&&t==="action")return;i()}),o.appendChild(f)}var ea=Array.from({length:12},()=>'<div class="sonner-loading-bar"></div>').join(""),ca=(()=>{if(typeof document==="undefined")return null;let a=document.createElement("template");return a.innerHTML=`
|
|
737
|
+
<div data-frame part="frame">
|
|
738
|
+
<button type="button" data-close-button part="close-button" hidden aria-label="Close toast"></button>
|
|
739
|
+
<div data-icon part="icon">
|
|
740
|
+
<slot name="icon"></slot>
|
|
741
|
+
<div class="sonner-loading-wrapper" aria-hidden="true">
|
|
742
|
+
<div class="sonner-spinner">${ea}</div>
|
|
743
|
+
</div>
|
|
735
744
|
</div>
|
|
745
|
+
<div data-content part="content">
|
|
746
|
+
<div data-title part="title"><slot name="title"></slot></div>
|
|
747
|
+
<div data-description part="description"><slot name="description"></slot></div>
|
|
748
|
+
</div>
|
|
749
|
+
<div data-cancel-host part="cancel"><slot name="cancel"></slot></div>
|
|
750
|
+
<div data-action-host part="action"><slot name="action"></slot></div>
|
|
751
|
+
<slot part="custom"></slot>
|
|
736
752
|
</div>
|
|
737
|
-
<div data-content part="content">
|
|
738
|
-
<div data-title part="title"><slot name="title"></slot></div>
|
|
739
|
-
<div data-description part="description"><slot name="description"></slot></div>
|
|
740
|
-
</div>
|
|
741
|
-
<slot name="cancel"></slot>
|
|
742
|
-
<slot name="action"></slot>
|
|
743
|
-
<slot part="custom"></slot>
|
|
744
|
-
</div>
|
|
745
|
-
`;class b extends da{static get observedAttributes(){return["type","duration","dismissible","position","close-button","rich-colors","invert"]}toastId=0;#o;#f;#k;#s;#t;#e=null;#d=y;#a=null;#c=0;#n=new Set;#h=null;#x=0;#i=null;#y=null;#w=!1;#b=!1;#J=!1;#u;#v;#S=null;#l=null;constructor(){super();this.#o=this.attachShadow({mode:"open"}),this.#o.adoptedStyleSheets=[N()];let a=document.createElement("template");a.innerHTML=ia,this.#o.appendChild(a.content.cloneNode(!0)),this.#f=this.#o.querySelector("[data-close-button]"),this.#k=this.#o.querySelector("[data-icon]"),this.#s=this.#o.querySelector("[data-title]"),this.#t=this.#o.querySelector("[data-description]"),this.#f.innerHTML=j,this.#f.addEventListener("click",()=>this.dismiss());let r=this.#o.querySelector('slot[name="icon"]'),t=this.#o.querySelector('slot[name="description"]');r.addEventListener("slotchange",()=>this.#Z("icon",r)),t.addEventListener("slotchange",()=>this.#Z("description",t)),this.addEventListener("pointerdown",this.#C),this.addEventListener("pointermove",this.#L),this.addEventListener("pointerup",this.#p),this.addEventListener("pointercancel",this.#p),this.addEventListener("mouseenter",()=>this.#W("hover-self")),this.addEventListener("mouseleave",()=>this.#E("hover-self")),this.addEventListener("focusin",(o)=>{if(this.#W("focus-self"),this.#l)return;let n=o.relatedTarget;if(n&&!this.contains(n))this.#l=n}),this.addEventListener("focusout",()=>this.#E("focus-self")),this.addEventListener("keydown",(o)=>{if(o.key==="Escape"&&this.#G())o.stopPropagation(),this.dismiss()})}connectedCallback(){if(!this.toastId)this.toastId=this.getAttribute("id")||0;if(!this.hasAttribute("tabindex"))this.tabIndex=0;if(this.#$(),this.#K(),this.#V(),this.#z(),this.#X(),this.#Y(),this.setAttribute("data-sonner-toast",""),!this.hasAttribute("aria-atomic"))this.setAttribute("aria-atomic","true");if(this.setAttribute("data-mounted","false"),this.setAttribute("data-removed","false"),this.setAttribute("data-swiping","false"),this.setAttribute("data-swiped","false"),this.setAttribute("data-swipe-out","false"),!this.hasAttribute("data-styled"))this.setAttribute("data-styled","true");U(this),document.addEventListener("visibilitychange",this.#j),requestAnimationFrame(()=>{this.#w=!0,this.setAttribute("data-mounted","true"),this.dispatchEvent(new CustomEvent("sonner-toast-mounted",{bubbles:!0,composed:!0})),this.#g()})}disconnectedCallback(){if(this.#a)clearTimeout(this.#a);document.removeEventListener("visibilitychange",this.#j),C(this)}attributeChangedCallback(a,r,t){if(!this.isConnected)return;switch(a){case"type":this.#$();break;case"duration":this.#e=this.#_(),this.#d=this.#e??y;break;case"dismissible":this.#K();break;case"position":this.#V();break;case"close-button":this.#Y();break;case"rich-colors":this.#z();break;case"invert":this.#X();break}}get toastType(){return this.getAttribute("type")||"default"}dismiss(){if(this.#b||this.#J)return;if(this.#J=!0,this.#b=!0,this.setAttribute("data-removed","true"),this.#a)clearTimeout(this.#a);this.dispatchEvent(new CustomEvent("sonner-toast-dismissed",{bubbles:!0,composed:!0})),setTimeout(()=>{this.#r(),this.#u?.(this),this.remove()},E)}#r(){if(!this.#l)return;let a=document.activeElement;if(!a||!this.contains(a))return;let r=this.#l;if(!r.isConnected||typeof r.focus!=="function")return;r.focus()}update(a){let r=a.type!==void 0&&a.type!==this.toastType,t=Q(this.toastType);if(a.type!==void 0)this.setAttribute("type",a.type);let o=!1;if(a.duration!==void 0)this.setAttribute("duration",String(a.duration)),this.#e=a.duration,this.#d=a.duration,o=!0;else if(r)this.#e=null,this.removeAttribute("duration"),this.#d=0,o=!0;if(a.dismissible!==void 0)if(a.dismissible)this.setAttribute("dismissible","");else this.removeAttribute("dismissible");if(a.position!==void 0)this.setAttribute("position",a.position);if(a.closeButton!==void 0)if(a.closeButton)this.setAttribute("close-button","");else this.removeAttribute("close-button");if(a.richColors!==void 0)if(a.richColors)this.setAttribute("rich-colors","");else this.removeAttribute("rich-colors");if(a.invert!==void 0)if(a.invert)this.setAttribute("invert","");else this.removeAttribute("invert");if(a.icon!==void 0)this.setIcon(a.icon);if(a.title!==void 0)this.setTitle(a.title);if(a.description!==void 0)this.setDescription(a.description);if(a.action!==void 0)F(this,"action",a.action,()=>this.dismiss());if(a.cancel!==void 0)F(this,"cancel",a.cancel,()=>this.dismiss());if(a.className)this.className=a.className;if(a.testId!==void 0)this.setAttribute("data-testid",a.testId);if(a.closeButtonAriaLabel!==void 0)this.#S=a.closeButtonAriaLabel||null,this.#Q();if(a.onDismiss)this.#u=a.onDismiss;if(a.onAutoClose)this.#v=a.onAutoClose;if(o)this.#U();if(this.#w&&r&&!t&&Q(this.toastType)){let d=Array.from(this.children).find((f)=>f.getAttribute("slot")==="title")?.textContent?.trim();if(d)this.closest("sonner-toaster")?.announceUrgent(d)}this.dispatchEvent(new CustomEvent("sonner-toast-updated",{bubbles:!0,composed:!0}))}setTitle(a){O(this,"title",a),this.#Q()}#Q(){if(this.#S){this.#f.setAttribute("aria-label",this.#S);return}let r=Array.from(this.children).find((t)=>t.getAttribute("slot")==="title")?.textContent?.trim();this.#f.setAttribute("aria-label",r?`Close: ${r}`:"Close toast")}setDescription(a){O(this,"description",a)}setIcon(a){for(let r of Array.from(this.children))if(r.getAttribute("slot")==="icon")this.removeChild(r);if(a==null)return;if(a instanceof Node){if(a instanceof Element)a.setAttribute("slot","icon");this.appendChild(a)}else{let r=document.createElement("template");r.innerHTML=a;let t=r.content.firstElementChild;if(t)t.setAttribute("slot","icon"),this.appendChild(t)}}setHandlers(a){this.#u=a.onDismiss,this.#v=a.onAutoClose}setPaused(a){if(a)this.#W("toaster");else this.#E("toaster")}#Z(a,r){if(r.assignedNodes().length>0)this.setAttribute(`data-has-${a}`,"");else this.removeAttribute(`data-has-${a}`)}#$(){let a=this.toastType;this.setAttribute("data-type",a);let r=Q(a);if(this.setAttribute("role",r?"alert":"status"),this.setAttribute("aria-live",r?"assertive":"polite"),a==="loading"){this.setAttribute("data-promise","true");for(let t of Array.from(this.children))if(t.getAttribute("slot")==="icon"&&t.hasAttribute("data-sonner-default-icon"))this.removeChild(t)}else if(this.removeAttribute("data-promise"),!Array.from(this.children).some((o)=>{if(o.getAttribute("slot")!=="icon")return!1;return!o.hasAttribute("data-sonner-default-icon")})){for(let n of Array.from(this.children))if(n.getAttribute("slot")==="icon"&&n.hasAttribute("data-sonner-default-icon"))this.removeChild(n);let o=p(a);if(o){let n=document.createElement("template");n.innerHTML=o;let d=n.content.firstElementChild;if(d)d.setAttribute("slot","icon"),d.setAttribute("data-sonner-default-icon",""),this.appendChild(d)}}}#K(){let a=this.getAttribute("dismissible")!=="false";this.setAttribute("data-dismissible",String(a))}#V(){let a=this.getAttribute("position");if(!a)return;let[r,t]=a.split("-");if(r)this.setAttribute("data-y-position",r);if(t)this.setAttribute("data-x-position",t)}#Y(){let a=this.hasAttribute("close-button")&&this.getAttribute("close-button")!=="false";this.#f.hidden=!a}#z(){let a=this.hasAttribute("rich-colors")&&this.getAttribute("rich-colors")!=="false";this.setAttribute("data-rich-colors",String(a))}#X(){let a=this.hasAttribute("invert")&&this.getAttribute("invert")!=="false";this.setAttribute("data-invert",String(a))}#_(){let a=this.getAttribute("duration");if(a==null)return null;if(a==="Infinity")return 1/0;let r=Number(a);return Number.isFinite(r)||r===1/0?r:null}#m(){let a=this.#e??this.#_();if(a!==null)return a;if(this.toastType==="loading")return 1/0;return y}#g(){if(!this.#w||this.#b)return;if(this.#n.size>0)return;if(this.#a!==null)return;let a=this.#m();if(a===1/0)return;this.#d=this.#d>0?this.#d:a,this.#c=Date.now(),this.#a=setTimeout(()=>{this.#a=null,this.#v?.(this),this.dispatchEvent(new CustomEvent("sonner-toast-autoclosed",{bubbles:!0,composed:!0})),this.dismiss()},this.#d)}#W(a){let r=this.#n.size===0;if(this.#n.add(a),r&&this.#a!==null){clearTimeout(this.#a),this.#a=null;let t=Date.now()-this.#c;this.#d=Math.max(0,this.#d-t)}}#E(a){if(!this.#n.delete(a))return;if(this.#n.size===0&&!this.#b)this.#g()}#U(){if(this.#a)clearTimeout(this.#a),this.#a=null;this.#d=this.#m(),this.#g()}#j=()=>{if(document.visibilityState==="hidden")this.#W("doc-hidden");else this.#E("doc-hidden")};#G(){return this.getAttribute("dismissible")!=="false"}#C=(a)=>{if(a.button===2)return;if(this.toastType==="loading"||!this.#G())return;let r=a.composedPath()[0];if(r){if(r.tagName==="BUTTON"||typeof r.closest==="function"&&r.closest("button"))return}this.#x=Date.now();try{this.setPointerCapture(a.pointerId)}catch{}if(this.setAttribute("data-swiping","true"),this.#h={x:a.clientX,y:a.clientY},!this.#y){let t=this.getAttribute("data-y-position"),o=this.getAttribute("data-x-position"),n=[];if(t==="top"||t==="bottom")n.push(t);if(o==="left"||o==="right")n.push(o);this.#y=n.length>0?n:["bottom","right"]}};#L=(a)=>{if(!this.#h||!this.#G())return;if((window.getSelection()?.toString().length??0)>0)return;let r=a.clientY-this.#h.y,t=a.clientX-this.#h.x,o=this.#y;if(!this.#i&&(Math.abs(t)>1||Math.abs(r)>1))this.#i=Math.abs(t)>Math.abs(r)?"x":"y";let n=(h)=>1/(1.5+Math.abs(h)/20),d=0,f=0;if(this.#i==="y"){if(o.includes("top")||o.includes("bottom"))if(o.includes("top")&&r<0||o.includes("bottom")&&r>0)f=r;else{let h=r*n(r);f=Math.abs(h)<Math.abs(r)?h:r}}else if(this.#i==="x"){if(o.includes("left")||o.includes("right"))if(o.includes("left")&&t<0||o.includes("right")&&t>0)d=t;else{let h=t*n(t);d=Math.abs(h)<Math.abs(t)?h:t}}if(Math.abs(d)>0||Math.abs(f)>0)this.setAttribute("data-swiped","true");this.style.setProperty("--swipe-amount-x",`${d}px`),this.style.setProperty("--swipe-amount-y",`${f}px`)};#p=()=>{if(this.getAttribute("data-swipe-out")==="true"||!this.#G()){this.#h=null,this.#i=null,this.setAttribute("data-swiping","false");return}let a=parseFloat(this.style.getPropertyValue("--swipe-amount-x"))||0,r=parseFloat(this.style.getPropertyValue("--swipe-amount-y"))||0,t=Math.max(1,Date.now()-this.#x),o=this.#i==="x"?a:r,n=Math.abs(o)/t;if(Math.abs(o)>=V||n>W){if(this.#i==="x")this.setAttribute("data-swipe-direction",a>0?"right":"left");else this.setAttribute("data-swipe-direction",r>0?"down":"up");this.setAttribute("data-swipe-out","true"),this.dismiss()}else this.style.setProperty("--swipe-amount-x","0px"),this.style.setProperty("--swipe-amount-y","0px"),this.setAttribute("data-swiped","false");this.setAttribute("data-swiping","false"),this.#h=null,this.#i=null}}if(typeof customElements!=="undefined"&&!customElements.get("sonner-toast"))customElements.define("sonner-toast",b);var fa=typeof HTMLElement!=="undefined"?HTMLElement:class{};function A(a,r){if(a==null)return r;if(typeof a==="number")return`${a}px`;return a}function I(a,r,t,o){let n=["top","right","bottom","left"];if(r==null||typeof r==="string"||typeof r==="number"){let d=A(r,o);for(let f of n)a.style.setProperty(`${t}-${f}`,d)}else for(let d of n)a.style.setProperty(`${t}-${d}`,A(r[d],o))}class m extends fa{static get observedAttributes(){return["position","theme","rich-colors","expand","duration","gap","visible-toasts","close-button","invert","dir","offset","mobile-offset","hotkey","container-aria-label"]}#o;#f;#k;#s;#t=[];#e=new Map;#d=!1;#a=!1;#c=!1;#n=null;#h=null;constructor(){super();this.#o=this.attachShadow({mode:"open"}),this.#o.adoptedStyleSheets=[M()],this.#o.innerHTML='<div data-frame part="frame"><slot></slot></div><div data-alert-announcer role="alert" aria-live="assertive" aria-atomic="true" style="position:absolute;left:0;top:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;pointer-events:none"></div>',this.#f=this.#o.querySelector("[data-alert-announcer]"),this.#k=new MutationObserver((a)=>{let r=!1;for(let t of a){for(let o of Array.from(t.addedNodes))if(o instanceof b)this.#t.unshift(o),this.#s.observe(o),this.#l(o),r=!0;for(let o of Array.from(t.removedNodes))if(o instanceof b)this.#t=this.#t.filter((n)=>n!==o),this.#e.delete(o),this.#s.unobserve(o),r=!0}if(r)this.#r({remeasure:!0})}),this.#s=new ResizeObserver(()=>this.#r({remeasure:!1})),this.addEventListener("mouseenter",this.#Z),this.addEventListener("mouseleave",this.#$),this.addEventListener("focusin",this.#K),this.addEventListener("focusout",this.#V),this.addEventListener("sonner-toast-dismissed",()=>this.#r({remeasure:!1})),this.addEventListener("sonner-toast-updated",()=>this.#r({remeasure:!0})),this.addEventListener("sonner-toast-mounted",()=>this.#r({remeasure:!0}))}connectedCallback(){if(!this.hasAttribute("tabindex"))this.tabIndex=-1;if(!this.hasAttribute("role"))this.setAttribute("role","region");if(!this.hasAttribute("aria-label"))this.setAttribute("aria-label",this.getAttribute("container-aria-label")??"Notifications");this.#_(),this.setAttribute("data-sonner-toaster",""),this.#i(),this.#y(),this.#w(),this.#b(),this.#J(),this.#u(),this.#k.observe(this,{childList:!0});for(let a of Array.from(this.children))if(a instanceof b)this.#t.unshift(a),this.#s.observe(a),this.#l(a);document.addEventListener("keydown",this.#z),window.addEventListener("resize",this.#Y),L(this),this.#r({remeasure:!0})}disconnectedCallback(){if(this.#k.disconnect(),this.#s.disconnect(),document.removeEventListener("keydown",this.#z),window.removeEventListener("resize",this.#Y),this.#n&&this.#h)this.#n.removeEventListener("change",this.#h);H(this)}attributeChangedCallback(a,r,t){if(!this.isConnected)return;switch(a){case"position":this.#i(),this.#v(),this.#r();break;case"theme":this.#y();break;case"dir":this.#w();break;case"gap":this.#b(),this.#r();break;case"visible-toasts":this.#r();break;case"expand":this.#a=this.hasAttribute("expand");for(let o of this.#t)o.setPaused(this.#a||this.#c);this.#r();break;case"close-button":case"rich-colors":case"invert":this.#S(a);break;case"offset":case"mobile-offset":this.#u();break;case"container-aria-label":this.setAttribute("aria-label",this.getAttribute("container-aria-label")??"Notifications");break;case"hotkey":this.#_();break}}addToast(a){return this.appendChild(a),a}announceUrgent(a){this.#f.textContent="",requestAnimationFrame(()=>{this.#f.textContent=a})}dismissAll(){for(let a of Array.from(this.children))if(a instanceof b)a.dismiss()}#x(){return this.getAttribute("position")||"bottom-right"}#i(){let[a,r]=this.#x().split("-");if(a)this.setAttribute("data-y-position",a);if(r)this.setAttribute("data-x-position",r)}#y(){if(this.#n&&this.#h)this.#n.removeEventListener("change",this.#h),this.#n=null,this.#h=null;let a=this.getAttribute("theme")||"light";if(a==="system"){this.#n=window.matchMedia("(prefers-color-scheme: dark)");let r=(t)=>{this.setAttribute("data-sonner-theme",t.matches?"dark":"light")};this.#h=r,this.#n.addEventListener("change",r),r(this.#n)}else this.setAttribute("data-sonner-theme",a)}#w(){let a=this.getAttribute("dir");if(a==="auto"||!a){let r=window.getComputedStyle(document.documentElement).direction||"ltr";this.setAttribute("dir",r)}}#b(){let a=this.getAttribute("gap"),r=a?Number(a):l;this.style.setProperty("--gap",`${Number.isFinite(r)?r:l}px`)}#J(){this.style.setProperty("--width",`${K}px`)}#u(){let a=this.getAttribute("offset"),r=this.getAttribute("mobile-offset");I(this,a??void 0,"--offset","24px"),I(this,r??void 0,"--mobile-offset","16px")}#v(){for(let a of this.#t)if(!a.hasAttribute("position")){let[r,t]=this.#x().split("-");if(r)a.setAttribute("data-y-position",r);if(t)a.setAttribute("data-x-position",t)}}#S(a){let r=this.hasAttribute(a);for(let t of this.#t){if(t.getAttribute(a)==="false")continue;if(r)t.setAttribute(a,"");else t.removeAttribute(a)}}#l(a){if(!a.hasAttribute("position")){let[r,t]=this.#x().split("-");if(r)a.setAttribute("data-y-position",r);if(t)a.setAttribute("data-x-position",t)}if(!a.hasAttribute("duration")){let r=this.getAttribute("duration");if(r)a.setAttribute("duration",r)}if(!a.hasAttribute("close-button")&&this.hasAttribute("close-button"))a.setAttribute("close-button","");if(!a.hasAttribute("rich-colors")&&this.hasAttribute("rich-colors"))a.setAttribute("rich-colors","");if(!a.hasAttribute("invert")&&this.hasAttribute("invert"))a.setAttribute("invert","")}#r(a={remeasure:!1}){let r=Number(this.getAttribute("visible-toasts")??$);if(a.remeasure){this.#d=!0;for(let h of this.#t){if(h.getAttribute("data-removed")==="true")continue;let i=h.style.height;h.style.height="auto",this.#e.set(h,h.getBoundingClientRect().height),h.style.height=i}this.#d=!1}let t=this.#t.filter((h)=>h.getAttribute("data-removed")!=="true"),o=t.length>0?this.#e.get(t[0])??0:0,n=this.#Q(),d=this.#a||this.#c,f=0;this.style.setProperty("--front-toast-height",`${o}px`);for(let h=0;h<t.length;h++){let i=t[h],c=this.#e.get(i)??0,x=h===0,g=h===0?0:f+h*n;if(f+=c,i.style.setProperty("--index",String(h)),i.style.setProperty("--toasts-before",String(h)),i.style.setProperty("--z-index",String(t.length-h)),i.style.setProperty("--offset",`${g}px`),i.style.setProperty("--initial-height",`${c}px`),i.setAttribute("data-index",String(h)),i.setAttribute("data-front",String(x)),i.setAttribute("data-visible",String(h+1<=r)),i.setAttribute("data-expanded",String(d)),d||x)i.removeAttribute("aria-hidden");else i.setAttribute("aria-hidden","true")}}#Q(){let a=this.getAttribute("gap"),r=a?Number(a):l;return Number.isFinite(r)?r:l}#Z=()=>{this.#c=!0;for(let a of this.#t)a.setPaused(!0);this.#r()};#$=()=>{this.#c=!1;for(let a of this.#t)a.setPaused(!1);this.#r()};#K=()=>{this.#c=!0;for(let a of this.#t)a.setPaused(!0);this.#r()};#V=(a)=>{let r=a.relatedTarget;if(r&&this.contains(r))return;this.#c=!1;for(let t of this.#t)t.setPaused(!1);this.#r()};#Y=()=>this.#r({remeasure:!0});#z=(a)=>{if(a.defaultPrevented)return;let r=a.target;if(r){let d=r.tagName;if(d==="INPUT"||d==="TEXTAREA"||d==="SELECT"||r.isContentEditable)return}let t=this.#X(),o=["altKey","ctrlKey","shiftKey","metaKey"];if(t.length>0&&t.every((d)=>{if(o.includes(d))return a[d];return a.code===d})&&o.every((d)=>t.includes(d)||!a[d])){this.#a=!0;for(let d of this.#t)d.setPaused(!0);this.focus(),this.#r();return}if(a.key==="Escape"&&this.#a&&this.contains(document.activeElement)){this.#a=!1;for(let d of this.#t)d.setPaused(!1);this.#r()}};#X(){let a=this.getAttribute("hotkey");if(a===null)return G;let r=a.trim();if(r===""||r.toLowerCase()==="none")return[];return r.split("+").map((t)=>t.trim())}#_(){let a=ea(this.#X());if(!a){if(this.#m)this.removeAttribute("aria-keyshortcuts"),this.#m=!1;if(this.#g)this.removeAttribute("title"),this.#g=!1;return}if(!this.hasAttribute("aria-keyshortcuts")||this.#m)this.setAttribute("aria-keyshortcuts",a),this.#m=!0;if(!this.hasAttribute("title")||this.#g)this.setAttribute("title",`Press ${a} to expand notifications`),this.#g=!0}#m=!1;#g=!1}function ea(a){if(a.length===0)return"";return a.map((r)=>{if(r==="altKey")return"Alt";if(r==="ctrlKey")return"Control";if(r==="shiftKey")return"Shift";if(r==="metaKey")return"Meta";if(/^Key[A-Z]$/.test(r))return r.slice(3);if(/^Digit[0-9]$/.test(r))return r.slice(5);return r}).join("+")}if(typeof customElements!=="undefined"&&!customElements.get("sonner-toaster"))customElements.define("sonner-toaster",m);function D(a){if(a){let t=document.getElementById(a);if(t instanceof m)return t}let r=R();if(!r)r=document.createElement("sonner-toaster"),document.body.appendChild(r);return r}function _(a){let r=a.id??k(),t=v(r);if(t)return t.update(a),t;let o=document.createElement("sonner-toast");return o.toastId=r,o.update(a),o.setHandlers({onDismiss:a.onDismiss,onAutoClose:a.onAutoClose}),D(a.toasterId).addToast(o),o}function z(a){return(r,t)=>_({...t,type:a,title:r})}function T(a,r){return _({...r,type:"default",title:a})}function ca(a){if(a!==void 0){v(a)?.dismiss();return}P()}function ga(a,r){let t=r?.id??k(),o=document.createElement("sonner-toast");if(o.toastId=t,o.setAttribute("data-styled","false"),r?.duration!==void 0)o.setAttribute("duration",String(r.duration));if(r?.dismissible===!1)o.setAttribute("dismissible","false");if(r?.position)o.setAttribute("position",r.position);if(r?.testId!==void 0)o.setAttribute("data-testid",r.testId);let n=a(t);return o.appendChild(n),o.setHandlers({onDismiss:r?.onDismiss,onAutoClose:r?.onAutoClose}),D(r?.toasterId).addToast(o),o}async function X(a,r){if(a===void 0)return;if(typeof a==="function")return a.length===0?a():a(r);return a}function sa(a,r){let t=r.id??k(),{loading:o,success:n,error:d,description:f,finally:h,...i}=r,c=_({...i,id:t,type:"loading",title:r.loading,duration:1/0,dismissible:r.dismissible??!1}),x=Promise.resolve(typeof a==="function"?a():a),g=null,aa=x.then(async(e)=>{g=["resolve",e];let s=await X(r.success,e),J=await X(r.description,e);if(s!==void 0)c.update({...i,id:t,type:"success",title:s,description:J,duration:r.duration,dismissible:r.dismissible??!0});else c.dismiss()}).catch(async(e)=>{g=["reject",e];let s=await X(r.error,e),J=await X(r.description,e);if(s!==void 0)c.update({...i,id:t,type:"error",title:s,description:J,duration:r.duration,dismissible:r.dismissible??!0});else c.dismiss()}).finally(()=>r.finally?.());return Object.assign(c,{unwrap:()=>new Promise((e,s)=>{aa.then(()=>{if(!g)return s(new Error("promise toast settled without a result"));if(g[0]==="resolve")e(g[1]);else s(g[1])})})})}var Z=Object.assign(T,{success:z("success"),error:z("error"),info:z("info"),warning:z("warning"),loading:(a,r)=>_({...r,type:"loading",title:a,duration:r?.duration??1/0}),message:T,promise:sa,custom:ga,dismiss:ca,getToast:v});if(typeof window!=="undefined")window.toast=Z;export{Z as toast,m as SonnerToaster,b as SonnerToast};
|
|
753
|
+
`,a})();class b extends S{static get observedAttributes(){return["type","duration","dismissible","position","close-button","rich-colors","invert"]}toastId=0;#n;#f;#u;#s;#t;#e=null;#d=y;#a=null;#c=0;#o=new Set;#i=null;#J=0;#h=null;#m=null;#x=!1;#b=!1;#k=!1;#v;#y;#S=null;#w=null;constructor(){super();this.#n=this.attachShadow({mode:"open"}),this.#n.adoptedStyleSheets=[I()],this.#n.appendChild(ca.content.cloneNode(!0)),this.#f=this.#n.querySelector("[data-close-button]"),this.#u=this.#n.querySelector("[data-icon]"),this.#s=this.#n.querySelector("[data-title]"),this.#t=this.#n.querySelector("[data-description]"),this.#f.innerHTML=L,this.#f.addEventListener("click",()=>this.dismiss());let a=this.#n.querySelector('slot[name="icon"]'),r=this.#n.querySelector('slot[name="description"]');a.addEventListener("slotchange",()=>this.#$("icon",a)),r.addEventListener("slotchange",()=>this.#$("description",r)),this.addEventListener("pointerdown",this.#L),this.addEventListener("pointermove",this.#H),this.addEventListener("pointerup",this.#C),this.addEventListener("pointercancel",this.#C),this.addEventListener("mouseenter",()=>this.#E("hover-self")),this.addEventListener("mouseleave",()=>this.#V("hover-self")),this.addEventListener("focusin",(t)=>{if(this.#E("focus-self"),this.#w)return;let n=t.relatedTarget;if(n&&!this.contains(n))this.#w=n}),this.addEventListener("focusout",()=>this.#V("focus-self")),this.addEventListener("keydown",(t)=>{if(t.key==="Escape"&&this.#W())t.stopPropagation(),this.dismiss()})}connectedCallback(){if(!this.toastId)this.toastId=this.getAttribute("id")||0;if(!this.hasAttribute("tabindex"))this.tabIndex=0;if(this.#p(),this.#K(),this.#G(),this.#z(),this.#X(),this.#Y(),this.setAttribute("data-sonner-toast",""),!this.hasAttribute("aria-atomic"))this.setAttribute("aria-atomic","true");if(this.setAttribute("data-mounted","false"),this.setAttribute("data-removed","false"),this.setAttribute("data-swiping","false"),this.setAttribute("data-swiped","false"),this.setAttribute("data-swipe-out","false"),!this.hasAttribute("data-styled"))this.setAttribute("data-styled","true");M(this),document.addEventListener("visibilitychange",this.#U),requestAnimationFrame(()=>{this.#x=!0,this.setAttribute("data-mounted","true"),this.dispatchEvent(new CustomEvent("sonner-toast-mounted",{bubbles:!0,composed:!0})),this.#g()})}disconnectedCallback(){if(this.#a)clearTimeout(this.#a);document.removeEventListener("visibilitychange",this.#U),R(this)}attributeChangedCallback(a,r,t){if(!this.isConnected)return;switch(a){case"type":this.#p();break;case"duration":this.#e=this.#_(),this.#d=this.#e??y;break;case"dismissible":this.#K();break;case"position":this.#G();break;case"close-button":this.#Y();break;case"rich-colors":this.#z();break;case"invert":this.#X();break}}get toastType(){return this.getAttribute("type")||"default"}dismiss(){if(this.#b||this.#k)return;if(this.#k=!0,this.#b=!0,this.setAttribute("data-removed","true"),this.#a)clearTimeout(this.#a);this.dispatchEvent(new CustomEvent("sonner-toast-dismissed",{bubbles:!0,composed:!0})),setTimeout(()=>{this.#Q(),this.#v?.(this),this.remove()},C)}#Q(){if(!this.#w)return;let a=document.activeElement;if(!a||!this.contains(a))return;let r=this.#w;if(!r.isConnected||typeof r.focus!=="function")return;r.focus()}update(a){let r=a.type!==void 0&&a.type!==this.toastType,t=$(this.toastType);if(a.type!==void 0)this.setAttribute("type",a.type);let n=!1;if(a.duration!==void 0)this.setAttribute("duration",String(a.duration)),this.#e=a.duration,this.#d=a.duration,n=!0;else if(r)this.#e=null,this.removeAttribute("duration"),this.#d=0,n=!0;if(a.dismissible!==void 0)X(this,"dismissible",a.dismissible);if(a.position!==void 0)this.setAttribute("position",a.position);if(a.closeButton!==void 0)X(this,"close-button",a.closeButton);if(a.richColors!==void 0)X(this,"rich-colors",a.richColors);if(a.invert!==void 0)X(this,"invert",a.invert);if(a.icon!==void 0)this.setIcon(a.icon);if(a.title!==void 0)this.setTitle(a.title);if(a.description!==void 0)this.setDescription(a.description);if(a.action!==void 0)aa(this,this.#n,"action",a.action,()=>this.dismiss());if(a.cancel!==void 0)aa(this,this.#n,"cancel",a.cancel,()=>this.dismiss());if(a.className)this.className=a.className;if(a.testId!==void 0)this.setAttribute("data-testid",a.testId);if(a.closeButtonAriaLabel!==void 0)this.#S=a.closeButtonAriaLabel||null,this.#Z();if(a.onDismiss)this.#v=a.onDismiss;if(a.onAutoClose)this.#y=a.onAutoClose;if(n)this.#j();if(this.#x&&r&&!t&&$(this.toastType)){let i=this.#r();if(i)this.closest("sonner-toaster")?.announceUrgent(i)}this.dispatchEvent(new CustomEvent("sonner-toast-updated",{bubbles:!0,composed:!0}))}setTitle(a){T(this,"title",a),this.#Z()}#r(){return Array.from(this.children).find((r)=>r.getAttribute("slot")==="title")?.textContent?.trim()??""}#Z(){if(this.#S){this.#f.setAttribute("aria-label",this.#S);return}let a=this.#r();this.#f.setAttribute("aria-label",a?`Close: ${a}`:"Close toast")}setDescription(a){T(this,"description",a)}setIcon(a){if(K(this,"icon"),a==null)return;if(a instanceof Node){if(a instanceof Element)a.setAttribute("slot","icon");this.appendChild(a)}else{let r=D(a,"icon");if(r)this.appendChild(r)}}setHandlers(a){this.#v=a.onDismiss,this.#y=a.onAutoClose}setPaused(a){if(a)this.#E("toaster");else this.#V("toaster")}#$(a,r){if(r.assignedNodes().length>0)this.setAttribute(`data-has-${a}`,"");else this.removeAttribute(`data-has-${a}`)}#p(){let a=this.toastType;this.setAttribute("data-type",a);let r=$(a);this.setAttribute("role",r?"alert":"status"),this.setAttribute("aria-live",r?"assertive":"polite");for(let o of Array.from(this.children))if(o.getAttribute("slot")==="icon"&&o.hasAttribute("data-sonner-default-icon"))this.removeChild(o);if(a==="loading"){this.setAttribute("data-promise","true");return}if(this.removeAttribute("data-promise"),Array.from(this.children).some((o)=>o.getAttribute("slot")==="icon"))return;let n=H(a);if(!n)return;let i=D(n,"icon");if(i)i.setAttribute("data-sonner-default-icon",""),this.appendChild(i)}#K(){let a=this.getAttribute("dismissible")!=="false";this.setAttribute("data-dismissible",String(a))}#G(){let a=this.getAttribute("position");if(!a)return;let[r,t]=a.split("-");if(r)this.setAttribute("data-y-position",r);if(t)this.setAttribute("data-x-position",t)}#Y(){this.#f.hidden=!p(this,"close-button")}#z(){this.setAttribute("data-rich-colors",String(p(this,"rich-colors")))}#X(){this.setAttribute("data-invert",String(p(this,"invert")))}#_(){let a=this.getAttribute("duration");if(a==null)return null;if(a==="Infinity")return 1/0;let r=Number(a);return Number.isFinite(r)?r:null}#l(){let a=this.#e??this.#_();if(a!==null)return a;if(this.toastType==="loading")return 1/0;return y}#g(){if(!this.#x||this.#b)return;if(this.#o.size>0)return;if(this.#a!==null)return;let a=this.#l();if(a===1/0)return;this.#d=this.#d>0?this.#d:a,this.#c=Date.now(),this.#a=setTimeout(()=>{this.#a=null,this.#y?.(this),this.dispatchEvent(new CustomEvent("sonner-toast-autoclosed",{bubbles:!0,composed:!0})),this.dismiss()},this.#d)}#E(a){let r=this.#o.size===0;if(this.#o.add(a),r&&this.#a!==null){clearTimeout(this.#a),this.#a=null;let t=Date.now()-this.#c;this.#d=Math.max(0,this.#d-t)}}#V(a){if(!this.#o.delete(a))return;if(this.#o.size===0&&!this.#b)this.#g()}#j(){if(this.#a)clearTimeout(this.#a),this.#a=null;this.#d=this.#l(),this.#g()}#U=()=>{if(document.visibilityState==="hidden")this.#E("doc-hidden");else this.#V("doc-hidden")};#W(){return this.getAttribute("dismissible")!=="false"}#L=(a)=>{if(a.button===2)return;if(this.toastType==="loading"||!this.#W())return;let r=a.composedPath()[0];if(r){if(r.tagName==="BUTTON"||typeof r.closest==="function"&&r.closest("button"))return}this.#J=Date.now();try{this.setPointerCapture(a.pointerId)}catch{}if(this.setAttribute("data-swiping","true"),this.#i={x:a.clientX,y:a.clientY},!this.#m){let t=this.getAttribute("data-y-position"),n=this.getAttribute("data-x-position"),i=[];if(t==="top"||t==="bottom")i.push(t);if(n==="left"||n==="right")i.push(n);this.#m=i.length>0?i:["bottom","right"]}};#H=(a)=>{if(!this.#i||!this.#W())return;if((window.getSelection()?.toString().length??0)>0)return;let r=a.clientY-this.#i.y,t=a.clientX-this.#i.x,n=this.#m;if(!this.#h&&(Math.abs(t)>1||Math.abs(r)>1))this.#h=Math.abs(t)>Math.abs(r)?"x":"y";let i=(d)=>1/(1.5+Math.abs(d)/20),o=0,f=0;if(this.#h==="y"){if(n.includes("top")||n.includes("bottom"))if(n.includes("top")&&r<0||n.includes("bottom")&&r>0)f=r;else{let d=r*i(r);f=Math.abs(d)<Math.abs(r)?d:r}}else if(this.#h==="x"){if(n.includes("left")||n.includes("right"))if(n.includes("left")&&t<0||n.includes("right")&&t>0)o=t;else{let d=t*i(t);o=Math.abs(d)<Math.abs(t)?d:t}}if(Math.abs(o)>0||Math.abs(f)>0)this.setAttribute("data-swiped","true");this.style.setProperty("--swipe-amount-x",`${o}px`),this.style.setProperty("--swipe-amount-y",`${f}px`)};#C=()=>{if(this.getAttribute("data-swipe-out")==="true"||!this.#W()){this.#i=null,this.#h=null,this.setAttribute("data-swiping","false");return}let a=parseFloat(this.style.getPropertyValue("--swipe-amount-x"))||0,r=parseFloat(this.style.getPropertyValue("--swipe-amount-y"))||0,t=Math.max(1,Date.now()-this.#J),n=this.#h==="x"?a:r,i=Math.abs(n)/t;if(Math.abs(n)>=W||i>U){if(this.#h==="x")this.setAttribute("data-swipe-direction",a>0?"right":"left");else this.setAttribute("data-swipe-direction",r>0?"down":"up");this.setAttribute("data-swipe-out","true"),this.dismiss()}else this.style.setProperty("--swipe-amount-x","0px"),this.style.setProperty("--swipe-amount-y","0px"),this.setAttribute("data-swiped","false");this.setAttribute("data-swiping","false"),this.#i=null,this.#h=null}}if(typeof customElements!=="undefined"&&!customElements.get("sonner-toast"))customElements.define("sonner-toast",b);function ra(a,r){if(a==null)return r;if(typeof a==="number")return`${a}px`;return a}function ta(a,r,t,n){let i=["top","right","bottom","left"];if(r==null||typeof r==="string"||typeof r==="number"){let o=ra(r,n);for(let f of i)a.style.setProperty(`${t}-${f}`,o)}else for(let o of i)a.style.setProperty(`${t}-${o}`,ra(r[o],n))}class m extends S{static get observedAttributes(){return["position","theme","rich-colors","expand","duration","gap","visible-toasts","close-button","invert","dir","offset","mobile-offset","hotkey","container-aria-label"]}#n;#f;#u;#s;#t=[];#e=new Map;#d=!1;#a=!1;#c=!1;#o=null;#i=null;constructor(){super();this.#n=this.attachShadow({mode:"open"}),this.#n.adoptedStyleSheets=[A()],this.#n.innerHTML='<div data-frame part="frame"><slot></slot></div><div data-alert-announcer role="alert" aria-live="assertive" aria-atomic="true" style="position:absolute;left:0;top:0;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;pointer-events:none"></div>',this.#f=this.#n.querySelector("[data-alert-announcer]"),this.#u=new MutationObserver((a)=>{let r=!1;for(let t of a){for(let n of Array.from(t.addedNodes))if(n instanceof b)this.#t.unshift(n),this.#s.observe(n),this.#Q(n),r=!0;for(let n of Array.from(t.removedNodes))if(n instanceof b)this.#t=this.#t.filter((i)=>i!==n),this.#e.delete(n),this.#s.unobserve(n),r=!0}if(r)this.#r({remeasure:!0})}),this.#s=new ResizeObserver(()=>this.#r({remeasure:!1})),this.addEventListener("mouseenter",this.#$),this.addEventListener("mouseleave",this.#p),this.addEventListener("focusin",this.#K),this.addEventListener("focusout",this.#G),this.addEventListener("sonner-toast-dismissed",()=>this.#r({remeasure:!1})),this.addEventListener("sonner-toast-updated",()=>this.#r({remeasure:!0})),this.addEventListener("sonner-toast-mounted",()=>this.#r({remeasure:!0}))}connectedCallback(){if(typeof this.showPopover==="function"){if(!this.hasAttribute("popover"))this.setAttribute("popover","manual");this.showPopover()}if(!this.hasAttribute("tabindex"))this.tabIndex=-1;if(!this.hasAttribute("role"))this.setAttribute("role","region");if(!this.hasAttribute("aria-label"))this.setAttribute("aria-label",this.getAttribute("container-aria-label")??"Notifications");this.#_(),this.setAttribute("data-sonner-toaster",""),this.#m(),this.#x(),this.#b(),this.#k(),this.#v(),this.#y(),this.#u.observe(this,{childList:!0});for(let a of Array.from(this.children))if(a instanceof b)this.#t.unshift(a),this.#s.observe(a),this.#Q(a);document.addEventListener("keydown",this.#z),window.addEventListener("resize",this.#Y),q(this),this.#r({remeasure:!0})}disconnectedCallback(){if(typeof this.hidePopover==="function")try{this.hidePopover()}catch{}if(this.#u.disconnect(),this.#s.disconnect(),document.removeEventListener("keydown",this.#z),window.removeEventListener("resize",this.#Y),this.#o&&this.#i)this.#o.removeEventListener("change",this.#i);B(this)}attributeChangedCallback(a,r,t){if(!this.isConnected)return;switch(a){case"position":this.#m(),this.#S(),this.#r();break;case"theme":this.#x();break;case"dir":this.#b();break;case"gap":this.#k(),this.#r();break;case"visible-toasts":this.#r();break;case"expand":this.#a=this.hasAttribute("expand");for(let n of this.#t)n.setPaused(this.#a||this.#c);this.#r();break;case"close-button":case"rich-colors":case"invert":this.#w(a);break;case"offset":case"mobile-offset":this.#y();break;case"container-aria-label":this.setAttribute("aria-label",this.getAttribute("container-aria-label")??"Notifications");break;case"hotkey":this.#_();break}}addToast(a){return this.appendChild(a),a}announceUrgent(a){this.#f.textContent="",requestAnimationFrame(()=>{this.#f.textContent=a})}dismissAll(){for(let a of Array.from(this.children))if(a instanceof b)a.dismiss()}#J(){return this.getAttribute("position")||"bottom-right"}#h(a){let[r,t]=this.#J().split("-");if(r)a.setAttribute("data-y-position",r);if(t)a.setAttribute("data-x-position",t)}#m(){this.#h(this)}#x(){if(this.#o&&this.#i)this.#o.removeEventListener("change",this.#i),this.#o=null,this.#i=null;let a=this.getAttribute("theme")||"light";if(a==="system"){this.#o=window.matchMedia("(prefers-color-scheme: dark)");let r=(t)=>{this.setAttribute("data-sonner-theme",t.matches?"dark":"light")};this.#i=r,this.#o.addEventListener("change",r),r(this.#o)}else this.setAttribute("data-sonner-theme",a)}#b(){let a=this.getAttribute("dir");if(a==="auto"||!a){let r=window.getComputedStyle(document.documentElement).direction||"ltr";this.setAttribute("dir",r)}}#k(){let a=this.getAttribute("gap"),r=a?Number(a):l;this.style.setProperty("--gap",`${Number.isFinite(r)?r:l}px`)}#v(){this.style.setProperty("--width",`${V}px`)}#y(){let a=this.getAttribute("offset"),r=this.getAttribute("mobile-offset");ta(this,a??void 0,"--offset","24px"),ta(this,r??void 0,"--mobile-offset","16px")}#S(){for(let a of this.#t)if(!a.hasAttribute("position"))this.#h(a)}#w(a){let r=this.hasAttribute(a);for(let t of this.#t){if(t.getAttribute(a)==="false")continue;if(r)t.setAttribute(a,"");else t.removeAttribute(a)}}#Q(a){if(!a.hasAttribute("position"))this.#h(a);if(!a.hasAttribute("duration")){let r=this.getAttribute("duration");if(r)a.setAttribute("duration",r)}if(!a.hasAttribute("close-button")&&this.hasAttribute("close-button"))a.setAttribute("close-button","");if(!a.hasAttribute("rich-colors")&&this.hasAttribute("rich-colors"))a.setAttribute("rich-colors","");if(!a.hasAttribute("invert")&&this.hasAttribute("invert"))a.setAttribute("invert","")}#r(a={remeasure:!1}){let r=Number(this.getAttribute("visible-toasts")??E);if(a.remeasure){this.#d=!0;for(let d of this.#t){if(d.getAttribute("data-removed")==="true")continue;let h=d.style.height;d.style.height="auto",this.#e.set(d,d.getBoundingClientRect().height),d.style.height=h}this.#d=!1}let t=this.#t.filter((d)=>d.getAttribute("data-removed")!=="true"),n=t.length>0?this.#e.get(t[0])??0:0,i=this.#Z(),o=this.#a||this.#c,f=0;this.style.setProperty("--front-toast-height",`${n}px`);for(let d=0;d<t.length;d++){let h=t[d],c=this.#e.get(h)??0,x=d===0,g=d===0?0:f+d*i;if(f+=c,h.style.setProperty("--index",String(d)),h.style.setProperty("--toasts-before",String(d)),h.style.setProperty("--z-index",String(t.length-d)),h.style.setProperty("--offset",`${g}px`),h.style.setProperty("--initial-height",`${c}px`),h.setAttribute("data-index",String(d)),h.setAttribute("data-front",String(x)),h.setAttribute("data-visible",String(d+1<=r)),h.setAttribute("data-expanded",String(o)),o||x)h.removeAttribute("aria-hidden");else h.setAttribute("aria-hidden","true")}}#Z(){let a=this.getAttribute("gap"),r=a?Number(a):l;return Number.isFinite(r)?r:l}#$=()=>{this.#c=!0;for(let a of this.#t)a.setPaused(!0);this.#r()};#p=()=>{this.#c=!1;for(let a of this.#t)a.setPaused(!1);this.#r()};#K=()=>{this.#c=!0;for(let a of this.#t)a.setPaused(!0);this.#r()};#G=(a)=>{let r=a.relatedTarget;if(r&&this.contains(r))return;this.#c=!1;for(let t of this.#t)t.setPaused(!1);this.#r()};#Y=()=>this.#r({remeasure:!0});#z=(a)=>{if(a.defaultPrevented)return;let r=a.target;if(r){let o=r.tagName;if(o==="INPUT"||o==="TEXTAREA"||o==="SELECT"||r.isContentEditable)return}let t=this.#X(),n=["altKey","ctrlKey","shiftKey","metaKey"];if(t.length>0&&t.every((o)=>{if(n.includes(o))return a[o];return a.code===o})&&n.every((o)=>t.includes(o)||!a[o])){this.#a=!0;for(let o of this.#t)o.setPaused(!0);this.focus(),this.#r();return}if(a.key==="Escape"&&this.#a&&this.contains(document.activeElement)){this.#a=!1;for(let o of this.#t)o.setPaused(!1);this.#r()}};#X(){let a=this.getAttribute("hotkey");if(a===null)return j;let r=a.trim();if(r===""||r.toLowerCase()==="none")return[];return r.split("+").map((t)=>t.trim())}#_(){let a=ga(this.#X());if(!a){if(this.#l)this.removeAttribute("aria-keyshortcuts"),this.#l=!1;if(this.#g)this.removeAttribute("title"),this.#g=!1;return}if(!this.hasAttribute("aria-keyshortcuts")||this.#l)this.setAttribute("aria-keyshortcuts",a),this.#l=!0;if(!this.hasAttribute("title")||this.#g)this.setAttribute("title",`Press ${a} to expand notifications`),this.#g=!0}#l=!1;#g=!1}function ga(a){if(a.length===0)return"";return a.map((r)=>{if(r==="altKey")return"Alt";if(r==="ctrlKey")return"Control";if(r==="shiftKey")return"Shift";if(r==="metaKey")return"Meta";if(/^Key[A-Z]$/.test(r))return r.slice(3);if(/^Digit[0-9]$/.test(r))return r.slice(5);return r}).join("+")}if(typeof customElements!=="undefined"&&!customElements.get("sonner-toaster"))customElements.define("sonner-toaster",m);function oa(a){if(a){let t=document.getElementById(a);if(t instanceof m)return t}let r=P();if(!r)r=document.createElement("sonner-toaster"),document.body.appendChild(r);return r}function Q(a){let r=a.id??k(),t=v(r);if(t)return t.update(a),t;let n=document.createElement("sonner-toast");return n.toastId=r,n.update(a),n.setHandlers({onDismiss:a.onDismiss,onAutoClose:a.onAutoClose}),oa(a.toasterId).addToast(n),n}function _(a){return(r,t)=>Q({...t,type:a,title:r})}function na(a,r){return Q({...r,type:"default",title:a})}function sa(a){if(a!==void 0){v(a)?.dismiss();return}N()}function ba(a,r){let t=r?.id??k(),n=document.createElement("sonner-toast");if(n.toastId=t,n.setAttribute("data-styled","false"),r?.duration!==void 0)n.setAttribute("duration",String(r.duration));if(r?.dismissible===!1)n.setAttribute("dismissible","false");if(r?.position)n.setAttribute("position",r.position);if(r?.testId!==void 0)n.setAttribute("data-testid",r.testId);let i=a(t);return n.appendChild(i),n.setHandlers({onDismiss:r?.onDismiss,onAutoClose:r?.onAutoClose}),oa(r?.toasterId).addToast(n),n}async function J(a,r){if(a===void 0)return;if(typeof a==="function")return a.length===0?a():a(r);return a}function la(a,r){let t=r.id??k(),{loading:n,success:i,error:o,description:f,finally:d,...h}=r,c=Q({...h,id:t,type:"loading",title:r.loading,duration:1/0,dismissible:r.dismissible??!1}),x=Promise.resolve(typeof a==="function"?a():a),g=null,da=x.then(async(e)=>{g=["resolve",e];let s=await J(r.success,e),Z=await J(r.description,e);if(s!==void 0)c.update({...h,id:t,type:"success",title:s,description:Z,duration:r.duration,dismissible:r.dismissible??!0});else c.dismiss()}).catch(async(e)=>{g=["reject",e];let s=await J(r.error,e),Z=await J(r.description,e);if(s!==void 0)c.update({...h,id:t,type:"error",title:s,description:Z,duration:r.duration,dismissible:r.dismissible??!0});else c.dismiss()}).finally(()=>r.finally?.());return Object.assign(c,{unwrap:()=>new Promise((e,s)=>{da.then(()=>{if(!g)return s(new Error("promise toast settled without a result"));if(g[0]==="resolve")e(g[1]);else s(g[1])})})})}var G=Object.assign(na,{success:_("success"),error:_("error"),info:_("info"),warning:_("warning"),loading:(a,r)=>Q({...r,type:"loading",title:a,duration:r?.duration??1/0}),message:na,promise:la,custom:ba,dismiss:sa,getToast:v});if(typeof window!=="undefined")window.toast=G;export{G as toast,m as SonnerToaster,b as SonnerToast};
|
|
746
754
|
|
|
747
|
-
//# debugId=
|
|
755
|
+
//# debugId=BFFB210CB348299E64756E2164756E21
|
|
748
756
|
//# sourceMappingURL=sonner-wc.bundle.js.map
|