mlform 0.1.9 → 0.1.11

package/dist/kit-QY6zff-h.js

@@ -1,1888 +0,0 @@
-import { f as e, h as t, r as n } from "./design-system-CIU_vH6O.js";
-import { t as r } from "./strings-CWwrrYzz.js";
-import { createRegistry as i } from "./mlform/schema.mjs";
-import { C as a, S as o, _ as s, b as c, c as l, g as u, h as d, l as f, m as p, o as m, p as h, r as g, s as _, t as v, v as y, x as b, y as x } from "./primitives-Di95y_ur.js";
-import { t as ee } from "./runtime-C5iTM3uu.js";
-import { n as te } from "./builtins-ml-pjab8_gu.js";
-//#region src/kit/defaults.ts
-var S = { ...p }, ne = {
-	mode: "auto",
-	theme: "neutral",
-	recipe: "default"
-}, re = (e) => {
-	let t = i();
-	for (let n of e.listFields()) t.registerField(n);
-	for (let n of e.listReports()) t.registerReport(n);
-	for (let n of e.listExplanations()) t.registerExplanation(n);
-	return t;
-}, ie = (e) => e?.clone() ?? g(), ae = (e) => e?.clone() ?? t.clone(), C = (e = {}) => ({
-	...S,
-	...e
-}), w = (t = {}) => e(ne, t), oe = a`
-  :host {
-    display: block;
-    inline-size: 100%;
-    block-size: 100%;
-    color: var(--mlf-shell-color, var(--mlf-color-text, #0f172a));
-    background: var(--mlf-shell-bg, var(--mlf-color-bg, #f5f7fa));
-    font-family: var(--mlf-font-family-body);
-  }
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-  .root {
-    display: grid;
-    grid-template-rows: auto 1fr auto;
-    min-height: 100%;
-    border-radius: var(--mlf-panel-radius, 12px);
-    border: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(--mlf-shell-panel-bg, var(--mlf-color-surface, #ffffff));
-    box-shadow:
-      0 2px 4px var(--mlf-shell-panel-shadow-soft, rgba(0, 0, 0, 0.04)),
-      0 8px 16px var(--mlf-shell-panel-shadow, rgba(0, 0, 0, 0.04));
-    overflow: hidden;
-  }
-  .header,
-  .footer {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 0.75rem;
-    padding: 0.85rem 1rem;
-    background: var(
-      --mlf-shell-header-bg,
-      color-mix(in srgb, var(--mlf-color-surface, #ffffff) 76%, transparent)
-    );
-    border-bottom: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-  }
-  .footer {
-    border-bottom: none;
-    border-top: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(--mlf-shell-action-bg, var(--mlf-color-surface-muted, #f5f7fa));
-  }
-  .title {
-    margin: 0;
-    font-size: 1rem;
-    font-weight: 700;
-  }
-  .actions {
-    display: inline-flex;
-    gap: 0.5rem;
-    flex-wrap: wrap;
-  }
-  .body {
-    display: grid;
-    gap: 0;
-    overflow-y: auto;
-    overflow-x: hidden;
-  }
-  .section + .section {
-    border-top: var(--mlf-border-width, 1px) solid
-      var(--mlf-panel-border, var(--mlf-color-border, #e2e8f0));
-  }
-  .section-toggle {
-    inline-size: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 0.75rem;
-    padding: 1rem;
-    border: none;
-    background: transparent;
-    color: inherit;
-    font: inherit;
-    text-align: left;
-    cursor: pointer;
-  }
-  .section-copy,
-  .nested-copy {
-    display: grid;
-    gap: 0.35rem;
-  }
-  .section-title {
-    margin: 0;
-    font-size: 0.96rem;
-    font-weight: 700;
-  }
-  .section-description,
-  .nested-description {
-    margin: 0;
-    font-size: var(--mlf-font-size-sm, 0.84rem);
-    color: var(--mlf-color-text-muted, #475569);
-    line-height: 1.5;
-  }
-  .chevron {
-    font-size: 1.1rem;
-    color: var(--mlf-color-text-muted, #475569);
-  }
-  .section-panel {
-    display: grid;
-    gap: 1rem;
-    padding: 0 1rem 1rem;
-  }
-  .collection,
-  .section-children,
-  .nested-section,
-  .group {
-    display: grid;
-    gap: var(--mlf-section-gap, 1rem);
-  }
-  .nested-copy {
-    padding: 0 0.5rem;
-  }
-  .nested-title {
-    margin: 0;
-    font-size: 0.95rem;
-    font-weight: 700;
-  }
-  .group.columns-2 {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-  .group.columns-3 {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-  }
-  .btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    min-height: 2.5rem;
-    padding: 0.5rem 1rem;
-    border-radius: var(--mlf-input-radius, 12px);
-    border: var(--mlf-border-width, 1px) solid var(--mlf-input-border, #e2e8f0);
-    background: var(--mlf-input-bg, var(--mlf-color-surface-elevated, #ffffff));
-    color: var(--mlf-color-text, #0f172a);
-    font: inherit;
-    font-size: 0.92rem;
-    font-weight: 600;
-    cursor: pointer;
-  }
-  .btn-submit {
-    border-color: var(--mlf-submit-bg, var(--mlf-color-accent, #1e40af));
-    background: var(--mlf-submit-bg, var(--mlf-color-accent, #1e40af));
-    color: var(--mlf-submit-color, #ffffff);
-  }
-  .btn:disabled {
-    cursor: not-allowed;
-    opacity: 0.55;
-  }
-  @media (max-width: 900px) {
-    .group.columns-2,
-    .group.columns-3 {
-      grid-template-columns: minmax(0, 1fr);
-    }
-    .header,
-    .footer {
-      flex-direction: column;
-      align-items: stretch;
-    }
-  }
-`, T = {
-	invalidDesignSystemSnapshot: "replaceDesignSystem requires an explicit mode, theme, and recipe.",
-	fieldDuplicateInLayout: (e) => `Field "${e}" appears multiple times in layout.`,
-	fieldMissingInLayout: (e) => `Field "${e}" is missing from layout.`,
-	reportDuplicateInLayout: (e) => `Report "${e}" appears multiple times in layout.`,
-	explanationDuplicateInLayout: (e) => `Explanation "${e}" appears multiple times in layout.`,
-	unknownFieldReference: (e) => `Layout references unknown field "${e}".`,
-	unknownReportReference: (e) => `Layout references unknown report "${e}".`,
-	unknownExplanationReference: (e) => `Layout references unknown explanation "${e}".`,
-	wizardRequiresSteps: "Wizard layout must define at least one step.",
-	wizardStepEmpty: (e) => `Wizard step "${e}" must contain at least one layout node.`,
-	tabsRequiresTabs: "Tabs layout must define at least one tab.",
-	tabEmpty: (e) => `Tab "${e}" must contain at least one layout node.`,
-	accordionRequiresSections: "Accordion layout must define at least one section.",
-	accordionSectionEmpty: (e) => `Accordion section "${e}" must contain at least one layout node.`,
-	wizardMissingLayout: "mountWizardForm requires a wizard layout.",
-	tabsMissingLayout: "mountTabsForm requires a tabs layout.",
-	accordionMissingLayout: "mountAccordionForm requires an accordion layout.",
-	nonWizardNextStep: "nextStep() is only available for wizard layouts.",
-	nonWizardGoToStep: "goToStep() is only available for wizard layouts.",
-	nonTabsSetActiveTab: "setActiveTab() is only available for tabs layouts.",
-	nonAccordionToggleSection: "Accordion section controls are only available for accordion layouts.",
-	unknownTab: (e) => `Unknown tab "${e}".`,
-	unknownWizardStep: (e) => `Unknown wizard step "${e}".`,
-	unknownAccordionSection: (e) => `Unknown accordion section "${e}".`
-}, E = {
-	wizard: "mlf-kit-wizard",
-	tabs: "mlf-kit-tabs",
-	accordion: "mlf-kit-accordion",
-	stepIndicator: "mlf-kit-step-indicator"
-}, se = async (e) => {
-	await Promise.resolve(), "updateComplete" in e && await e.updateComplete, await Promise.resolve();
-}, ce = (e, t) => e.some((e) => e.kind === "field" ? e.field === t : "children" in e && ce(e.children, t)), le = (e, t) => {
-	let n = e.getSnapshot().layout;
-	return n.kind === "accordion" ? n.sections.find((e) => ce(e.children, t))?.id ?? null : null;
-}, ue = (e) => {
-	let t = e.getSnapshot().fields.filter((e) => e.state.visible && e.state.errors.length > 0), n = new Map(e.getLayoutReferences().fields.map((e, t) => [e, t]));
-	return t.sort((e, t) => (n.get(e.id) ?? 0) - (n.get(t.id) ?? 0)), t[0] ?? null;
-}, D = async (e, t) => {
-	let n = ue(t);
-	if (!n) return !1;
-	let r = t.getSnapshot().layout.kind;
-	r === "wizard" && n.stepId && await t.goToStep(n.stepId), r === "tabs" && n.tabId && t.setActiveTab(n.tabId);
-	let i = le(t, n.id);
-	return i && t.openSection(i), await se(e), f(l(e.shadowRoot ?? e, n.id));
-}, O = ({ node: e, snapshot: t, registry: n, primitiveText: r = d, sectionClass: i, sectionCopyClass: a, sectionTitleClass: s, sectionDescriptionClass: c, childrenClass: l, groupBaseClass: u }) => {
-	switch (e.kind) {
-		case "section": return o`
-        <section class=${i} data-section-id=${e.id}>
-          ${e.title || e.description ? o`
-                <div class=${a}>
-                  ${e.title ? o`<h2 class=${s}>${e.title}</h2>` : b}
-                  ${e.description ? o`<p class=${c}>${e.description}</p>` : b}
-                </div>
-              ` : b}
-          <div class=${l}>
-            ${m(e.children, (t, n) => `${e.id}-${n}`, (e) => O({
-			node: e,
-			snapshot: t,
-			registry: n,
-			primitiveText: r,
-			sectionClass: i,
-			sectionCopyClass: a,
-			sectionTitleClass: s,
-			sectionDescriptionClass: c,
-			childrenClass: l,
-			groupBaseClass: u
-		}))}
-          </div>
-        </section>
-      `;
-		case "group": return o`
-        <div
-          class=${`${u}${e.columns ? ` columns-${e.columns}` : ""}`}
-          data-group-id=${e.id}
-        >
-          ${m(e.children, (t, n) => `${e.id}-${n}`, (e) => O({
-			node: e,
-			snapshot: t,
-			registry: n,
-			primitiveText: r,
-			sectionClass: i,
-			sectionCopyClass: a,
-			sectionTitleClass: s,
-			sectionDescriptionClass: c,
-			childrenClass: l,
-			groupBaseClass: u
-		}))}
-        </div>
-      `;
-		case "field": {
-			let i = t.fields.find((t) => t.id === e.field);
-			return i ? o`
-        <mlf-field-frame
-          data-field-id=${i.id}
-          .controller=${i.controller}
-          .descriptor=${i.descriptor}
-          .registry=${n}
-          .text=${r}
-        ></mlf-field-frame>
-      ` : b;
-		}
-		case "report": {
-			let i = t.reports.find((t) => t.id === e.report);
-			return i ? o`
-        <mlf-report-frame
-          .controller=${i.controller}
-          .descriptor=${i.descriptor}
-          .registry=${n}
-          .text=${r}
-          .lastResult=${t.form.lastResult}
-        ></mlf-report-frame>
-      ` : b;
-		}
-		case "explanation": {
-			let i = t.explanations.find((t) => t.id === e.explanation);
-			return i ? o`
-        <mlf-explanation-panel
-          .controller=${i.controller}
-          .descriptor=${i.descriptor}
-          .registry=${n}
-          .text=${r}
-          .lastResult=${t.form.lastResult}
-        ></mlf-explanation-panel>
-      ` : b;
-		}
-	}
-}, k = class extends c {
-	static styles = oe;
-	#e;
-	get view() {
-		return this.#e;
-	}
-	set view(e) {
-		this.#e = e;
-	}
-	#t;
-	get registry() {
-		return this.#t;
-	}
-	set registry(e) {
-		this.#t = e;
-	}
-	#n = d;
-	get primitiveText() {
-		return this.#n;
-	}
-	set primitiveText(e) {
-		this.#n = e;
-	}
-	#r = "Submit";
-	get submitLabel() {
-		return this.#r;
-	}
-	set submitLabel(e) {
-		this.#r = e;
-	}
-	#i = "Validating...";
-	get validatingLabel() {
-		return this.#i;
-	}
-	set validatingLabel(e) {
-		this.#i = e;
-	}
-	#a = "Submitting...";
-	get submittingLabel() {
-		return this.#a;
-	}
-	set submittingLabel(e) {
-		this.#a = e;
-	}
-	#o = null;
-	get snapshot() {
-		return this.#o;
-	}
-	set snapshot(e) {
-		this.#o = e;
-	}
-	#s = null;
-	willUpdate(e) {
-		e.has("view") && (this.#s?.(), this.#s = null, this.snapshot = this.view?.getSnapshot() ?? null, this.view && (this.#s = this.view.subscribe((e) => {
-			this.snapshot = e;
-		})));
-	}
-	disconnectedCallback() {
-		this.#s?.(), this.#s = null, super.disconnectedCallback();
-	}
-	render() {
-		let e = this.snapshot, t = e?.accordion;
-		if (!e || !t || e.layout.kind !== "accordion") return o``;
-		let n = e.form.status, r = n === "validating" ? this.validatingLabel : n === "submitting" ? this.submittingLabel : this.submitLabel;
-		return o`
-      <section class="root" part="accordion-panel">
-        <header class="header">
-          <h1 class="title">Accordion Form</h1>
-          <div class="actions">
-            <button type="button" class="btn" @click=${this.#c}>Open all</button>
-            <button type="button" class="btn" @click=${this.#l}>Close all</button>
-          </div>
-        </header>
-
-        <div class="body">
-          ${m(e.layout.sections, (e) => e.id, (n) => {
-			let r = t.openSectionIds.includes(n.id);
-			return o`
-                <section class="section">
-                  <button
-                    type="button"
-                    class="section-toggle"
-                    aria-expanded=${String(r)}
-                    @click=${() => this.view?.toggleSection(n.id)}
-                  >
-                    <span class="section-copy">
-                      <span class="section-title">${n.title}</span>
-                      ${n.description ? o`<span class="section-description">${n.description}</span>` : b}
-                    </span>
-                    <span class="chevron">${r ? "−" : "+"}</span>
-                  </button>
-                  ${r ? o`
-                        <div class="section-panel">
-                          <div class="collection">
-                            ${m(n.children, (e, t) => `${n.id}-${t}`, (t) => O({
-				node: t,
-				snapshot: e,
-				registry: this.registry,
-				primitiveText: this.primitiveText,
-				sectionClass: "nested-section",
-				sectionCopyClass: "nested-copy",
-				sectionTitleClass: "nested-title",
-				sectionDescriptionClass: "nested-description",
-				childrenClass: "section-children",
-				groupBaseClass: "group"
-			}))}
-                          </div>
-                        </div>
-                      ` : b}
-                </section>
-              `;
-		})}
-        </div>
-
-        <footer class="footer" part="actions">
-          <span>${t.openSectionIds.length} / ${t.sectionCount} open</span>
-          <button
-            type="button"
-            class="btn btn-submit"
-            ?disabled=${n === "validating" || n === "submitting"}
-            @click=${this.#u}
-          >
-            ${r}
-          </button>
-        </footer>
-      </section>
-    `;
-	}
-	#c = () => {
-		this.view?.openAllSections();
-	};
-	#l = () => {
-		this.view?.closeAllSections();
-	};
-	#u = async () => {
-		if (this.view) try {
-			await this.view.submit();
-		} catch (e) {
-			if (!await D(this, this.view)) throw e;
-		}
-	};
-};
-h([y({ attribute: !1 })], k.prototype, "view", null), h([y({ attribute: !1 })], k.prototype, "registry", null), h([y({ attribute: !1 })], k.prototype, "primitiveText", null), h([y({ type: String })], k.prototype, "submitLabel", null), h([y({ type: String })], k.prototype, "validatingLabel", null), h([y({ type: String })], k.prototype, "submittingLabel", null), h([s()], k.prototype, "snapshot", null), k = h([x(E.accordion)], k);
-//#endregion
-//#region src/kit/layout-helpers.ts
-var de = (e, t, n) => ({
-	fieldIds: new Set(e.map((e) => e.id)),
-	reportIds: new Set(t.map((e) => e.id)),
-	explanationIds: new Set(n.map((e) => e.id))
-}), fe = () => ({
-	fieldStepIds: /* @__PURE__ */ new Map(),
-	reportStepIds: /* @__PURE__ */ new Map(),
-	explanationStepIds: /* @__PURE__ */ new Map(),
-	fieldTabIds: /* @__PURE__ */ new Map(),
-	reportTabIds: /* @__PURE__ */ new Map(),
-	explanationTabIds: /* @__PURE__ */ new Map(),
-	fieldIdsInLayout: /* @__PURE__ */ new Set(),
-	reportIdsInLayout: /* @__PURE__ */ new Set(),
-	explanationIdsInLayout: /* @__PURE__ */ new Set()
-}), A = (e, t, n) => {
-	let i = r(t ?? e) || e, a = n.get(i) ?? 0;
-	return n.set(i, a + 1), a === 0 ? i : `${i}-${a + 1}`;
-}, pe = (e, t) => {
-	if (!t.fieldIds.has(e)) throw TypeError(T.unknownFieldReference(e));
-}, me = (e, t) => {
-	if (!t.reportIds.has(e)) throw TypeError(T.unknownReportReference(e));
-}, he = (e, t) => {
-	if (!t.explanationIds.has(e)) throw TypeError(T.unknownExplanationReference(e));
-}, ge = (e, t, n, r) => {
-	if (t.fieldIdsInLayout.has(e)) throw TypeError(T.fieldDuplicateInLayout(e));
-	t.fieldIdsInLayout.add(e), n && t.fieldStepIds.set(e, n), r && t.fieldTabIds.set(e, r);
-}, _e = (e, t, n, r) => {
-	if (t.reportIdsInLayout.has(e)) throw TypeError(T.reportDuplicateInLayout(e));
-	t.reportIdsInLayout.add(e), n && t.reportStepIds.set(e, n), r && t.reportTabIds.set(e, r);
-}, ve = (e, t, n, r) => {
-	if (t.explanationIdsInLayout.has(e)) throw TypeError(T.explanationDuplicateInLayout(e));
-	t.explanationIdsInLayout.add(e), n && t.explanationStepIds.set(e, n), r && t.explanationTabIds.set(e, r);
-}, ye = (e, t, n) => [
-	...e.map((e) => ({
-		kind: "field",
-		field: e.id
-	})),
-	...t.map((e) => ({
-		kind: "explanation",
-		explanation: e.id
-	})),
-	...n.map((e) => ({
-		kind: "report",
-		report: e.id
-	}))
-], j = (e, t) => {
-	for (let n of e) if (!t.fieldIdsInLayout.has(n.id)) throw TypeError(T.fieldMissingInLayout(n.id));
-}, M = (e, t, n, r, i, a) => e.map((e) => {
-	switch (e.kind) {
-		case "section": return {
-			kind: "section",
-			id: A("section", e.id ?? e.title, r),
-			title: e.title,
-			description: e.description,
-			children: M(e.children, t, n, r, i, a)
-		};
-		case "group": return {
-			kind: "group",
-			id: A("group", e.id, r),
-			columns: e.columns,
-			children: M(e.children, t, n, r, i, a)
-		};
-		case "field": return pe(e.field, t), ge(e.field, n, i, a), {
-			kind: "field",
-			field: e.field
-		};
-		case "report": return me(e.report, t), _e(e.report, n, i, a), {
-			kind: "report",
-			report: e.report
-		};
-		case "explanation": return he(e.explanation, t), ve(e.explanation, n, i, a), {
-			kind: "explanation",
-			explanation: e.explanation
-		};
-	}
-}), be = (e, t, n, r) => {
-	let i = de(t, n, r), a = fe(), o = /* @__PURE__ */ new Map();
-	if (!e || e.kind === void 0 || e.kind === "single-page") {
-		let s = M(e?.children ?? ye(t, r, n), i, a, o, null, null);
-		return j(t, a), {
-			layout: {
-				kind: "single-page",
-				children: s
-			},
-			maps: a
-		};
-	}
-	if (e.kind === "tabs") {
-		if (e.tabs.length === 0) throw TypeError(T.tabsRequiresTabs);
-		let n = /* @__PURE__ */ new Map(), r = e.tabs.map((e, t) => {
-			let r = A("tab", e.id ?? e.title ?? `tab-${t + 1}`, n), s = M(e.children, i, a, o, null, r);
-			if (s.length === 0) throw TypeError(T.tabEmpty(r));
-			return {
-				id: r,
-				title: e.title,
-				description: e.description,
-				children: s
-			};
-		});
-		return j(t, a), {
-			layout: {
-				kind: "tabs",
-				tabs: r
-			},
-			maps: a
-		};
-	}
-	if (e.kind === "accordion") {
-		if (e.sections.length === 0) throw TypeError(T.accordionRequiresSections);
-		let n = /* @__PURE__ */ new Map(), r = e.sections.map((e, t) => {
-			let r = A("section", e.id ?? e.title ?? `section-${t + 1}`, n), s = M(e.children, i, a, o, null, r);
-			if (s.length === 0) throw TypeError(T.accordionSectionEmpty(r));
-			return {
-				id: r,
-				title: e.title,
-				description: e.description,
-				defaultOpen: e.defaultOpen ?? t === 0,
-				children: s
-			};
-		});
-		return j(t, a), {
-			layout: {
-				kind: "accordion",
-				sections: r
-			},
-			maps: a
-		};
-	}
-	let s = e;
-	if (s.steps.length === 0) throw TypeError(T.wizardRequiresSteps);
-	let c = /* @__PURE__ */ new Map(), l = s.steps.map((e, t) => {
-		let n = A("step", e.id ?? e.title ?? `step-${t + 1}`, c), r = M(e.children, i, a, o, n, null);
-		if (r.length === 0) throw TypeError(T.wizardStepEmpty(n));
-		return {
-			id: n,
-			title: e.title,
-			description: e.description,
-			children: r
-		};
-	});
-	return j(t, a), {
-		layout: {
-			kind: "wizard",
-			steps: l
-		},
-		maps: a
-	};
-}, N = (e, t) => {
-	if (t(e), "children" in e) for (let n of e.children) N(n, t);
-}, P = (e, t) => {
-	switch (e.kind) {
-		case "single-page":
-			for (let n of e.children) N(n, t);
-			return;
-		case "wizard":
-			for (let n of e.steps) for (let e of n.children) N(e, t);
-			return;
-		case "tabs":
-			for (let n of e.tabs) for (let e of n.children) N(e, t);
-			return;
-		case "accordion": for (let n of e.sections) for (let e of n.children) N(e, t);
-	}
-}, F = (e) => {
-	let t = [];
-	return P(e, (e) => {
-		t.push(e);
-	}), t;
-}, I = (e) => {
-	let t = {
-		fields: [],
-		reports: [],
-		explanations: []
-	};
-	for (let n of F(e)) switch (n.kind) {
-		case "field":
-			t.fields.push(n.field);
-			break;
-		case "report":
-			t.reports.push(n.report);
-			break;
-		case "explanation":
-			t.explanations.push(n.explanation);
-			break;
-		default: break;
-	}
-	return t;
-}, L = (e, t, n) => {
-	if (n.length === 0) return null;
-	let r = Math.min(Math.max(t, 0), n.length - 1);
-	return {
-		kind: e,
-		index: r,
-		count: n.length,
-		currentId: n[r] ?? n[0],
-		canGoNext: r < n.length - 1,
-		canGoPrev: r > 0
-	};
-}, R = ({ layout: e, stepIndex: t, formState: n }) => {
-	let r = L("wizard-step", t, (e.kind === "wizard" ? e.steps : []).map((e) => e.id));
-	return r ? {
-		stepIndex: r.index,
-		stepCount: r.count,
-		currentStepId: r.currentId,
-		canNext: n.status !== "validating" && n.status !== "submitting",
-		canPrev: r.canGoPrev,
-		isLastStep: r.index === r.count - 1
-	} : null;
-}, z = ({ layout: e, activeTabIndex: t }) => {
-	let n = L("tab", t, (e.kind === "tabs" ? e.tabs : []).map((e) => e.id));
-	return n ? {
-		activeTabIndex: n.index,
-		tabCount: n.count,
-		currentTabId: n.currentId,
-		canGoNext: n.canGoNext,
-		canGoPrev: n.canGoPrev
-	} : null;
-}, B = ({ layout: e, openSectionIds: t }) => {
-	let n = e.kind === "accordion" ? e.sections : [];
-	return n.length === 0 ? null : {
-		openSectionIds: n.map((e) => e.id).filter((e) => t.has(e)),
-		sectionCount: n.length
-	};
-}, xe = (e) => ({
-	form: e.formState,
-	wizard: R(e),
-	tabs: z(e),
-	accordion: B(e)
-}), V = (e, t, n, r, i, a) => e.kind === "wizard" ? i === (e.steps[t]?.id ?? null) : e.kind === "tabs" ? a === (e.tabs[n]?.id ?? null) : e.kind === "accordion" ? a !== null && r.has(a) : !0, Se = (e, t, n, r, i, a) => {
-	let o = n.maps.fieldStepIds.get(e.id) ?? null, s = n.maps.fieldTabIds.get(e.id) ?? null, c = t.getField(e.kind);
-	return {
-		id: e.id,
-		kind: e.kind,
-		config: e.config,
-		controller: e,
-		state: e.state,
-		descriptor: c?.describe(e.config, {
-			fieldId: e.id,
-			state: e.state,
-			value: e.state.value
-		}) ?? _(e),
-		stepId: o,
-		tabId: s,
-		visibleInLayout: V(n.layout, r, i, a, o, s)
-	};
-}, Ce = (e, t, n, r, i, a, o) => {
-	let s = r.maps.reportStepIds.get(e.id) ?? null, c = r.maps.reportTabIds.get(e.id) ?? null, l = n.getReport(e.kind);
-	return {
-		id: e.id,
-		kind: e.kind,
-		config: e.config,
-		controller: e,
-		state: e.state,
-		descriptor: l ? l.describe(e.config, {
-			reportId: e.id,
-			state: e.state,
-			payload: e.state.payload,
-			result: t.state.lastResult
-		}) : null,
-		stepId: s,
-		tabId: c,
-		visibleInLayout: V(r.layout, i, a, o, s, c)
-	};
-}, we = (e, t, n, r, i, a) => {
-	let o = n.maps.explanationStepIds.get(e.id) ?? null, s = n.maps.explanationTabIds.get(e.id) ?? null, c = t.getExplanation(e.kind);
-	return {
-		id: e.id,
-		kind: e.kind,
-		config: e.config,
-		controller: e,
-		state: e.state,
-		descriptor: c ? c.describe(e.config, {
-			explanationId: e.id,
-			state: e.state
-		}) : null,
-		stepId: o,
-		tabId: s,
-		visibleInLayout: V(n.layout, r, i, a, o, s)
-	};
-}, Te = ({ form: e, presentationRegistry: t, resolvedLayout: n, stepIndex: r, activeTabIndex: i, openSectionIds: a }) => ({
-	form: e.state,
-	layout: n.layout,
-	fields: e.fields.map((e) => Se(e, t, n, r, i, a)),
-	reports: e.reports.map((o) => Ce(o, e, t, n, r, i, a)),
-	explanations: e.explanations.map((e) => we(e, t, n, r, i, a)),
-	wizard: R({
-		layout: n.layout,
-		stepIndex: r,
-		activeTabIndex: i,
-		openSectionIds: a,
-		formState: e.state
-	}),
-	tabs: z({
-		layout: n.layout,
-		stepIndex: r,
-		activeTabIndex: i,
-		openSectionIds: a,
-		formState: e.state
-	}),
-	accordion: B({
-		layout: n.layout,
-		stepIndex: r,
-		activeTabIndex: i,
-		openSectionIds: a,
-		formState: e.state
-	})
-}), Ee = (e, t, n, r, i) => xe({
-	formState: e.state,
-	layout: t,
-	stepIndex: n,
-	activeTabIndex: r,
-	openSectionIds: i
-}), De = ({ form: e, presentationRegistry: t, resolvedLayout: n, getStepIndex: r, getActiveTabIndex: i, getOpenSectionIds: a }) => {
-	let o = e.state, s = -1, c = -1, l = "", u = null;
-	return () => {
-		let d = r(), f = i(), p = a(), m = e.state, h = Array.from(p).sort().join("|");
-		return u && o === m && s === d && c === f && l === h ? u : (o = m, s = d, c = f, l = h, u = Te({
-			form: e,
-			presentationRegistry: t,
-			resolvedLayout: n,
-			stepIndex: d,
-			activeTabIndex: f,
-			openSectionIds: p
-		}), u);
-	};
-}, Oe = async (e, t, n) => {
-	if (t.layout.kind !== "wizard") return !1;
-	let r = t.layout.steps[n]?.id;
-	if (!r) return !1;
-	let i = e.fields.filter((e) => t.maps.fieldStepIds.get(e.id) === r && e.state.visible);
-	return (await Promise.all(i.map((e) => e.validate()))).every((e) => e.errors.length === 0);
-}, ke = (e, t, n, r) => {
-	switch (e.layout.kind) {
-		case "single-page": return e.layout.children;
-		case "wizard": return e.layout.steps[t]?.children ?? [];
-		case "tabs": return e.layout.tabs[n]?.children ?? [];
-		case "accordion": return e.layout.sections.filter((e) => r.has(e.id)).flatMap((e) => e.children);
-	}
-}, H = (e, t, n) => {
-	if (e.layout.kind !== "accordion") throw TypeError(T.nonAccordionToggleSection);
-	if (!t.some((e) => e.id === n)) throw TypeError(T.unknownAccordionSection(n));
-}, U = (e) => {
-	if (e.layout.kind !== "accordion") throw TypeError(T.nonAccordionToggleSection);
-}, W = (e) => {
-	let t = !e.registry || !e.presentationRegistry || !e.behaviors ? te() : null, n = e.registry ? re(e.registry) : t.registry, r = e.presentationRegistry?.clone() ?? t.presentationRegistry, i = ie(e.primitiveRegistry), a = ae(e.designSystemRegistry), o = ee({
-		schema: e.schema,
-		registry: n,
-		behaviors: e.behaviors ?? t?.behaviors,
-		transport: e.transport,
-		initialValues: e.initialValues,
-		validators: e.validators,
-		hooks: e.hooks,
-		hookFailurePolicy: e.hookFailurePolicy,
-		inactiveFieldPolicy: e.inactiveFieldPolicy,
-		listenerErrorPolicy: e.listenerErrorPolicy,
-		onListenerError: e.onListenerError
-	}), s = be(e.layout, o.fields, o.reports, o.explanations), c = 0, l = 0, u = new Set(s.layout.kind === "accordion" ? s.layout.sections.filter((e) => e.defaultOpen).map((e) => e.id) : []), d = /* @__PURE__ */ new Set(), f = s.layout.kind === "wizard" ? s.layout.steps : [], p = s.layout.kind === "tabs" ? s.layout.tabs : [], m = s.layout.kind === "accordion" ? s.layout.sections : [], h = I(s.layout), g = /* @__PURE__ */ new Map();
-	for (let e of F(s.layout)) "id" in e && g.set(e.id, e);
-	let _ = () => Ee(o, s.layout, c, l, u), v = De({
-		form: o,
-		presentationRegistry: r,
-		resolvedLayout: s,
-		getStepIndex: () => c,
-		getActiveTabIndex: () => l,
-		getOpenSectionIds: () => u
-	}), y = () => {
-		let e = v();
-		for (let t of d) t(e);
-	};
-	return o.subscribe(() => {
-		y();
-	}), Object.freeze({
-		form: o,
-		engineRegistry: n,
-		presentationRegistry: r,
-		primitiveRegistry: i,
-		designSystemRegistry: a,
-		get state() {
-			return _();
-		},
-		getSnapshot: v,
-		getNodeById(e) {
-			return g.get(e);
-		},
-		getField(e) {
-			return v().fields.find((t) => t.id === e);
-		},
-		getReport(e) {
-			return v().reports.find((t) => t.id === e);
-		},
-		getExplanation(e) {
-			return v().explanations.find((t) => t.id === e);
-		},
-		getVisibleFields() {
-			return v().fields.filter((e) => e.visibleInLayout && e.state.visible);
-		},
-		getVisibleReports() {
-			return v().reports.filter((e) => e.visibleInLayout);
-		},
-		getVisibleExplanations() {
-			return v().explanations.filter((e) => e.visibleInLayout);
-		},
-		getActiveLayoutNodes() {
-			return ke(s, c, l, u);
-		},
-		getLayoutReferences() {
-			return h;
-		},
-		validate() {
-			return o.validate();
-		},
-		submit(e) {
-			return o.submit(e);
-		},
-		reset() {
-			o.reset();
-		},
-		subscribe(e) {
-			return d.add(e), () => {
-				d.delete(e);
-			};
-		},
-		async nextStep() {
-			return s.layout.kind !== "wizard" || !await Oe(o, s, c) ? !1 : (c < f.length - 1 && (c += 1, y()), !0);
-		},
-		prevStep() {
-			s.layout.kind === "wizard" && c > 0 && (--c, y());
-		},
-		async goToStep(e) {
-			if (s.layout.kind !== "wizard") throw TypeError(T.nonWizardGoToStep);
-			let t = f.findIndex((t) => t.id === e);
-			if (t < 0) throw TypeError(T.unknownWizardStep(e));
-			if (t <= c) return c = t, y(), !0;
-			for (; c < t;) if (!await this.nextStep()) return !1;
-			return !0;
-		},
-		setActiveTab(e) {
-			if (s.layout.kind !== "tabs") throw TypeError(T.nonTabsSetActiveTab);
-			let t = p.findIndex((t) => t.id === e);
-			if (t < 0) throw TypeError(T.unknownTab(e));
-			t !== l && (l = t, y());
-		},
-		nextTab() {
-			return s.layout.kind !== "tabs" || l >= p.length - 1 ? !1 : (l += 1, y(), !0);
-		},
-		prevTab() {
-			return s.layout.kind !== "tabs" || l <= 0 ? !1 : (--l, y(), !0);
-		},
-		toggleSection(e) {
-			H(s, m, e), u.has(e) ? u.delete(e) : u.add(e), y();
-		},
-		openSection(e) {
-			H(s, m, e), u.has(e) || (u.add(e), y());
-		},
-		closeSection(e) {
-			H(s, m, e), u.delete(e) && y();
-		},
-		openAllSections() {
-			U(s), u = new Set(m.map((e) => e.id)), y();
-		},
-		closeAllSections() {
-			U(s), u = /* @__PURE__ */ new Set(), y();
-		}
-	});
-}, G = Symbol("mlform.kit.accordion.mounted"), Ae = (e) => "view" in e, je = (e, t) => {
-	let r = e;
-	r[G]?.unmount();
-	let i = Ae(t) ? t.view : W({
-		schema: t.schema,
-		transport: t.transport,
-		registry: t.registry,
-		primitiveRegistry: t.primitiveRegistry,
-		designSystemRegistry: t.designSystemRegistry,
-		designSystem: t.designSystem,
-		initialValues: t.initialValues,
-		validators: t.validators,
-		hooks: t.hooks,
-		hookFailurePolicy: t.hookFailurePolicy,
-		inactiveFieldPolicy: t.inactiveFieldPolicy,
-		listenerErrorPolicy: t.listenerErrorPolicy,
-		onListenerError: t.onListenerError,
-		layout: t.layout
-	});
-	if (i.getSnapshot().layout.kind !== "accordion") throw TypeError(T.accordionMissingLayout);
-	let a = C(t.labels), o = u(t.primitiveText), s = w(t.designSystem), c = document.createElement(E.accordion);
-	c.view = i, c.registry = i.primitiveRegistry, c.primitiveText = o, c.submitLabel = a.submit, c.validatingLabel = a.validating, c.submittingLabel = a.submitting, e.replaceChildren(c);
-	let l = n(c, {
-		config: s,
-		registry: i.designSystemRegistry,
-		onChange: t.onDesignSystemChange
-	}), d = !1, f = Object.freeze({
-		view: i,
-		form: i.form,
-		host: c,
-		designSystem: l,
-		unmount() {
-			d || (d = !0, r[G] === f && delete r[G], i.form.abortSubmit("unmount"), l.disconnect(), c.remove());
-		}
-	});
-	return r[G] = f, f;
-}, K = Symbol("mlform.kit.mounted"), Me = (e) => {
-	if (!e.mode || !e.theme || !e.recipe) throw TypeError(T.invalidDesignSystemSnapshot);
-}, Ne = (e, t) => {
-	let r = e;
-	r[K]?.unmount();
-	let i = W({
-		schema: t.schema,
-		transport: t.transport,
-		registry: t.registry,
-		presentationRegistry: t.presentationRegistry,
-		primitiveRegistry: t.primitiveRegistry,
-		designSystemRegistry: t.designSystemRegistry,
-		designSystem: t.designSystem,
-		initialValues: t.initialValues,
-		validators: t.validators,
-		hooks: t.hooks,
-		hookFailurePolicy: t.hookFailurePolicy,
-		inactiveFieldPolicy: t.inactiveFieldPolicy,
-		listenerErrorPolicy: t.listenerErrorPolicy,
-		onListenerError: t.onListenerError,
-		reportPane: t.reportPane,
-		reportTransport: t.reportTransport,
-		labels: t.labels,
-		primitiveText: t.primitiveText,
-		containerStrategy: t.containerStrategy,
-		onDesignSystemChange: t.onDesignSystemChange
-	}), a = C(t.labels), o = w(t.designSystem), s = v(e, i.form, {
-		registry: i.primitiveRegistry,
-		presentationRegistry: i.presentationRegistry,
-		layout: t.layout,
-		containerStrategy: t.containerStrategy,
-		formLabel: a.form,
-		reportsLabel: a.reports,
-		submitLabel: a.submit,
-		validatingLabel: a.validating,
-		submittingLabel: a.submitting,
-		reportPane: t.reportPane,
-		text: t.primitiveText,
-		reportTransport: t.reportTransport
-	}), c = n(s.host, {
-		config: o,
-		registry: i.designSystemRegistry,
-		onChange: t.onDesignSystemChange
-	}), l = !1, u = Object.freeze({
-		form: i.form,
-		host: s.host,
-		engineRegistry: i.engineRegistry,
-		presentationRegistry: i.presentationRegistry,
-		primitiveRegistry: i.primitiveRegistry,
-		designSystemRegistry: i.designSystemRegistry,
-		designSystem: c,
-		updateDesignSystem(e) {
-			c.update(e);
-		},
-		replaceDesignSystem(e) {
-			Me(e), c.replace(e);
-		},
-		resetDesignSystem() {
-			c.reset();
-		},
-		unmount() {
-			l || (l = !0, r[K] === u && delete r[K], i.form.abortSubmit("unmount"), c.disconnect(), s.unmount());
-		}
-	});
-	return r[K] = u, u;
-}, Pe = (e) => {
-	e.unmount();
-}, Fe = a`
-  :host {
-    display: block;
-    flex: 1 1 auto;
-    align-self: stretch;
-    inline-size: 100%;
-    block-size: 100%;
-    color: var(--mlf-shell-color, var(--mlf-color-text, #0f172a));
-    background: var(--mlf-shell-bg, var(--mlf-color-bg, #f5f7fa));
-    font-family: var(--mlf-font-family-body);
-    min-width: 0;
-    min-height: 0;
-  }
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-  .root {
-    display: grid;
-    grid-template-rows: auto 1fr auto;
-    inline-size: 100%;
-    block-size: 100%;
-    min-width: 0;
-    min-height: 0;
-    overflow: hidden;
-    border-radius: var(--mlf-panel-radius, 12px);
-    border: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(--mlf-shell-panel-bg, var(--mlf-color-surface, #ffffff));
-    box-shadow:
-      0 2px 4px var(--mlf-shell-panel-shadow-soft, rgba(0, 0, 0, 0.04)),
-      0 8px 16px var(--mlf-shell-panel-shadow, rgba(0, 0, 0, 0.04));
-  }
-  .tablist {
-    display: flex;
-    gap: 0.35rem;
-    overflow-x: auto;
-    padding: 0.85rem 1rem 0;
-    border-bottom: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(
-      --mlf-shell-header-bg,
-      color-mix(in srgb, var(--mlf-color-surface, #ffffff) 76%, transparent)
-    );
-    scrollbar-width: thin;
-  }
-  .tab {
-    position: relative;
-    border: none;
-    border-radius: 12px 12px 0 0;
-    background: transparent;
-    color: var(--mlf-color-text-muted, #475569);
-    font: inherit;
-    font-size: 0.94rem;
-    font-weight: 600;
-    padding: 0.85rem 1rem 0.75rem;
-    cursor: pointer;
-    white-space: nowrap;
-  }
-  .tab[aria-selected="true"] {
-    color: var(--mlf-color-text, #0f172a);
-    background: color-mix(in srgb, var(--mlf-color-surface, #ffffff) 94%, transparent);
-  }
-  .tab[aria-selected="true"]::after {
-    content: "";
-    position: absolute;
-    inset-inline: 0.8rem;
-    inset-block-end: 0;
-    block-size: 3px;
-    border-radius: 999px;
-    background: var(--mlf-color-accent, #1e40af);
-  }
-  .tab-panel {
-    display: grid;
-    grid-template-rows: auto 1fr;
-    min-width: 0;
-    min-height: 0;
-    overflow: hidden;
-  }
-  .tab-header {
-    display: grid;
-    gap: 0.35rem;
-    padding: 1rem 1.25rem 0.5rem;
-  }
-  .tab-title {
-    margin: 0;
-    font-size: 1.08rem;
-    font-weight: 700;
-    color: var(--mlf-color-text, #0f172a);
-    line-height: 1.3;
-  }
-  .tab-description {
-    margin: 0;
-    font-size: var(--mlf-font-size-sm, 0.84rem);
-    color: var(--mlf-color-text-muted, #475569);
-    line-height: 1.5;
-  }
-  .body {
-    display: grid;
-    align-content: start;
-    gap: 1rem;
-    padding: 0.5rem 1rem 1.25rem;
-    overflow-y: auto;
-    overflow-x: hidden;
-  }
-  .collection,
-  .section-children,
-  .group {
-    display: grid;
-    gap: var(--mlf-section-gap, 1rem);
-  }
-  .section {
-    display: grid;
-    gap: 0.9rem;
-  }
-  .section-copy {
-    display: grid;
-    gap: 0.35rem;
-    padding: 0 0.5rem;
-  }
-  .section-title {
-    margin: 0;
-    font-size: 0.95rem;
-    font-weight: 700;
-    color: var(--mlf-color-text, #0f172a);
-  }
-  .section-description {
-    margin: 0;
-    font-size: var(--mlf-font-size-sm, 0.84rem);
-    color: var(--mlf-color-text-muted, #475569);
-    line-height: 1.5;
-  }
-  .group.columns-2 {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-  .group.columns-3 {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-  }
-  .footer {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 0.75rem;
-    padding: 0.85rem 1rem 1rem;
-    border-top: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(--mlf-shell-action-bg, var(--mlf-color-surface-muted, #f5f7fa));
-  }
-  .nav {
-    display: inline-flex;
-    gap: 0.5rem;
-  }
-  .btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    min-height: 2.5rem;
-    padding: 0.5rem 1rem;
-    border-radius: var(--mlf-input-radius, 12px);
-    border: var(--mlf-border-width, 1px) solid var(--mlf-input-border, #e2e8f0);
-    background: var(--mlf-input-bg, var(--mlf-color-surface-elevated, #ffffff));
-    color: var(--mlf-color-text, #0f172a);
-    font: inherit;
-    font-size: 0.92rem;
-    font-weight: 600;
-    cursor: pointer;
-  }
-  .btn:disabled {
-    cursor: not-allowed;
-    opacity: 0.55;
-  }
-  .btn-submit {
-    border-color: var(--mlf-submit-bg, var(--mlf-color-accent, #1e40af));
-    background: var(--mlf-submit-bg, var(--mlf-color-accent, #1e40af));
-    color: var(--mlf-submit-color, #ffffff);
-  }
-  @media (max-width: 900px) {
-    .group.columns-2,
-    .group.columns-3 {
-      grid-template-columns: minmax(0, 1fr);
-    }
-    .footer {
-      flex-direction: column;
-      align-items: stretch;
-    }
-    .nav {
-      justify-content: space-between;
-    }
-  }
-`, q = class extends c {
-	static styles = Fe;
-	#e;
-	get view() {
-		return this.#e;
-	}
-	set view(e) {
-		this.#e = e;
-	}
-	#t;
-	get registry() {
-		return this.#t;
-	}
-	set registry(e) {
-		this.#t = e;
-	}
-	#n = d;
-	get primitiveText() {
-		return this.#n;
-	}
-	set primitiveText(e) {
-		this.#n = e;
-	}
-	#r = "Submit";
-	get submitLabel() {
-		return this.#r;
-	}
-	set submitLabel(e) {
-		this.#r = e;
-	}
-	#i = "Validating...";
-	get validatingLabel() {
-		return this.#i;
-	}
-	set validatingLabel(e) {
-		this.#i = e;
-	}
-	#a = "Submitting...";
-	get submittingLabel() {
-		return this.#a;
-	}
-	set submittingLabel(e) {
-		this.#a = e;
-	}
-	#o = null;
-	get snapshot() {
-		return this.#o;
-	}
-	set snapshot(e) {
-		this.#o = e;
-	}
-	#s = null;
-	willUpdate(e) {
-		e.has("view") && (this.#s?.(), this.#s = null, this.snapshot = this.view?.getSnapshot() ?? null, this.view && (this.#s = this.view.subscribe((e) => {
-			this.snapshot = e;
-		})));
-	}
-	disconnectedCallback() {
-		this.#s?.(), this.#s = null, super.disconnectedCallback();
-	}
-	render() {
-		let e = this.snapshot, t = e?.tabs;
-		if (!e || !t || e.layout.kind !== "tabs") return o``;
-		let n = e.layout.tabs[t.activeTabIndex];
-		if (!n) return o``;
-		let r = e.form.status, i = r === "validating" ? this.validatingLabel : r === "submitting" ? this.submittingLabel : this.submitLabel;
-		return o`
-      <section class="root" part="tabs-panel">
-        <div class="tablist" role="tablist" aria-label="Form sections">
-          ${m(e.layout.tabs, (e) => e.id, (e, n) => o`
-              <button
-                type="button"
-                class="tab"
-                role="tab"
-                aria-selected=${String(n === t.activeTabIndex)}
-                aria-controls=${`panel-${e.id}`}
-                id=${`tab-${e.id}`}
-                @click=${() => this.view?.setActiveTab(e.id)}
-              >
-                ${e.title}
-              </button>
-            `)}
-        </div>
-
-        <div
-          class="tab-panel"
-          role="tabpanel"
-          id=${`panel-${n.id}`}
-          aria-labelledby=${`tab-${n.id}`}
-        >
-          ${n.title || n.description ? o`
-                <header class="tab-header">
-                  <h1 class="tab-title">${n.title}</h1>
-                  ${n.description ? o`<p class="tab-description">${n.description}</p>` : b}
-                </header>
-              ` : b}
-
-          <div class="body">
-            <div class="collection">
-              ${m(n.children, (e, t) => `${n.id}-${t}`, (t) => O({
-			node: t,
-			snapshot: e,
-			registry: this.registry,
-			primitiveText: this.primitiveText,
-			sectionClass: "section",
-			sectionCopyClass: "section-copy",
-			sectionTitleClass: "section-title",
-			sectionDescriptionClass: "section-description",
-			childrenClass: "section-children",
-			groupBaseClass: "group"
-		}))}
-            </div>
-          </div>
-        </div>
-
-        <footer class="footer" part="actions">
-          <div class="nav">
-            <button
-              type="button"
-              class="btn"
-              ?disabled=${!t.canGoPrev}
-              @click=${() => this.view?.prevTab()}
-            >
-              Previous
-            </button>
-            <button
-              type="button"
-              class="btn"
-              ?disabled=${!t.canGoNext}
-              @click=${() => this.view?.nextTab()}
-            >
-              Next
-            </button>
-          </div>
-          <button
-            type="button"
-            class="btn btn-submit"
-            ?disabled=${r === "validating" || r === "submitting"}
-            @click=${this.#c}
-          >
-            ${i}
-          </button>
-        </footer>
-      </section>
-    `;
-	}
-	#c = async () => {
-		if (this.view) try {
-			await this.view.submit();
-		} catch (e) {
-			if (!await D(this, this.view)) throw e;
-		}
-	};
-};
-h([y({ attribute: !1 })], q.prototype, "view", null), h([y({ attribute: !1 })], q.prototype, "registry", null), h([y({ attribute: !1 })], q.prototype, "primitiveText", null), h([y({ type: String })], q.prototype, "submitLabel", null), h([y({ type: String })], q.prototype, "validatingLabel", null), h([y({ type: String })], q.prototype, "submittingLabel", null), h([s()], q.prototype, "snapshot", null), q = h([x(E.tabs)], q);
-//#endregion
-//#region src/kit/tabs.ts
-var J = Symbol("mlform.kit.tabs.mounted"), Ie = (e) => "view" in e, Le = (e, t) => {
-	let r = e;
-	r[J]?.unmount();
-	let i = Ie(t) ? t.view : W({
-		schema: t.schema,
-		transport: t.transport,
-		registry: t.registry,
-		primitiveRegistry: t.primitiveRegistry,
-		designSystemRegistry: t.designSystemRegistry,
-		designSystem: t.designSystem,
-		initialValues: t.initialValues,
-		validators: t.validators,
-		hooks: t.hooks,
-		hookFailurePolicy: t.hookFailurePolicy,
-		inactiveFieldPolicy: t.inactiveFieldPolicy,
-		listenerErrorPolicy: t.listenerErrorPolicy,
-		onListenerError: t.onListenerError,
-		layout: t.layout
-	});
-	if (i.getSnapshot().layout.kind !== "tabs") throw TypeError(T.tabsMissingLayout);
-	let a = C(t.labels), o = u(t.primitiveText), s = w(t.designSystem), c = document.createElement(E.tabs);
-	c.view = i, c.registry = i.primitiveRegistry, c.primitiveText = o, c.submitLabel = a.submit, c.validatingLabel = a.validating, c.submittingLabel = a.submitting, e.replaceChildren(c);
-	let l = n(c, {
-		config: s,
-		registry: i.designSystemRegistry,
-		onChange: t.onDesignSystemChange
-	}), d = !1, f = Object.freeze({
-		view: i,
-		form: i.form,
-		host: c,
-		designSystem: l,
-		unmount() {
-			d || (d = !0, r[J] === f && delete r[J], i.form.abortSubmit("unmount"), l.disconnect(), c.remove());
-		}
-	});
-	return r[J] = f, f;
-}, Y = class extends c {
-	static styles = a`
-    :host {
-      display: block;
-      min-width: 0;
-    }
-
-    *,
-    *::before,
-    *::after {
-      box-sizing: border-box;
-    }
-
-    .indicator {
-      display: grid;
-      gap: 0.5rem;
-    }
-
-    .header {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-      gap: 1rem;
-    }
-
-    .step-label {
-      font-size: var(--mlf-font-size-sm, 0.84rem);
-      font-weight: 600;
-      letter-spacing: 0.05em;
-      text-transform: uppercase;
-      color: var(--mlf-color-text-muted, #475569);
-    }
-
-    .step-fraction {
-      font-size: var(--mlf-font-size-sm, 0.84rem);
-      font-weight: 700;
-      color: var(--mlf-color-accent, #1e40af);
-    }
-
-    .track {
-      height: 4px;
-      border-radius: 999px;
-      background: var(--mlf-color-border, #e2e8f0);
-      overflow: hidden;
-    }
-
-    .fill {
-      height: 100%;
-      border-radius: 999px;
-      background: var(--mlf-color-accent, #1e40af);
-      transition: width 0.3s ease;
-    }
-
-    .dots {
-      display: flex;
-      gap: 0.4rem;
-      flex-wrap: wrap;
-    }
-
-    .dot {
-      width: 8px;
-      height: 8px;
-      border-radius: 50%;
-      background: var(--mlf-color-border, #e2e8f0);
-      transition:
-        background-color 0.2s ease,
-        transform 0.2s ease;
-    }
-
-    .dot.active {
-      background: var(--mlf-color-accent, #1e40af);
-      transform: scale(1.25);
-    }
-
-    .dot.done {
-      background: color-mix(in srgb, var(--mlf-color-accent, #1e40af) 50%, transparent);
-    }
-  `;
-	#e = 1;
-	get current() {
-		return this.#e;
-	}
-	set current(e) {
-		this.#e = e;
-	}
-	#t = 1;
-	get total() {
-		return this.#t;
-	}
-	set total(e) {
-		this.#t = e;
-	}
-	#n = "Step";
-	get label() {
-		return this.#n;
-	}
-	set label(e) {
-		this.#n = e;
-	}
-	render() {
-		let e = this.total > 0 ? Math.round(this.current / this.total * 100) : 0;
-		return o`
-      <div
-        class="indicator"
-        role="status"
-        aria-label=${`${this.label} ${this.current} of ${this.total}`}
-      >
-        <div class="header">
-          <span class="step-label">${this.label}</span>
-          <span class="step-fraction">${this.current} / ${this.total}</span>
-        </div>
-        <div class="track" aria-hidden="true">
-          <div class="fill" style="width: ${e}%"></div>
-        </div>
-        <div class="dots" aria-hidden="true">
-          ${Array.from({ length: this.total }, (e, t) => o`<div class=${t + 1 < this.current ? "dot done" : t + 1 === this.current ? "dot active" : "dot"}></div>`)}
-        </div>
-      </div>
-    `;
-	}
-};
-h([y({ type: Number })], Y.prototype, "current", null), h([y({ type: Number })], Y.prototype, "total", null), h([y({ type: String })], Y.prototype, "label", null), Y = h([x(E.stepIndicator)], Y);
-//#endregion
-//#region src/kit/wizard-constants.ts
-var X = {
-	prev: "Previous",
-	next: "Next",
-	submit: "Submit",
-	validating: "Validating...",
-	submitting: "Submitting..."
-}, Re = Object.freeze({
-	stepLabel: (e, t) => `Step ${e} of ${t}`,
-	prevLabel: "Previous",
-	nextLabel: "Next",
-	submitLabel: "Submit",
-	validatingLabel: "Validating...",
-	submittingLabel: "Submitting..."
-}), Z = (e) => e ? Object.freeze({
-	...Re,
-	...e
-}) : Re, ze = a`
-  :host {
-    display: block;
-    flex: 1 1 auto;
-    align-self: stretch;
-    inline-size: 100%;
-    block-size: 100%;
-    color: var(--mlf-shell-color, var(--mlf-color-text, #0f172a));
-    background: var(--mlf-shell-bg, var(--mlf-color-bg, #f5f7fa));
-    font-family: var(--mlf-font-family-body);
-    min-width: 0;
-    min-height: 0;
-  }
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-  .root {
-    display: grid;
-    grid-template-rows: 1fr;
-    gap: var(--mlf-shell-gap, 1rem);
-    inline-size: 100%;
-    block-size: 100%;
-    min-width: 0;
-    min-height: 0;
-  }
-  .panel {
-    display: flex;
-    flex-direction: column;
-    min-width: 0;
-    min-height: 0;
-    overflow: hidden;
-    border-radius: var(--mlf-panel-radius, 12px);
-    border: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(--mlf-shell-panel-bg, var(--mlf-color-surface, #ffffff));
-    box-shadow:
-      0 2px 4px var(--mlf-shell-panel-shadow-soft, rgba(0, 0, 0, 0.04)),
-      0 8px 16px var(--mlf-shell-panel-shadow, rgba(0, 0, 0, 0.04));
-  }
-  .pane-header {
-    flex: 0 0 auto;
-    display: grid;
-    gap: 0.85rem;
-    padding: 1rem 1.5rem;
-    border-bottom: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(
-      --mlf-shell-header-bg,
-      color-mix(in srgb, var(--mlf-color-surface, #ffffff) 76%, transparent)
-    );
-    backdrop-filter: blur(var(--mlf-shell-header-blur, 3px));
-    -webkit-backdrop-filter: blur(var(--mlf-shell-header-blur, 3px));
-  }
-  .step-title {
-    margin: 0;
-    font-size: 1.1rem;
-    font-weight: 700;
-    color: var(--mlf-pane-title-color, var(--mlf-color-text, #0f172a));
-    line-height: 1.3;
-  }
-  .step-description {
-    margin: 0;
-    font-size: var(--mlf-font-size-sm, 0.84rem);
-    color: var(--mlf-color-text-muted, #475569);
-    line-height: 1.5;
-  }
-  .pane-body {
-    flex: 1 1 auto;
-    display: grid;
-    align-content: start;
-    gap: 1rem;
-    padding: 1rem 1rem 1.25rem;
-    overflow-y: auto;
-    overflow-x: hidden;
-  }
-  .collection,
-  .section-children,
-  .section,
-  .group {
-    display: grid;
-    gap: var(--mlf-section-gap, 1rem);
-  }
-  .section-copy {
-    display: grid;
-    gap: 0.35rem;
-    padding: 0 0.5rem;
-  }
-  .section-title {
-    margin: 0;
-    font-size: 0.95rem;
-    font-weight: 700;
-    color: var(--mlf-color-text, #0f172a);
-  }
-  .section-description {
-    margin: 0;
-    font-size: var(--mlf-font-size-sm, 0.84rem);
-    color: var(--mlf-color-text-muted, #475569);
-    line-height: 1.5;
-  }
-  .group.columns-2 {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-  .group.columns-3 {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-  }
-  .actions {
-    flex: 0 0 auto;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 1rem;
-    padding: 0.75rem 1.5rem;
-    border-top: var(--mlf-border-width, 1px) solid
-      var(--mlf-shell-panel-border, var(--mlf-color-border, #e2e8f0));
-    background: var(--mlf-shell-action-bg, var(--mlf-color-surface-muted, #f5f7fa));
-  }
-  .btn {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    gap: 0.5rem;
-    min-height: 2.5rem;
-    padding: 0.5rem 1.25rem;
-    border: var(--mlf-border-width, 1px) solid transparent;
-    border-radius: var(--mlf-input-radius, 12px);
-    font: inherit;
-    font-size: 0.95rem;
-    font-weight: 600;
-    cursor: pointer;
-    transition:
-      background-color 0.2s ease,
-      border-color 0.2s ease,
-      opacity 0.2s ease;
-  }
-  .btn:disabled {
-    cursor: not-allowed;
-    opacity: 0.55;
-  }
-  .btn-prev {
-    background: transparent;
-    border-color: var(--mlf-input-border, var(--mlf-color-border, #e2e8f0));
-    color: var(--mlf-color-text-muted, #475569);
-  }
-  .btn-next,
-  .btn-submit {
-    background: var(--mlf-submit-bg, var(--mlf-color-accent, #1e40af));
-    border-color: var(--mlf-submit-bg, var(--mlf-color-accent, #1e40af));
-    color: var(--mlf-submit-color, #ffffff);
-  }
-  .spacer {
-    flex: 1 1 auto;
-  }
-  @media (max-width: 900px) {
-    .group.columns-2,
-    .group.columns-3 {
-      grid-template-columns: minmax(0, 1fr);
-    }
-  }
-`, Q = class extends c {
-	static styles = ze;
-	#e;
-	get view() {
-		return this.#e;
-	}
-	set view(e) {
-		this.#e = e;
-	}
-	#t;
-	get registry() {
-		return this.#t;
-	}
-	set registry(e) {
-		this.#t = e;
-	}
-	#n = d;
-	get primitiveText() {
-		return this.#n;
-	}
-	set primitiveText(e) {
-		this.#n = e;
-	}
-	#r = X;
-	get labels() {
-		return this.#r;
-	}
-	set labels(e) {
-		this.#r = e;
-	}
-	#i = Z();
-	get text() {
-		return this.#i;
-	}
-	set text(e) {
-		this.#i = e;
-	}
-	#a = null;
-	get snapshot() {
-		return this.#a;
-	}
-	set snapshot(e) {
-		this.#a = e;
-	}
-	#o = null;
-	willUpdate(e) {
-		e.has("view") && (this.#o?.(), this.#o = null, this.snapshot = this.view?.getSnapshot() ?? null, this.view && (this.#o = this.view.subscribe((e) => {
-			this.snapshot = e;
-		})));
-	}
-	disconnectedCallback() {
-		this.#o?.(), this.#o = null, super.disconnectedCallback();
-	}
-	render() {
-		let e = this.snapshot, t = e?.wizard;
-		if (!e || !t || e.layout.kind !== "wizard") return o``;
-		let n = e.layout.steps[t.stepIndex];
-		if (!n) return o``;
-		let r = e.form.status, i = r === "validating" || r === "submitting", a = t.isLastStep ? r === "validating" ? this.labels.validating : r === "submitting" ? this.labels.submitting : this.labels.submit : this.labels.next;
-		return o`
-      <div class="root">
-        <section class="panel" part="wizard-panel">
-          <header class="pane-header">
-            <mlf-kit-step-indicator
-              .current=${t.stepIndex + 1}
-              .total=${t.stepCount}
-              .label=${this.text.stepLabel(t.stepIndex + 1, t.stepCount).split(" ")[0] ?? "Step"}
-            ></mlf-kit-step-indicator>
-            <h1 class="step-title">${n.title}</h1>
-            ${n.description ? o`<p class="step-description">${n.description}</p>` : b}
-          </header>
-
-          <div class="pane-body">
-            <div class="collection">
-              ${m(n.children, (e, t) => `${n.id}-${t}`, (t) => O({
-			node: t,
-			snapshot: e,
-			registry: this.registry,
-			primitiveText: this.primitiveText,
-			sectionClass: "section",
-			sectionCopyClass: "section-copy",
-			sectionTitleClass: "section-title",
-			sectionDescriptionClass: "section-description",
-			childrenClass: "section-children",
-			groupBaseClass: "group"
-		}))}
-            </div>
-          </div>
-
-          <div class="actions" part="actions">
-            <button
-              type="button"
-              class="btn btn-prev"
-              ?disabled=${!t.canPrev || i}
-              @click=${this.#s}
-            >
-              ${this.labels.prev}
-            </button>
-            <span class="spacer"></span>
-            <button
-              type="button"
-              class=${t.isLastStep ? "btn btn-submit" : "btn btn-next"}
-              ?disabled=${i}
-              @click=${t.isLastStep ? this.#l : this.#c}
-            >
-              ${a}
-            </button>
-          </div>
-        </section>
-      </div>
-    `;
-	}
-	#s = () => {
-		this.view?.prevStep();
-	};
-	#c = async () => {
-		await this.view?.nextStep() === !1 && this.view && await D(this, this.view);
-	};
-	#l = async () => {
-		if (this.view) {
-			if (!await this.view.nextStep()) {
-				await D(this, this.view);
-				return;
-			}
-			try {
-				await this.view.submit();
-			} catch (e) {
-				if (!await D(this, this.view)) throw e;
-			}
-		}
-	};
-};
-h([y({ attribute: !1 })], Q.prototype, "view", null), h([y({ attribute: !1 })], Q.prototype, "registry", null), h([y({ attribute: !1 })], Q.prototype, "primitiveText", null), h([y({ attribute: !1 })], Q.prototype, "labels", null), h([y({ attribute: !1 })], Q.prototype, "text", null), h([s()], Q.prototype, "snapshot", null), Q = h([x(E.wizard)], Q);
-//#endregion
-//#region src/kit/wizard.ts
-var $ = Symbol("mlform.kit.wizard.mounted"), Be = (e) => "view" in e, Ve = (e, t) => {
-	let r = e;
-	r[$]?.unmount();
-	let i = Be(t) ? t.view : W({
-		schema: t.schema,
-		transport: t.transport,
-		registry: t.registry,
-		primitiveRegistry: t.primitiveRegistry,
-		designSystemRegistry: t.designSystemRegistry,
-		designSystem: t.designSystem,
-		initialValues: t.initialValues,
-		validators: t.validators,
-		hooks: t.hooks,
-		hookFailurePolicy: t.hookFailurePolicy,
-		inactiveFieldPolicy: t.inactiveFieldPolicy,
-		listenerErrorPolicy: t.listenerErrorPolicy,
-		onListenerError: t.onListenerError,
-		layout: t.layout
-	});
-	if (i.getSnapshot().layout.kind !== "wizard") throw TypeError(T.wizardMissingLayout);
-	let a = document.createElement(E.wizard), o = {
-		...X,
-		...t.labels
-	}, s = Z({
-		...t.text,
-		prevLabel: o.prev,
-		nextLabel: o.next,
-		submitLabel: o.submit,
-		validatingLabel: o.validating,
-		submittingLabel: o.submitting
-	}), c = u(t.primitiveText), l = w(t.designSystem);
-	a.view = i, a.registry = i.primitiveRegistry, a.primitiveText = c, a.labels = o, a.text = s, e.replaceChildren(a);
-	let d = n(a, {
-		config: l,
-		registry: i.designSystemRegistry,
-		onChange: t.onDesignSystemChange
-	}), f = !1, p = Object.freeze({
-		view: i,
-		form: i.form,
-		host: a,
-		designSystem: d,
-		unmount() {
-			f || (f = !0, r[$] === p && delete r[$], i.form.abortSubmit("unmount"), d.disconnect(), a.remove());
-		}
-	});
-	return r[$] = p, p;
-};
-//#endregion
-export { je as a, F as c, S as d, Pe as i, P as l, Le as n, W as o, Ne as r, I as s, Ve as t, ne as u };