@cupra/ui-kit 2.0.0-canary.23 → 2.0.0-canary.231

package/dist-react/esm/components/ds-theme-provider/ds-theme-provider.js

@@ -1,93 +1,92 @@
-import { THEME_STORAGE_KEY as p } from "../../core/theme.constants.js";
-import { customUiKitElement as f } from "../../decorators/customUiKitElement.js";
-import { provide as c } from "../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.js";
-import { pubSub as u } from "../../utils/PubSub.js";
-import { booleanConverter as h } from "../../utils/booleanConverter.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { nothing as y, html as $ } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import { LitElement as F } from "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { property as i } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { state as l } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";
-import { fontsConfig as v } from "../../styles/fonts-config.js";
-import { themeContext as S } from "./themeContext.js";
-var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, d = (t, o, s, r) => {
-  for (var e = r > 1 ? void 0 : r ? E(o, s) : o, a = t.length - 1, n; a >= 0; a--)
-    (n = t[a]) && (e = (r ? n(o, s, e) : n(e)) || e);
-  return r && e && w(o, s, e), e;
-};
-let m = class extends F {
-  constructor() {
-    super(...arguments), this.loadFonts = !0, this.loadStyles = !0, this.cssLoaded = !1, this.loadedFonts = /* @__PURE__ */ new Set();
-  }
-  updated(t) {
-    if (super.updated(t), t.has("theme")) {
-      if (u.publish("theme", this.theme), sessionStorage == null || sessionStorage.setItem(p, this.theme), typeof FontFace > "u" || !(document != null && document.fonts)) return;
-      this.loadThemeFonts(), this.loadThemeStyles().then(() => {
-        this.cssLoaded = !0;
-      });
-    }
-  }
-  loadThemeFonts() {
-    var t;
-    (t = v[this.theme]) == null || t.fonts.forEach((o) => {
-      this.loadThemeFont(o);
-    });
-  }
-  async loadThemeFont({ weight: t, name: o, file: s }) {
-    if (!this.loadFonts) return Promise.resolve();
-    const r = `${o}-${t}`;
-    if (this.loadedFonts.has(r)) return;
-    const e = new FontFace(
-      o,
-      `url('https://ds-assets.cupra.com/fonts/${this.theme}/${s}.woff2') format('woff2'),
-            url('https://ds-assets.cupra.com/fonts/${this.theme}/${s}.woff') format('woff'),
-            url('https://ds-assets.cupra.com/fonts/${this.theme}/${s}.ttf') format('truetype'),
-            url('https://ds-assets.cupra.com/fonts/${this.theme}/${s}.otf') format('opentype')`,
-      {
-        style: "normal",
-        weight: t,
-        display: "swap"
-      }
-    );
-    try {
-      await e.load(), document.fonts.add(e), this.loadedFonts.add(r);
-    } catch (a) {
-      console.error(`Error loading "${o}" font with "${t}" weight:`, a);
-    }
-  }
-  loadThemeStyles() {
-    return this.loadStyles ? new Promise((t, o) => {
-      const s = "/2.0.0-canary.23", r = `https://ds-assets.cupra.com${s}/styles/${this.theme}/theme.css`;
-      if (document.head.querySelector(`link[href="${r}"]`)) t();
-      else {
-        const e = `ui-kit-theme-${s}`, a = document.getElementById(e), n = document.createElement("link");
-        n.id = e, n.rel = "stylesheet", n.href = r, n.onload = () => t(), n.onerror = () => o(new Error(`Failed to load theme CSS: ${r}`)), document.head.appendChild(n), a == null || a.remove();
-      }
-    }) : Promise.resolve();
-  }
-  render() {
-    return this.cssLoaded ? $`<slot></slot>` : y;
-  }
-};
-d([
-  i({ type: Boolean, converter: h, attribute: "load-fonts" })
-], m.prototype, "loadFonts", 2);
-d([
-  i({ type: Boolean, converter: h, attribute: "load-styles" })
-], m.prototype, "loadStyles", 2);
-d([
-  c({ context: S }),
-  i({ type: String })
-], m.prototype, "theme", 2);
-d([
-  l()
-], m.prototype, "cssLoaded", 2);
-d([
-  l()
-], m.prototype, "loadedFonts", 2);
-m = d([
-  f("ds-theme-provider")
-], m);
-export {
-  m as DsThemeProvider
+import { provide as e } from "../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.js";
+import { themeContext as t } from "./themeContext.js";
+import "../../core/theme.constants.js";
+import { pubSub as n } from "../../utils/PubSub.js";
+import { html as r, nothing as i } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.js";
+import { LitElement as a } from "../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+import { property as o } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
+import { state as s } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
+import c from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
+import { customUiKitElement as l } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as u } from "../../utils/booleanConverter.js";
+import { fontsConfig as d } from "../../styles/source/shared/fonts-config.js";
+//#region src/components/ds-theme-provider/ds-theme-provider.ts
+var f = class extends a {
+	constructor(...e) {
+		super(...e), this.loadFonts = !0, this.loadStyles = !0, this.loadUnusedStyles = !0, this.cssLoaded = !1, this.loadedFonts = /* @__PURE__ */ new Set();
+	}
+	updated(e) {
+		if (super.updated(e), e.has("theme")) {
+			var t, r;
+			n.publish("theme", this.theme), (t = sessionStorage) == null || t.setItem("@cupra/ui-kit/theme", this.theme), typeof FontFace < "u" && (r = document) != null && r.fonts && this.loadThemeFonts(), this.loadThemeStyles().then(() => {
+				this.cssLoaded = !0, this.dispatchEvent(new CustomEvent("ui-kit:ready", {
+					bubbles: !0,
+					composed: !0
+				}));
+			});
+		}
+	}
+	loadThemeFonts() {
+		var e;
+		(e = d[this.theme]) == null || e.fonts.forEach((e) => {
+			this.loadThemeFont(e);
+		});
+	}
+	async loadThemeFont({ weight: e, name: t, file: n }) {
+		if (!this.loadFonts) return Promise.resolve();
+		let r = `${t}-${e}`;
+		if (this.loadedFonts.has(r)) return;
+		let i = new FontFace(t, `url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff2') format('woff2'),
+            url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.woff') format('woff'),
+            url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.ttf') format('truetype'),
+            url('https://ds-assets.cupra.com/fonts/${this.theme}/${n}.otf') format('opentype')`, {
+			style: "normal",
+			weight: e,
+			display: "optional"
+		});
+		try {
+			await i.load(), document.fonts.add(i), this.loadedFonts.add(r);
+		} catch (n) {
+			console.error(`Error loading "${t}" font with "${e}" weight:`, n);
+		}
+	}
+	loadThemeStyles() {
+		let e = "/2.0.0-canary.231";
+		return this.loadUnusedStyles && this.applyUnusedStyles(e), this.loadStyles ? new Promise((t, n) => {
+			let r = `https://ds-assets.cupra.com${e}/styles/${this.theme}/theme.css`;
+			if (document.head.querySelector(`link[href="${r}"]`)) t();
+			else {
+				let i = `ui-kit-theme-${e}`, a = document.getElementById(i), o = document.createElement("link");
+				o.id = i, o.rel = "stylesheet", o.href = r, o.onload = () => t(), o.onerror = () => n(/* @__PURE__ */ Error(`Failed to load theme CSS: ${r}`)), document.head.appendChild(o), a == null || a.remove();
+			}
+		}) : Promise.resolve();
+	}
+	applyUnusedStyles(e) {
+		let t = `https://ds-assets.cupra.com${e}/styles/${this.theme}/unused-styles.css`;
+		if (document.head.querySelector(`link[href="${t}"]`)) return;
+		let n = `ui-kit-unused-styles-${e}`, r = document.getElementById(n), i = document.createElement("link");
+		i.id = n, i.rel = "preload", i.as = "style", i.href = t, i.onload = () => {
+			i.rel = "stylesheet";
+		}, document.head.appendChild(i), r == null || r.remove();
+	}
+	render() {
+		return this.cssLoaded ? r`<slot></slot>` : i;
+	}
 };
