schema-components 1.18.0 → 1.19.0

package/dist/html/renderToHtml.mjs

@@ -1,7 +1,6 @@
 import { normaliseSchema } from "../core/adapter.mjs";
 import { getHtmlRenderFn, mergeHtmlResolvers } from "../core/renderer.mjs";
 import { walk } from "../core/walker.mjs";
-import { h, serialize } from "./html.mjs";
 import { joinPath } from "./a11y.mjs";
 import { defaultHtmlResolver } from "./renderers.mjs";
 //#region src/html/renderToHtml.ts
@@ -59,35 +58,19 @@ function renderFieldHtml(tree, value, resolver, path, renderChild) {
 	const effectiveValue = value ?? tree.defaultValue;
 	const mergedResolver = mergeHtmlResolvers(resolver, defaultHtmlResolver);
 	const renderFn = getHtmlRenderFn(tree.type, mergedResolver);
-	if (renderFn !== void 0) {
-		const props = {
-			value: effectiveValue,
-			readOnly: tree.editability === "presentation",
-			writeOnly: tree.editability === "input",
-			meta: tree.meta,
-			constraints: tree.constraints,
-			path,
-			tree,
-			renderChild
-		};
-		if (tree.type === "enum") props.enumValues = tree.enumValues;
-		if (tree.type === "array" && tree.element !== void 0) props.element = tree.element;
-		if (tree.type === "object") props.fields = tree.fields;
-		if (tree.type === "union" || tree.type === "discriminatedUnion") props.options = tree.options;
-		if (tree.type === "discriminatedUnion") props.discriminator = tree.discriminator;
-		if (tree.type === "record") props.keyType = tree.keyType;
-		if (tree.type === "record") props.valueType = tree.valueType;
-		if (tree.type === "tuple") props.prefixItems = tree.prefixItems;
-		if (tree.type === "conditional") props.ifClause = tree.ifClause;
-		if (tree.type === "conditional" && tree.thenClause !== void 0) props.thenClause = tree.thenClause;
-		if (tree.type === "conditional" && tree.elseClause !== void 0) props.elseClause = tree.elseClause;
-		if (tree.type === "negation") props.negated = tree.negated;
-		if (tree.type === "literal") props.literalValues = tree.literalValues;
-		if (tree.examples !== void 0) props.examples = tree.examples;
-		return renderFn(props);
-	}
-	if (effectiveValue === void 0 || effectiveValue === null) return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
-	return serialize(h("span", { class: "sc-value" }, typeof effectiveValue === "string" ? effectiveValue : JSON.stringify(effectiveValue)));
+	if (renderFn === void 0) throw new Error(`renderToHtml: no HTML renderer registered for type "${tree.type}"`);
+	const props = {
+		value: effectiveValue,
+		readOnly: tree.editability === "presentation",
+		writeOnly: tree.editability === "input",
+		meta: tree.meta,
+		constraints: tree.constraints,
+		path,
+		tree,
+		renderChild
+	};
+	if (tree.examples !== void 0) props.examples = tree.examples;
+	return renderFn(props);
 }
 //#endregion
 export { renderToHtml };

package/dist/html/renderToHtmlStream.d.mts

@@ -1,5 +1,5 @@
 import { T as SchemaMeta } from "../types-D_5ST7SS.mjs";
