schema-components 1.17.0 → 1.18.1

package/dist/react/SchemaComponent.mjs

@@ -2,7 +2,7 @@
 import { isObject, toRecordOrUndefined } from "../core/guards.mjs";
 import { SchemaFieldError, SchemaNormalisationError, SchemaRenderError } from "../core/errors.mjs";
 import { normaliseSchema } from "../core/adapter.mjs";
-import { getRenderFunction, mergeResolvers } from "../core/renderer.mjs";
+import { buildRenderProps, getRenderFunction, mergeResolvers } from "../core/renderer.mjs";
 import { walk } from "../core/walker.mjs";
 import { headlessResolver } from "./headless.mjs";
 import { resolvePath, resolveValue, setNestedValue } from "./fieldPath.mjs";
@@ -203,35 +203,6 @@ function renderField(tree, value, onChange, userResolver, renderChild, path, ins
 	if (value === void 0 || value === null) return /* @__PURE__ */ jsx("span", { children: "—" });
 	return /* @__PURE__ */ jsx("span", { children: typeof value === "string" ? value : JSON.stringify(value) });
 }
-function buildRenderProps(tree, value, onChange, renderChild, path) {
-	const props = {
-		value,
-		onChange,
-		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 === "recursive") props.refTarget = tree.refTarget;
-	if (tree.type === "literal") props.literalValues = tree.literalValues;
-	if (tree.examples !== void 0) props.examples = tree.examples;
-	return props;
-}
 function SchemaField({ path, schema: schemaInput, ref: refInput, value, onChange, meta: fieldMeta, validate, onValidationError }) {
 	const userResolver = useContext(UserResolverContext);
 	const contextWidgets = useContext(WidgetsContext);

package/dist/react/SchemaView.d.mts

@@ -1,6 +1,6 @@
 import { T as SchemaMeta } from "../types-D_5ST7SS.mjs";
-import { t as Diagnostic } from "../diagnostics-DzbZmcLI.mjs";
-import { r as ComponentResolver } from "../renderer-B3s8o2B8.mjs";
+import { t as Diagnostic } from "../diagnostics-BYk63jsC.mjs";
+import { r as ComponentResolver } from "../renderer-BAGoX4AK.mjs";
 import { WidgetMap } from "./SchemaComponent.mjs";
 import { ReactNode } from "react";
 
@@ -38,7 +38,8 @@ interface SchemaViewProps {
   idPrefix?: string;
 }
 /**
- * Server-safe schema renderer — no hooks, no context, no state.
+ * Server-safe schema renderer — no context and no state. The only hook
+ * called is `useId()`, which is RSC-safe.
  *
  * Always renders in read-only mode. For editable forms, use
  * `<SchemaComponent>` with `"use client"`.

package/dist/react/SchemaView.mjs

@@ -1,6 +1,6 @@
 import { SchemaNormalisationError, SchemaRenderError } from "../core/errors.mjs";
 import { normaliseSchema } from "../core/adapter.mjs";
-import { getRenderFunction, mergeResolvers } from "../core/renderer.mjs";
+import { buildRenderProps, getRenderFunction, mergeResolvers } from "../core/renderer.mjs";
 import { walk } from "../core/walker.mjs";
 import { headlessResolver } from "./headless.mjs";
 import { joinPath, sanitisePrefix } from "./SchemaComponent.mjs";
@@ -10,9 +10,12 @@ import { createElement, isValidElement, useId } from "react";
 /**
 * React Server Component for read-only schema rendering.
 *
-* This component has zero hooks — no `useContext`, no `useMemo`,
-* no `useCallback`. It can run in a React Server Component environment
-* without the `"use client"` directive.
+* Uses no React state, context, or effects — no `useContext`, `useMemo`,
+* `useCallback`, `useState`, or `useEffect`. The single hook called is
+* `useId()`, which is one of the few hooks permitted inside a React
+* Server Component (it is RSC-safe by design) and is used solely to
+* derive a stable per-instance `idPrefix`. The component therefore runs
+* in an RSC environment without the `"use client"` directive.
 *
 * **Read-only only.** For interactive forms with `onChange`, use
 * `<SchemaComponent>` (which requires `"use client"`).
@@ -31,9 +34,9 @@ import { createElement, isValidElement, useId } from "react";
 * Server Components cannot use React context, so the resolver
 * is passed explicitly.
 */
-function noop() {}
 /**
-* Server-safe schema renderer — no hooks, no context, no state.
+* Server-safe schema renderer — no context and no state. The only hook
+* called is `useId()`, which is RSC-safe.
 *
 * Always renders in read-only mode. For editable forms, use
 * `<SchemaComponent>` with `"use client"`.
@@ -81,22 +84,12 @@ function SchemaView({ schema: schemaInput, ref: refInput, value, fields, meta: c
 }
 function renderFieldServer(tree, value, resolver, renderChild, path, widgets) {
 	if (path.length === 0) throw new Error("renderFieldServer requires a non-empty path. Pass ROOT_PATH at the root and join children via joinPath().");
+	const adaptedRenderChild = (childTree, childValue, _childOnChange, pathSuffix) => renderChild(childTree, childValue, pathSuffix);
 	const componentHint = tree.meta.component;
 	if (typeof componentHint === "string") {
 		const widget = widgets?.get(componentHint);
 		if (widget !== void 0) {
-			const wrapRenderChild = (childTree, childValue, _childOnChange, pathSuffix) => renderChild(childTree, childValue, pathSuffix);
-			const result = widget({
-				value,
-				onChange: noop,
-				readOnly: true,
-				writeOnly: false,
-				meta: tree.meta,
-				constraints: tree.constraints,
-				path,
-				tree,
-				renderChild: wrapRenderChild
-			});
+			const result = widget(buildRenderProps(tree, value, void 0, adaptedRenderChild, path));
 			if (result !== void 0 && result !== null) {
 				if (isValidElement(result)) return result;
 				if (typeof result === "string" || typeof result === "number") return result;
@@ -105,31 +98,7 @@ function renderFieldServer(tree, value, resolver, renderChild, path, widgets) {
 	}
 	const renderFn = getRenderFunction(tree.type, resolver);
 	if (renderFn !== void 0) {
-		const props = {
-			value,
-			onChange: noop,
-			readOnly: true,
-			writeOnly: false,
-			meta: tree.meta,
-			constraints: tree.constraints,
-			path,
-			tree,
-			renderChild: (childTree, childValue, _childOnChange, pathSuffix) => renderChild(childTree, childValue, pathSuffix)
-		};
-		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 === "recursive") props.refTarget = tree.refTarget;
-		if (tree.type === "literal") props.literalValues = tree.literalValues;
+		const props = buildRenderProps(tree, value, void 0, adaptedRenderChild, path);
 		try {
 			const result = renderFn(props);
 			if (result !== void 0 && result !== null) {

package/dist/react/headless.d.mts

@@ -1,4 +1,4 @@
-import { r as ComponentResolver } from "../renderer-B3s8o2B8.mjs";
+import { r as ComponentResolver } from "../renderer-BAGoX4AK.mjs";
 
 //#region src/react/headless.d.ts
 /**

package/dist/react/headlessRenderers.d.mts

@@ -1,5 +1,5 @@
 import { M as WalkedField } from "../types-D_5ST7SS.mjs";
-import { l as RenderProps } from "../renderer-B3s8o2B8.mjs";
+import { l as RenderProps } from "../renderer-BAGoX4AK.mjs";
 import { ReactNode } from "react";
 
 //#region src/react/headlessRenderers.d.ts

package/dist/react/headlessRenderers.mjs

@@ -1,4 +1,5 @@
 import { isObject } from "../core/guards.mjs";
+import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { isValidElement, useCallback, useEffect, useRef } from "react";
 //#region src/react/headlessRenderers.tsx
@@ -128,24 +129,27 @@ function renderString(props) {
 		},
 		...ariaAttrs
 	});
-	if (props.enumValues !== void 0 && props.enumValues.length > 0) return /* @__PURE__ */ jsxs("select", {
-		id,
-		value: strValue,
-		onChange: (e) => {
-			props.onChange(e.target.value);
-		},
-		...ariaAttrs,
-		children: [/* @__PURE__ */ jsxs("option", {
-			value: "",
-			children: ["Select", "…"]
-		}), props.enumValues.map((v) => {
-			const display = v === null ? "null" : typeof v === "string" ? v : String(v);
-			return /* @__PURE__ */ jsx("option", {
-				value: display,
-				children: display
-			}, display);
-		})]
-	});
+	if (props.tree.type === "enum" && props.tree.enumValues.length > 0) {
+		const enumValues = props.tree.enumValues;
+		return /* @__PURE__ */ jsxs("select", {
+			id,
+			value: strValue,
+			onChange: (e) => {
+				props.onChange(e.target.value);
+			},
+			...ariaAttrs,
+			children: [/* @__PURE__ */ jsxs("option", {
+				value: "",
+				children: ["Select", "…"]
+			}), enumValues.map((v) => {
+				const display = v === null ? "null" : typeof v === "string" ? v : String(v);
+				return /* @__PURE__ */ jsx("option", {
+					value: display,
+					children: display
+				}, display);
+			})]
+		});
+	}
 	return /* @__PURE__ */ jsx("input", {
 		id,
 		type: props.constraints.format === "email" ? "email" : props.constraints.format === "uri" ? "url" : "text",
@@ -225,6 +229,7 @@ function renderEnum(props) {
 	});
 	const ariaAttrs = {};
 	if (props.tree.isOptional === false) ariaAttrs["aria-required"] = "true";
+	const enumValues = props.tree.type === "enum" ? props.tree.enumValues : [];
 	return /* @__PURE__ */ jsxs("select", {
 		id,
 		value: props.writeOnly ? "" : enumValue,
@@ -235,7 +240,7 @@ function renderEnum(props) {
 		children: [/* @__PURE__ */ jsxs("option", {
 			value: "",
 			children: ["Select", "…"]
-		}), props.enumValues?.map((v) => {
+		}), enumValues.map((v) => {
 			const display = v === null ? "null" : typeof v === "string" ? v : String(v);
 			return /* @__PURE__ */ jsx("option", {
 				value: display,
@@ -245,12 +250,10 @@ function renderEnum(props) {
 	});
 }
 function renderObject(props) {
+	if (props.tree.type !== "object") return null;
 	const obj = isObject(props.value) ? props.value : {};
-	const fields = props.fields;
-	if (fields === void 0) return null;
-	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);
-	});
+	const fields = props.tree.fields;
+	const sortedEntries = sortFieldsByOrder(fields);
 	return /* @__PURE__ */ jsxs("fieldset", { children: [typeof props.meta.description === "string" && /* @__PURE__ */ jsx("legend", { children: props.meta.description }), sortedEntries.filter(([, field]) => field.meta.visible !== false).map(([key, field]) => {
 		const childValue = obj[key];
 		const childId = inputId(`${props.path}.${key}`);
@@ -312,9 +315,9 @@ function renameRecordKey(obj, oldKey, newKey) {
 	return renamed;
 }
 function renderRecord(props) {
+	if (props.tree.type !== "record") return null;
 	const obj = isObject(props.value) ? props.value : {};
-	const valueType = props.valueType;
-	if (valueType === void 0) return null;
+	const valueType = props.tree.valueType;
 	const entries = Object.entries(obj);
 	if (props.readOnly) {
 		if (entries.length === 0) return /* @__PURE__ */ jsx("span", {
@@ -392,8 +395,9 @@ function renderRecord(props) {
 	});
 }
 function renderArray(props) {
+	if (props.tree.type !== "array") return null;
 	const arr = Array.isArray(props.value) ? props.value : [];
-	const element = props.element;
+	const element = props.tree.element;
 	if (element === void 0) return null;
 	if (arr.length === 0) return null;
 	return /* @__PURE__ */ jsx("div", {
@@ -410,7 +414,7 @@ function renderArray(props) {
 	});
 }
 function renderUnion(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 /* @__PURE__ */ jsx("span", { children: "—" });
 		return /* @__PURE__ */ jsx("span", { children: JSON.stringify(props.value) });
@@ -422,8 +426,8 @@ function renderUnion(props) {
 	return /* @__PURE__ */ jsx("span", { children: "—" });
 }
 function renderDiscriminatedUnion(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 /* @__PURE__ */ jsx("span", { children: "—" });
 		return /* @__PURE__ */ jsx("span", { children: JSON.stringify(props.value) });
@@ -496,7 +500,7 @@ function DiscriminatedUnionTabs({ options, optionLabels, activeIndex, panelId, d
 	}, [
 		optionLabels,
 		discKey,
-		props
+		props.onChange
 	]);
 	const wrapIndex = useCallback((index) => (index % options.length + options.length) % options.length, [options.length]);
 	const handleKeyDown = useCallback((e) => {
@@ -537,6 +541,7 @@ function DiscriminatedUnionTabs({ options, optionLabels, activeIndex, panelId, d
 			},
 			type: "button",
 			role: "tab",
+			id: `${panelId}-tab-${String(i)}`,
 			"aria-selected": i === activeIndex ? "true" : void 0,
 			"aria-controls": `${panelId}-panel`,
 			tabIndex: i === activeIndex ? 0 : -1,
@@ -583,7 +588,7 @@ function renderFile(props) {
 	});
 }
 function renderRecursive(props) {
-	const refTarget = props.refTarget ?? "";
+	const refTarget = props.tree.type === "recursive" ? props.tree.refTarget : "";
 	return /* @__PURE__ */ jsx("fieldset", { children: /* @__PURE__ */ jsxs("em", { children: [
 		"↻ ",
 		typeof props.meta.description === "string" ? props.meta.description : refTarget,

package/dist/{ref-DvWoULcy.d.mts → ref-Ckt5liZs.d.mts}

@@ -1,4 +1,4 @@
-import { i as DiagnosticsOptions } from "./diagnostics-DzbZmcLI.mjs";
+import { i as DiagnosticsOptions } from "./diagnostics-BYk63jsC.mjs";
 
 //#region src/core/ref.d.ts
 /**

package/dist/{renderer-B3s8o2B8.d.mts → renderer-BAGoX4AK.d.mts}

@@ -13,6 +13,13 @@ type AllConstraints = StringConstraints & NumberConstraints & ArrayConstraints &
 /**
  * Properties available on every schema field, regardless of rendering target.
  * Both React and HTML renderers receive these.
+ *
+ * Per-type schema data — enum values, object fields, array element schema,
+ * union options, record key/value types, tuple `prefixItems`, conditional
+ * if/then/else clauses, negation `negated`, recursive `refTarget`, literal
+ * values — lives on the discriminated `tree`. Renderers narrow on
+ * `tree.type` and read from the matching variant; there are no duplicate
+ * sibling fields on these props.
  */
 interface BaseFieldProps {
   /** Current field value. */
@@ -27,31 +34,6 @@ interface BaseFieldProps {
   constraints: AllConstraints;
   /** Dot-separated path from root (e.g. "address.city"). */
   path: string;
-  /** For enums: the allowed values. */
-  enumValues?: (string | number | boolean | null)[];
-  /** For arrays: the element schema. */
-  element?: WalkedField;
-  /** For tuples: positional element schemas from prefixItems. */
-  prefixItems?: WalkedField[];
-  /** For conditionals: the if/then/else sub-schemas. */
-  ifClause?: WalkedField;
-  thenClause?: WalkedField;
-  elseClause?: WalkedField;
-  /** For negations: the negated sub-schema. */
-  negated?: WalkedField;
-  /** For recursive fields: the $ref string that would create the cycle. */
-  refTarget?: string;
-  /** For objects: map of field name → WalkedField. */
-  fields?: Record<string, WalkedField>;
-  /** For unions: the option schemas. */
-  options?: WalkedField[];
-  /** For discriminated unions: the discriminator key. */
-  discriminator?: string;
-  /** For records: key and value schemas. */
-  keyType?: WalkedField;
-  valueType?: WalkedField;
-  /** For literals: the literal value(s). */
-  literalValues?: (string | number | boolean | null)[];
   /** Example values from the schema's `examples` keyword. */
   examples?: unknown[];
   /** Walked field tree for recursive rendering. */
@@ -99,6 +81,18 @@ interface HtmlRenderProps extends BaseFieldProps {
    */
   renderChild: (tree: WalkedField, value: unknown, pathSuffix?: string) => string;
 }
+/**
+ * Build the `RenderProps` object handed to a resolver render function or a
+ * widget. Used by both the server-side `<SchemaView>` (which has no
+ * `onChange`) and the client-side `<SchemaComponent>` (which threads an
+ * `onChange` callback).
+ *
+ * When `onChange` is `undefined` the caller is rendering in read-only mode:
+ * a noop `onChange` is wired up, `readOnly` is forced to `true`, and
+ * `writeOnly` is forced to `false`. Otherwise the editability is taken
+ * from `tree.editability`.
+ */
+declare function buildRenderProps(tree: WalkedField, value: unknown, onChange: ((next: unknown) => void) | undefined, renderChild: RenderProps["renderChild"], path: string): RenderProps;
 type RenderFunction = (props: RenderProps) => unknown;
 interface ComponentResolver {
   string?: RenderFunction;
@@ -166,4 +160,4 @@ declare function mergeResolvers(user: ComponentResolver, fallback: ComponentReso
  */
 declare function mergeHtmlResolvers(user: HtmlResolver, fallback: HtmlResolver): HtmlResolver;
 //#endregion
-export { HtmlRenderProps as a, RenderFunction as c, getRenderFunction as d, mergeHtmlResolvers as f, HtmlRenderFunction as i, RenderProps as l, typeToKey as m, BaseFieldProps as n, HtmlResolver as o, mergeResolvers as p, ComponentResolver as r, RESOLVER_KEYS as s, AllConstraints as t, getHtmlRenderFn as u };
+export { HtmlRenderProps as a, RenderFunction as c, getHtmlRenderFn as d, getRenderFunction as f, typeToKey as h, HtmlRenderFunction as i, RenderProps as l, mergeResolvers as m, BaseFieldProps as n, HtmlResolver as o, mergeHtmlResolvers as p, ComponentResolver as r, RESOLVER_KEYS as s, AllConstraints as t, buildRenderProps as u };

package/dist/themes/mantine.d.mts

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

package/dist/themes/mantine.mjs

@@ -1,4 +1,5 @@
 import { isObject } from "../core/guards.mjs";
+import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
 import { inputId, toReactNode } from "../react/headlessRenderers.mjs";
 import { headlessResolver } from "../react/headless.mjs";
 import { jsx } from "react/jsx-runtime";
@@ -103,6 +104,7 @@ function renderEnumInput(props) {
 		id,
 		children: enumValue || "—"
 	});
+	const enumValues = props.tree.type === "enum" ? props.tree.enumValues : [];
 	return /* @__PURE__ */ jsx(MantineSelect, {
 		id,
 		label,
@@ -110,19 +112,19 @@ function renderEnumInput(props) {
 		onChange: (v) => {
 			if (typeof v === "string") props.onChange(v);
 		},
-		data: (props.enumValues ?? []).map((v) => ({
+		data: enumValues.map((v) => ({
 			value: v,
 			label: v
 		}))
 	});
 }
 function renderObjectContainer(props) {
-	const fields = props.fields;
-	if (fields === void 0) return null;
+	if (props.tree.type !== "object") return null;
+	const fields = props.tree.fields;
 	const obj = isObject(props.value) ? props.value : {};
 	return /* @__PURE__ */ jsx(MantineFieldset, {
 		legend: getLabel(props),
-		children: Object.entries(fields).filter(([, field]) => field.meta.visible !== false).map(([key, field]) => {
+		children: sortFieldsByOrder(fields).filter(([, field]) => field.meta.visible !== false).map(([key, field]) => {
 			const childValue = obj[key];
 			const childOnChange = (v) => {
 				const updated = {};

package/dist/themes/mui.d.mts

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

package/dist/themes/mui.mjs

@@ -1,4 +1,5 @@
 import { isObject } from "../core/guards.mjs";
+import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
 import { inputId, toReactNode } from "../react/headlessRenderers.mjs";
 import { headlessResolver } from "../react/headless.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -117,15 +118,15 @@ function renderEnumInput(props) {
 		children: [/* @__PURE__ */ jsxs(MuiMenuItem, {
 			value: "",
 			children: ["Select", "…"]
-		}), (props.enumValues ?? []).map((v) => /* @__PURE__ */ jsx(MuiMenuItem, {
+		}), (props.tree.type === "enum" ? props.tree.enumValues : []).map((v) => /* @__PURE__ */ jsx(MuiMenuItem, {
 			value: v,
 			children: v
 		}, v))]
 	});
 }
 function renderObjectContainer(props) {
-	const fields = props.fields;
-	if (fields === void 0) return null;
+	if (props.tree.type !== "object") return null;
+	const fields = props.tree.fields;
 	const obj = isObject(props.value) ? props.value : {};
 	return /* @__PURE__ */ jsxs(MuiBox, {
 		sx: {
@@ -136,7 +137,7 @@ function renderObjectContainer(props) {
 		children: [typeof props.meta.description === "string" && /* @__PURE__ */ jsx(MuiTypography, {
 			variant: "h6",
 			children: props.meta.description
-		}), Object.entries(fields).map(([key, field]) => {
+		}), sortFieldsByOrder(fields).map(([key, field]) => {
 			const childValue = obj[key];
 			const childOnChange = (v) => {
 				const updated = {};
@@ -150,7 +151,8 @@ function renderObjectContainer(props) {
 }
 function renderArrayContainer(props) {
 	const arr = Array.isArray(props.value) ? props.value : [];
-	const element = props.element;
+	if (props.tree.type !== "array") return null;
+	const element = props.tree.element;
 	if (element === void 0) return null;
 	return /* @__PURE__ */ jsx(MuiBox, {
 		sx: {

package/dist/themes/radix.d.mts

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

package/dist/themes/radix.mjs

@@ -1,4 +1,5 @@
 import { isObject } from "../core/guards.mjs";
+import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
 import { inputId, toReactNode } from "../react/headlessRenderers.mjs";
 import { headlessResolver } from "../react/headless.mjs";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -142,15 +143,15 @@ function renderEnumInput(props) {
 		children: [/* @__PURE__ */ jsx(RadixSelectTrigger, {
 			id,
 			mt: "1"
-		}), /* @__PURE__ */ jsx(RadixSelectContent, { children: (props.enumValues ?? []).map((value) => /* @__PURE__ */ jsx(RadixSelectItem, {
+		}), /* @__PURE__ */ jsx(RadixSelectContent, { children: (props.tree.type === "enum" ? props.tree.enumValues : []).map((value) => /* @__PURE__ */ jsx(RadixSelectItem, {
 			value,
 			children: value
 		}, value)) })]
 	})] });
 }
 function renderObjectContainer(props) {
-	const fields = props.fields;
-	if (fields === void 0) return null;
+	if (props.tree.type !== "object") return null;
+	const fields = props.tree.fields;
 	const obj = isObject(props.value) ? props.value : {};
 	return /* @__PURE__ */ jsxs(RadixBox, { children: [typeof props.meta.description === "string" && /* @__PURE__ */ jsx(RadixText, {
 		as: "div",
@@ -161,7 +162,7 @@ function renderObjectContainer(props) {
 	}), /* @__PURE__ */ jsx(RadixFlex, {
 		direction: "column",
 		gap: "3",
-		children: Object.entries(fields).filter(([, field]) => field.meta.visible !== false).map(([key, field]) => {
+		children: sortFieldsByOrder(fields).filter(([, field]) => field.meta.visible !== false).map(([key, field]) => {
 			const childValue = obj[key];
 			const childOnChange = (v) => {
 				const updated = {};

package/dist/themes/shadcn.d.mts

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

package/dist/themes/shadcn.mjs

@@ -1,4 +1,5 @@
 import { toRecord } from "../core/guards.mjs";
+import { sortFieldsByOrder } from "../core/fieldOrder.mjs";
 import { inputId, toReactNode } from "../react/headlessRenderers.mjs";
 import { headlessResolver } from "../react/headless.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -94,15 +95,15 @@ function renderBooleanInput(props) {
 	});
 }
 function renderObjectContainer(props) {
-	const fields = props.fields;
-	if (fields === void 0) return null;
+	if (props.tree.type !== "object") return null;
+	const fields = props.tree.fields;
 	const obj = typeof props.value === "object" && props.value !== null && !Array.isArray(props.value) ? props.value : {};
 	return /* @__PURE__ */ jsxs("div", {
 		className: "space-y-4",
 		children: [typeof props.meta.description === "string" && /* @__PURE__ */ jsx("h3", {
 			className: "text-lg font-medium",
 			children: props.meta.description
-		}), Object.entries(fields).map(([key, field]) => {
+		}), sortFieldsByOrder(fields).map(([key, field]) => {
 			const childValue = toRecord(obj)[key];
 			const childId = inputId(`${props.path}.${key}`);
 			const childOnChange = (v) => {
@@ -124,7 +125,8 @@ function renderObjectContainer(props) {
 }
 function renderArrayContainer(props) {
 	const arr = Array.isArray(props.value) ? props.value : [];
-	const element = props.element;
+	if (props.tree.type !== "array") return null;
+	const element = props.tree.element;
 	if (element === void 0) return null;
 	return /* @__PURE__ */ jsx("div", {
 		className: "space-y-2",
@@ -157,13 +159,13 @@ function renderEnumInput(props) {
 		children: [/* @__PURE__ */ jsxs("option", {
 			value: "",
 			children: ["Select", "…"]
-		}), props.enumValues?.map((v) => {
+		}), props.tree.type === "enum" ? props.tree.enumValues.map((v) => {
 			const display = v === null ? "null" : typeof v === "string" ? v : String(v);
 			return /* @__PURE__ */ jsx("option", {
 				value: display,
 				children: display
 			}, display);
-		})]
+		}) : null]
 	});
 }
 function buildResolver() {