+c([o({
+	type: Boolean,
+	converter: u,
+	attribute: "load-fonts"
+})], f.prototype, "loadFonts", void 0), c([o({
+	type: Boolean,
+	converter: u,
+	attribute: "load-styles"
+})], f.prototype, "loadStyles", void 0), c([o({
+	type: Boolean,
+	converter: u,
+	attribute: "load-unused-styles"
+})], f.prototype, "loadUnusedStyles", void 0), c([e({ context: t }), o({ type: String })], f.prototype, "theme", void 0), c([s()], f.prototype, "cssLoaded", void 0), c([s()], f.prototype, "loadedFonts", void 0), f = c([l("ds-theme-provider")], f);
+//#endregion
+export { f as DsThemeProvider };

package/dist-react/esm/components/ds-theme-provider/themeContext.js

@@ -1,5 +1,5 @@
-import { createContext as t } from "../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/create-context.js";
-const o = t("theme");
-export {
-  o as themeContext
-};
+import { createContext as e } from "../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/create-context.js";
+//#region src/components/ds-theme-provider/themeContext.ts
+var t = e("theme");
+//#endregion
+export { t as themeContext };

package/dist-react/esm/components/ds-theme-switch/ds-theme-switch.js

@@ -0,0 +1,30 @@
+import { consume as e } from "../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/consume.js";
+import { themeContext as t } from "../ds-theme-provider/themeContext.js";
+import { html as n, nothing as r } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.js";
+import { LitElement as i } from "../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+import { property as a } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
+import o from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
+import { customUiKitElement as s } from "../../decorators/customUiKitElement.js";
+//#region src/components/ds-theme-switch/ds-theme-switch.ts
+var c = class extends i {
+	getMatchingTemplate() {
+		return this.activeTheme ? this.querySelector(`template[slot="${this.activeTheme}"]`) : null;
+	}
+	getDefaultTemplate() {
+		return this.querySelector("template[slot=\"default\"]");
+	}
+	render() {
+		let e = this.getMatchingTemplate();
+		if (e) return n`${e.content.cloneNode(!0)}`;
+		let t = this.getDefaultTemplate();
+		return t ? n`${t.content.cloneNode(!0)}` : r;
+	}
+};
+o([a({ attribute: !1 }), e({
+	context: t,
+	subscribe: !0
+})], c.prototype, "activeTheme", void 0), c = o([s("ds-theme-switch")], c);
+//#endregion
+export { c as DsThemeSwitch };