-import { o as HtmlResolver } from "../renderer-DXo-rXHJ.mjs";
+import { o as HtmlResolver } from "../renderer-BQqiXUYP.mjs";
 
 //#region src/html/renderToHtmlStream.d.ts
 interface StreamRenderOptions {

package/dist/html/renderers.d.mts

@@ -1,5 +1,5 @@
 import { M as WalkedField } from "../types-D_5ST7SS.mjs";
-import { o as HtmlResolver } from "../renderer-DXo-rXHJ.mjs";
+import { o as HtmlResolver } from "../renderer-BQqiXUYP.mjs";
 
 //#region src/html/renderers.d.ts
 declare function dateInputType(format: string | undefined): string | undefined;

package/dist/html/renderers.mjs

@@ -1,3 +1,4 @@
+import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
 import { h, raw, serialize } from "./html.mjs";
 import { ariaDescribedByAttrs, ariaLabelAttrs, ariaReadonlyAttrs, ariaRequiredAttrs, buildHintElement, buildInputId, requiredIndicator } from "./a11y.mjs";
 //#region src/html/renderers.ts
@@ -135,7 +136,8 @@ function renderEnumEditable(props) {
 	const enumValue = typeof props.value === "string" ? props.value : "";
 	const id = fieldId(props.path);
 	const selectedValue = props.writeOnly ? "" : enumValue;
-	const optionNodes = [h("option", { value: "" }, "Select…"), ...(props.enumValues ?? []).map((v) => {
+	const enumValues = props.tree.type === "enum" ? props.tree.enumValues : [];
+	const optionNodes = [h("option", { value: "" }, "Select…"), ...enumValues.map((v) => {
 		const display = v === null ? "null" : typeof v === "string" ? v : String(v);
 		const attrs = { value: display };
 		if (display === selectedValue) attrs.selected = true;
@@ -153,15 +155,13 @@ function renderObjectHtml(props) {
 	return serialize(renderObjectNode(props));
 }
 function renderObjectNode(props) {
-	const fields = props.fields;
-	if (fields === void 0) return "";
+	if (props.tree.type !== "object") return "";
+	const fields = props.tree.fields;
 	const isRecord = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
 	const obj = isRecord(props.value) ? props.value : {};
 	const descriptionText = typeof props.meta.description === "string" ? props.meta.description : void 0;
 	const legend = descriptionText !== void 0 ? h("legend", {}, descriptionText) : void 0;
-	const sortedEntries = Object.entries(fields).sort((a, b) => {
-		return (typeof a[1].meta.order === "number" ? a[1].meta.order : Infinity) - (typeof b[1].meta.order === "number" ? b[1].meta.order : Infinity);
-	}).filter(([, field]) => field.meta.visible !== false);
+	const sortedEntries = sortFieldsByOrder(fields).filter(([, field]) => field.meta.visible !== false);
 	if (props.readOnly) {
 		const children = [];
 		if (legend !== void 0) children.push(legend);
@@ -203,7 +203,7 @@ function renderArrayHtml(props) {
 }
 function renderArrayNode(props) {
 	const arr = Array.isArray(props.value) ? props.value : [];
-	const element = props.element;
+	const element = props.tree.type === "array" ? props.tree.element : void 0;
 	if (element === void 0) return "";
 	const childHtmls = arr.map((item, i) => props.renderChild(element, item, `[${String(i)}]`));
 	if (props.readOnly) return h("ul", { class: "sc-array" }, ...childHtmls.map((childHtml) => h("li", { class: "sc-item" }, raw(childHtml))));
@@ -213,10 +213,10 @@ function renderRecordHtml(props) {
 	return serialize(renderRecordNode(props));
 }
 function renderRecordNode(props) {
+	if (props.tree.type !== "record") return "";
 	const isRecord = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
 	const obj = isRecord(props.value) ? props.value : {};
-	const valueType = props.valueType;
-	if (valueType === void 0) return "";
+	const valueType = props.tree.valueType;
 	const attrs = {
 		class: "sc-record",
 		role: "group"
@@ -238,12 +238,13 @@ function renderRecordNode(props) {
 	return h("div", attrs, ...children);
 }
 function renderLiteralHtml(props) {
-	const values = props.literalValues;
-	if (values === void 0 || values.length === 0) return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
+	if (props.tree.type !== "literal") return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
+	const values = props.tree.literalValues;
+	if (values.length === 0) return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
 	return serialize(h("span", { class: "sc-value" }, values.map((v) => v === null ? "null" : String(v)).join(", ")));
 }
 function renderUnionHtml(props) {
-	const options = props.options;
+	const options = props.tree.type === "union" || props.tree.type === "discriminatedUnion" ? props.tree.options : void 0;
 	if (options === void 0 || options.length === 0) {
 		if (props.value === void 0 || props.value === null) return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
 		return serialize(h("span", { class: "sc-value" }, JSON.stringify(props.value)));
@@ -255,8 +256,8 @@ function renderUnionHtml(props) {
 	return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
 }
 function renderDiscriminatedUnionHtml(props) {
-	const options = props.options;
-	const discriminator = props.discriminator;
+	const options = props.tree.type === "discriminatedUnion" ? props.tree.options : void 0;
+	const discriminator = props.tree.type === "discriminatedUnion" ? props.tree.discriminator : void 0;
 	if (options === void 0 || options.length === 0) {
 		if (props.value === void 0 || props.value === null) return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
 		return serialize(h("span", { class: "sc-value" }, JSON.stringify(props.value)));
@@ -285,7 +286,9 @@ function renderDiscriminatedUnionHtml(props) {
 		if (activeOption !== void 0) return props.renderChild(activeOption, props.value);
 		return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
 	}
-	const panelId = `sc-${props.path}-panel`;
+	const baseId = fieldId(props.path);
+	const panelId = `${baseId}-panel`;
+	const tabId = (i) => `${baseId}-tab-${String(i)}`;
 	const children = [h("div", {
 		role: "tablist",
 		class: "sc-tabs",
@@ -295,7 +298,7 @@ function renderDiscriminatedUnionHtml(props) {
 			type: "button",
 			role: "tab",
 			class: i === activeIndex ? "sc-tab sc-tab--active" : "sc-tab",
-			id: `sc-${props.path}-tab-${String(i)}`,
+			id: tabId(i),
 			"aria-selected": i === activeIndex ? "true" : void 0,
 			"aria-controls": panelId,
 			tabindex: i === activeIndex ? "0" : "-1"
@@ -306,7 +309,7 @@ function renderDiscriminatedUnionHtml(props) {
 		children.push(h("div", {
 			role: "tabpanel",
 			id: panelId,
-			"aria-labelledby": `sc-${props.path}-tab-${String(activeIndex)}`
+			"aria-labelledby": tabId(activeIndex)
 		}, raw(childHtml)));
 	}
 	return serialize(h("div", { class: "sc-discriminated-union" }, ...children));
@@ -331,7 +334,7 @@ function renderFileHtml(props) {
 	return serialize(h("input", attrs));
 }
 function renderRecursiveHtml(props) {
-	const refTarget = props.refTarget ?? "";
+	const refTarget = props.tree.type === "recursive" ? props.tree.refTarget : "";
 	return serialize(h("fieldset", { class: "sc-recursive" }, `↻ ${typeof props.meta.description === "string" ? props.meta.description : refTarget} (recursive)`));
 }
 function renderUnknownHtml(props) {
@@ -350,9 +353,9 @@ function renderUnknownHtml(props) {
 	return serialize(h("input", attrs));
 }
 function renderTupleHtml(props) {
+	if (props.tree.type !== "tuple") return renderUnknownHtml(props);
 	const arr = Array.isArray(props.value) ? props.value : [];
-	const prefixItems = props.prefixItems;
-	if (prefixItems === void 0) return renderUnknownHtml(props);
+	const prefixItems = props.tree.prefixItems;
 	const children = [];
 	for (let i = 0; i < prefixItems.length; i++) {
 		const itemValue = arr[i];
@@ -365,14 +368,42 @@ function renderTupleHtml(props) {
 }
 function renderConditionalHtml(props) {
 	const children = [];
-	if (props.ifClause !== void 0) children.push(h("div", { class: "sc-conditional-if" }, raw("if: ...")));
-	if (props.thenClause !== void 0) children.push(h("div", { class: "sc-conditional-then" }, raw("then: ...")));
-	if (props.elseClause !== void 0) children.push(h("div", { class: "sc-conditional-else" }, raw("else: ...")));
+	if (props.tree.type === "conditional") {
+		children.push(h("div", { class: "sc-conditional-if" }, raw("if: ...")));
+		if (props.tree.thenClause !== void 0) children.push(h("div", { class: "sc-conditional-then" }, raw("then: ...")));
+		if (props.tree.elseClause !== void 0) children.push(h("div", { class: "sc-conditional-else" }, raw("else: ...")));
+	}
 	return serialize(h("div", { class: "sc-conditional" }, ...children));
 }
 function renderNegationHtml(props) {
 	return serialize(h("div", { class: "sc-negation" }, raw("not: ...")));
 }
+/**
+* Render a null field — `z.null()` or `{ type: "null" }`.
+*
+* The only valid value is `null`, so render an em-dash placeholder.
+*/
+function renderNullHtml(props) {
+	return serialize(h("span", {
+		class: "sc-value sc-value--empty",
+		id: fieldId(props.path),
+		...ariaReadonlyAttrs()
+	}, "—"));
+}
+/**
+* Render a never field — `z.never()` or a `false` schema.
+*
+* `never` indicates a position that cannot hold any value. Render a
+* visible placeholder rather than throwing because some valid schemas
+* intentionally contain `never` branches.
+*/
+function renderNeverHtml(props) {
+	return serialize(h("span", {
+		class: "sc-value sc-never",
+		id: fieldId(props.path),
+		...ariaReadonlyAttrs()
+	}, h("em", {}, "never matches")));
+}
 function matchUnionOption(options, value) {
 	if (typeof value === "string") return options.find((o) => o.type === "string" || o.type === "enum");
 	if (typeof value === "number") return options.find((o) => o.type === "number");
@@ -384,6 +415,7 @@ const defaultHtmlResolver = {
 	string: renderStringHtml,
 	number: renderNumberHtml,
 	boolean: renderBooleanHtml,
+	null: renderNullHtml,
 	enum: renderEnumHtml,
 	object: renderObjectHtml,
 	array: renderArrayHtml,
@@ -396,6 +428,7 @@ const defaultHtmlResolver = {
 	negation: renderNegationHtml,
 	recursive: renderRecursiveHtml,
 	file: renderFileHtml,
+	never: renderNeverHtml,
 	unknown: renderUnknownHtml
 };
 //#endregion

package/dist/html/streamRenderers.d.mts

@@ -1,5 +1,5 @@
 import { M as WalkedField } from "../types-D_5ST7SS.mjs";
-import { o as HtmlResolver } from "../renderer-DXo-rXHJ.mjs";
+import { o as HtmlResolver } from "../renderer-BQqiXUYP.mjs";
 import { HtmlElement } from "./html.mjs";
 
 //#region src/html/streamRenderers.d.ts

package/dist/html/streamRenderers.mjs

@@ -14,27 +14,16 @@ function yieldClose(el) {
 }
 function renderLeaf(tree, value, mergedResolver, path) {
 	const renderFn = getHtmlRenderFn(tree.type, mergedResolver);
-	if (renderFn !== void 0) {
-		const props = {
-			value,
-			readOnly: tree.editability === "presentation",
-			writeOnly: tree.editability === "input",
-			meta: tree.meta,
-			constraints: tree.constraints,
-			path,
-			tree,
-			renderChild: () => ""
-		};
-		if (tree.type === "enum") props.enumValues = tree.enumValues;
-		if (tree.type === "literal") props.literalValues = tree.literalValues;
-		if (tree.type === "array" && tree.element !== void 0) props.element = tree.element;
-		if (tree.type === "object") props.fields = tree.fields;
-		if (tree.type === "union") props.options = tree.options;
-		if (tree.type === "discriminatedUnion") props.discriminator = tree.discriminator;
-		if (tree.type === "record") props.keyType = tree.keyType;
-		if (tree.type === "record") props.valueType = tree.valueType;
-		return renderFn(props);
-	}
+	if (renderFn !== void 0) return renderFn({
+		value,
+		readOnly: tree.editability === "presentation",
+		writeOnly: tree.editability === "input",
+		meta: tree.meta,
+		constraints: tree.constraints,
+		path,
+		tree,
+		renderChild: () => ""
+	});
 	if (value === void 0 || value === null) return serialize(h("span", { class: "sc-value sc-value--empty" }, "—"));
 	return serialize(h("span", { class: "sc-value" }, typeof value === "string" ? value : JSON.stringify(value)));
 }