schema-components 1.22.0 → 1.24.0

package/dist/react/headlessRenderers.mjs

@@ -1,6 +1,12 @@
 import { isObject } from "../core/guards.mjs";
+import { dateInputType } from "../core/formats.mjs";
 import { isSafeHyperlink, isSafeMailtoAddress } from "../core/uri.mjs";
+import { SC_CLASSES } from "../core/cssClasses.mjs";
 import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
+import { fieldDomId, panelIdFor, tabIdFor } from "../core/idPath.mjs";
+import { matchUnionOption, resolveDiscriminatedActive } from "../core/unionMatch.mjs";
+import { displayJsonValue } from "../core/walkBuilders.mjs";
+import { buildAriaAttrs } from "./a11y.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { isValidElement, useCallback, useEffect, useRef } from "react";
 //#region src/react/headlessRenderers.tsx
@@ -41,26 +47,19 @@ function formatTime(value) {
 	if (isNaN(date.getTime())) return void 0;
 	return date.toLocaleTimeString();
 }
-function dateInputType(format) {
-	if (format === "date") return "date";
-	if (format === "time") return "time";
-	if (format === "date-time" || format === "datetime") return "datetime-local";
-}
 /**
 * Build a stable, unique input ID from the path.
-* Used for `htmlFor`/`id` association between labels and inputs.
 *
-* Throws on an empty path: the previous "sc-field" fallback caused every
-* input across a form to share the same id, breaking label-input pairing
-* and screen reader navigation. Callers must thread a non-empty path
-* (see `ROOT_PATH` and `joinPath` in `SchemaComponent.tsx`).
+* Re-exported alias for {@link fieldDomId} so external themes (shadcn,
+* MUI, mantine, radix) keep importing `inputId` from the React entry
+* point. Both the React and HTML renderers must derive the same id from
+* the same path — `fieldDomId` in `core/idPath.ts` is the single
+* source-of-truth.
 *
-* Dots and bracket indices in paths are converted to hyphens to keep the
-* id valid as a CSS selector and predictable in test queries.
+* Throws on an empty path; see `fieldDomId` for the rationale.
 */
 function inputId(path) {
-	if (path.length === 0) throw new Error("inputId requires a non-empty path. Pass ROOT_PATH for the root field and use renderChild's pathSuffix to derive child paths.");
-	return `sc-${path.replace(/[.[\]]+/g, "-").replace(/-+$/g, "")}`;
+	return fieldDomId(path);
 }
 function renderString(props) {
 	const id = inputId(props.path);
@@ -107,8 +106,7 @@ function renderString(props) {
 	}
 	const strValue = typeof props.value === "string" ? props.value : "";
 	const dateType = dateInputType(props.constraints.format);
-	const ariaAttrs = {};
-	if (props.tree.isOptional === false) ariaAttrs["aria-required"] = "true";
+	const ariaAttrs = buildAriaAttrs(props.tree);
 	if (dateType !== void 0) return /* @__PURE__ */ jsx("input", {
 		id,
 		type: dateType,
@@ -131,7 +129,7 @@ function renderString(props) {
 				value: "",
 				children: ["Select", "…"]
 			}), enumValues.map((v) => {
-				const display = v === null ? "null" : typeof v === "string" ? v : String(v);
+				const display = displayJsonValue(v);
 				return /* @__PURE__ */ jsx("option", {
 					value: display,
 					children: display
@@ -167,8 +165,7 @@ function renderNumber(props) {
 		});
 	}
 	const numValue = typeof props.value === "number" ? props.value : "";
-	const ariaAttrs = {};
-	if (props.tree.isOptional === false) ariaAttrs["aria-required"] = "true";
+	const ariaAttrs = buildAriaAttrs(props.tree);
 	return /* @__PURE__ */ jsx("input", {
 		id,
 		type: "number",
@@ -195,9 +192,7 @@ function renderBoolean(props) {
 			children: props.value ? "Yes" : "No"
 		});
 	}
-	const ariaAttrs = {};
-	if (props.tree.isOptional === false) ariaAttrs["aria-required"] = "true";
-	if (typeof props.meta.description === "string") ariaAttrs["aria-label"] = props.meta.description;
+	const ariaAttrs = buildAriaAttrs(props.tree, props.meta.description);
 	return /* @__PURE__ */ jsx("input", {
 		id,
 		type: "checkbox",
@@ -216,8 +211,7 @@ function renderEnum(props) {
 		"aria-readonly": "true",
 		children: enumValue || "—"
 	});
-	const ariaAttrs = {};
-	if (props.tree.isOptional === false) ariaAttrs["aria-required"] = "true";
+	const ariaAttrs = buildAriaAttrs(props.tree);
 	const enumValues = props.tree.type === "enum" ? props.tree.enumValues : [];
 	return /* @__PURE__ */ jsxs("select", {
 		id,
@@ -230,7 +224,7 @@ function renderEnum(props) {
 			value: "",
 			children: ["Select", "…"]
 		}), enumValues.map((v) => {
-			const display = v === null ? "null" : typeof v === "string" ? v : String(v);
+			const display = displayJsonValue(v);
 			return /* @__PURE__ */ jsx("option", {
 				value: display,
 				children: display
@@ -315,7 +309,7 @@ function renderRecord(props) {
 		});
 		return /* @__PURE__ */ jsx("div", {
 			role: "group",
-			"aria-label": props.meta.description ?? "Record",
+			"aria-label": typeof props.meta.description === "string" ? props.meta.description : void 0,
 			children: entries.map(([key, value]) => {
 				return /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("label", {
 					htmlFor: inputId(`${props.path}.${key}`),
@@ -415,32 +409,16 @@ function renderUnion(props) {
 	return /* @__PURE__ */ jsx("span", { children: "—" });
 }
 function renderDiscriminatedUnion(props) {
-	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.tree.type !== "discriminatedUnion") {
 		if (props.value === void 0 || props.value === null) return /* @__PURE__ */ jsx("span", { children: "—" });
 		return /* @__PURE__ */ jsx("span", { children: JSON.stringify(props.value) });
 	}
-	const obj = isObject(props.value) ? props.value : {};
-	const discKey = discriminator ?? "";
-	const currentDiscriminatorValue = typeof obj[discKey] === "string" ? obj[discKey] : void 0;
-	const optionLabels = options.map((opt) => {
-		if (opt.type === "object") {
-			const discriminatorField = opt.fields[discKey];
-			if (discriminatorField?.type === "literal") {
-				const constVal = discriminatorField.literalValues[0];
-				if (typeof constVal === "string") return constVal;
-			}
-		}
-		return typeof opt.meta.title === "string" ? opt.meta.title : opt.type;
-	});
-	let activeIndex = 0;
-	if (currentDiscriminatorValue !== void 0) {
-		const found = optionLabels.indexOf(currentDiscriminatorValue);
-		if (found !== -1) activeIndex = found;
+	const { options, discriminator: discKey } = props.tree;
+	if (options.length === 0) {
+		if (props.value === void 0 || props.value === null) return /* @__PURE__ */ jsx("span", { children: "—" });
+		return /* @__PURE__ */ jsx("span", { children: JSON.stringify(props.value) });
 	}
-	const activeOption = options[activeIndex];
-	const panelId = inputId(props.path);
+	const { optionLabels, activeIndex, activeOption } = resolveDiscriminatedActive(options, discKey, isObject(props.value) ? props.value : void 0);
 	if (props.readOnly) {
 		if (activeOption !== void 0) return toReactNode(props.renderChild(activeOption, props.value, props.onChange));
 		return /* @__PURE__ */ jsx("span", { children: "—" });
@@ -449,7 +427,7 @@ function renderDiscriminatedUnion(props) {
 		options,
 		optionLabels,
 		activeIndex,
-		panelId,
+		path: props.path,
 		discKey,
 		props
 	});
@@ -479,7 +457,8 @@ function discriminatedUnionValueForTab(optionLabels, discKey, newIndex) {
 * "Automatic activation" means each arrow key both moves focus and
 * activates the new tab in one step — selection and focus stay aligned.
 */
-function DiscriminatedUnionTabs({ options, optionLabels, activeIndex, panelId, discKey, props }) {
+function DiscriminatedUnionTabs({ options, optionLabels, activeIndex, path, discKey, props }) {
+	const panelId = panelIdFor(path);
 	const tabRefs = useRef([]);
 	const pendingFocusRef = useRef(false);
 	const handleTabChange = useCallback((newIndex) => {
@@ -530,9 +509,9 @@ function DiscriminatedUnionTabs({ options, optionLabels, activeIndex, panelId, d
 			},
 			type: "button",
 			role: "tab",
-			id: `${panelId}-tab-${String(i)}`,
+			id: tabIdFor(path, i),
 			"aria-selected": i === activeIndex ? "true" : void 0,
-			"aria-controls": `${panelId}-panel`,
+			"aria-controls": panelId,
 			tabIndex: i === activeIndex ? 0 : -1,
 			onClick: () => {
 				handleTabChange(i);
@@ -549,8 +528,8 @@ function DiscriminatedUnionTabs({ options, optionLabels, activeIndex, panelId, d
 		}, String(i)))
 	}), /* @__PURE__ */ jsx("div", {
 		role: "tabpanel",
-		id: `${panelId}-panel`,
-		"aria-labelledby": `${panelId}-tab-${String(activeIndex)}`,
+		id: panelId,
+		"aria-labelledby": tabIdFor(path, activeIndex),
 		children: activeOption !== void 0 && toReactNode(props.renderChild(activeOption, props.value, props.onChange))
 	})] });
 }
@@ -562,9 +541,6 @@ function renderFile(props) {
 		"aria-readonly": "true",
 		children: "File field"
 	});
-	const ariaAttrs = {};
-	if (props.tree.isOptional === false) ariaAttrs["aria-required"] = "true";
-	if (typeof props.meta.description === "string") ariaAttrs["aria-label"] = props.meta.description;
 	return /* @__PURE__ */ jsx("input", {
 		id,
 		type: "file",
@@ -573,7 +549,7 @@ function renderFile(props) {
 			const file = e.target.files?.[0];
 			if (file !== void 0) props.onChange(file);
 		},
-		...ariaAttrs
+		...buildAriaAttrs(props.tree, props.meta.description)
 	});
 }
 /**
@@ -595,7 +571,7 @@ function renderLiteral(props) {
 	return /* @__PURE__ */ jsx("span", {
 		id,
 		"aria-readonly": "true",
-		children: values.map((v) => v === null ? "null" : String(v)).join(", ")
+		children: values.map((v) => displayJsonValue(v)).join(", ")
 	});
 }
 /**
@@ -624,7 +600,7 @@ function renderNever(props) {
 	return /* @__PURE__ */ jsx("span", {
 		id: inputId(props.path),
 		"aria-readonly": "true",
-		className: "sc-never",
+		className: SC_CLASSES.never,
 		children: /* @__PURE__ */ jsx("em", { children: "never matches" })
 	});
 }
@@ -678,10 +654,10 @@ function renderConditional(props) {
 	if (props.tree.type !== "conditional") return null;
 	const { ifClause, thenClause, elseClause } = props.tree;
 	return /* @__PURE__ */ jsxs("fieldset", {
-		className: "sc-conditional",
+		className: SC_CLASSES.conditional,
 		children: [
 			/* @__PURE__ */ jsxs("div", {
-				className: "sc-conditional-if",
+				className: SC_CLASSES.conditionalIf,
 				children: [
 					/* @__PURE__ */ jsx("strong", { children: "if:" }),
 					" ",
@@ -689,7 +665,7 @@ function renderConditional(props) {
 				]
 			}),
 			thenClause !== void 0 && /* @__PURE__ */ jsxs("div", {
-				className: "sc-conditional-then",
+				className: SC_CLASSES.conditionalThen,
 				children: [
 					/* @__PURE__ */ jsx("strong", { children: "then:" }),
 					" ",
@@ -697,7 +673,7 @@ function renderConditional(props) {
 				]
 			}),
 			elseClause !== void 0 && /* @__PURE__ */ jsxs("div", {
-				className: "sc-conditional-else",
+				className: SC_CLASSES.conditionalElse,
 				children: [
 					/* @__PURE__ */ jsx("strong", { children: "else:" }),
 					" ",
@@ -717,7 +693,7 @@ function renderConditional(props) {
 function renderNegation(props) {
 	if (props.tree.type !== "negation") return null;
 	return /* @__PURE__ */ jsxs("fieldset", {
-		className: "sc-negation",
+		className: SC_CLASSES.negation,
 		children: [
 			/* @__PURE__ */ jsx("strong", { children: "Must NOT match:" }),
 			" ",
@@ -749,12 +725,5 @@ function renderUnknown(props) {
 		}
 	});
 }
-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");
-	if (typeof value === "boolean") return options.find((o) => o.type === "boolean");
-	if (Array.isArray(value)) return options.find((o) => o.type === "array");
-	if (typeof value === "object" && value !== null) return options.find((o) => o.type === "object");
-}
 //#endregion
 export { defaultRecordValue, discriminatedUnionValueForTab, inputId, nextRecordKey, renameRecordKey, renderArray, renderBoolean, renderConditional, renderDiscriminatedUnion, renderEnum, renderFile, renderLiteral, renderNegation, renderNever, renderNull, renderNumber, renderObject, renderRecord, renderString, renderTuple, renderUnion, renderUnknown, toReactNode };

package/dist/{ref-D-_JBZkF.d.mts → ref-DCDuswPe.d.mts}

@@ -1,6 +1,13 @@
-import { i as DiagnosticsOptions } from "./diagnostics-D0QCYGv0.mjs";
+import { i as DiagnosticsOptions } from "./diagnostics-Cbwak-ZX.mjs";
 
 //#region src/core/ref.d.ts
+/**
+ * The canonical recursive `$anchor` name synthesised by the Draft
+ * 2019-09 `$recursiveAnchor: true` rewrite. Re-exported here so the
+ * collision check in {@link findAnchor} stays aligned with the
+ * rewriter in `core/normalise.ts`.
+ */
+declare const RECURSIVE_ANCHOR_SENTINEL = "__recursive__";
 /**
  * Resolver function for external $ref URIs.
  * Called with the URI portion (everything before `#`) of an external ref.
@@ -33,17 +40,45 @@ declare function resolveRef(schema: Record<string, unknown>, rootDocument: Recor
 /**
  * Dereference a JSON Pointer fragment (`#/path/to/schema`) or an
  * `$anchor` (`#SomeName`) against a root document.
+ *
+ * Returns the resolved sub-schema, which may be a JSON object or — per
+ * Draft 06+ — a boolean (`true` for the always-valid schema, `false`
+ * for the never-valid schema). Returns `undefined` when the pointer or
+ * anchor cannot be resolved.
+ *
+ * JSON Pointer segments are percent-decoded per RFC 6901 §6 before the
+ * `~1`/`~0` token expansion; this allows pointers such as
+ * `#/paths/~1pets%20store` to resolve a path containing a literal space.
  */
-declare function dereference(ref: string, root: Record<string, unknown>): Record<string, unknown> | undefined;
+declare function dereference(ref: string, root: Record<string, unknown>): Record<string, unknown> | boolean | undefined;
 /**
  * Recursively scan a schema document for a `$anchor` matching the given name.
  * Returns the schema object containing the anchor, or undefined.
  *
+ * Per JSON Schema 2020-12 §8.2, `$anchor` is scoped to the resource
+ * defined by the nearest enclosing `$id`. A bare DFS would happily
+ * cross resource boundaries and resolve to an anchor declared in an
+ * unrelated sub-resource — that violates the spec and produces wrong
+ * walker input when two sub-schemas use the same anchor name within
+ * their own `$id` scope.
+ *
+ * The walk skips into any sub-tree that introduces a new `$id` value:
+ * such a sub-tree is a separate resource and its `$anchor`s belong to
+ * that resource, not the caller's. Anchors declared at the same `$id`
+ * scope (or in nested sub-schemas without their own `$id`) remain
+ * reachable.
+ *
  * The optional `visited` set guards against shared object references and
  * cycles introduced by the OpenAPI bundler's `structuredClone`-based
  * inlining of external refs. Without it a recursive document would stack
  * overflow before reaching the matching anchor.
+ *
+ * When `crossResourceBoundary` is `true` the walker is currently
+ * recursing into a sub-tree that introduced its own `$id`; we still
+ * recurse so a nested `$anchor` declared inside that same sub-resource
+ * is reachable from the caller that owns that resource, but we skip
+ * further nested resources for the same reason as above.
  */
 declare function findAnchor(node: unknown, anchorName: string, visited?: WeakSet<object>): Record<string, unknown> | undefined;
 //#endregion
-export { findAnchor as a, dereference as i, RefOptions as n, resolveRef as o, countDistinctRefs as r, ExternalResolver as t };
+export { dereference as a, countDistinctRefs as i, RECURSIVE_ANCHOR_SENTINEL as n, findAnchor as o, RefOptions as r, resolveRef as s, ExternalResolver as t };

package/dist/{renderer-BaRlQIuN.d.mts → renderer-CXJ8y0qw.d.mts}

@@ -1,4 +1,4 @@
-import { E as StringConstraints, f as FileConstraints, j as WalkedField, t as ArrayConstraints, w as SchemaMeta, x as ObjectConstraints, y as NumberConstraints } from "./types-BrRMV0en.mjs";
+import { E as StringConstraints, f as FileConstraints, j as WalkedField, t as ArrayConstraints, w as SchemaMeta, x as ObjectConstraints, y as NumberConstraints } from "./types-BTB73MB8.mjs";
 
 //#region src/core/renderer.d.ts
 /**

package/dist/themes/mantine.d.mts

@@ -1,4 +1,4 @@
-import { r as ComponentResolver } from "../renderer-BaRlQIuN.mjs";
+import { r as ComponentResolver } from "../renderer-CXJ8y0qw.mjs";
 
 //#region src/themes/mantine.d.ts
 /**

package/dist/themes/mui.d.mts

@@ -1,4 +1,4 @@
-import { r as ComponentResolver } from "../renderer-BaRlQIuN.mjs";
+import { r as ComponentResolver } from "../renderer-CXJ8y0qw.mjs";
 
 //#region src/themes/mui.d.ts
 /**

package/dist/themes/radix.d.mts

@@ -1,4 +1,4 @@
-import { r as ComponentResolver } from "../renderer-BaRlQIuN.mjs";
+import { r as ComponentResolver } from "../renderer-CXJ8y0qw.mjs";
 
 //#region src/themes/radix.d.ts
 /**

package/dist/themes/shadcn.d.mts

@@ -1,4 +1,4 @@
-import { r as ComponentResolver } from "../renderer-BaRlQIuN.mjs";
+import { r as ComponentResolver } from "../renderer-CXJ8y0qw.mjs";
 
 //#region src/themes/shadcn.d.ts
 declare const shadcnResolver: ComponentResolver;

package/dist/themes/shadcn.mjs

@@ -1,5 +1,6 @@
 import { toRecord } from "../core/guards.mjs";
 import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
+import { displayJsonValue } from "../core/walkBuilders.mjs";
 import { inputId, toReactNode } from "../react/headlessRenderers.mjs";
 import { headlessResolver } from "../react/headless.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -160,7 +161,7 @@ function renderEnumInput(props) {
 			value: "",
 			children: ["Select", "…"]
 		}), props.tree.type === "enum" ? props.tree.enumValues.map((v) => {
-			const display = v === null ? "null" : typeof v === "string" ? v : String(v);
+			const display = displayJsonValue(v);
 			return /* @__PURE__ */ jsx("option", {
 				value: display,
 				children: display

package/dist/{types-BrRMV0en.d.mts → types-BTB73MB8.d.mts}

@@ -86,8 +86,6 @@ interface ArrayConstraints {
   uniqueItems?: boolean;
   minContains?: number;
   maxContains?: number;
-  /** Constraint schema for unevaluated items. */
-  unevaluatedItems?: Record<string, unknown>;
 }
 /** Constraints that apply to object schemas. */
 interface ObjectConstraints {
@@ -138,12 +136,24 @@ interface NullField extends FieldBase {
 interface EnumField extends FieldBase {
   type: "enum";
   constraints: Record<string, never>;
-  enumValues: (string | number | boolean | null)[];
+  /**
+   * Enum values from JSON Schema `enum`. Per Draft 2020-12 §6.1.2,
+   * `enum` accepts an array of arbitrary JSON values — not only
+   * primitives. Object and array values are preserved verbatim.
+   */
+  enumValues: unknown[];
 }
 interface LiteralField extends FieldBase {
   type: "literal";
   constraints: Record<string, never>;
-  literalValues: (string | number | boolean | null)[];
+  /**
+   * Const values from JSON Schema `const`. Per Draft 2020-12 §6.1.3,
+   * `const` accepts any JSON value (object or array included), not
+   * only primitives. The walker emits a single-element array because
+   * `const` is scalar by definition; the field shape mirrors
+   * `EnumField` for renderer symmetry.
+   */
+  literalValues: unknown[];
 }
 interface ObjectField extends FieldBase {
   type: "object";
@@ -182,6 +192,13 @@ interface ArrayField extends FieldBase {
   contains?: WalkedField;
   /** Walked schema for unevaluated items. */
   unevaluatedItems?: WalkedField;
+  /**
+   * Whether `unevaluatedItems` is explicitly `false` (no extras
+   * permitted beyond the items evaluated by `items`/`prefixItems`/
+   * `contains`). Parallel to `additionalPropertiesClosed` and
+   * `unevaluatedPropertiesClosed` on `ObjectField`.
+   */
+  unevaluatedItemsClosed?: boolean;
 }
 interface TupleField extends FieldBase {
   type: "tuple";
@@ -200,6 +217,17 @@ interface TupleField extends FieldBase {
    * element schemas to require the presence of a specific element.
    */
   contains?: WalkedField;
+  /**
+   * Walked schema for `unevaluatedItems` adjacent to `prefixItems`.
+   * Permits additional items only when they satisfy this schema.
+   */
+  unevaluatedItems?: WalkedField;
+  /**
+   * Whether `unevaluatedItems` is explicitly `false` on a tuple. With
+   * `prefixItems` declared, this forbids any items beyond the prefix
+   * length.
+   */
+  unevaluatedItemsClosed?: boolean;
 }
 interface RecordField extends FieldBase {
   type: "record";

package/dist/{version-D2jfdX6E.d.mts → version-BFTVLsdb.d.mts}

@@ -56,7 +56,13 @@ interface OpenApiVersionInfo {
 }
 /**
  * Detect the OpenAPI/Swagger version from a document.
- * Returns `undefined` for documents that are not OpenAPI or Swagger.
+ *
+ * Returns `undefined` when the document declares neither `swagger` nor
+ * `openapi` strings, or when the declared version string is malformed
+ * (missing parts or non-numeric segments). `Number("abc")` yields `NaN`,
+ * which `parts[i] ?? default` does NOT replace — nullish coalescing only
+ * substitutes `null`/`undefined` — so any unparseable segment surfaces
+ * as `undefined` rather than a silent fabricated default.
  */
 declare function detectOpenApiVersion(doc: Record<string, unknown>): OpenApiVersionInfo | undefined;
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "schema-components",
-    "version": "1.22.0",
+    "version": "1.24.0",
     "description": "React components that render UI from Zod schemas, JSON Schema, and OpenAPI documents",
     "type": "module",
     "exports": {