package/dist-react/esm/components/ds-toast/ds-toast.js

@@ -1,95 +1,74 @@
-import { UiKitElement as p } from "../base/UiKitElement.js";
+import { html as e } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/lit-html.js";
+import { LitElement as t } from "../../node_modules/.pnpm/lit-element@4.2.2/node_modules/lit-element/lit-element.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+import { property as n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/property.js";
+import { state as r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/decorators/state.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/decorators.js";
+import i from "../../_virtual/_@oxc-project_runtime@0.148.0/helpers/esm/decorate.js";
+import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import { uiKitHtml as o } from "../../utils/uiKitHtml.js";
+import { classMap as s } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/class-map.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/class-map.js";
+import { ifDefined as c } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/if-defined.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/if-defined.js";
 import { toastManager as l } from "./utils/ToastManager.js";
-import { customUiKitElement as d } from "../../decorators/customUiKitElement.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { nothing as f, html as m } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { property as b } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { state as h } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";
-import { classMap as u } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { repeat as g } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/repeat.js";
-import { unsafeHTML as v } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/unsafe-html.js";
-import { containerStyles as y, toastStyles as M } from "./styles/common.styles.js";
-var T = Object.defineProperty, x = Object.getOwnPropertyDescriptor, c = (t, i, s, a) => {
-  for (var e = a > 1 ? void 0 : a ? x(i, s) : i, o = t.length - 1, n; o >= 0; o--)
-    (n = t[o]) && (e = (a ? n(i, s, e) : n(e)) || e);
-  return a && e && T(i, s, e), e;
-};
-let r = class extends p {
-  constructor() {
-    super(...arguments), this.position = "top-right", this.toasts = [], this.unsubscribe = null;
-  }
-  connectedCallback() {
-    super.connectedCallback(), this.unsubscribe = l.subscribe((t) => {
-      this.toasts = t;
-    });
-  }
-  disconnectedCallback() {
-    this.unsubscribe && (this.unsubscribe(), this.unsubscribe = null), super.disconnectedCallback();
-  }
-  handleAnimationEnd(t) {
-    const i = t.target;
-    if (i.classList.contains("exiting") && (t.animationName === "toast-out-left" || t.animationName === "toast-out-right")) {
-      const s = i.getAttribute("data-id");
-      s && l.removeToast(s);
-    }
-  }
-  getToastMessageTemplate(t) {
-    const i = {
-      toast: !0,
-      [t.status]: !0,
-      exiting: t.exiting
-    };
-    let s = f;
-    if (t.referenceId) {
-      const a = document.querySelector(`[data-id="${t.referenceId}"]`);
-      if (a) {
-        const e = a.cloneNode(!0);
-        e.setAttribute("data-template", "false"), e.setAttribute("data-id", t.id), s = v(e.outerHTML);
-      }
-    } else
-      s = this.componentFactory.createToastMessage({
-        "data-id": t.id,
-        "data-template": !1,
-        title: t.title,
-        text: t.text,
-        status: t.status
-      });
-    return m`<div class=${u(i)} data-id="${t.id}">${s}</div>`;
-  }
-  get containerClasses() {
-    return {
-      "toast-container": !0,
-      [this.position]: !0
-    };
-  }
-  render() {
-    return m`
+import "../ds-toast-message/ds-toast-message.js";
+import { repeat as u } from "../../node_modules/.pnpm/lit-html@3.3.3/node_modules/lit-html/directives/repeat.js";
+import "../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/directives/repeat.js";
+import { containerStyles as d, toastStyles as f } from "./styles/common.styles.js";
+//#region src/components/ds-toast/ds-toast.ts
+var p = class extends t {
+	constructor(...e) {
+		super(...e), this.position = "top-right", this.toasts = [], this.unsubscribe = null;
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.unsubscribe = l.subscribe((e) => {
+			this.toasts = e;
+		});
+	}
+	disconnectedCallback() {
+		this.unsubscribe && (this.unsubscribe(), this.unsubscribe = null), super.disconnectedCallback();
+	}
+	handleAnimationEnd(e) {
+		let t = e.target;
+		if (t.classList.contains("exiting") && (e.animationName === "toast-out-left" || e.animationName === "toast-out-right")) {
+			let e = t.getAttribute("data-id");
+			e && l.removeToast(e);
+		}
+	}
+	getToastMessageTemplate(t) {
+		let n = {
+			toast: !0,
+			[t.status]: !0,
+			exiting: t.exiting
+		}, r = o`<ds-toast-message
+            data-id=${t.id}
+            title=${c(t.title)}
+            text=${c(t.text)}
+            status=${c(t.status)}
+            .action=${t.action}
+        ></ds-toast-message>`;
+		return e`<div class=${s(n)} data-id="${t.id}">${r}</div>`;
+	}
+	get containerClasses() {
+		return {
+			"toast-container": !0,
+			[this.position]: !0
+		};
+	}
+	render() {
+		return e`
             <div
                 part="toast-container"
-                class=${u(this.containerClasses)}
+                class=${s(this.containerClasses)}
                 @animationend=${this.handleAnimationEnd}
                 aria-live="polite"
             >
-                ${g(
-      this.toasts,
-      (t) => t.id,
-      (t) => this.getToastMessageTemplate(t)
-    )}
+                ${u(this.toasts, (e) => e.id, (e) => this.getToastMessageTemplate(e))}
             </div>
         `;
-  }
-};
-r.styles = [y, M];
-c([
-  b({ type: String })
-], r.prototype, "position", 2);
-c([
-  h()
-], r.prototype, "toasts", 2);
-r = c([
-  d("ds-toast")
-], r);
-export {
-  r as DsToast
-};
+	}
+}, m = (p.styles = [d, f], p);
+i([n({ type: String })], m.prototype, "position", void 0), i([r()], m.prototype, "toasts", void 0), m = i([a("ds-toast")], m);
+//#endregion
+export { m as DsToast };

package/dist-react/esm/components/ds-toast/styles/common.styles.js

@@ -1,8 +1,7 @@
-import "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import "../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
-import "../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
-import { css as t } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const n = t`
+import { css as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.2/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.3/node_modules/lit/index.js";
+//#region src/components/ds-toast/styles/common.styles.ts
+var t = e`
     :host {
         display: contents;
     }
@@ -43,7 +42,7 @@ const n = t`
         left: 1rem;
         align-items: flex-start;
     }
-`, s = t`
+`, n = e`
     .toast {
         margin-bottom: 1rem;
         animation: toast-in-top 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
@@ -106,7 +105,5 @@ const n = t`
         }
     }
 `;
-export {
-  n as containerStyles,
-  s as toastStyles
-};
+//#endregion
+export { t as containerStyles, n as toastStyles };

package/dist-react/esm/components/ds-toast/utils/ToastManager.js

@@ -1,48 +1,55 @@
-const d = () => typeof crypto < "u" && typeof crypto.randomUUID == "function" ? crypto.randomUUID() : Math.random().toString(36).substring(2);
-class n {
-  constructor() {
-    this.toasts = [], this.subscribers = [], this.defaultDuration = 1e4, this.handleAddToast = (s) => {
-      const { id: t = d(), status: e = "default", duration: i = this.defaultDuration, ...o } = s.detail || {}, r = {
-        id: t,
-        status: e,
-        ...o,
-        exiting: !1
-      };
-      r.timeoutId = window.setTimeout(() => {
-        this.toasts.find((a) => a.id === t).exiting = !0, this.notifySubscribers();
-      }, i), this.toasts = [...this.toasts, r], this.notifySubscribers();
-    }, this.handleRemoveToast = (s) => {
-      const { id: t, referenceId: e } = s.detail || {};
-      if (!t && !e) return;
-      let i;
-      t ? i = this.toasts.find((o) => o.id === t) : e && (i = this.toasts.find((o) => o.referenceId === e)), i && (i != null && i.timeoutId && window.clearTimeout(i.timeoutId), i.exiting = !0, this.notifySubscribers());
-    }, this.initialize();
-  }
-  initialize() {
-    window.addEventListener("toast:add", this.handleAddToast), window.addEventListener("toast:remove", this.handleRemoveToast);
-  }
-  static getInstance() {
-    return n.instance || (n.instance = new n()), n.instance;
-  }
-  removeToast(s) {
-    const t = this.toasts.find((e) => e.id === s);
-    t != null && t.timeoutId && window.clearTimeout(t.timeoutId), this.toasts = this.toasts.filter((e) => e.id !== s), this.notifySubscribers();
-  }
-  getToasts() {
-    return [...this.toasts];
-  }
-  subscribe(s) {
-    return this.subscribers.push(s), () => {
-      this.subscribers = this.subscribers.filter((t) => t !== s);
-    };
-  }
-  notifySubscribers() {
-    const s = this.getToasts();
-    this.subscribers.forEach((t) => t(s));
-  }
-}
-const u = n.getInstance();
-export {
-  d as generateId,
-  u as toastManager
-};
+//#region src/components/ds-toast/utils/ToastManager.ts
+var e = () => typeof crypto < "u" && typeof crypto.randomUUID == "function" ? crypto.randomUUID() : Math.random().toString(36).substring(2), t = class t {
+	constructor() {
+		this.toasts = [], this.subscribers = [], this.defaultDuration = 1e4, this.handleAddToast = (t) => {
+			let { id: n = e(), status: r = "default", duration: i = this.defaultDuration, ...a } = t.detail || {}, o = {
+				id: n,
+				status: r,
+				...a,
+				exiting: !1
+			};
+			o.timeoutId = window.setTimeout(() => {
+				this.toasts.find((e) => e.id === n).exiting = !0, this.notifySubscribers();
+			}, i), this.toasts = [...this.toasts, o], this.notifySubscribers();
+		}, this.handleRemoveToast = (e) => {
+			let { id: t } = e.detail || {};
+			if (!t) return;
+			let n = this.toasts.find((e) => e.id === t);
+			n && (n.timeoutId && window.clearTimeout(n.timeoutId), n.exiting = !0, this.notifySubscribers());
+		}, this.handleActionClick = (e) => {
+			var t, n;
+			let { id: r } = e.detail || {};
+			if (!r) return;
+			let i = this.toasts.find((e) => e.id === r);
+			i && ((t = i.action) == null || (n = t.callback) == null || n.call(t), window.dispatchEvent(new CustomEvent("ds-toast:action", {
+				bubbles: !0,
+				composed: !0,
+				detail: { toastId: r }
+			})));
+		}, this.initialize();
+	}
+	initialize() {
+		window.addEventListener("toast:add", this.handleAddToast), window.addEventListener("toast:remove", this.handleRemoveToast), window.addEventListener("ds-toast:action-click", this.handleActionClick);
+	}
+	static getInstance() {
+		return t.instance || (t.instance = new t()), t.instance;
+	}
+	removeToast(e) {
+		let t = this.toasts.find((t) => t.id === e);
+		t != null && t.timeoutId && window.clearTimeout(t.timeoutId), this.toasts = this.toasts.filter((t) => t.id !== e), this.notifySubscribers();
+	}
+	getToasts() {
+		return [...this.toasts];
+	}
+	subscribe(e) {
+		return this.subscribers.push(e), () => {
+			this.subscribers = this.subscribers.filter((t) => t !== e);
+		};
+	}
+	notifySubscribers() {
+		let e = this.getToasts();
+		this.subscribers.forEach((t) => t(e));
+	}
+}.getInstance();
+//#endregion
+export { e as generateId, t as toastManager };