@cupra/ui-kit 2.0.0-canary.88 → 2.0.0-canary.89

package/dist/esm/components/ds-textarea/ds-textarea.js

@@ -1,45 +1,46 @@
-import { UiKitElement as u } from "../base/UiKitElement.js";
-import { customUiKitElement as m } from "../../decorators/customUiKitElement.js";
-import { ViewportMixin as c } from "../../mixins/ViewportMixin.js";
-import { inputStatesMixin as f } from "../../mixins/inputStatesMixin.js";
-import { objectConverter as y } from "../../utils/objectConverter.js";
-import { validateMaxLength as v } from "../../utils/validateMaxLength.js";
-import "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.js";
-import { html as n, nothing as l } 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 p } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
-import { classMap as x } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
-import { commonStyles as g } from "./styles/common.styles.js";
-var S = Object.defineProperty, T = Object.getOwnPropertyDescriptor, o = (t, r, a, i) => {
-  for (var s = i > 1 ? void 0 : i ? T(r, a) : r, d = t.length - 1, h; d >= 0; d--)
-    (h = t[d]) && (s = (i ? h(r, a, s) : h(s)) || s);
-  return i && s && S(r, a, s), s;
-};
-let e = class extends f(c(u)) {
-  constructor() {
-    super(...arguments), this.keyboardMode = !1, this.size = "medium", this.helperText = "", this.forcedError = "", this.invalidError = "", this.readonlyText = "", this.mode = "light";
-  }
-  onInputReady(t) {
-    t.classList.add("ds-scroll");
-  }
-  get classes() {
-    const t = typeof this.size == "string" ? this.size : this.size[this.viewport];
-    return {
-      container: !0,
-      error: !!this.forcedError,
-      [t]: !!t,
-      [this.mode]: !!this.mode,
-      disabled: this.inputStates.disabled,
-      readonly: this.inputStates.readonly,
-      filled: this.inputStates.filled,
-      invalid: this.inputStates.invalid,
-      focus: this.inputStates.focus,
-      "focus-visible": this.inputStates.focusVisible
-    };
-  }
-  render() {
-    return n`
-            <div class=${x(this.classes)}>
+import { E as e, x as t } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as r } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { UiKitElement as i } from "../base/UiKitElement.js";
+import { customUiKitElement as a } from "../../decorators/customUiKitElement.js";
+import { e as o } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.js";
+import { ViewportMixin as s } from "../../mixins/ViewportMixin.js";
+import { objectConverter as c } from "../../utils/objectConverter.js";
+import { inputStatesMixin as l } from "../../mixins/inputStatesMixin.js";
+import { validateMaxLength as u } from "../../utils/validateMaxLength.js";
+import { commonStyles as d } from "./styles/common.styles.js";
+//#region src/components/ds-textarea/ds-textarea.ts
+var f = class extends l(s(i)) {
+	constructor(...e) {
+		super(...e), this.keyboardMode = !1, this.size = "medium", this.helperText = "", this.forcedError = "", this.invalidError = "", this.readonlyText = "", this.mode = "light";
+	}
+	static {
+		this.styles = [d];
+	}
+	onInputReady(e) {
+		e.classList.add("ds-scroll");
+	}
+	get classes() {
+		let e = typeof this.size == "string" ? this.size : this.size[this.viewport];
+		return {
+			container: !0,
+			error: !!this.forcedError,
+			[e]: !!e,
+			[this.mode]: !!this.mode,
+			disabled: this.inputStates.disabled,
+			readonly: this.inputStates.readonly,
+			filled: this.inputStates.filled,
+			invalid: this.inputStates.invalid,
+			focus: this.inputStates.focus,
+			"focus-visible": this.inputStates.focusVisible
+		};
+	}
+	render() {
+		return t`
+            <div class=${o(this.classes)}>
                 <div class="input-container">
                     <slot></slot>
                 </div>
@@ -52,47 +53,38 @@ let e = class extends f(c(u)) {
                 </div>
             </div>
         `;
-  }
-  get lengthTemplate() {
-    var r, a, i;
-    const t = (a = (r = this.nativeInput) == null ? void 0 : r.maxLength) == null ? void 0 : a.toString();
-    return v(t) ? n`<span class="char-counter">${((i = this.inputStates.currentValue) == null ? void 0 : i.length) || 0}/${t}</span>` : l;
-  }
-  get helperTextTemplate() {
-    return this.inputStates.readonly || this.forcedError || this.inputStates.invalid && this.invalidError ? l : n`<span class="support-text helper-text">${this.helperText}</span>`;
-  }
-  get forcedErrorTemplate() {
-    return this.inputStates.readonly || !this.forcedError ? l : n`<span class="support-text error-text forced-error">${this.forcedError}</span>`;
-  }
-  get readonlyTextTemplate() {
-    return !this.inputStates.readonly || !this.readonlyText ? l : n`<span class="support-text readonly-text">${this.readonlyText}</span>`;
-  }
-  get invalidErrorTemplate() {
-    return this.inputStates.readonly || this.forcedError || !this.inputStates.invalid || !this.invalidError ? l : n`<span class="support-text error-text invalid-error">${this.invalidError}</span>`;
-  }
-};
-e.styles = [g];
-o([
-  p({ type: String, converter: y })
-], e.prototype, "size", 2);
-o([
-  p({ type: String, attribute: "helper-text" })
-], e.prototype, "helperText", 2);
-o([
-  p({ type: String, attribute: "forced-error" })
-], e.prototype, "forcedError", 2);
-o([
-  p({ type: String, attribute: "invalid-error" })
-], e.prototype, "invalidError", 2);
-o([
-  p({ type: String, attribute: "readonly-text" })
-], e.prototype, "readonlyText", 2);
-o([
-  p({ type: String })
-], e.prototype, "mode", 2);
-e = o([
-  m("ds-textarea")
-], e);
-export {
-  e as DsTextarea
+	}
+	get lengthTemplate() {
+		let n = this.nativeInput?.maxLength?.toString();
+		return u(n) ? t`<span class="char-counter">${this.inputStates.currentValue?.length || 0}/${n}</span>` : e;
+	}
+	get helperTextTemplate() {
+		return this.inputStates.readonly || this.forcedError || this.inputStates.invalid && this.invalidError ? e : t`<span class="support-text helper-text">${this.helperText}</span>`;
+	}
+	get forcedErrorTemplate() {
+		return this.inputStates.readonly || !this.forcedError ? e : t`<span class="support-text error-text forced-error">${this.forcedError}</span>`;
+	}
+	get readonlyTextTemplate() {
+		return !this.inputStates.readonly || !this.readonlyText ? e : t`<span class="support-text readonly-text">${this.readonlyText}</span>`;
+	}
+	get invalidErrorTemplate() {
+		return this.inputStates.readonly || this.forcedError || !this.inputStates.invalid || !this.invalidError ? e : t`<span class="support-text error-text invalid-error">${this.invalidError}</span>`;
+	}
 };
+r([n({
+	type: String,
+	converter: c
+})], f.prototype, "size", void 0), r([n({
+	type: String,
+	attribute: "helper-text"
+})], f.prototype, "helperText", void 0), r([n({
+	type: String,
+	attribute: "forced-error"
+})], f.prototype, "forcedError", void 0), r([n({
+	type: String,
+	attribute: "invalid-error"
+})], f.prototype, "invalidError", void 0), r([n({
+	type: String,
+	attribute: "readonly-text"
+})], f.prototype, "readonlyText", void 0), r([n({ type: String })], f.prototype, "mode", void 0), f = r([a("ds-textarea")], f);
+//#endregion

package/dist/esm/components/ds-textarea/styles/common.styles.js

@@ -1,12 +1,10 @@
-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 o } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
-const p = o`
+import { i as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+//#region src/components/ds-textarea/styles/common.styles.ts
+var t = e`
     :host {
         display: contents;
     }
 `;
-export {
-  p as commonStyles
-};
+//#endregion
+export { t as commonStyles };

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

@@ -1,90 +1,74 @@
-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 v } 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 F } from "../../styles/source/shared/fonts-config.js";
-import { themeContext as E } from "./themeContext.js";
-var w = Object.defineProperty, S = Object.getOwnPropertyDescriptor, d = (t, o, s, r) => {
-  for (var e = r > 1 ? void 0 : r ? S(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 v {
-  constructor() {
-    super(...arguments), this.loadFonts = !0, this.loadStyles = !0, this.cssLoaded = !1, this.loadedFonts = /* @__PURE__ */ new Set();
-  }
-  updated(t) {
-    super.updated(t), t.has("theme") && (u.publish("theme", this.theme), sessionStorage == null || sessionStorage.setItem(p, this.theme), typeof FontFace < "u" && (document != null && document.fonts) && this.loadThemeFonts(), this.loadThemeStyles().then(() => {
-      this.cssLoaded = !0, this.dispatchEvent(new CustomEvent("ui-kit:ready", { bubbles: !0, composed: !0 }));
-    }));
-  }
-  loadThemeFonts() {
-    var t;
-    (t = F[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.88", 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: E }),
-  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 { 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 { THEME_STORAGE_KEY as n } from "../../core/theme.constants.js";
+import { pubSub as r } from "../../utils/PubSub.js";
+import { E as i, x as a } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import { i as o } from "../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n as s } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { r as c } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as l } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { customUiKitElement as u } from "../../decorators/customUiKitElement.js";
+import { booleanConverter as d } from "../../utils/booleanConverter.js";
+import { fontsConfig as f } from "../../styles/source/shared/fonts-config.js";
+//#region src/components/ds-theme-provider/ds-theme-provider.ts
+var p = class extends o {
+	constructor(...e) {
+		super(...e), this.loadFonts = !0, this.loadStyles = !0, this.cssLoaded = !1, this.loadedFonts = /* @__PURE__ */ new Set();
+	}
+	updated(e) {
+		super.updated(e), e.has("theme") && (r.publish("theme", this.theme), sessionStorage?.setItem(n, this.theme), typeof FontFace < "u" && document?.fonts && this.loadThemeFonts(), this.loadThemeStyles().then(() => {
+			this.cssLoaded = !0, this.dispatchEvent(new CustomEvent("ui-kit:ready", {
+				bubbles: !0,
+				composed: !0
+			}));
+		}));
+	}
+	loadThemeFonts() {
+		f[this.theme]?.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: "swap"
+		});
+		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() {
+		return this.loadStyles ? new Promise((e, t) => {
+			let n = "/2.0.0-canary.89", r = `https://ds-assets.cupra.com${n}/styles/${this.theme}/theme.css`;
+			if (document.head.querySelector(`link[href="${r}"]`)) e();
+			else {
+				let i = `ui-kit-theme-${n}`, a = document.getElementById(i), o = document.createElement("link");
+				o.id = i, o.rel = "stylesheet", o.href = r, o.onload = () => e(), o.onerror = () => t(/* @__PURE__ */ Error(`Failed to load theme CSS: ${r}`)), document.head.appendChild(o), a?.remove();
+			}
+		}) : Promise.resolve();
+	}
+	render() {
+		return this.cssLoaded ? a`<slot></slot>` : i;
+	}
 };
+l([s({
+	type: Boolean,
+	converter: d,
+	attribute: "load-fonts"
+})], p.prototype, "loadFonts", void 0), l([s({
+	type: Boolean,
+	converter: d,
+	attribute: "load-styles"
+})], p.prototype, "loadStyles", void 0), l([e({ context: t }), s({ type: String })], p.prototype, "theme", void 0), l([c()], p.prototype, "cssLoaded", void 0), l([c()], p.prototype, "loadedFonts", void 0), p = l([u("ds-theme-provider")], p);
+//#endregion

package/dist/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 { n 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/esm/components/ds-toast/ds-toast.js

@@ -1,95 +1,81 @@
-import { UiKitElement as p } from "../base/UiKitElement.js";
+import { E as e, x as t } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/index.js";
+import { n } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.js";
+import { r } from "../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/decorators.js";
+import { __decorate as i } from "../../_virtual/_@oxc-project_runtime@0.122.0/helpers/decorate.js";
+import { UiKitElement as a } from "../base/UiKitElement.js";
+import { customUiKitElement as o } from "../../decorators/customUiKitElement.js";
+import { o as s } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/unsafe-html.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/unsafe-html.js";
+import { e as c } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.js";
+import "../../node_modules/.pnpm/lit@3.3.1/node_modules/lit/directives/class-map.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 { c as u } from "../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/repeat.js";
+import "../../node_modules/.pnpm/lit@3.3.1/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 a {
+	constructor(...e) {
+		super(...e), this.position = "top-right", this.toasts = [], this.unsubscribe = null;
+	}
+	static {
+		this.styles = [d, f];
+	}
+	connectedCallback() {
+		super.connectedCallback(), this.unsubscribe = l.subscribe((e) => {
+			this.toasts = e;
+		});
+	}
+	disconnectedCallback() {
+		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(n) {
+		let r = {
+			toast: !0,
+			[n.status]: !0,
+			exiting: n.exiting
+		}, i = e;
+		if (n.referenceId) {
+			let e = document.querySelector(`[data-id="${n.referenceId}"]`);
+			if (e) {
+				let t = e.cloneNode(!0);
+				t.setAttribute("data-template", "false"), t.setAttribute("data-id", n.id), i = s(t.outerHTML);
+			}
+		} else i = this.componentFactory.createToastMessage({
+			"data-id": n.id,
+			"data-template": !1,
+			title: n.title,
+			text: n.text,
+			status: n.status
+		});
+		return t`<div class=${c(r)} data-id="${n.id}">${i}</div>`;
+	}
+	get containerClasses() {
+		return {
+			"toast-container": !0,
+			[this.position]: !0
+		};
+	}
+	render() {
+		return t`
             <div
                 part="toast-container"
-                class=${u(this.containerClasses)}
+                class=${c(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
+	}
 };
+i([n({ type: String })], p.prototype, "position", void 0), i([r()], p.prototype, "toasts", void 0), p = i([o("ds-toast")], p);
+//#endregion

package/dist/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 { i as e } from "../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.js";
+import "../../../node_modules/.pnpm/lit@3.3.1/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 };