@webority/ui-elements 0.34.0 → 0.35.0

package/dist/WuiTree-Ds-8tNgs.js

@@ -0,0 +1,393 @@
+import { t as e } from "./elementBase-Bg1xpvup.js";
+import { c as t } from "./wuiHttp-m0yQadwQ.js";
+import { n, t as r } from "./formMirror-jGf5M4gk.js";
+import { t as i } from "./iconGlyphs.g-Cpg1BUHm.js";
+import { t as a } from "./listboxKeyNav-zts_8d5e.js";
+//#region src/WuiTree.js
+var o = [
+	"none",
+	"single",
+	"multiple"
+], s = "parentId", c = "Loading", l = "Could not load. Try again.", u = ":scope > input[data-wui-mirror]", d = [
+	"nodes",
+	"selection",
+	"selected",
+	"values",
+	"loadChildren",
+	"loadUrl",
+	"name"
+], f = 0;
+function p(e, t, n) {
+	let r = document.createElement(e);
+	t && (r.className = t);
+	for (let [e, t] of Object.entries(n ?? {})) t != null && r.setAttribute(e, String(t));
+	return r;
+}
+var m = class extends e {
+	static get observedAttributes() {
+		return [
+			"selection",
+			"selected",
+			"name",
+			"aria-label",
+			"loading-text",
+			"error-text"
+		];
+	}
+	constructor() {
+		super(), this._uid = `wui-tree-${++f}`, this._seq = 0, this._roots = [], this._byId = /* @__PURE__ */ new Map(), this._prev = null, this._staged = null, this._els = /* @__PURE__ */ new Map(), this._checked = /* @__PURE__ */ new Set(), this._selected = null, this._focusId = null, this._loader = null, this._list = null, this._live = null, this._ready = !1, this._nav = a({
+			getVisibleOptions: () => this._visible().map((e) => this._els.get(e.id)?.row),
+			getActive: () => this._visible().findIndex((e) => e.id === this._focusId),
+			setActive: (e) => this._focusNode(this._visible()[e]),
+			onEnter: () => {
+				let e = this._byId.get(this._focusId);
+				e && this._activate(e);
+			}
+		}), this._onKeyDown = (e) => this._handleKeyDown(e), this._onClick = (e) => this._handleClick(e), this._onFocusIn = (e) => {
+			let t = this._nodeFrom(e.target);
+			t && t.id !== this._focusId && this._setRoving(t);
+		};
+	}
+	connectedCallback() {
+		let e = {};
+		for (let t of d) Object.hasOwn(this, t) && (e[t] = this[t], delete this[t]);
+		if (!this._ready) {
+			this._ready = !0;
+			let e = this._readScript();
+			this.replaceChildren(), this._list = p("ul", "wui-tree"), this._list.setAttribute("role", "tree"), this._live = p("div", "visually-hidden", {
+				role: "status",
+				"aria-live": "polite"
+			}), this.append(this._list, this._live), e && this._adoptAll(e);
+		}
+		for (let [t, n] of Object.entries(e)) this[t] = n;
+		this.addEventListener("keydown", this._onKeyDown), this.addEventListener("click", this._onClick), this.addEventListener("focusin", this._onFocusIn), this._render(), this._loadOpenNodes();
+	}
+	disconnectedCallback() {
+		this.removeEventListener("keydown", this._onKeyDown), this.removeEventListener("click", this._onClick), this.removeEventListener("focusin", this._onFocusIn), this._nav.teardown();
+	}
+	attributeChangedCallback(e, t, n) {
+		e === "selected" && (this._selected = n), this._ready && this.isConnected && this._render();
+	}
+	get nodes() {
+		return this._roots.map((e) => e.raw);
+	}
+	set nodes(e) {
+		this._adoptAll(e ?? []), this._render(), this._loadOpenNodes();
+	}
+	get selection() {
+		let e = this.getAttribute("selection");
+		return o.includes(e) ? e : "none";
+	}
+	set selection(e) {
+		this.setAttribute("selection", String(e));
+	}
+	get selected() {
+		return this._selected;
+	}
+	set selected(e) {
+		this._selected = e == null ? null : String(e), this._render();
+	}
+	get values() {
+		let e = [], t = (n) => {
+			for (let r of n) this._state(r) === "checked" && e.push(r.id), r.children && t(r.children);
+		};
+		return t(this._roots), [...e, ...[...this._checked].filter((e) => !this._byId.has(e))];
+	}
+	set values(e) {
+		this._checked.clear();
+		for (let t of e ?? []) {
+			let e = this._byId.get(String(t));
+			e ? this._setChecked(e, !0) : this._checked.add(String(t));
+		}
+		this._render();
+	}
+	get loadChildren() {
+		return this._loader;
+	}
+	set loadChildren(e) {
+		this._loader = typeof e == "function" ? e : null;
+	}
+	get loadUrl() {
+		return this.getAttribute("load-url");
+	}
+	set loadUrl(e) {
+		e == null ? this.removeAttribute("load-url") : this.setAttribute("load-url", String(e));
+	}
+	get name() {
+		return this.getAttribute("name");
+	}
+	set name(e) {
+		e == null ? this.removeAttribute("name") : this.setAttribute("name", String(e));
+	}
+	get loadingText() {
+		return this.getAttribute("loading-text") ?? c;
+	}
+	set loadingText(e) {
+		this.setAttribute("loading-text", String(e ?? ""));
+	}
+	get errorText() {
+		return this.getAttribute("error-text") ?? l;
+	}
+	set errorText(e) {
+		this.setAttribute("error-text", String(e ?? ""));
+	}
+	_readScript() {
+		let e = this.querySelector(":scope > script[type='application/json']");
+		if (!e) return null;
+		try {
+			return JSON.parse(e.textContent);
+		} catch (e) {
+			return console.error("[@webority/ui-elements] <wui-tree> could not read its JSON nodes:", e?.message), null;
+		}
+	}
+	_adoptAll(e) {
+		let t = this._byId;
+		this._prev = t, this._byId = /* @__PURE__ */ new Map();
+		let n;
+		try {
+			n = this._adoptStaged(e, null, 1);
+		} catch (e) {
+			throw this._byId = t, e;
+		} finally {
+			this._prev = null;
+		}
+		this._roots = n;
+		for (let e of t.keys()) this._byId.has(e) || this._checked.delete(e);
+		for (let e of this._roots) this._passChecksDown(e);
+		this._focusId && !this._byId.has(this._focusId) && (this._focusId = null);
+	}
+	_adoptStaged(e, t, n) {
+		let r = [], i = [];
+		this._staged = {
+			ids: r,
+			checks: i
+		};
+		try {
+			let r = this._adopt(e, t, n);
+			for (let e of i) this._checked.add(e);
+			return r;
+		} catch (e) {
+			for (let e of r) this._byId.delete(e);
+			throw e;
+		} finally {
+			this._staged = null;
+		}
+	}
+	_adopt(e, t, n) {
+		if (!Array.isArray(e)) throw Error("<wui-tree> nodes must be an array.");
+		return e.map((e) => {
+			let r = e?.id == null ? "" : String(e.id);
+			if (!r) throw Error("<wui-tree> every node needs an id.");
+			if (this._byId.has(r)) throw Error(`<wui-tree> node id "${r}" is used twice.`);
+			let i = this._prev?.get(r), a = {
+				id: r,
+				raw: e,
+				parent: t,
+				level: n,
+				seq: ++this._seq,
+				label: e.label == null ? r : String(e.label),
+				icon: e.icon || null,
+				badge: e.badge == null || e.badge === "" ? null : String(e.badge),
+				badgeTone: e.badgeTone || null,
+				disabled: !!e.disabled,
+				hasChildren: !!e.hasChildren,
+				children: null,
+				expanded: i ? i.expanded : !!e.expanded,
+				loading: !1,
+				failed: !1
+			};
+			this._byId.set(r, a), this._staged.ids.push(r);
+			let o = e.children ?? (e.hasChildren ? i?.children?.map((e) => e.raw) : void 0);
+			return Array.isArray(o) && (a.children = this._adopt(o, a, n + 1)), a.loading = !!i?.loading && a.children === null && a.hasChildren, e.checked && !i && this._staged.checks.push(r), a;
+		});
+	}
+	_passChecksDown(e) {
+		e.children?.length && this._checked.has(e.id) && (this._checked.delete(e.id), this._setChecked(e, !0));
+		for (let t of e.children ?? []) this._passChecksDown(t);
+	}
+	_loadOpenNodes() {
+		queueMicrotask(() => {
+			if (this.isConnected) for (let e of [...this._byId.values()]) e.expanded && e.children === null && e.hasChildren && !e.loading && this._load(e);
+		});
+	}
+	_isBranch(e) {
+		return e.children ? e.children.length > 0 : e.hasChildren;
+	}
+	_visible() {
+		let e = [], t = (n) => {
+			for (let r of n) e.push(r), r.expanded && r.children && t(r.children);
+		};
+		return t(this._roots), e;
+	}
+	_state(e) {
+		if (e.children?.length) {
+			let t = 0, n = 0;
+			for (let r of e.children) {
+				let e = this._state(r);
+				e === "checked" ? t++ : e === "unchecked" && n++;
+			}
+			return t === e.children.length ? "checked" : n === e.children.length ? "unchecked" : "mixed";
+		}
+		return this._checked.has(e.id) ? "checked" : "unchecked";
+	}
+	_setChecked(e, t) {
+		if (e.children?.length) for (let n of e.children) n.disabled || this._setChecked(n, t);
+		else t ? this._checked.add(e.id) : this._checked.delete(e.id);
+	}
+	_nodeFrom(e) {
+		let t = e?.closest?.("li.wui-tree-item");
+		if (!t) return null;
+		for (let [e, n] of this._els) if (n.li === t) return this._byId.get(e) ?? null;
+		return null;
+	}
+	_emit(e, t) {
+		this.dispatchEvent(new CustomEvent(`wui-tree:${e}`, {
+			detail: t,
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+	_announce(e) {
+		this._live && (this._live.textContent = e);
+	}
+	_setRoving(e) {
+		let t = this._els.get(this._focusId);
+		t && (t.li.tabIndex = -1), this._focusId = e.id;
+		let n = this._els.get(e.id);
+		n && (n.li.tabIndex = 0);
+	}
+	_focusNode(e) {
+		e && (this._setRoving(e), this._els.get(e.id)?.li.focus());
+	}
+	_activate(e) {
+		e.disabled || (this.selection === "single" && (this._selected = e.id, this._render(), this._syncForm()), this._emit("select", {
+			id: e.id,
+			node: e.raw
+		}));
+	}
+	_enabledLeaves(e) {
+		return e.disabled ? [] : e.children?.length ? e.children.flatMap((e) => this._enabledLeaves(e)) : [e];
+	}
+	_toggleCheck(e) {
+		let t = this._enabledLeaves(e);
+		if (!t.length) return;
+		let n = !t.every((e) => this._checked.has(e.id));
+		this._setChecked(e, n), this._render(), this._syncForm(), this._emit("check", {
+			id: e.id,
+			checked: n,
+			values: this.values
+		});
+	}
+	_toggleExpand(e) {
+		e.disabled || !this._isBranch(e) || (e.expanded ? (e.expanded = !1, this._render()) : this._expand(e));
+	}
+	_expand(e) {
+		e.expanded = !0, e.children === null ? this._load(e) : this._render();
+	}
+	async _load(e) {
+		if (e.loading) return;
+		e.loading = !0, e.failed = !1, this._announce(this.loadingText), this._render();
+		let t, n = null;
+		try {
+			t = await this._fetchChildren(e);
+		} catch (e) {
+			n = e;
+		}
+		let r = this._byId.get(e.id);
+		if (!r) {
+			this._announce("");
+			return;
+		}
+		if (r.loading) {
+			if (r.loading = !1, !n) try {
+				r.children = this._adoptStaged(t, r, r.level + 1), this._passChecksDown(r), this._announce("");
+			} catch (e) {
+				n = e;
+			}
+			n && (r.failed = !0, r.expanded = !1, this._announce(this.errorText), this._emit("error", {
+				id: r.id,
+				message: n?.message ?? String(n)
+			})), this._render(), this._syncForm();
+		}
+	}
+	async _fetchChildren(e) {
+		if (this._loader) return this._loader(e.raw);
+		let n = this.getAttribute("load-url");
+		if (!n) throw Error("<wui-tree> has a node with children to load but no loadChildren or load-url.");
+		let r = new URL(n, window.location.href);
+		r.searchParams.set(s, e.id);
+		let i = await t(r.href, { headers: { Accept: "application/json" } });
+		if (!i.ok) throw Error(`Loading children answered ${i.kind}.`);
+		return JSON.parse(i.html);
+	}
+	_handleClick(e) {
+		let t = this._nodeFrom(e.target);
+		!t || t.disabled || (this._focusNode(t), e.target.closest(".wui-tree-toggle") ? this._toggleExpand(t) : e.target.closest(".wui-tree-check") ? (e.preventDefault(), this._toggleCheck(t)) : this._activate(t));
+	}
+	_handleKeyDown(e) {
+		if (e.ctrlKey || e.metaKey || e.altKey) return;
+		let t = this._nodeFrom(e.target);
+		if (!(!t || e.target !== this._els.get(t.id)?.li)) if (e.key === "ArrowRight") {
+			if (e.preventDefault(), !this._isBranch(t) || t.disabled) return;
+			t.expanded ? t.children?.length && this._focusNode(t.children[0]) : this._expand(t);
+		} else e.key === "ArrowLeft" ? (e.preventDefault(), t.expanded && this._isBranch(t) && !t.disabled ? this._toggleExpand(t) : t.parent && this._focusNode(t.parent)) : e.key === " " ? (e.preventDefault(), this.selection === "multiple" ? this._toggleCheck(t) : this.selection === "single" && this._activate(t)) : this._nav.handler(e);
+	}
+	_syncForm() {
+		let e = this.selection;
+		if (e === "multiple") n(this, this.values);
+		else if (e === "single") r(this, this._selected ?? "");
+		else for (let e of this.querySelectorAll(u)) e.remove();
+	}
+	_render() {
+		if (!this._list) return;
+		let e = document.activeElement, t = !!e && this._list.contains(e), n = this._visible();
+		n.some((e) => e.id === this._focusId) || (this._focusId = (n.find((e) => e.id === this._selected) ?? n[0])?.id ?? null), this._els = /* @__PURE__ */ new Map();
+		let r = this.getAttribute("aria-label");
+		r ? this._list.setAttribute("aria-label", r) : this._list.removeAttribute("aria-label"), this._list.replaceChildren(...this._buildLevel(this._roots)), t && this._focusId && this._els.get(this._focusId)?.li.focus(), this._syncForm();
+	}
+	_buildLevel(e) {
+		return e.map((t, n) => this._buildItem(t, n + 1, e.length));
+	}
+	_buildItem(e, t, n) {
+		let r = this.selection, a = this._isBranch(e), o = this._state(e), s = p("li", "wui-tree-item", {
+			role: "treeitem",
+			tabindex: e.id === this._focusId ? 0 : -1,
+			"aria-level": e.level,
+			"aria-setsize": n,
+			"aria-posinset": t,
+			"aria-labelledby": `${this._uid}-${e.seq}`,
+			"aria-describedby": e.badge ? `${this._uid}-${e.seq}-badge` : null
+		});
+		a && s.setAttribute("aria-expanded", String(e.expanded)), e.disabled && s.setAttribute("aria-disabled", "true"), e.loading && s.setAttribute("aria-busy", "true"), r === "single" && s.setAttribute("aria-selected", String(e.id === this._selected)), r === "multiple" && s.setAttribute("aria-checked", o === "mixed" ? "mixed" : String(o === "checked"));
+		let c = p("div", "wui-tree-row", { role: "presentation" });
+		c.style.setProperty("--wui-tree-level", String(e.level - 1)), r === "single" && e.id === this._selected && c.classList.add("wui-tree-row-selected"), e.failed && c.classList.add("wui-tree-row-error");
+		let l = p("span", a ? "wui-tree-toggle" : "wui-tree-toggle wui-tree-toggle-leaf", { "aria-hidden": "true" });
+		if (a && (l.innerHTML = i("chevron-right", { size: 16 })), c.append(l), r === "multiple") {
+			let t = p("input", "form-check-input wui-tree-check", {
+				type: "checkbox",
+				tabindex: -1,
+				"aria-hidden": "true"
+			});
+			t.checked = o === "checked", t.indeterminate = o === "mixed", t.disabled = e.disabled, t.addEventListener("mousedown", (e) => e.preventDefault()), c.append(t);
+		}
+		if (e.icon) {
+			let t = p("span", "wui-tree-icon", { "aria-hidden": "true" });
+			t.innerHTML = i(e.icon, { size: 16 }), c.append(t);
+		}
+		let u = p("span", "wui-tree-label", { id: `${this._uid}-${e.seq}` });
+		if (u.textContent = e.label, c.append(u), e.badge) {
+			let t = p("span", `badge wui-tree-badge${e.badgeTone && e.badgeTone !== "neutral" ? ` badge-${e.badgeTone}` : ""}`, { id: `${this._uid}-${e.seq}-badge` });
+			t.textContent = e.badge, c.append(t);
+		}
+		if (e.loading && c.append(p("span", "wui-tree-spinner", { "aria-hidden": "true" })), s.append(c), e.expanded && e.children?.length) {
+			let t = p("ul", "wui-tree-group", { role: "group" });
+			t.append(...this._buildLevel(e.children)), s.append(t);
+		}
+		return this._els.set(e.id, {
+			li: s,
+			row: c
+		}), s;
+	}
+};
+//#endregion
+export { m as t };

package/dist/WuiWizardStep-BU5w9_Ds.js

@@ -0,0 +1,221 @@
+import { t as e } from "./elementBase-Bg1xpvup.js";
+import { t } from "./iconGlyphs.g-Cpg1BUHm.js";
+//#region src/WuiWizard.js
+var n = "wui-wizard-step", r = class extends e {
+	static get observedAttributes() {
+		return [
+			"active",
+			"variant",
+			"orientation",
+			"non-linear",
+			"hide-stepper",
+			"hide-connectors",
+			"disabled",
+			"skippable",
+			"label",
+			"back-label",
+			"next-label",
+			"skip-label",
+			"finish-label"
+		];
+	}
+	constructor() {
+		super(), this._active = 0, this._skipped = /* @__PURE__ */ new Set(), this._invalid = /* @__PURE__ */ new Set(), this._finished = !1, this._rendered = !1, this._reflecting = !1, this._beforeNext = null, this._header = null, this._footer = null, this._known = [], this._observer = null;
+	}
+	get active() {
+		return this._active;
+	}
+	set active(e) {
+		let t = Number.parseInt(e, 10);
+		Number.isFinite(t) && this._go(t, "set");
+	}
+	get beforeNext() {
+		return this._beforeNext;
+	}
+	set beforeNext(e) {
+		this._beforeNext = typeof e == "function" ? e : null;
+	}
+	get _steps() {
+		return [...this.querySelectorAll(`:scope > ${n}`)];
+	}
+	refresh() {
+		this._rendered && this._renderChrome();
+	}
+	connectedCallback() {
+		if (this._rendered) this._wire(), this._onStepsMutated();
+		else {
+			let e = Number.parseInt(this.getAttribute("active"), 10);
+			this._active = Number.isFinite(e) && e >= 0 ? e : 0, this.render();
+		}
+	}
+	disconnectedCallback() {
+		this._teardown();
+	}
+	attributeChangedCallback(e, t, n) {
+		if (!(!this._rendered || this._reflecting)) {
+			if (e === "active") {
+				let e = Number.parseInt(n, 10);
+				Number.isFinite(e) && this._go(e, "set");
+				return;
+			}
+			this._renderChrome();
+		}
+	}
+	render() {
+		let e = this._steps;
+		this._header || (this._header = document.createElement("nav"), this._header.className = "stepper wizard-stepper", this._footer = document.createElement("div"), this._footer.className = "form-actions wizard-footer form-actions-between", e.length ? (this.insertBefore(this._header, e[0]), e[e.length - 1].after(this._footer)) : (this.prepend(this._header), this.append(this._footer))), this._known = e, this._renderChrome(), this._rendered = !0, this._wire();
+	}
+	_renderChrome() {
+		let e = this._reconcileSteps();
+		this._placeChrome(e), this._clampActive(e), this._syncPanels(e), this._header.innerHTML = this._headerHtml(e), this._footer.innerHTML = this._footerHtml(e), this._header.hidden = this.hasAttribute("hide-stepper");
+	}
+	_clampActive(e) {
+		let t = Math.max(0, e.length - 1);
+		this._active > t && (this._active = t), this._active < 0 && (this._active = 0);
+	}
+	_reconcileSteps() {
+		let e = this._steps, t = this._known;
+		if (this._known = e, i(e, t)) return e;
+		let n = (n) => new Set([...n].map((n) => e.indexOf(t[n])).filter((e) => e >= 0));
+		this._skipped = n(this._skipped), this._invalid = n(this._invalid);
+		let r = t[this._active];
+		if (!r) return e;
+		let a = e.indexOf(r);
+		if (a < 0) {
+			let n = (t) => e.includes(t), r = t.slice(this._active + 1).find(n) ?? t.slice(0, this._active).reverse().find(n);
+			a = r ? e.indexOf(r) : this._active;
+		}
+		return a = Math.min(a, Math.max(0, e.length - 1)), a !== this._active && (this._active = a, this._reflectActive(a)), e;
+	}
+	_placeChrome(e) {
+		if (!e.length) return;
+		let t = e[e.length - 1];
+		this._header.nextElementSibling !== e[0] && this.insertBefore(this._header, e[0]), this._footer.previousElementSibling !== t && t.after(this._footer);
+	}
+	_onStepsMutated() {
+		if (!this._rendered) return;
+		let e = this._steps;
+		(!e.length || this._header.nextElementSibling === e[0] && this._footer.previousElementSibling === e[e.length - 1]) && i(e, this._known) || (this._renderChrome(), this._observer?.takeRecords());
+	}
+	_syncPanels(e) {
+		e.forEach((e, t) => {
+			let n = t === this._active;
+			e.classList.add("wizard-panel"), e.hidden = !n, e.setAttribute("role", "tabpanel"), e.setAttribute("aria-hidden", n ? "false" : "true");
+		});
+	}
+	_stepStatus(e, t) {
+		return e.getAttribute("status") || (this._invalid.has(t) ? "error" : this._finished ? "done" : t === this._active ? "active" : t < this._active ? this._skipped.has(t) ? "skipped" : "done" : "pending");
+	}
+	_headerHtml(e) {
+		let n = this.getAttribute("variant") === "journey", r = this.getAttribute("variant") === "icons", i = this.getAttribute("orientation") === "vertical", o = !this.hasAttribute("hide-connectors");
+		this._header.className = [
+			"stepper",
+			"wizard-stepper",
+			n && "stepper-journey",
+			r && "stepper-icons",
+			i && "stepper-vertical",
+			!o && "wui-stepper-no-connectors"
+		].filter(Boolean).join(" "), this._header.setAttribute("aria-label", this.getAttribute("label") || "Progress");
+		let s = this.hasAttribute("non-linear");
+		return e.map((i, c) => {
+			let l = this._stepStatus(i, c), u = i.getAttribute("label") || "", d = i.getAttribute("description") || "", f = i.getAttribute("icon") || "", p = c + 1, m;
+			m = l === "done" ? t("check") : l === "error" ? t("alert-triangle") : l === "skipped" ? t("minus") : f ? t(f) : String(p);
+			let h = l === "pending" ? "step" : `step ${l}`, g = l === "active" ? " aria-current=\"step\"" : "", _ = s || c < this._active, v = d ? `<span class="step-desc">${a(d)}</span>` : "", y;
+			y = n ? `<span class="step-circle">${m}</span><span class="step-text"><span class="step-index">Step ${p}</span><span class="step-label">${a(u)}</span>${v}</span>` : r ? `<span class="step-circle">${m}</span><span class="step-index">Step ${p}</span><span class="step-label">${a(u)}</span>${v}` : `<span class="step-circle">${m}</span><span class="step-label">${a(u)}</span>${v}`;
+			let b = _ ? `<button type="button" class="${h}" data-step="${c}"${g}>${y}</button>` : `<div class="${h}"${g}>${y}</div>`;
+			return n && o && c < e.length - 1 ? `${b}<span class="step-line${l === "done" ? " done" : ""}" aria-hidden="true"></span>` : b;
+		}).join("");
+	}
+	_footerHtml(e) {
+		let n = this._active, r = e.length - 1, i = this.hasAttribute("disabled") ? " disabled" : "", o = e[n]?.hasAttribute("optional") || this.hasAttribute("skippable"), s = this.getAttribute("back-label") || "Back", c = this.getAttribute("next-label") || "Next", l = this.getAttribute("skip-label") || "Skip", u = this.getAttribute("finish-label") || "Finish";
+		return `${n > 0 ? `<button type="button" class="btn btn-secondary" data-nav="back"${i}>${t("arrow-left", { className: "me-2" })}${a(s)}</button>` : "<span></span>"}<span class="wizard-footer-actions">${o && n < r ? `<button type="button" class="btn btn-subtle" data-nav="skip"${i}>${a(l)}</button>` : ""}${n < r ? `<button type="button" class="btn btn-primary" data-nav="next"${i}>${a(c)}${t("arrow-right", { className: "ms-2" })}</button>` : `<button type="button" class="btn btn-primary" data-nav="finish"${i}>${a(u)}</button>`}</span>`;
+	}
+	_wire() {
+		this._teardown(), this._onHeaderClick = (e) => {
+			let t = e.target.closest("[data-step]");
+			t && this.contains(t) && this._stepTo(Number.parseInt(t.dataset.step, 10));
+		}, this._onFooterClick = (e) => {
+			let t = e.target.closest("[data-nav]");
+			if (!t || !this.contains(t) || this.hasAttribute("disabled")) return;
+			let n = t.dataset.nav;
+			n === "back" ? this._back() : n === "skip" ? this._skip() : (n === "next" || n === "finish") && this._next();
+		}, this._header.addEventListener("click", this._onHeaderClick), this._footer.addEventListener("click", this._onFooterClick), this._observer = new MutationObserver(() => this._onStepsMutated()), this._observer.observe(this, { childList: !0 });
+	}
+	_teardown() {
+		this._header && this._onHeaderClick && this._header.removeEventListener("click", this._onHeaderClick), this._footer && this._onFooterClick && this._footer.removeEventListener("click", this._onFooterClick), this._observer?.disconnect(), this._observer = null;
+	}
+	_stepTo(e) {
+		this.hasAttribute("disabled") || !this.hasAttribute("non-linear") && e >= this._active || this._go(e, "step");
+	}
+	_back() {
+		this._active > 0 && this._go(this._active - 1, "back");
+	}
+	async _next() {
+		this._reconcileSteps();
+		let e = this._active, t = this._steps, n = e >= t.length - 1, r = t[e];
+		if (!this.dispatchEvent(new CustomEvent("wui-wizard:beforechange", {
+			detail: n ? {
+				index: e,
+				next: e,
+				reason: "finish"
+			} : {
+				index: e,
+				next: e + 1,
+				reason: "next"
+			},
+			cancelable: !0
+		}))) return this._flagInvalid(e);
+		if (this._beforeNext) {
+			let i;
+			try {
+				i = await this._beforeNext(e);
+			} catch {
+				i = !1;
+			}
+			if (this._reconcileSteps(), t = this._steps, e = t.indexOf(r), e < 0) return;
+			if (n = e >= t.length - 1, i === !1) return this._flagInvalid(e);
+		}
+		if (this._invalid.delete(e), this._skipped.delete(e), n) return this._finish();
+		this._go(e + 1, "next");
+	}
+	_skip() {
+		let e = this._active, t = this._steps;
+		if (!(!t[e]?.hasAttribute("optional") && !this.hasAttribute("skippable"))) {
+			if (this._invalid.delete(e), this._skipped.add(e), this.dispatchEvent(new CustomEvent("wui-wizard:skip", { detail: { index: e } })), e >= t.length - 1) return this._finish();
+			this._go(e + 1, "skip");
+		}
+	}
+	_flagInvalid(e) {
+		this._invalid.add(e), this._renderChrome(), this.dispatchEvent(new CustomEvent("wui-wizard:invalid", { detail: { index: e } }));
+	}
+	_finish() {
+		this._invalid.delete(this._active), this._finished = !0, this._renderChrome(), this.dispatchEvent(new CustomEvent("wui-wizard:finish", { detail: { index: this._active } }));
+	}
+	_go(e, t) {
+		let n = this._reconcileSteps(), r = Math.max(0, n.length - 1), i = Math.min(Math.max(e, 0), r), a = this._active;
+		this._finished = !1, this._invalid.delete(a), this._active = i, this._reflectActive(i), this._renderChrome(), t !== "silent" && i !== a && this.dispatchEvent(new CustomEvent("wui-wizard:change", { detail: {
+			index: i,
+			previous: a,
+			reason: t
+		} }));
+	}
+	_reflectActive(e) {
+		this._reflecting = !0, this.setAttribute("active", String(e)), this._reflecting = !1;
+	}
+}, i = (e, t) => e.length === t.length && e.every((e, n) => e === t[n]), a = (e) => String(e ?? "").replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;"), o = class extends e {
+	static get observedAttributes() {
+		return [
+			"label",
+			"description",
+			"optional",
+			"icon",
+			"status"
+		];
+	}
+	attributeChangedCallback() {
+		let e = this.closest("wui-wizard");
+		e && typeof e.refresh == "function" && e.refresh();
+	}
+};
+//#endregion
+export { r as n, o as t };

package/dist/anchorOverlay-DluGZ8ef.js

@@ -0,0 +1,23 @@
+function e(e, t, n = {}) {
+	if (!e || !t) return;
+	let r = e.getBoundingClientRect(), i = n.clampHeight ? t.scrollTop : 0;
+	n.clampHeight && (t.style.maxHeight = "");
+	let a = t.offsetHeight, o = window.innerHeight - r.bottom, s = o < a + 4 && r.top > o;
+	if (t.classList.toggle("drop-up", s), t.style.position = "fixed", t.style.top = s ? `${Math.max(4, r.top - a - 4)}px` : `${r.bottom + 4}px`, n.clampHeight) {
+		let e = s ? r.top - 8 : window.innerHeight - r.bottom - 8;
+		e < a && (t.style.maxHeight = `${Math.max(e, 0)}px`), t.scrollTop = i;
+	}
+	n.matchWidth && (r.width >= 300 ? (t.style.minWidth = `${r.width}px`, t.style.width = `${r.width}px`, t.style.maxWidth = `${r.width}px`) : (t.style.minWidth = `${r.width}px`, t.style.width = "max-content", t.style.maxWidth = `${Math.min(400, window.innerWidth - 8)}px`));
+	let c = t.offsetWidth, l = Math.min(r.left, window.innerWidth - c - 4);
+	t.style.left = `${Math.max(4, l)}px`;
+}
+function t(e, t) {
+	n(e), e._reanchor = t, e._reanchorScroll = (n) => {
+		n.target instanceof Node && typeof e.contains == "function" && e.contains(n.target) || t();
+	}, window.addEventListener("resize", e._reanchor), window.addEventListener("scroll", e._reanchorScroll, !0);
+}
+function n(e) {
+	e?._reanchor && (window.removeEventListener("resize", e._reanchor), window.removeEventListener("scroll", e._reanchorScroll, !0), e._reanchor = null, e._reanchorScroll = null);
+}
+//#endregion
+export { t as n, n as r, e as t };

package/dist/calendarMath-BAF2Jkg_.js

@@ -0,0 +1,42 @@
+//#region src/calendarMath.js
+var e = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+], t = [
+	"Su",
+	"Mo",
+	"Tu",
+	"We",
+	"Th",
+	"Fr",
+	"Sa"
+], n = (e) => String(e).padStart(2, "0"), r = (e, t, r) => `${e}-${n(t + 1)}-${n(r)}`, i = (e) => {
+	let t = /^(\d{4})-(\d{2})-(\d{2})$/.exec(e || "");
+	return t ? {
+		y: +t[1],
+		m: t[2] - 1,
+		d: +t[3]
+	} : null;
+}, a = (t) => {
+	let r = i(t);
+	return r ? `${n(r.d)} ${e[r.m].slice(0, 3)} ${r.y}` : "";
+}, o = (e, t) => new Date(e, t + 1, 0).getDate(), s = (e, t) => {
+	for (; t < 0;) t += 12, --e;
+	for (; t > 11;) t -= 12, e += 1;
+	return {
+		y: e,
+		m: t
+	};
+};
+//#endregion
+export { a, o as i, t as n, i as o, s as r, r as s, e as t };