solid-ui 3.1.3-4 → 3.1.3-6

package/dist/components/combobox/Combobox.esm.js

@@ -1,38 +1,38 @@
 import { customElement as e } from "../../lib/components/decorators.esm.js";
-import { generateId as t } from "../../lib/components/ids.esm.js";
-import n from "../../lib/components/web-component/WebComponent.esm.js";
+import t from "../../lib/components/web-component/WebComponent.esm.js";
+import n from "../../lib/components/traits/InputTrait.esm.js";
 import "../../lib/components/index.esm.js";
 import "../../_virtual/~icons/lucide/chevron-down.esm.js";
 import r from "./Combobox.styles.esm.js";
 import { html as i } from "lit";
 import { property as a, query as o, state as s } from "lit/decorators.js";
 //#region src/components/combobox/Combobox.ts
-var c, l, u, d, f, p, m, h, g, _, v, y, b, x, S, C, w, T, E, D, O, k;
-function A(e, t, n) {
-	j(e, t), t.set(e, n);
+var c, l, u, d, f, p, m, h, g, _, v, y, b, x, S, C, w, T, E, D, O, k, A, j, M, N, P, F, I, L, R;
+function z(e, t, n) {
+	B(e, t), t.set(e, n);
 }
-function j(e, t) {
+function B(e, t) {
 	if (t.has(e)) throw TypeError("Cannot initialize the same private elements twice on an object");
 }
-function M(e, t, n) {
-	return e.set(P(e, t), n), n;
+function V(e, t, n) {
+	return e.set(U(e, t), n), n;
 }
-function N(e, t) {
-	return e.get(P(e, t));
+function H(e, t) {
+	return e.get(U(e, t));
 }
-function P(e, t, n) {
+function U(e, t, n) {
 	if (typeof e == "function" ? e === t : e.has(t)) return arguments.length < 3 ? t : n;
 	throw TypeError("Private element is not present on this object");
 }
-function F(e, t, n) {
-	return (t = L(t)) in e ? Object.defineProperty(e, t, {
+function W(e, t, n) {
+	return (t = K(t)) in e ? Object.defineProperty(e, t, {
 		value: n,
 		enumerable: !0,
 		configurable: !0,
 		writable: !0
 	}) : e[t] = n, e;
 }
-function I(e, t, n, r, i, a) {
+function G(e, t, n, r, i, a) {
 	function o(e, t, n) {
 		return function(r, i) {
 			return n && n(r), e[t].call(r, i);
@@ -55,13 +55,13 @@ function I(e, t, n, r, i, a) {
 			n || Array.isArray(_) || (_ = [_]);
 			var b = {}, x = [], S = i === 3 ? "get" : i === 4 || p ? "set" : "value";
 			d ? (f || p ? b = {
-				get: z(function() {
+				get: J(function() {
 					return v(this);
 				}, r, "get"),
 				set: function(e) {
 					t[4](this, e);
 				}
-			} : b[S] = v, f || z(b[S], r, i === 2 ? "" : S)) : f || (b = Object.getOwnPropertyDescriptor(e, r));
+			} : b[S] = v, f || J(b[S], r, i === 2 ? "" : S)) : f || (b = Object.getOwnPropertyDescriptor(e, r));
 		}
 		for (var C = e, w = _.length - 1; w >= 0; w -= n ? 2 : 1) {
 			var T = _[w], E = n ? _[w - 1] : void 0, D = {}, O = {
@@ -121,7 +121,7 @@ function I(e, t, n, r, i, a) {
 	if (arguments.length >= 6) var d = a[Symbol.metadata || Symbol.for("Symbol.metadata")];
 	var f = Object.create(d ?? null), p = function(e, t, n, r) {
 		var i, a, o = [], c = function(t) {
-			return B(t) === e;
+			return Y(t) === e;
 		}, u = /* @__PURE__ */ new Map();
 		function d(e) {
 			e && o.push(s.bind(null, e));
@@ -135,7 +135,7 @@ function I(e, t, n, r, i, a) {
 					if (!0 === x || x === 3 && m !== 4 || x === 4 && m !== 3) throw Error("Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: " + h);
 					u.set(b, !(m > 2) || m);
 				}
-				l(v ? e : e.prototype, p, _, g ? "#" + h : L(h), m, r, v ? a ||= [] : i ||= [], o, v, g, y, m === 1, v && g ? c : n);
+				l(v ? e : e.prototype, p, _, g ? "#" + h : K(h), m, r, v ? a ||= [] : i ||= [], o, v, g, y, m === 1, v && g ? c : n);
 			}
 		}
 		return d(i), d(a), o;
@@ -148,11 +148,11 @@ function I(e, t, n, r, i, a) {
 		}
 	};
 }
-function L(e) {
-	var t = R(e, "string");
+function K(e) {
+	var t = q(e, "string");
 	return typeof t == "symbol" ? t : t + "";
 }
-function R(e, t) {
+function q(e, t) {
 	if (typeof e != "object" || !e) return e;
 	var n = e[Symbol.toPrimitive];
 	if (n !== void 0) {
@@ -162,7 +162,7 @@ function R(e, t) {
 	}
 	return (t === "string" ? String : Number)(e);
 }
-function z(e, t, n) {
+function J(e, t, n) {
 	typeof t == "symbol" && (t = (t = t.description) ? "[" + t + "]" : "");
 	try {
 		Object.defineProperty(e, "name", {
@@ -172,80 +172,119 @@ function z(e, t, n) {
 	} catch {}
 	return e;
 }
-function B(e) {
+function Y(e) {
 	if (Object(e) !== e) throw TypeError("right-hand side of 'in' should be an object, got " + (e === null ? "null" : typeof e));
 	return e;
 }
-function V(e) {
+function X(e) {
 	return e;
 }
-_ = [e("solid-ui-combobox")];
-var H;
-new (O = (u = /*#__PURE__*/ new WeakMap(), d = /*#__PURE__*/ new WeakMap(), f = /*#__PURE__*/ new WeakMap(), p = /*#__PURE__*/ new WeakMap(), m = /*#__PURE__*/ new WeakMap(), k = (v = a({
+b = [e("solid-ui-combobox")];
+var Z;
+new (L = (u = /*#__PURE__*/ new WeakMap(), d = /*#__PURE__*/ new WeakMap(), f = /*#__PURE__*/ new WeakMap(), p = /*#__PURE__*/ new WeakMap(), m = /*#__PURE__*/ new WeakMap(), h = /*#__PURE__*/ new WeakMap(), g = /*#__PURE__*/ new WeakMap(), _ = /*#__PURE__*/ new WeakMap(), R = (x = a({
 	type: String,
 	reflect: !0
-}), b = a({ type: String }), S = o("[popover]"), w = o("input"), E = s(), "label"), l = class extends n {
-	constructor(...e) {
-		super(...e), A(this, u, (h(this), y(this, ""))), A(this, d, x(this, "")), A(this, f, C(this, null)), A(this, p, T(this, null)), A(this, m, D(this, "")), F(this, "inputId", `combobox-${t()}`);
-	}
-	get [k]() {
-		return N(u, this);
+}), C = a({
+	type: String,
+	reflect: !0
+}), T = a({ type: String }), D = a({
+	type: String,
+	reflect: !0
+}), k = a({
+	type: Boolean,
+	reflect: !0
+}), j = o("[popover]"), N = o("input"), F = s(), "label"), l = class extends t {
+	get [R]() {
+		return H(u, this);
 	}
 	set label(e) {
-		M(u, this, e);
+		V(u, this, e);
+	}
+	get name() {
+		return H(d, this);
+	}
+	set name(e) {
+		V(d, this, e);
 	}
 	get value() {
-		return N(d, this);
+		return H(f, this);
 	}
 	set value(e) {
-		M(d, this, e);
+		V(f, this, e);
+	}
+	get placeholder() {
+		return H(p, this);
+	}
+	set placeholder(e) {
+		V(p, this, e);
+	}
+	get required() {
+		return H(m, this);
+	}
+	set required(e) {
+		V(m, this, e);
 	}
 	get popoverElement() {
-		return N(f, this);
+		return H(h, this);
 	}
 	set popoverElement(e) {
-		M(f, this, e);
+		V(h, this, e);
 	}
 	get inputElement() {
-		return N(p, this);
+		return H(g, this);
 	}
 	set inputElement(e) {
-		M(p, this, e);
+		V(g, this, e);
 	}
 	get filter() {
-		return N(m, this);
+		return H(_, this);
 	}
 	set filter(e) {
-		M(m, this, e);
+		V(_, this, e);
+	}
+	constructor() {
+		super(), z(this, u, (v(this), S(this, ""))), z(this, d, w(this, "")), z(this, f, E(this, "")), z(this, p, O(this, "")), z(this, m, A(this, !1)), z(this, h, M(this, null)), z(this, g, P(this, null)), z(this, _, I(this, "")), W(this, "inputTrait", void 0), this.inputTrait = this.addTrait(new n(this, {
+			getInputElement: () => this.inputElement,
+			getInternals: () => this.getInternals(),
+			onValueChanged: (e) => {
+				this.filter = e.toLowerCase();
+			}
+		}));
 	}
 	render() {
-		let e = this.getOptions().filter((e) => e.toLowerCase().includes(this.filter));
+		let e = this.getOptions().filter((e) => e.label.toLowerCase().includes(this.filter));
 		return i`
-        ${this.label ? i`<label for="${this.inputId}">${this.label}</label>` : ""}
-        <div class="input-wrapper">
-            <input
-                id="${this.inputId}"
-                .value=${this.value}
-                type="text"
-                @keydown=${this.onInputKeyDown}
-                @click=${this.onInputClick}
-                @input=${this.onInputChange}
-            />
-            <icon-lucide-chevron-down></icon-lucide-chevron-down>
-        </div>
-        <div role="listbox" aria-labelledby="${this.inputId}" popover>
-          ${e.map((e) => i`<div role="option" aria-selected="false" @click=${() => this.onOptionClick(e)}>${e}</div>`)}
-        </div>
+      ${this.inputTrait.renderLabel()}
+      <div class="input-wrapper">
+        <input
+          id="${this.inputTrait.inputId}"
+          type="text"
+          name=${this.name}
+          ?placeholder=${this.placeholder}
+          ?required=${this.required}
+          .value=${this.value}
+          @keydown=${this.onInputKeyDown}
+          @click=${this.onInputClick}
+          @input=${() => this.inputTrait.onInput()}
+        />
+        <icon-lucide-chevron-down></icon-lucide-chevron-down>
+      </div>
+      <div role="listbox" aria-labelledby="${this.inputTrait.inputId}" popover>
+        ${e.map((e) => i`<div
+              role="option"
+              aria-selected="false"
+              @click=${() => this.onOptionClick(e.value)}
+            >
+              ${e.label}
+            </div>`)}
+      </div>
     `;
 	}
 	getOptions() {
 		let e = this.querySelectorAll("solid-ui-combobox-option");
-		return Array.from(e).map((e) => e.value);
-	}
-	setValue(e) {
-		this.filter = e.toLowerCase(), this.value = e, this.getInternals().setFormValue(e), this.dispatchEvent(new InputEvent("input", {
-			bubbles: !0,
-			composed: !0
+		return Array.from(e).map((e) => ({
+			value: e.value,
+			label: e.textContent
 		}));
 	}
 	onInputKeyDown(e) {
@@ -254,51 +293,63 @@ new (O = (u = /*#__PURE__*/ new WeakMap(), d = /*#__PURE__*/ new WeakMap(), f =
 				e.preventDefault(), this.popoverElement?.showPopover();
 				break;
 			case "Enter":
-				this.popoverElement?.matches(":popover-open") || (e.preventDefault(), this.getInternals().form?.requestSubmit());
+				this.popoverElement?.matches(":popover-open") || (e.preventDefault(), this.inputTrait.onSubmit());
 				break;
 		}
 	}
 	onInputClick(e) {
 		e.preventDefault(), this.popoverElement?.showPopover();
 	}
-	onInputChange() {
-		this.setValue(this.inputElement?.value ?? "");
-	}
 	onOptionClick(e) {
-		this.setValue(e), this.popoverElement?.hidePopover();
+		this.inputTrait.setValue(e), this.popoverElement?.hidePopover();
 	}
-}, {e: [y, x, C, T, D, h], c: [H, g]} = I(l, [
+}, {e: [S, w, E, O, A, M, P, I, v], c: [Z, y]} = G(l, [
 	[
-		v,
+		x,
 		1,
 		"label"
 	],
 	[
-		b,
+		C,
+		1,
+		"name"
+	],
+	[
+		T,
 		1,
 		"value"
 	],
 	[
-		S,
+		D,
+		1,
+		"placeholder"
+	],
+	[
+		k,
+		1,
+		"required"
+	],
+	[
+		j,
 		1,
 		"popoverElement"
 	],
 	[
-		w,
+		N,
 		1,
 		"inputElement"
 	],
 	[
-		E,
+		F,
 		1,
 		"filter"
 	]
-], _, 0, void 0, n), l), c = class extends V {
+], b, 0, void 0, t), l), c = class extends X {
 	constructor() {
-		super(H), F(this, "styles", r), F(this, "formAssociated", !0), g();
+		super(Z), W(this, "styles", r), W(this, "formAssociated", !0), y();
 	}
-}, F(c, O, void 0), c)();
+}, W(c, L, void 0), c)();
 //#endregion
-export { H as _Combobox };
+export { Z as _Combobox };
 
 //# sourceMappingURL=Combobox.esm.js.map

package/dist/components/combobox/Combobox.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.esm.js","names":["html","property","query","state","generateId","WebComponent","customElement","styles","_classDecs","_Combobox","_Combobox2","_A","WeakMap","_B","_C","_D","_E","_ref","_labelDecs","type","String","reflect","_valueDecs","_popoverElementDecs","_inputElementDecs","_filterDecs","_Combobox3","Combobox","constructor","args","_classPrivateFieldInitSpec","_initProto","_init_label","_init_value","_init_popoverElement","_init_inputElement","_init_filter","_defineProperty","_classPrivateFieldGet","label","v","_classPrivateFieldSet","value","popoverElement","inputElement","filter","render","options","getOptions","option","toLowerCase","includes","inputId","onInputKeyDown","onInputClick","onInputChange","map","onOptionClick","querySelectorAll","Array","from","setValue","getInternals","setFormValue","dispatchEvent","InputEvent","bubbles","composed","e","key","preventDefault","showPopover","matches","form","requestSubmit","hidePopover","c","_initClass","_applyDecs","_Class","_identity","default"],"sources":["../../../src/components/combobox/Combobox.ts"],"sourcesContent":["import { html } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport { generateId, WebComponent, customElement } from '@/lib/components'\nimport ComboboxOption from '@/components/combobox-option/ComboboxOption'\n\nimport '~icons/lucide/chevron-down'\n\nimport styles from './Combobox.styles.css'\n\n@customElement('solid-ui-combobox')\nexport default class Combobox extends WebComponent {\n  static styles = styles\n  static formAssociated = true\n\n  @property({ type: String, reflect: true })\n  accessor label = ''\n\n  @property({ type: String })\n  accessor value = ''\n\n  @query('[popover]')\n  private accessor popoverElement: HTMLDivElement | null = null\n\n  @query('input')\n  private accessor inputElement: HTMLInputElement | null = null\n\n  @state()\n  private accessor filter = ''\n\n  private inputId = `combobox-${generateId()}`\n\n  protected render () {\n    const options = this.getOptions().filter(option => option.toLowerCase().includes(this.filter))\n\n    return html`\n        ${this.label ? html`<label for=\"${this.inputId}\">${this.label}</label>` : ''}\n        <div class=\"input-wrapper\">\n            <input\n                id=\"${this.inputId}\"\n                .value=${this.value}\n                type=\"text\"\n                @keydown=${this.onInputKeyDown}\n                @click=${this.onInputClick}\n                @input=${this.onInputChange}\n            />\n            <icon-lucide-chevron-down></icon-lucide-chevron-down>\n        </div>\n        <div role=\"listbox\" aria-labelledby=\"${this.inputId}\" popover>\n          ${options.map(option => html`<div role=\"option\" aria-selected=\"false\" @click=${() => this.onOptionClick(option)}>${option}</div>`)}\n        </div>\n    `\n  }\n\n  private getOptions (): string[] {\n    const options = this.querySelectorAll<ComboboxOption>('solid-ui-combobox-option')\n\n    return Array.from(options).map(option => option.value)\n  }\n\n  private setValue (value: string) {\n    this.filter = value.toLowerCase()\n    this.value = value\n\n    this.getInternals().setFormValue(value)\n    this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }))\n  }\n\n  private onInputKeyDown (e: KeyboardEvent) {\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault()\n        this.popoverElement?.showPopover()\n        break\n      case 'Enter':\n        if (!this.popoverElement?.matches(':popover-open')) {\n          e.preventDefault()\n\n          this.getInternals().form?.requestSubmit()\n        }\n        break\n    }\n  }\n\n  private onInputClick (e: MouseEvent) {\n    e.preventDefault()\n\n    this.popoverElement?.showPopover()\n  }\n\n  private onInputChange () {\n    this.setValue(this.inputElement?.value ?? '')\n  }\n\n  private onOptionClick (option: string) {\n    this.setValue(option)\n\n    this.popoverElement?.hidePopover()\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"Combobox.esm.js","names":["customElement","WebComponent","html","property","query","state","InputTrait","styles","_classDecs","_Combobox","_Combobox2","_A","WeakMap","_B","_C","_D","_E","_F","_G","_H","_ref","_labelDecs","type","String","reflect","_nameDecs","_valueDecs","_placeholderDecs","_requiredDecs","Boolean","_popoverElementDecs","_inputElementDecs","_filterDecs","_Combobox3","Combobox","_classPrivateFieldGet","label","v","_classPrivateFieldSet","name","value","placeholder","required","popoverElement","inputElement","filter","constructor","_classPrivateFieldInitSpec","_initProto","_init_label","_init_name","_init_value","_init_placeholder","_init_required","_init_popoverElement","_init_inputElement","_init_filter","_defineProperty","inputTrait","addTrait","getInputElement","getInternals","onValueChanged","toLowerCase","render","options","getOptions","option","includes","renderLabel","inputId","onInputKeyDown","onInputClick","onInput","map","onOptionClick","querySelectorAll","Array","from","textContent","e","key","preventDefault","showPopover","matches","onSubmit","setValue","hidePopover","c","_initClass","_applyDecs","_Class","_identity","default"],"sources":["../../../src/components/combobox/Combobox.ts"],"sourcesContent":["import { customElement, WebComponent } from '@/lib/components'\nimport { html } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\nimport InputTrait from '@/lib/components/traits/InputTrait'\nimport type ComboboxOption from '@/components/combobox-option/ComboboxOption'\n\nimport '~icons/lucide/chevron-down'\n\nimport styles from './Combobox.styles.css'\n\n@customElement('solid-ui-combobox')\nexport default class Combobox extends WebComponent {\n  static styles = styles\n  static formAssociated = true\n\n  @property({ type: String, reflect: true })\n  accessor label = ''\n\n  @property({ type: String, reflect: true })\n  accessor name = ''\n\n  @property({ type: String })\n  accessor value = ''\n\n  @property({ type: String, reflect: true })\n  accessor placeholder = ''\n\n  @property({ type: Boolean, reflect: true })\n  accessor required = false\n\n  @query('[popover]')\n  private accessor popoverElement: HTMLDivElement | null = null\n\n  @query('input')\n  private accessor inputElement: HTMLInputElement | null = null\n\n  @state()\n  private accessor filter = ''\n\n  private inputTrait: InputTrait\n\n  constructor () {\n    super()\n\n    this.inputTrait = this.addTrait(\n      new InputTrait(this, {\n        getInputElement: () => this.inputElement,\n        getInternals: () => this.getInternals(),\n        onValueChanged: (value) => {\n          this.filter = value.toLowerCase()\n        },\n      })\n    )\n  }\n\n  protected render () {\n    const options = this.getOptions().filter((option) =>\n      option.label.toLowerCase().includes(this.filter)\n    )\n\n    return html`\n      ${this.inputTrait.renderLabel()}\n      <div class=\"input-wrapper\">\n        <input\n          id=\"${this.inputTrait.inputId}\"\n          type=\"text\"\n          name=${this.name}\n          ?placeholder=${this.placeholder}\n          ?required=${this.required}\n          .value=${this.value}\n          @keydown=${this.onInputKeyDown}\n          @click=${this.onInputClick}\n          @input=${() => this.inputTrait.onInput()}\n        />\n        <icon-lucide-chevron-down></icon-lucide-chevron-down>\n      </div>\n      <div role=\"listbox\" aria-labelledby=\"${this.inputTrait.inputId}\" popover>\n        ${options.map(\n          (option) =>\n            html`<div\n              role=\"option\"\n              aria-selected=\"false\"\n              @click=${() => this.onOptionClick(option.value)}\n            >\n              ${option.label}\n            </div>`\n        )}\n      </div>\n    `\n  }\n\n  private getOptions (): { value: string; label: string }[] {\n    const options = this.querySelectorAll<ComboboxOption>(\n      'solid-ui-combobox-option'\n    )\n\n    return Array.from(options).map((option) => ({\n      value: option.value,\n      label: option.textContent,\n    }))\n  }\n\n  private onInputKeyDown (e: KeyboardEvent) {\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault()\n        this.popoverElement?.showPopover()\n        break\n      case 'Enter':\n        if (!this.popoverElement?.matches(':popover-open')) {\n          e.preventDefault()\n\n          this.inputTrait.onSubmit()\n        }\n        break\n    }\n  }\n\n  private onInputClick (e: MouseEvent) {\n    e.preventDefault()\n\n    this.popoverElement?.showPopover()\n  }\n\n  private onOptionClick (option: string) {\n    this.inputTrait.setValue(option)\n\n    this.popoverElement?.hidePopover()\n  }\n}\n"],"mappings":"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"}

package/dist/components/combobox-option.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../chunks/combobox-option-CW1ZwMC7.js";
+import { n as e, t } from "../chunks/combobox-option-Ck0mu4Gc.js";
 export { e as ComboboxOption, t as default };

package/dist/components/combobox.js

@@ -1,2 +1,2 @@
-import { n as e, t } from "../chunks/combobox-eju-wypA.js";
+import { n as e, t } from "../chunks/combobox-Dtgc8qqO.js";
 export { e as Combobox, t as default };

package/dist/components/dialog/Dialog.cjs.js

@@ -1,4 +1,4 @@
-const e=require("../../lib/dialogs/context.cjs.js"),t=require("../../lib/components/decorators.cjs.js"),n=require("../../lib/components/web-component/WebComponent.cjs.js");require("../../lib/components/index.cjs.js");const r=require("../../lib/dialogs/events/close-dialog.cjs.js");require("../../_virtual/~icons/lucide/x.cjs.js"),require("../dialog-header/index.cjs.js"),require("../button/index.cjs.js");const i=require("./Dialog.styles.cjs.js");let a=require("@lit/context"),o=require("lit"),s=require("lit/decorators.js");var c,l,u,d,f,p,m,h,g,_,v,y,b,x,S,C;function w(e,t,n){T(e,t),t.set(e,n)}function T(e,t){if(t.has(e))throw TypeError(`Cannot initialize the same private elements twice on an object`)}function E(e,t,n){return e.set(O(e,t),n),n}function D(e,t){return e.get(O(e,t))}function O(e,t,n){if(typeof e==`function`?e===t:e.has(t))return arguments.length<3?t:n;throw TypeError(`Private element is not present on this object`)}function k(e,t,n){return(t=j(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function A(e,t,n,r,i,a){function o(e,t,n){return function(r,i){return n&&n(r),e[t].call(r,i)}}function s(e,t){for(var n=0;n<e.length;n++)e[n].call(t);return t}function c(e,t,n,r){if(typeof e!=`function`&&(r||e!==void 0))throw TypeError(t+` must `+(n||`be`)+` a function`+(r?``:` or undefined`));return e}function l(e,t,n,r,i,a,s,l,u,d,f,p,m){function h(e){if(!m(e))throw TypeError(`Attempted to access private element on non-instance`)}var g,_=t[0],v=t[3],y=!l;if(!y){n||Array.isArray(_)||(_=[_]);var b={},x=[],S=i===3?`get`:i===4||p?`set`:`value`;d?(f||p?b={get:N(function(){return v(this)},r,`get`),set:function(e){t[4](this,e)}}:b[S]=v,f||N(b[S],r,i===2?``:S)):f||(b=Object.getOwnPropertyDescriptor(e,r))}for(var C=e,w=_.length-1;w>=0;w-=n?2:1){var T=_[w],E=n?_[w-1]:void 0,D={},O={kind:[`field`,`accessor`,`method`,`getter`,`setter`,`class`][i],name:r,metadata:a,addInitializer:function(e,t){if(e.v)throw Error(`attempted to call addInitializer after decoration was finished`);c(t,`An initializer`,`be`,!0),s.push(t)}.bind(null,D)};try{if(y)(g=c(T.call(E,C,O),`class decorators`,`return`))&&(C=g);else{var k,A;O.static=u,O.private=d,d?i===2?k=function(e){return h(e),b.value}:(i<4&&(k=o(b,`get`,h)),i!==3&&(A=o(b,`set`,h))):(k=function(e){return e[r]},(i<2||i===4)&&(A=function(e,t){e[r]=t}));var j=O.access={has:d?m.bind():function(e){return r in e}};if(k&&(j.get=k),A&&(j.set=A),C=T.call(E,p?{get:b.get,set:b.set}:b[S],O),p){if(typeof C==`object`&&C)(g=c(C.get,`accessor.get`))&&(b.get=g),(g=c(C.set,`accessor.set`))&&(b.set=g),(g=c(C.init,`accessor.init`))&&x.push(g);else if(C!==void 0)throw TypeError(`accessor decorators must return an object with get, set, or init properties or void 0`)}else c(C,(f?`field`:`method`)+` decorators`,`return`)&&(f?x.push(C):b[S]=C)}}finally{D.v=!0}}return(f||p)&&l.push(function(e,t){for(var n=x.length-1;n>=0;n--)t=x[n].call(e,t);return t}),f||y||(d?p?l.push(o(b,`get`),o(b,`set`)):l.push(i===2?b[S]:o.call.bind(b[S])):Object.defineProperty(e,r,b)),C}function u(e,t){return Object.defineProperty(e,Symbol.metadata||Symbol.for(`Symbol.metadata`),{configurable:!0,enumerable:!0,value:t})}if(arguments.length>=6)var d=a[Symbol.metadata||Symbol.for(`Symbol.metadata`)];var f=Object.create(d??null),p=function(e,t,n,r){var i,a,o=[],c=function(t){return P(t)===e},u=new Map;function d(e){e&&o.push(s.bind(null,e))}for(var f=0;f<t.length;f++){var p=t[f];if(Array.isArray(p)){var m=p[1],h=p[2],g=p.length>3,_=16&m,v=!!(8&m),y=(m&=7)==0,b=h+`/`+v;if(!y&&!g){var x=u.get(b);if(!0===x||x===3&&m!==4||x===4&&m!==3)throw Error(`Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: `+h);u.set(b,!(m>2)||m)}l(v?e:e.prototype,p,_,g?`#`+h:j(h),m,r,v?a||=[]:i||=[],o,v,g,y,m===1,v&&g?c:n)}}return d(i),d(a),o}(e,t,i,f);return n.length||u(e,f),{e:p,get c(){var t=[];return n.length&&[u(l(e,[n],r,e.name,5,f,t),f),s.bind(null,t,e)]}}}function j(e){var t=M(e,`string`);return typeof t==`symbol`?t:t+``}function M(e,t){if(typeof e!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(typeof r!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function N(e,t,n){typeof t==`symbol`&&(t=(t=t.description)?`[`+t+`]`:``);try{Object.defineProperty(e,"name",{configurable:!0,value:n?n+` `+t:t})}catch{}return e}function P(e){if(Object(e)!==e)throw TypeError(`right-hand side of 'in' should be an object, got `+(e===null?`null`:typeof e));return e}function F(e){return e}h=[t.customElement(`solid-ui-dialog`)];var I;new(S=(u=new WeakMap,d=new WeakMap,f=new WeakMap,C=(g=(0,s.property)({type:String,reflect:!0}),v=(0,s.query)(`dialog`),b=(0,a.consume)({context:e.dialogContext,subscribe:!0}),`title`),l=class extends n.default{constructor(...e){super(...e),w(this,u,(p(this),_(this,``))),w(this,d,y(this,null)),w(this,f,x(this))}get[C](){return D(u,this)}set title(e){E(u,this,e)}get nativeDialog(){return D(d,this)}set nativeDialog(e){E(d,this,e)}get context(){return D(f,this)}set context(e){E(f,this,e)}close(){if(!this.context)throw Error(`Dialog context missing`);window.dispatchEvent(new r.CloseDialogEvent(this.context.id))}firstUpdated(){this.nativeDialog&&(this.nativeDialog.showModal(),this.nativeDialog.addEventListener(`close`,()=>this.close()))}render(){return o.html`
+const e=require("../../lib/dialogs/context.cjs.js"),t=require("../../lib/components/decorators.cjs.js"),n=require("../../lib/components/web-component/WebComponent.cjs.js"),r=require("../../lib/components/traits/DialogTrait.cjs.js");require("../../lib/components/index.cjs.js"),require("../../_virtual/~icons/lucide/x.cjs.js"),require("../dialog-header/index.cjs.js"),require("../button/index.cjs.js");const i=require("./Dialog.styles.cjs.js");let a=require("@lit/context"),o=require("lit"),s=require("lit/decorators.js");var c,l,u,d,f,p,m,h,g,_,v,y,b,x,S,C;function w(e,t,n){T(e,t),t.set(e,n)}function T(e,t){if(t.has(e))throw TypeError(`Cannot initialize the same private elements twice on an object`)}function E(e,t,n){return e.set(O(e,t),n),n}function D(e,t){return e.get(O(e,t))}function O(e,t,n){if(typeof e==`function`?e===t:e.has(t))return arguments.length<3?t:n;throw TypeError(`Private element is not present on this object`)}function k(e,t,n){return(t=j(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function A(e,t,n,r,i,a){function o(e,t,n){return function(r,i){return n&&n(r),e[t].call(r,i)}}function s(e,t){for(var n=0;n<e.length;n++)e[n].call(t);return t}function c(e,t,n,r){if(typeof e!=`function`&&(r||e!==void 0))throw TypeError(t+` must `+(n||`be`)+` a function`+(r?``:` or undefined`));return e}function l(e,t,n,r,i,a,s,l,u,d,f,p,m){function h(e){if(!m(e))throw TypeError(`Attempted to access private element on non-instance`)}var g,_=t[0],v=t[3],y=!l;if(!y){n||Array.isArray(_)||(_=[_]);var b={},x=[],S=i===3?`get`:i===4||p?`set`:`value`;d?(f||p?b={get:N(function(){return v(this)},r,`get`),set:function(e){t[4](this,e)}}:b[S]=v,f||N(b[S],r,i===2?``:S)):f||(b=Object.getOwnPropertyDescriptor(e,r))}for(var C=e,w=_.length-1;w>=0;w-=n?2:1){var T=_[w],E=n?_[w-1]:void 0,D={},O={kind:[`field`,`accessor`,`method`,`getter`,`setter`,`class`][i],name:r,metadata:a,addInitializer:function(e,t){if(e.v)throw Error(`attempted to call addInitializer after decoration was finished`);c(t,`An initializer`,`be`,!0),s.push(t)}.bind(null,D)};try{if(y)(g=c(T.call(E,C,O),`class decorators`,`return`))&&(C=g);else{var k,A;O.static=u,O.private=d,d?i===2?k=function(e){return h(e),b.value}:(i<4&&(k=o(b,`get`,h)),i!==3&&(A=o(b,`set`,h))):(k=function(e){return e[r]},(i<2||i===4)&&(A=function(e,t){e[r]=t}));var j=O.access={has:d?m.bind():function(e){return r in e}};if(k&&(j.get=k),A&&(j.set=A),C=T.call(E,p?{get:b.get,set:b.set}:b[S],O),p){if(typeof C==`object`&&C)(g=c(C.get,`accessor.get`))&&(b.get=g),(g=c(C.set,`accessor.set`))&&(b.set=g),(g=c(C.init,`accessor.init`))&&x.push(g);else if(C!==void 0)throw TypeError(`accessor decorators must return an object with get, set, or init properties or void 0`)}else c(C,(f?`field`:`method`)+` decorators`,`return`)&&(f?x.push(C):b[S]=C)}}finally{D.v=!0}}return(f||p)&&l.push(function(e,t){for(var n=x.length-1;n>=0;n--)t=x[n].call(e,t);return t}),f||y||(d?p?l.push(o(b,`get`),o(b,`set`)):l.push(i===2?b[S]:o.call.bind(b[S])):Object.defineProperty(e,r,b)),C}function u(e,t){return Object.defineProperty(e,Symbol.metadata||Symbol.for(`Symbol.metadata`),{configurable:!0,enumerable:!0,value:t})}if(arguments.length>=6)var d=a[Symbol.metadata||Symbol.for(`Symbol.metadata`)];var f=Object.create(d??null),p=function(e,t,n,r){var i,a,o=[],c=function(t){return P(t)===e},u=new Map;function d(e){e&&o.push(s.bind(null,e))}for(var f=0;f<t.length;f++){var p=t[f];if(Array.isArray(p)){var m=p[1],h=p[2],g=p.length>3,_=16&m,v=!!(8&m),y=(m&=7)==0,b=h+`/`+v;if(!y&&!g){var x=u.get(b);if(!0===x||x===3&&m!==4||x===4&&m!==3)throw Error(`Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: `+h);u.set(b,!(m>2)||m)}l(v?e:e.prototype,p,_,g?`#`+h:j(h),m,r,v?a||=[]:i||=[],o,v,g,y,m===1,v&&g?c:n)}}return d(i),d(a),o}(e,t,i,f);return n.length||u(e,f),{e:p,get c(){var t=[];return n.length&&[u(l(e,[n],r,e.name,5,f,t),f),s.bind(null,t,e)]}}}function j(e){var t=M(e,`string`);return typeof t==`symbol`?t:t+``}function M(e,t){if(typeof e!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(typeof r!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function N(e,t,n){typeof t==`symbol`&&(t=(t=t.description)?`[`+t+`]`:``);try{Object.defineProperty(e,"name",{configurable:!0,value:n?n+` `+t:t})}catch{}return e}function P(e){if(Object(e)!==e)throw TypeError(`right-hand side of 'in' should be an object, got `+(e===null?`null`:typeof e));return e}function F(e){return e}h=[t.customElement(`solid-ui-dialog`)];var I;new(S=(u=new WeakMap,d=new WeakMap,f=new WeakMap,C=(g=(0,s.property)({type:String,reflect:!0}),v=(0,s.query)(`dialog`),b=(0,a.consume)({context:e.dialogContext,subscribe:!0}),`title`),l=class extends n.default{get[C](){return D(u,this)}set title(e){E(u,this,e)}get nativeDialog(){return D(d,this)}set nativeDialog(e){E(d,this,e)}get context(){return D(f,this)}set context(e){E(f,this,e)}constructor(){super(),w(this,u,(p(this),_(this,``))),w(this,d,y(this,null)),w(this,f,x(this,e.DEFAULT_DIALOG_CONTEXT)),k(this,`dialogTrait`,void 0),this.dialogTrait=this.addTrait(new r.default(this,{getContext:()=>this.context}))}close(e){this.dialogTrait.close(e)}firstUpdated(){this.nativeDialog&&(this.nativeDialog.showModal(),this.nativeDialog.addEventListener(`close`,()=>this.close()))}render(){return o.html`
         <dialog>
             <slot name="header">${this.title?o.html`
         <solid-ui-dialog-header>

package/dist/components/dialog/Dialog.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.cjs.js","names":["consume","html","nothing","property","query","customElement","WebComponent","dialogContext","CloseDialogEvent","styles","_classDecs","_Dialog","_Dialog2","_A","WeakMap","_B","_C","_ref","_titleDecs","type","String","reflect","_nativeDialogDecs","_contextDecs","context","subscribe","_Dialog3","Dialog","constructor","args","_classPrivateFieldInitSpec","_initProto","_init_title","_init_nativeDialog","_init_context","_classPrivateFieldGet","title","v","_classPrivateFieldSet","nativeDialog","close","Error","window","dispatchEvent","id","firstUpdated","showModal","addEventListener","render","header","e","c","_initClass","_applyDecs","_Class","_identity","_defineProperty","default"],"sources":["../../../src/components/dialog/Dialog.ts"],"sourcesContent":["import { consume } from '@lit/context'\nimport { html, nothing } from 'lit'\nimport { property, query } from 'lit/decorators.js'\nimport { customElement, WebComponent } from '@/lib/components'\nimport { DialogContext, dialogContext } from '../../lib/dialogs/context'\nimport { CloseDialogEvent } from '../../lib/dialogs/events/close-dialog'\n\nimport '~icons/lucide/x'\nimport '@/components/dialog-header'\nimport '@/components/button'\n\nimport styles from './Dialog.styles.css'\n\n@customElement('solid-ui-dialog')\nexport default class Dialog extends WebComponent {\n  static styles = styles\n\n  @property({ type: String, reflect: true })\n  accessor title = ''\n\n  @query('dialog')\n  private accessor nativeDialog: HTMLDialogElement | null = null\n\n  @consume({ context: dialogContext, subscribe: true })\n  private accessor context!: DialogContext\n\n  public close () {\n    if (!this.context) {\n      throw new Error('Dialog context missing')\n    }\n\n    window.dispatchEvent(new CloseDialogEvent(this.context.id))\n  }\n\n  protected firstUpdated () {\n    if (!this.nativeDialog) {\n      return\n    }\n\n    this.nativeDialog.showModal()\n    this.nativeDialog.addEventListener('close', () => this.close())\n  }\n\n  protected render () {\n    const header = this.title\n      ? html`\n        <solid-ui-dialog-header>\n            <h1>${this.title}</h1>\n\n            <solid-ui-button variant=\"ghost\" @click=${this.close}>\n                <span class=\"sr-only\">Close</span>\n                <icon-lucide-x slot=\"icon\"></icon-lucide-x>\n            </solid-ui-button>\n        </solid-ui-dialog-header>\n        `\n      : nothing\n\n    return html`\n        <dialog>\n            <slot name=\"header\">${header}</slot>\n            <slot></slot>\n            <slot name=\"footer\"></slot>\n        </dialog>\n    `\n  }\n}\n"],"mappings":"qmJAWwCU,EAAA,CAEvCL,EAAAA,cAAc,iBAAiB,CAAC,EAAA,IAAAM,EAAA,IAAAC,GAAAC,EAAA,IAAAC,QAAAC,EAAA,IAAAD,QAAAE,EAAA,IAAAF,QAAAG,GAAAC,GAAAA,EAAAA,EAAAA,UAIrB,CAAEC,KAAMC,OAAQC,QAAS,EAAK,CAAC,EAACC,GAAAA,EAAAA,EAAAA,OAGnC,QAAQ,EAACC,GAAAA,EAAAA,EAAAA,SAGP,CAAEC,QAASjB,EAAAA,cAAekB,UAAW,EAAK,CAAC,EAAC,SAAAC,EAVvD,cACoCpB,EAAAA,OAAa,CAAAsB,YAAA,GAAAC,EAAA,CAAA,MAAA,GAAAA,CAAA,EAAAC,EAAA,KAAAjB,GAAAkB,EAAA,IAAA,EAAAC,EAAA,KAI9B,EAAE,EAAA,EAAAF,EAAA,KAAAf,EAAAkB,EAAA,KAGuC,IAAI,CAAA,EAAAH,EAAA,KAAAd,EAAAkB,EAAA,IAAA,CAAA,CAAA,CAAA,IAAAjB,IAAA,CAAA,OAAAkB,EAAAtB,EAAA,IAAA,CAAA,CAAA,IAHrDuB,MAAKC,EAAA,CAAAC,EAAAzB,EAAA,KAAAwB,CAAA,CAAA,CAAA,IAGGE,cAAY,CAAA,OAAAJ,EAAApB,EAAA,IAAA,CAAA,CAAA,IAAZwB,aAAYF,EAAA,CAAAC,EAAAvB,EAAA,KAAAsB,CAAA,CAAA,CAAA,IAGZb,SAAO,CAAA,OAAAW,EAAAnB,EAAA,IAAA,CAAA,CAAA,IAAPQ,QAAOa,EAAA,CAAAC,EAAAtB,EAAA,KAAAqB,CAAA,CAAA,CAEjBG,OAAS,CACd,GAAI,CAAC,KAAKhB,QACR,MAAUiB,MAAM,wBAAwB,EAG1CC,OAAOC,cAAc,IAAInC,EAAAA,iBAAiB,KAAKgB,QAAQoB,EAAE,CAAC,CAC5D,CAEUC,cAAgB,CACnB,KAAKN,eAIV,KAAKA,aAAaO,UAAU,EAC5B,KAAKP,aAAaQ,iBAAiB,YAAe,KAAKP,MAAM,CAAC,EAChE,CAEUQ,QAAU,CAclB,MAAO/C,GAAAA,IAAI;;kCAbI,KAAKmC,MAChBnC,EAAAA,IAAI;;kBAEM,KAAKmC,MAAK;;sDAE0B,KAAKI,MAAK;;;;;UAMxDtC,EAAAA,QAIgC;;;;KAKtC,CACF,EAAC,CAAAgD,EAAA,CAAAlB,EAAAC,EAAAC,EAAAH,GAAAoB,EAAA,CAAAxC,EAAAyC,IAAAC,EAAA3B,EAAA,CAAA,CAAAR,EAAA,EAAA,OAAA,EAAA,CAAAI,EAAA,EAAA,cAAA,EAAA,CAAAC,EAAA,EAAA,SAAA,CAAA,EAAAb,EAAA,EAAA,IAAA,GAnDmCJ,EAAAA,OAAY,EAAAoB,GAAA4B,EAAA,cAAAC,CAAA,CAAA3B,aAAA,CAAA,MAAAjB,CAAA,EAAA6C,EAAA,KAAA,SAC9B/C,EAAAA,OAAM,EAAA2C,EAAA,CAAA,CAAA,EAAAI,EAAAF,EAAA1C,EAAA,IAAA,EAAA,EAAA0C"}
+{"version":3,"file":"Dialog.cjs.js","names":["customElement","WebComponent","consume","html","nothing","property","query","dialogContext","DEFAULT_DIALOG_CONTEXT","DialogTrait","styles","_classDecs","_Dialog","_Dialog2","_A","WeakMap","_B","_C","_ref","_titleDecs","type","String","reflect","_nativeDialogDecs","_contextDecs","context","subscribe","_Dialog3","Dialog","_classPrivateFieldGet","title","v","_classPrivateFieldSet","nativeDialog","constructor","_classPrivateFieldInitSpec","_initProto","_init_title","_init_nativeDialog","_init_context","_defineProperty","dialogTrait","addTrait","getContext","close","data","firstUpdated","showModal","addEventListener","render","header","e","c","_initClass","_applyDecs","_Class","_identity","default"],"sources":["../../../src/components/dialog/Dialog.ts"],"sourcesContent":["import { customElement, WebComponent } from '@/lib/components'\nimport { consume } from '@lit/context'\nimport { html, nothing } from 'lit'\nimport { property, query } from 'lit/decorators.js'\nimport { DialogContext, dialogContext, DEFAULT_DIALOG_CONTEXT } from '@/lib/dialogs/context'\nimport DialogTrait from '@/lib/components/traits/DialogTrait'\n\nimport '~icons/lucide/x'\nimport '@/components/dialog-header'\nimport '@/components/button'\n\nimport styles from './Dialog.styles.css'\n\n@customElement('solid-ui-dialog')\nexport default class Dialog extends WebComponent {\n  static styles = styles\n\n  @property({ type: String, reflect: true })\n  accessor title = ''\n\n  @query('dialog')\n  private accessor nativeDialog: HTMLDialogElement | null = null\n\n  @consume({ context: dialogContext, subscribe: true })\n  private accessor context: DialogContext = DEFAULT_DIALOG_CONTEXT\n\n  private dialogTrait: DialogTrait<unknown>\n\n  constructor () {\n    super()\n\n    this.dialogTrait = this.addTrait(new DialogTrait(this, {\n      getContext: () => this.context\n    }))\n  }\n\n  public close (data?: unknown) {\n    this.dialogTrait.close(data)\n  }\n\n  protected firstUpdated () {\n    if (!this.nativeDialog) {\n      return\n    }\n\n    this.nativeDialog.showModal()\n    this.nativeDialog.addEventListener('close', () => this.close())\n  }\n\n  protected render () {\n    const header = this.title\n      ? html`\n        <solid-ui-dialog-header>\n            <h1>${this.title}</h1>\n\n            <solid-ui-button variant=\"ghost\" @click=${this.close}>\n                <span class=\"sr-only\">Close</span>\n                <icon-lucide-x slot=\"icon\"></icon-lucide-x>\n            </solid-ui-button>\n        </solid-ui-dialog-header>\n        `\n      : nothing\n\n    return html`\n        <dialog>\n            <slot name=\"header\">${header}</slot>\n            <slot></slot>\n            <slot name=\"footer\"></slot>\n        </dialog>\n    `\n  }\n}\n"],"mappings":"imJAWwCW,EAAA,CAEvCX,EAAAA,cAAc,iBAAiB,CAAC,EAAA,IAAAY,EAAA,IAAAC,GAAAC,EAAA,IAAAC,QAAAC,EAAA,IAAAD,QAAAE,EAAA,IAAAF,QAAAG,GAAAC,GAAAA,EAAAA,EAAAA,UAIrB,CAAEC,KAAMC,OAAQC,QAAS,EAAK,CAAC,EAACC,GAAAA,EAAAA,EAAAA,OAGnC,QAAQ,EAACC,GAAAA,EAAAA,EAAAA,SAGP,CAAEC,QAASlB,EAAAA,cAAemB,UAAW,EAAK,CAAC,EAAC,SAAAC,EAVvD,cACoC1B,EAAAA,OAAa,CAAA,IAAAiB,IAAA,CAAA,OAAAW,EAAAf,EAAA,IAAA,CAAA,CAAA,IAItCgB,MAAKC,EAAA,CAAAC,EAAAlB,EAAA,KAAAiB,CAAA,CAAA,CAAA,IAGGE,cAAY,CAAA,OAAAJ,EAAAb,EAAA,IAAA,CAAA,CAAA,IAAZiB,aAAYF,EAAA,CAAAC,EAAAhB,EAAA,KAAAe,CAAA,CAAA,CAAA,IAGZN,SAAO,CAAA,OAAAI,EAAAZ,EAAA,IAAA,CAAA,CAAA,IAAPQ,QAAOM,EAAA,CAAAC,EAAAf,EAAA,KAAAc,CAAA,CAAA,CAIxBG,aAAe,CACb,MAAM,EAACC,EAAA,KAAArB,GAAAsB,EAAA,IAAA,EAAAC,EAAA,KAXQ,EAAE,EAAA,EAAAF,EAAA,KAAAnB,EAAAsB,EAAA,KAGuC,IAAI,CAAA,EAAAH,EAAA,KAAAlB,EAAAsB,EAAA,KAGpB/B,EAAAA,sBAAsB,CAAA,EAAAgC,EAAA,KAAA,cAAA,IAAA,EAAA,EAO9D,KAAKC,YAAc,KAAKC,SAAS,IAAIjC,EAAAA,QAAY,KAAM,CACrDkC,eAAkB,KAAKlB,OACzB,CAAC,CAAC,CACJ,CAEOmB,MAAOC,EAAgB,CAC5B,KAAKJ,YAAYG,MAAMC,CAAI,CAC7B,CAEUC,cAAgB,CACnB,KAAKb,eAIV,KAAKA,aAAac,UAAU,EAC5B,KAAKd,aAAae,iBAAiB,YAAe,KAAKJ,MAAM,CAAC,EAChE,CAEUK,QAAU,CAclB,MAAO9C,GAAAA,IAAI;;kCAbI,KAAK2B,MAChB3B,EAAAA,IAAI;;kBAEM,KAAK2B,MAAK;;sDAE0B,KAAKc,MAAK;;;;;UAMxDxC,EAAAA,QAIgC;;;;KAKtC,CACF,EAAC,CAAA+C,EAAA,CAAAd,EAAAC,EAAAC,EAAAH,GAAAgB,EAAA,CAAAxC,EAAAyC,IAAAC,EAAA3B,EAAA,CAAA,CAAAR,EAAA,EAAA,OAAA,EAAA,CAAAI,EAAA,EAAA,cAAA,EAAA,CAAAC,EAAA,EAAA,SAAA,CAAA,EAAAb,EAAA,EAAA,IAAA,GAzDmCV,EAAAA,OAAY,EAAA0B,GAAA4B,EAAA,cAAAC,CAAA,CAAAtB,aAAA,CAAA,MAAAtB,CAAA,EAAA4B,EAAA,KAAA,SAC9B9B,EAAAA,OAAM,EAAA2C,EAAA,CAAA,CAAA,EAAAb,EAAAe,EAAA1C,EAAA,IAAA,EAAA,EAAA0C"}

package/dist/components/dialog/Dialog.d.ts

@@ -4,7 +4,9 @@ export default class Dialog extends WebComponent {
     accessor title: string;
     private accessor nativeDialog;
     private accessor context;
-    close(): void;
+    private dialogTrait;
+    constructor();
+    close(data?: unknown): void;
     protected firstUpdated(): void;
     protected render(): import('lit-html').TemplateResult<1>;
 }

package/dist/components/dialog/Dialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/Dialog.ts"],"names":[],"mappings":"AAGA,OAAO,EAAiB,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAI9D,OAAO,iBAAiB,CAAA;AACxB,OAAO,4BAA4B,CAAA;AACnC,OAAO,qBAAqB,CAAA;AAK5B,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,YAAY;IAC9C,MAAM,CAAC,MAAM,0BAAS;IAGtB,QAAQ,CAAC,KAAK,SAAK;IAGnB,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAiC;IAG9D,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAgB;IAEjC,KAAK;IAQZ,SAAS,CAAC,YAAY;IAStB,SAAS,CAAC,MAAM;CAsBjB"}
+{"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/Dialog.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAO9D,OAAO,iBAAiB,CAAA;AACxB,OAAO,4BAA4B,CAAA;AACnC,OAAO,qBAAqB,CAAA;AAK5B,MAAM,CAAC,OAAO,OAAO,MAAO,SAAQ,YAAY;IAC9C,MAAM,CAAC,MAAM,0BAAS;IAGtB,QAAQ,CAAC,KAAK,SAAK;IAGnB,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAiC;IAG9D,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAwC;IAEhE,OAAO,CAAC,WAAW,CAAsB;;IAUlC,KAAK,CAAE,IAAI,CAAC,EAAE,OAAO;IAI5B,SAAS,CAAC,YAAY;IAStB,SAAS,CAAC,MAAM;CAsBjB"}