@verbb/plugin-kit-react 1.0.9 → 2.0.0

package/dist/forms/assertSchemaRegistry.js

@@ -0,0 +1,71 @@
+import { getFormComponentRegistry, getFormFieldRegistry } from "./registry.js";
+import { isBuiltinFormFieldType } from "./builtin-field-loaders.js";
+//#region src/forms/assertSchemaRegistry.ts
+var isRecord = (value) => {
+	return Boolean(value) && typeof value === "object" && !Array.isArray(value);
+};
+var walkSchema = (schema, path, visit) => {
+	if (typeof schema === "string") return;
+	if (Array.isArray(schema)) {
+		schema.forEach((item, index) => {
+			if (typeof item === "string" || !isRecord(item)) return;
+			const itemPath = `${path}[${index}]`;
+			visit(item, itemPath);
+			walkSchema(item, itemPath, visit);
+		});
+		return;
+	}
+	if (!isRecord(schema)) return;
+	const node = schema;
+	visit(node, path);
+	if (node.children) walkSchema(node.children, `${path}.children`, visit);
+	if (node.schema) walkSchema(node.schema, `${path}.schema`, visit);
+};
+/**
+* Walk a SchemaForm tree and verify every `$field` / `$cmp` key is registered.
+* Use in dev/test bootstraps for large plugins (Formie-scale) before shipping CP screens.
+*/
+var assertSchemaRegistry = (schema, options = {}) => {
+	const { failFast = false } = options;
+	const fieldRegistry = getFormFieldRegistry();
+	const componentRegistry = getFormComponentRegistry();
+	const issues = [];
+	walkSchema(schema, "schema", (node, nodePath) => {
+		if (node.$field) {
+			const key = String(node.$field);
+			if (!fieldRegistry[key] && !isBuiltinFormFieldType(key)) {
+				const issue = {
+					path: nodePath,
+					kind: "field",
+					key
+				};
+				issues.push(issue);
+				if (failFast) throw new Error(`SchemaForm: unregistered field "${key}" at ${nodePath}`);
+			}
+		}
+		if (node.$cmp) {
+			const key = String(node.$cmp);
+			if (!componentRegistry[key]) {
+				const issue = {
+					path: nodePath,
+					kind: "component",
+					key
+				};
+				issues.push(issue);
+				if (failFast) throw new Error(`SchemaForm: unregistered component "${key}" at ${nodePath}`);
+			}
+		}
+	});
+	return issues;
+};
+/** Dev helper: log registry gaps for a schema index root tree. */
+var debugSchemaRegistry = (schemaIndex, options) => {
+	if (!schemaIndex?.schema) return [];
+	const issues = assertSchemaRegistry(schemaIndex.schema, options);
+	if (issues.length) console.warn("[plugin-kit] SchemaForm registry gaps:", issues);
+	return issues;
+};
+//#endregion
+export { assertSchemaRegistry, debugSchemaRegistry };
+
+//# sourceMappingURL=assertSchemaRegistry.js.map

package/dist/forms/assertSchemaRegistry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"assertSchemaRegistry.js","names":[],"sources":["../../src/forms/assertSchemaRegistry.ts"],"sourcesContent":["import type { SchemaIndex, SchemaNode, SchemaRenderable } from '@verbb/plugin-kit-forms';\n\nimport { isBuiltinFormFieldType } from './builtin-field-loaders.js';\nimport { getFormComponentRegistry, getFormFieldRegistry } from './registry.js';\n\nexport type AssertSchemaRegistryOptions = {\n    /** When true, throw on the first missing registry key instead of collecting all. */\n    failFast?: boolean;\n};\n\nexport type SchemaRegistryIssue = {\n    path: string;\n    kind: 'field' | 'component';\n    key: string;\n};\n\nconst isRecord = (value: unknown): value is Record<string, unknown> => {\n    return Boolean(value) && typeof value === 'object' && !Array.isArray(value);\n};\n\nconst walkSchema = (\n    schema: SchemaRenderable,\n    path: string,\n    visit: (node: SchemaNode, path: string) => void,\n): void => {\n    if (typeof schema === 'string') {\n        return;\n    }\n\n    if (Array.isArray(schema)) {\n        schema.forEach((item, index) => {\n            if (typeof item === 'string' || !isRecord(item)) {\n                return;\n            }\n\n            const itemPath = `${path}[${index}]`;\n            visit(item as SchemaNode, itemPath);\n            walkSchema(item as SchemaRenderable, itemPath, visit);\n        });\n        return;\n    }\n\n    if (!isRecord(schema)) {\n        return;\n    }\n\n    const node = schema as SchemaNode;\n    visit(node, path);\n\n    if (node.children) {\n        walkSchema(node.children as SchemaRenderable, `${path}.children`, visit);\n    }\n\n    if (node.schema) {\n        walkSchema(node.schema as SchemaRenderable, `${path}.schema`, visit);\n    }\n};\n\n/**\n * Walk a SchemaForm tree and verify every `$field` / `$cmp` key is registered.\n * Use in dev/test bootstraps for large plugins (Formie-scale) before shipping CP screens.\n */\nexport const assertSchemaRegistry = (\n    schema: SchemaRenderable,\n    options: AssertSchemaRegistryOptions = {},\n): SchemaRegistryIssue[] => {\n    const { failFast = false } = options;\n\n    const fieldRegistry = getFormFieldRegistry();\n    const componentRegistry = getFormComponentRegistry();\n    const issues: SchemaRegistryIssue[] = [];\n\n    walkSchema(schema, 'schema', (node, nodePath) => {\n        if (node.$field) {\n            const key = String(node.$field);\n            if (!fieldRegistry[key] && !isBuiltinFormFieldType(key)) {\n                const issue: SchemaRegistryIssue = { path: nodePath, kind: 'field', key };\n                issues.push(issue);\n                if (failFast) {\n                    throw new Error(`SchemaForm: unregistered field \"${key}\" at ${nodePath}`);\n                }\n            }\n        }\n\n        if (node.$cmp) {\n            const key = String(node.$cmp);\n            if (!componentRegistry[key]) {\n                const issue: SchemaRegistryIssue = { path: nodePath, kind: 'component', key };\n                issues.push(issue);\n                if (failFast) {\n                    throw new Error(`SchemaForm: unregistered component \"${key}\" at ${nodePath}`);\n                }\n            }\n        }\n    });\n\n    return issues;\n};\n\n/** Dev helper: log registry gaps for a schema index root tree. */\nexport const debugSchemaRegistry = (\n    schemaIndex: SchemaIndex | null | undefined,\n    options?: AssertSchemaRegistryOptions,\n): SchemaRegistryIssue[] => {\n    if (!schemaIndex?.schema) {\n        return [];\n    }\n\n    const issues = assertSchemaRegistry(schemaIndex.schema, options);\n\n    if (issues.length) {\n        console.warn('[plugin-kit] SchemaForm registry gaps:', issues);\n    }\n\n    return issues;\n};\n"],"mappings":";;;AAgBA,IAAM,YAAY,UAAqD;AACnE,QAAO,QAAQ,MAAM,IAAI,OAAO,UAAU,YAAY,CAAC,MAAM,QAAQ,MAAM;;AAG/E,IAAM,cACF,QACA,MACA,UACO;AACP,KAAI,OAAO,WAAW,SAClB;AAGJ,KAAI,MAAM,QAAQ,OAAO,EAAE;AACvB,SAAO,SAAS,MAAM,UAAU;AAC5B,OAAI,OAAO,SAAS,YAAY,CAAC,SAAS,KAAK,CAC3C;GAGJ,MAAM,WAAW,GAAG,KAAK,GAAG,MAAM;AAClC,SAAM,MAAoB,SAAS;AACnC,cAAW,MAA0B,UAAU,MAAM;IACvD;AACF;;AAGJ,KAAI,CAAC,SAAS,OAAO,CACjB;CAGJ,MAAM,OAAO;AACb,OAAM,MAAM,KAAK;AAEjB,KAAI,KAAK,SACL,YAAW,KAAK,UAA8B,GAAG,KAAK,YAAY,MAAM;AAG5E,KAAI,KAAK,OACL,YAAW,KAAK,QAA4B,GAAG,KAAK,UAAU,MAAM;;;;;;AAQ5E,IAAa,wBACT,QACA,UAAuC,EAAE,KACjB;CACxB,MAAM,EAAE,WAAW,UAAU;CAE7B,MAAM,gBAAgB,sBAAsB;CAC5C,MAAM,oBAAoB,0BAA0B;CACpD,MAAM,SAAgC,EAAE;AAExC,YAAW,QAAQ,WAAW,MAAM,aAAa;AAC7C,MAAI,KAAK,QAAQ;GACb,MAAM,MAAM,OAAO,KAAK,OAAO;AAC/B,OAAI,CAAC,cAAc,QAAQ,CAAC,uBAAuB,IAAI,EAAE;IACrD,MAAM,QAA6B;KAAE,MAAM;KAAU,MAAM;KAAS;KAAK;AACzE,WAAO,KAAK,MAAM;AAClB,QAAI,SACA,OAAM,IAAI,MAAM,mCAAmC,IAAI,OAAO,WAAW;;;AAKrF,MAAI,KAAK,MAAM;GACX,MAAM,MAAM,OAAO,KAAK,KAAK;AAC7B,OAAI,CAAC,kBAAkB,MAAM;IACzB,MAAM,QAA6B;KAAE,MAAM;KAAU,MAAM;KAAa;KAAK;AAC7E,WAAO,KAAK,MAAM;AAClB,QAAI,SACA,OAAM,IAAI,MAAM,uCAAuC,IAAI,OAAO,WAAW;;;GAI3F;AAEF,QAAO;;;AAIX,IAAa,uBACT,aACA,YACwB;AACxB,KAAI,CAAC,aAAa,OACd,QAAO,EAAE;CAGb,MAAM,SAAS,qBAAqB,YAAY,QAAQ,QAAQ;AAEhE,KAAI,OAAO,OACP,SAAQ,KAAK,0CAA0C,OAAO;AAGlE,QAAO"}

package/dist/forms/builtin-field-loaders.d.ts

@@ -0,0 +1,11 @@
+import { SchemaFormFieldComponent } from './engine/context.js';
+type BuiltinFieldLoader = () => Promise<SchemaFormFieldComponent>;
+/**
+ * Built-in SchemaForm `$field` types load on first render so CP bundles only pay for
+ * field modules that appear in the active schema (e.g. no CodeMirror until `codeEditor`).
+ */
+export declare const builtinFormFieldLoaders: Record<string, BuiltinFieldLoader>;
+export declare const isBuiltinFormFieldType: (name: string) => boolean;
+export declare const loadBuiltinFormField: (name: string) => Promise<SchemaFormFieldComponent | null>;
+export {};
+//# sourceMappingURL=builtin-field-loaders.d.ts.map

package/dist/forms/builtin-field-loaders.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"builtin-field-loaders.d.ts","sourceRoot":"","sources":["../../src/forms/builtin-field-loaders.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,qBAAqB,CAAC;AAEpE,KAAK,kBAAkB,GAAG,MAAM,OAAO,CAAC,wBAAwB,CAAC,CAAC;AAElE;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,MAAM,CAAC,MAAM,EAAE,kBAAkB,CAatE,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,MAAM,MAAM,KAAG,OAErD,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAAU,MAAM,MAAM,KAAG,OAAO,CAAC,wBAAwB,GAAG,IAAI,CAQhG,CAAC"}

package/dist/forms/builtin-field-loaders.js

@@ -0,0 +1,31 @@
+//#region src/forms/builtin-field-loaders.ts
+/**
+* Built-in SchemaForm `$field` types load on first render so CP bundles only pay for
+* field modules that appear in the active schema (e.g. no CodeMirror until `codeEditor`).
+*/
+var builtinFormFieldLoaders = {
+	text: async () => (await import("./fields/TextField.js")).TextField,
+	textarea: async () => (await import("./fields/TextareaField.js")).TextareaField,
+	number: async () => (await import("./fields/NumberField.js")).NumberField,
+	select: async () => (await import("./fields/SelectField.js")).SelectField,
+	lightswitch: async () => (await import("./fields/LightswitchField.js")).LightswitchField,
+	color: async () => (await import("./fields/ColorField.js")).ColorField,
+	radioGroup: async () => (await import("./fields/RadioGroupField.js")).RadioGroupField,
+	checkboxSelect: async () => (await import("./fields/CheckboxSelectField.js")).CheckboxSelectField,
+	combobox: async () => (await import("./fields/ComboboxField.js")).ComboboxField,
+	group: async () => (await import("./fields/GroupField.js")).GroupField,
+	date: async () => (await import("./fields/DateTimeField.js")).DateTimeField,
+	codeEditor: async () => (await import("./fields/CodeEditorField.js")).CodeEditorField
+};
+var isBuiltinFormFieldType = (name) => {
+	return Object.prototype.hasOwnProperty.call(builtinFormFieldLoaders, name);
+};
+var loadBuiltinFormField = async (name) => {
+	const loader = builtinFormFieldLoaders[name];
+	if (!loader) return null;
+	return loader();
+};
+//#endregion
+export { isBuiltinFormFieldType, loadBuiltinFormField };
+
+//# sourceMappingURL=builtin-field-loaders.js.map

package/dist/forms/builtin-field-loaders.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"builtin-field-loaders.js","names":[],"sources":["../../src/forms/builtin-field-loaders.ts"],"sourcesContent":["import type { SchemaFormFieldComponent } from './engine/context.js';\n\ntype BuiltinFieldLoader = () => Promise<SchemaFormFieldComponent>;\n\n/**\n * Built-in SchemaForm `$field` types load on first render so CP bundles only pay for\n * field modules that appear in the active schema (e.g. no CodeMirror until `codeEditor`).\n */\nexport const builtinFormFieldLoaders: Record<string, BuiltinFieldLoader> = {\n    text: async () => (await import('./fields/TextField.js')).TextField as SchemaFormFieldComponent,\n    textarea: async () => (await import('./fields/TextareaField.js')).TextareaField as SchemaFormFieldComponent,\n    number: async () => (await import('./fields/NumberField.js')).NumberField as SchemaFormFieldComponent,\n    select: async () => (await import('./fields/SelectField.js')).SelectField as SchemaFormFieldComponent,\n    lightswitch: async () => (await import('./fields/LightswitchField.js')).LightswitchField as SchemaFormFieldComponent,\n    color: async () => (await import('./fields/ColorField.js')).ColorField as SchemaFormFieldComponent,\n    radioGroup: async () => (await import('./fields/RadioGroupField.js')).RadioGroupField as SchemaFormFieldComponent,\n    checkboxSelect: async () => (await import('./fields/CheckboxSelectField.js')).CheckboxSelectField as SchemaFormFieldComponent,\n    combobox: async () => (await import('./fields/ComboboxField.js')).ComboboxField as SchemaFormFieldComponent,\n    group: async () => (await import('./fields/GroupField.js')).GroupField as SchemaFormFieldComponent,\n    date: async () => (await import('./fields/DateTimeField.js')).DateTimeField as SchemaFormFieldComponent,\n    codeEditor: async () => (await import('./fields/CodeEditorField.js')).CodeEditorField as SchemaFormFieldComponent,\n};\n\nexport const isBuiltinFormFieldType = (name: string): boolean => {\n    return Object.prototype.hasOwnProperty.call(builtinFormFieldLoaders, name);\n};\n\nexport const loadBuiltinFormField = async (name: string): Promise<SchemaFormFieldComponent | null> => {\n    const loader = builtinFormFieldLoaders[name];\n\n    if (!loader) {\n        return null;\n    }\n\n    return loader();\n};\n"],"mappings":";;;;;AAQA,IAAa,0BAA8D;CACvE,MAAM,aAAa,MAAM,OAAO,0BAA0B;CAC1D,UAAU,aAAa,MAAM,OAAO,8BAA8B;CAClE,QAAQ,aAAa,MAAM,OAAO,4BAA4B;CAC9D,QAAQ,aAAa,MAAM,OAAO,4BAA4B;CAC9D,aAAa,aAAa,MAAM,OAAO,iCAAiC;CACxE,OAAO,aAAa,MAAM,OAAO,2BAA2B;CAC5D,YAAY,aAAa,MAAM,OAAO,gCAAgC;CACtE,gBAAgB,aAAa,MAAM,OAAO,oCAAoC;CAC9E,UAAU,aAAa,MAAM,OAAO,8BAA8B;CAClE,OAAO,aAAa,MAAM,OAAO,2BAA2B;CAC5D,MAAM,aAAa,MAAM,OAAO,8BAA8B;CAC9D,YAAY,aAAa,MAAM,OAAO,gCAAgC;CACzE;AAED,IAAa,0BAA0B,SAA0B;AAC7D,QAAO,OAAO,UAAU,eAAe,KAAK,yBAAyB,KAAK;;AAG9E,IAAa,uBAAuB,OAAO,SAA2D;CAClG,MAAM,SAAS,wBAAwB;AAEvC,KAAI,CAAC,OACD,QAAO;AAGX,QAAO,QAAQ"}

package/dist/forms/components/FieldWrap.d.ts

@@ -1,10 +1,16 @@
-import { SchemaFormComponentProps } from '../engine/context';
+import { ReactNode } from 'react';
+import { SchemaFormComponentProps } from '../engine/context.js';
+/**
+ * Schema `$cmp: 'FieldWrap'` — labels a horizontal cluster of nested fields and
+ * surfaces grouped nested errors on the wrapper (kit v1 FieldWrap contract).
+ */
 export declare const FieldWrap: (({ name, label, instructions, required, warning, children, schemaNode, }: SchemaFormComponentProps & {
     name?: string;
     label?: string;
     instructions?: string;
     required?: boolean;
     warning?: string;
+    children?: ReactNode;
 }) => import("react/jsx-runtime").JSX.Element) & {
     usesSchemaNode: true;
 };

package/dist/forms/components/FieldWrap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldWrap.d.ts","sourceRoot":"","sources":["../../../src/forms/components/FieldWrap.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AA6ClE,eAAO,MAAM,SAAS,6EAQnB,wBAAwB,GAAG;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;CACpB;;CAgEoC,CAAC"}
+{"version":3,"file":"FieldWrap.d.ts","sourceRoot":"","sources":["../../../src/forms/components/FieldWrap.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGtE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAsBrE;;;GAGG;AACH,eAAO,MAAM,SAAS,6EAQnB,wBAAwB,GAAG;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACxB;;CAyEoC,CAAC"}

package/dist/forms/components/FieldWrap.js

@@ -1,20 +1,9 @@
-import { FieldLayout, InlineFieldErrorVisibilityContext } from "../Field.js";
+import { FieldLayout } from "../Field.js";
 import { useSchemaEngineContext } from "../engine/context.js";
+import { collectSchemaFieldNames } from "./schemaErrors.js";
 import { useMemo, useSyncExternalStore } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/forms/components/FieldWrap.tsx
-var collectFieldNames = (schema, names) => {
-	if (Array.isArray(schema)) {
-		schema.forEach((entry) => {
-			collectFieldNames(entry, names);
-		});
-		return;
-	}
-	if (!schema || typeof schema !== "object") return;
-	if (schema.$field && typeof schema.name === "string" && schema.name) names.add(schema.name);
-	if (Array.isArray(schema.children)) collectFieldNames(schema.children, names);
-	if (Array.isArray(schema.schema)) collectFieldNames(schema.schema, names);
-};
 var ATTRIBUTE_MESSAGE_PATTERN = /^(.+?) (cannot be blank\.|must be .+)$/;
 var formatWrapperMessage = (message, wrapperLabel) => {
 	if (!wrapperLabel) return message;
@@ -25,13 +14,15 @@ var formatWrapperMessage = (message, wrapperLabel) => {
 	}
 	return `${wrapperLabel} ${message}`;
 };
+/**
+* Schema `$cmp: 'FieldWrap'` — labels a horizontal cluster of nested fields and
+* surfaces grouped nested errors on the wrapper (kit v1 FieldWrap contract).
+*/
 var FieldWrap = Object.assign(({ name, label, instructions, required, warning, children, schemaNode }) => {
 	const form = useSchemaEngineContext();
 	const fieldName = name || label || "field";
 	const nestedFieldNames = useMemo(() => {
-		const names = /* @__PURE__ */ new Set();
-		collectFieldNames(schemaNode?.children || [], names);
-		return Array.from(names);
+		return Array.from(collectSchemaFieldNames(schemaNode?.children || []));
 	}, [schemaNode]);
 	const errorMap = useSyncExternalStore(form.store.subscribe.bind(form.store), () => {
 		return form.getErrorMapFields() || {};
@@ -68,13 +59,16 @@ var FieldWrap = Object.assign(({ name, label, instructions, required, warning, c
 			name,
 			nestedFieldNames
 		]),
-		withControl: false,
-		children: /* @__PURE__ */ jsx(InlineFieldErrorVisibilityContext.Provider, {
-			value: false,
-			children: /* @__PURE__ */ jsx("div", {
-				className: "flex items-center flex-row gap-2",
-				children
-			})
+		children: /* @__PURE__ */ jsx("div", {
+			"data-pk-field-wrap-controls": "",
+			style: {
+				display: "flex",
+				alignItems: "center",
+				flexDirection: "row",
+				flexWrap: "wrap",
+				gap: "0.5rem"
+			},
+			children
 		})
 	});
 }, { usesSchemaNode: true });

package/dist/forms/components/FieldWrap.js.map

@@ -1 +1 @@
-{"version":3,"file":"FieldWrap.js","names":[],"sources":["../../../src/forms/components/FieldWrap.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore } from 'react';\n\nimport { FieldLayout, InlineFieldErrorVisibilityContext } from '../Field';\nimport type { SchemaFormComponentProps } from '../engine/context';\nimport { useSchemaEngineContext } from '../engine/context';\nimport type { SchemaRenderable } from '../engine/SchemaIndex';\n\nconst collectFieldNames = (schema: SchemaRenderable, names: Set<string>) => {\n    if (Array.isArray(schema)) {\n        schema.forEach((entry) => {\n            collectFieldNames(entry, names);\n        });\n        return;\n    }\n\n    if (!schema || typeof schema !== 'object') {\n        return;\n    }\n\n    if (schema.$field && typeof schema.name === 'string' && schema.name) {\n        names.add(schema.name);\n    }\n\n    if (Array.isArray(schema.children)) {\n        collectFieldNames(schema.children, names);\n    }\n\n    if (Array.isArray(schema.schema)) {\n        collectFieldNames(schema.schema, names);\n    }\n};\n\nconst ATTRIBUTE_MESSAGE_PATTERN = /^(.+?) (cannot be blank\\.|must be .+)$/;\n\nconst formatWrapperMessage = (message: string, wrapperLabel?: string) => {\n    if (!wrapperLabel) {\n        return message;\n    }\n\n    const match = String(message).match(ATTRIBUTE_MESSAGE_PATTERN);\n    if (match) {\n        const [, , suffix] = match;\n        return `${wrapperLabel} ${suffix}`;\n    }\n\n    return `${wrapperLabel} ${message}`;\n};\n\nexport const FieldWrap = Object.assign(({\n    name,\n    label,\n    instructions,\n    required,\n    warning,\n    children,\n    schemaNode,\n}: SchemaFormComponentProps & {\n    name?: string;\n    label?: string;\n    instructions?: string;\n    required?: boolean;\n    warning?: string;\n}) => {\n    const form = useSchemaEngineContext();\n    const fieldName = name || label || 'field';\n    const nestedFieldNames = useMemo(() => {\n        const names = new Set<string>();\n        collectFieldNames(schemaNode?.children || [], names);\n        return Array.from(names);\n    }, [schemaNode]);\n    const errorMap = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => {\n            return (form.getErrorMapFields() || {}) as Record<string, string[]>;\n        },\n        () => {\n            return {} as Record<string, string[]>;\n        },\n    );\n    const errors = useMemo(() => {\n        if (name && typeof form?.getGroupedErrorsForPath === 'function') {\n            return form.getGroupedErrorsForPath(name) || [];\n        }\n\n        if (!nestedFieldNames.length) {\n            return [];\n        }\n\n        const groupedErrors: string[] = [];\n\n        nestedFieldNames.forEach((fieldPath) => {\n            (errorMap[fieldPath] || []).forEach((message: string) => {\n                groupedErrors.push(formatWrapperMessage(String(message), label || name || fieldName));\n            });\n\n            Object.entries(errorMap).forEach(([errorPath, messages]) => {\n                if (!errorPath.startsWith(`${fieldPath}.`)) {\n                    return;\n                }\n\n                (messages || []).forEach((message: string) => {\n                    groupedErrors.push(formatWrapperMessage(String(message), label || name || fieldName));\n                });\n            });\n        });\n\n        return Array.from(new Set(groupedErrors));\n    }, [errorMap, fieldName, form, label, name, nestedFieldNames]);\n\n    return (\n        <FieldLayout\n            name={fieldName}\n            label={label}\n            instructions={instructions}\n            required={required}\n            warning={warning}\n            errors={errors}\n            withControl={false}\n        >\n            <InlineFieldErrorVisibilityContext.Provider value={false}>\n                <div className=\"flex items-center flex-row gap-2\">\n                    {children}\n                </div>\n            </InlineFieldErrorVisibilityContext.Provider>\n        </FieldLayout>\n    );\n}, { usesSchemaNode: true as const });\n"],"mappings":";;;;;AAOA,IAAM,qBAAqB,QAA0B,UAAuB;AACxE,KAAI,MAAM,QAAQ,OAAO,EAAE;AACvB,SAAO,SAAS,UAAU;AACtB,qBAAkB,OAAO,MAAM;IACjC;AACF;;AAGJ,KAAI,CAAC,UAAU,OAAO,WAAW,SAC7B;AAGJ,KAAI,OAAO,UAAU,OAAO,OAAO,SAAS,YAAY,OAAO,KAC3D,OAAM,IAAI,OAAO,KAAK;AAG1B,KAAI,MAAM,QAAQ,OAAO,SAAS,CAC9B,mBAAkB,OAAO,UAAU,MAAM;AAG7C,KAAI,MAAM,QAAQ,OAAO,OAAO,CAC5B,mBAAkB,OAAO,QAAQ,MAAM;;AAI/C,IAAM,4BAA4B;AAElC,IAAM,wBAAwB,SAAiB,iBAA0B;AACrE,KAAI,CAAC,aACD,QAAO;CAGX,MAAM,QAAQ,OAAO,QAAQ,CAAC,MAAM,0BAA0B;AAC9D,KAAI,OAAO;EACP,MAAM,KAAK,UAAU;AACrB,SAAO,GAAG,aAAa,GAAG;;AAG9B,QAAO,GAAG,aAAa,GAAG;;AAG9B,IAAa,YAAY,OAAO,QAAQ,EACpC,MACA,OACA,cACA,UACA,SACA,UACA,iBAOE;CACF,MAAM,OAAO,wBAAwB;CACrC,MAAM,YAAY,QAAQ,SAAS;CACnC,MAAM,mBAAmB,cAAc;EACnC,MAAM,wBAAQ,IAAI,KAAa;AAC/B,oBAAkB,YAAY,YAAY,EAAE,EAAE,MAAM;AACpD,SAAO,MAAM,KAAK,MAAM;IACzB,CAAC,WAAW,CAAC;CAChB,MAAM,WAAW,qBACb,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AACF,SAAQ,KAAK,mBAAmB,IAAI,EAAE;UAEpC;AACF,SAAO,EAAE;GAEhB;AA+BD,QACI,oBAAC,aAAD;EACI,MAAM;EACC;EACO;EACJ;EACD;EACD,QArCD,cAAc;AACzB,OAAI,QAAQ,OAAO,MAAM,4BAA4B,WACjD,QAAO,KAAK,wBAAwB,KAAK,IAAI,EAAE;AAGnD,OAAI,CAAC,iBAAiB,OAClB,QAAO,EAAE;GAGb,MAAM,gBAA0B,EAAE;AAElC,oBAAiB,SAAS,cAAc;AACpC,KAAC,SAAS,cAAc,EAAE,EAAE,SAAS,YAAoB;AACrD,mBAAc,KAAK,qBAAqB,OAAO,QAAQ,EAAE,SAAS,QAAQ,UAAU,CAAC;MACvF;AAEF,WAAO,QAAQ,SAAS,CAAC,SAAS,CAAC,WAAW,cAAc;AACxD,SAAI,CAAC,UAAU,WAAW,GAAG,UAAU,GAAG,CACtC;AAGJ,MAAC,YAAY,EAAE,EAAE,SAAS,YAAoB;AAC1C,oBAAc,KAAK,qBAAqB,OAAO,QAAQ,EAAE,SAAS,QAAQ,UAAU,CAAC;OACvF;MACJ;KACJ;AAEF,UAAO,MAAM,KAAK,IAAI,IAAI,cAAc,CAAC;KAC1C;GAAC;GAAU;GAAW;GAAM;GAAO;GAAM;GAAiB,CAS7C;EACR,aAAa;YAEb,oBAAC,kCAAkC,UAAnC;GAA4C,OAAO;aAC/C,oBAAC,OAAD;IAAK,WAAU;IACV;IACC,CAAA;GACmC,CAAA;EACnC,CAAA;GAEnB,EAAE,gBAAgB,MAAe,CAAC"}
+{"version":3,"file":"FieldWrap.js","names":[],"sources":["../../../src/forms/components/FieldWrap.tsx"],"sourcesContent":["import { useMemo, useSyncExternalStore, type ReactNode } from 'react';\n\nimport { FieldLayout } from '../Field.js';\nimport type { SchemaFormComponentProps } from '../engine/context.js';\nimport { useSchemaEngineContext } from '../engine/context.js';\nimport type { SchemaRenderable } from '@verbb/plugin-kit-forms';\n\nimport { collectSchemaFieldNames } from './schemaErrors.js';\n\nconst ATTRIBUTE_MESSAGE_PATTERN = /^(.+?) (cannot be blank\\.|must be .+)$/;\n\nconst formatWrapperMessage = (message: string, wrapperLabel?: string) => {\n    if (!wrapperLabel) {\n        return message;\n    }\n\n    const match = String(message).match(ATTRIBUTE_MESSAGE_PATTERN);\n    if (match) {\n        const [, , suffix] = match;\n        return `${wrapperLabel} ${suffix}`;\n    }\n\n    return `${wrapperLabel} ${message}`;\n};\n\n/**\n * Schema `$cmp: 'FieldWrap'` — labels a horizontal cluster of nested fields and\n * surfaces grouped nested errors on the wrapper (kit v1 FieldWrap contract).\n */\nexport const FieldWrap = Object.assign(({\n    name,\n    label,\n    instructions,\n    required,\n    warning,\n    children,\n    schemaNode,\n}: SchemaFormComponentProps & {\n    name?: string;\n    label?: string;\n    instructions?: string;\n    required?: boolean;\n    warning?: string;\n    children?: ReactNode;\n}) => {\n    const form = useSchemaEngineContext();\n    const fieldName = name || label || 'field';\n    const nestedFieldNames = useMemo(() => {\n        return Array.from(collectSchemaFieldNames(schemaNode?.children || [] as SchemaRenderable));\n    }, [schemaNode]);\n    const errorMap = useSyncExternalStore(\n        form.store.subscribe.bind(form.store),\n        () => {\n            return (form.getErrorMapFields() || {}) as Record<string, string[]>;\n        },\n        () => {\n            return {} as Record<string, string[]>;\n        },\n    );\n    const errors = useMemo(() => {\n        if (name && typeof form?.getGroupedErrorsForPath === 'function') {\n            return form.getGroupedErrorsForPath(name) || [];\n        }\n\n        if (!nestedFieldNames.length) {\n            return [];\n        }\n\n        const groupedErrors: string[] = [];\n\n        nestedFieldNames.forEach((fieldPath) => {\n            (errorMap[fieldPath] || []).forEach((message: string) => {\n                groupedErrors.push(formatWrapperMessage(String(message), label || name || fieldName));\n            });\n\n            Object.entries(errorMap).forEach(([errorPath, messages]) => {\n                if (!errorPath.startsWith(`${fieldPath}.`)) {\n                    return;\n                }\n\n                (messages || []).forEach((message: string) => {\n                    groupedErrors.push(formatWrapperMessage(String(message), label || name || fieldName));\n                });\n            });\n        });\n\n        return Array.from(new Set(groupedErrors));\n    }, [errorMap, fieldName, form, label, name, nestedFieldNames]);\n\n    return (\n        <FieldLayout\n            name={fieldName}\n            label={label}\n            instructions={instructions}\n            required={required}\n            warning={warning}\n            errors={errors}\n        >\n            {/*\n              Horizontal control cluster (v1 FieldWrap). Nested pk-fields shrink via\n              `[data-pk-field-wrap-controls] pk-field` in kit-react style.css — not a\n              global unlabeled FieldLayout rule (that broke full-width conditions tables).\n            */}\n            <div\n                data-pk-field-wrap-controls=\"\"\n                style={{\n                    display: 'flex',\n                    alignItems: 'center',\n                    flexDirection: 'row',\n                    flexWrap: 'wrap',\n                    gap: '0.5rem',\n                }}\n            >\n                {children}\n            </div>\n        </FieldLayout>\n    );\n}, { usesSchemaNode: true as const });\n"],"mappings":";;;;;;AASA,IAAM,4BAA4B;AAElC,IAAM,wBAAwB,SAAiB,iBAA0B;AACrE,KAAI,CAAC,aACD,QAAO;CAGX,MAAM,QAAQ,OAAO,QAAQ,CAAC,MAAM,0BAA0B;AAC9D,KAAI,OAAO;EACP,MAAM,KAAK,UAAU;AACrB,SAAO,GAAG,aAAa,GAAG;;AAG9B,QAAO,GAAG,aAAa,GAAG;;;;;;AAO9B,IAAa,YAAY,OAAO,QAAQ,EACpC,MACA,OACA,cACA,UACA,SACA,UACA,iBAQE;CACF,MAAM,OAAO,wBAAwB;CACrC,MAAM,YAAY,QAAQ,SAAS;CACnC,MAAM,mBAAmB,cAAc;AACnC,SAAO,MAAM,KAAK,wBAAwB,YAAY,YAAY,EAAE,CAAqB,CAAC;IAC3F,CAAC,WAAW,CAAC;CAChB,MAAM,WAAW,qBACb,KAAK,MAAM,UAAU,KAAK,KAAK,MAAM,QAC/B;AACF,SAAQ,KAAK,mBAAmB,IAAI,EAAE;UAEpC;AACF,SAAO,EAAE;GAEhB;AA+BD,QACI,oBAAC,aAAD;EACI,MAAM;EACC;EACO;EACJ;EACD;EACD,QArCD,cAAc;AACzB,OAAI,QAAQ,OAAO,MAAM,4BAA4B,WACjD,QAAO,KAAK,wBAAwB,KAAK,IAAI,EAAE;AAGnD,OAAI,CAAC,iBAAiB,OAClB,QAAO,EAAE;GAGb,MAAM,gBAA0B,EAAE;AAElC,oBAAiB,SAAS,cAAc;AACpC,KAAC,SAAS,cAAc,EAAE,EAAE,SAAS,YAAoB;AACrD,mBAAc,KAAK,qBAAqB,OAAO,QAAQ,EAAE,SAAS,QAAQ,UAAU,CAAC;MACvF;AAEF,WAAO,QAAQ,SAAS,CAAC,SAAS,CAAC,WAAW,cAAc;AACxD,SAAI,CAAC,UAAU,WAAW,GAAG,UAAU,GAAG,CACtC;AAGJ,MAAC,YAAY,EAAE,EAAE,SAAS,YAAoB;AAC1C,oBAAc,KAAK,qBAAqB,OAAO,QAAQ,EAAE,SAAS,QAAQ,UAAU,CAAC;OACvF;MACJ;KACJ;AAEF,UAAO,MAAM,KAAK,IAAI,IAAI,cAAc,CAAC;KAC1C;GAAC;GAAU;GAAW;GAAM;GAAO;GAAM;GAAiB,CAS7C;YAOR,oBAAC,OAAD;GACI,+BAA4B;GAC5B,OAAO;IACH,SAAS;IACT,YAAY;IACZ,eAAe;IACf,UAAU;IACV,KAAK;IACR;GAEA;GACC,CAAA;EACI,CAAA;GAEnB,EAAE,gBAAgB,MAAe,CAAC"}

package/dist/forms/components/ModalTabs.d.ts

@@ -1,21 +1,36 @@
-import { SchemaFormComponentProps } from '../engine/context';
+import { ReactNode } from 'react';
+import { SchemaFormComponentProps } from '../engine/context.js';
+import { SchemaNode } from '@verbb/plugin-kit-forms';
 export declare const useModalTabsErrors: () => Record<string, boolean>;
-declare const ModalTabs: (({ children, schema, schemaNode, ...props }: SchemaFormComponentProps) => import("react/jsx-runtime").JSX.Element) & {
+type ModalTabsRootProps = SchemaFormComponentProps & {
+    children?: ReactNode;
+    className?: string;
+    value?: string;
+    defaultValue?: string;
+};
+/**
+ * Schema `$cmp: 'ModalTabs'` — wraps stock `Tabs` `variant="modal"`.
+ * Owns tab ↔ schema error mapping (same contract as kit v1 ModalTabs).
+ */
+declare const ModalTabs: (({ children, schemaNode, schema, _id: _schemaId, _data: _schemaData, className, value: controlledValue, defaultValue, ...props }: ModalTabsRootProps & {
+    schema?: SchemaNode;
+    _id?: string;
+    _data?: Record<string, unknown>;
+}) => import("react/jsx-runtime").JSX.Element) & {
     usesSchemaNode: true;
 };
-declare function ModalTabsList({ children, ...props }: {
-    [x: string]: any;
-    children: any;
+declare function ModalTabsList({ children }: {
+    children?: ReactNode;
 }): import("react/jsx-runtime").JSX.Element;
-declare function ModalTabsTrigger({ children, value, ...props }: {
-    [x: string]: any;
-    children: any;
-    value: any;
+declare function ModalTabsTrigger({ children, value, className, ...props }: {
+    children?: ReactNode;
+    value?: string;
+    className?: string;
 }): import("react/jsx-runtime").JSX.Element;
-declare function ModalTabsContent({ children, value, ...props }: {
-    [x: string]: any;
-    children: any;
-    value: any;
+declare function ModalTabsContent({ children, className, ...props }: {
+    children?: ReactNode;
+    className?: string;
+    value?: string;
 }): import("react/jsx-runtime").JSX.Element;
 export { ModalTabs, ModalTabsList, ModalTabsTrigger, ModalTabsContent, };
 //# sourceMappingURL=ModalTabs.d.ts.map

package/dist/forms/components/ModalTabs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalTabs.d.ts","sourceRoot":"","sources":["../../../src/forms/components/ModalTabs.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC;AAOlE,eAAO,MAAM,kBAAkB,+BAE9B,CAAC;AAEF,QAAA,MAAM,SAAS,gDAEZ,wBAAwB;;CAmDU,CAAC;AAEtC,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE;;;CAAA,2CAE5C;AAED,iBAAS,gBAAgB,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE;;;;CAAA,2CAsBtD;AAED,iBAAS,gBAAgB,CAAC,EACtB,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,EAC5B;;;;CAAA,2CAQA;AAED,OAAO,EACH,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,gBAAgB,GACnB,CAAC"}
+{"version":3,"file":"ModalTabs.d.ts","sourceRoot":"","sources":["../../../src/forms/components/ModalTabs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAQH,KAAK,SAAS,EACjB,MAAM,OAAO,CAAC;AAKf,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAErE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAM1D,eAAO,MAAM,kBAAkB,+BAE9B,CAAC;AAEF,KAAK,kBAAkB,GAAG,wBAAwB,GAAG;IACjD,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AA8DF;;;GAGG;AACH,QAAA,MAAM,SAAS,qIAYZ,kBAAkB,GAAG;IACpB,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACnC;;CAmIoC,CAAC;AAEtC,iBAAS,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,2CAG5D;AAED,iBAAS,gBAAgB,CAAC,EACtB,QAAQ,EACR,KAAK,EACL,SAAS,EACT,GAAG,KAAK,EACX,EAAE;IACC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB,2CAsBA;AAED,iBAAS,gBAAgB,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACX,EAAE;IACC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,2CAQA;AAED,OAAO,EACH,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,gBAAgB,GACnB,CAAC"}

package/dist/forms/components/ModalTabs.js

@@ -1,22 +1,57 @@
-import { cn } from "../../utils/classes.js";
-import { hasSchemaErrorsCached } from "../../utils/schemaIndexCache.js";
-import "../../utils/index.js";
-import { ModalTabs as ModalTabs$1, ModalTabsContent as ModalTabsContent$1, ModalTabsList as ModalTabsList$1, ModalTabsTrigger as ModalTabsTrigger$1 } from "../../components/ModalTabs.js";
-import "../../components/index.js";
+import { Icon } from "../../components/Icon.js";
+import { Tab, TabPanel, Tabs } from "../../components/Tabs.js";
 import { SchemaEngineContext } from "../engine/context.js";
-import { createContext, useCallback, useContext, useEffect, useState } from "react";
+import { schemaSubtreeHasErrors } from "./schemaErrors.js";
+import { cn } from "../../utils/cn.js";
+import { Fragment, createContext, useCallback, useContext, useEffect, useMemo, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faTriangleExclamation } from "@fortawesome/pro-solid-svg-icons";
+import { evaluateCondition } from "@verbb/plugin-kit-forms";
 //#region src/forms/components/ModalTabs.tsx
 var ModalTabsErrorsContext = createContext({});
 var useModalTabsErrors = () => {
 	return useContext(ModalTabsErrorsContext);
 };
-var ModalTabs = Object.assign(({ children, schema, schemaNode, ...props }) => {
+var isRecord = (value) => {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+};
+/**
+* Collect ModalTabsTrigger handles + optional tab-level `if` from schema.
+* O(schema nodes under this ModalTabs) once per schema identity — not nested field visibility.
+*/
+var collectTabHandles = (node) => {
+	if (!node?.children) return [];
+	const handles = [];
+	const visit = (items) => {
+		if (!Array.isArray(items)) return;
+		items.forEach((item) => {
+			if (!isRecord(item)) return;
+			const child = item;
+			if (child.$cmp === "ModalTabsTrigger") {
+				const value = typeof child.props?.value === "string" ? child.props.value : typeof child.value === "string" ? child.value : "";
+				if (value) handles.push({
+					value,
+					if: typeof child.if === "string" ? child.if : void 0
+				});
+				return;
+			}
+			if (child.children) visit(child.children);
+		});
+	};
+	visit(node.children);
+	return handles;
+};
+/**
+* Schema `$cmp: 'ModalTabs'` — wraps stock `Tabs` `variant="modal"`.
+* Owns tab ↔ schema error mapping (same contract as kit v1 ModalTabs).
+*/
+var ModalTabs = Object.assign(({ children, schemaNode, schema, _id: _schemaId, _data: _schemaData, className, value: controlledValue, defaultValue = "", ...props }) => {
 	const form = useContext(SchemaEngineContext);
 	const node = schemaNode ?? schema;
 	const [tabErrors, setTabErrors] = useState({});
+	const [uncontrolledValue, setUncontrolledValue] = useState(() => controlledValue ?? defaultValue ?? "");
+	const isControlled = controlledValue !== void 0 && controlledValue !== null;
+	const resolvedValue = isControlled ? String(controlledValue) : uncontrolledValue;
+	const tabHandles = useMemo(() => collectTabHandles(node), [node]);
 	const getTabErrors = useCallback(() => {
 		const errors = {};
 		if (!node?.children || !form?.getErrorMapFields) return errors;
@@ -25,10 +60,21 @@ var ModalTabs = Object.assign(({ children, schema, schemaNode, ...props }) => {
 			if (typeof item !== "object" || item === null || Array.isArray(item)) return;
 			const childNode = item;
 			const value = typeof childNode.props?.value === "string" ? childNode.props.value : "";
-			if (childNode.$cmp === "ModalTabsContent" && value) errors[value] = hasSchemaErrorsCached(formErrors, childNode.children || []);
+			if (childNode.$cmp === "ModalTabsContent" && value) errors[value] = schemaSubtreeHasErrors(formErrors, childNode.children || []);
 		});
 		return errors;
 	}, [form, node]);
+	/** First tab whose tab-level `if` (if any) currently passes. */
+	const getFirstVisibleTabValue = useCallback((values) => {
+		for (const handle of tabHandles) if (!handle.if || evaluateCondition(handle.if, values)) return handle.value;
+		return tabHandles[0]?.value ?? "";
+	}, [tabHandles]);
+	const isTabVisible = useCallback((tabValue, values) => {
+		const handle = tabHandles.find((item) => item.value === tabValue);
+		if (!handle) return false;
+		if (!handle.if) return true;
+		return evaluateCondition(handle.if, values);
+	}, [tabHandles]);
 	useEffect(() => {
 		if (!form?.store?.subscribe) {
 			setTabErrors(getTabErrors());
@@ -36,44 +82,67 @@ var ModalTabs = Object.assign(({ children, schema, schemaNode, ...props }) => {
 		}
 		const update = () => {
 			setTabErrors(getTabErrors());
+			if (isControlled) return;
+			const { values } = form.store.state;
+			const formValues = values && typeof values === "object" ? values : {};
+			if (!resolvedValue || isTabVisible(resolvedValue, formValues)) return;
+			const next = getFirstVisibleTabValue(formValues);
+			if (next && next !== resolvedValue) setUncontrolledValue(next);
 		};
 		update();
 		return form.store.subscribe(update);
-	}, [form, getTabErrors]);
+	}, [
+		form,
+		getFirstVisibleTabValue,
+		getTabErrors,
+		isControlled,
+		isTabVisible,
+		resolvedValue
+	]);
 	return /* @__PURE__ */ jsx(ModalTabsErrorsContext.Provider, {
 		value: tabErrors,
-		children: /* @__PURE__ */ jsx(ModalTabs$1, {
+		children: /* @__PURE__ */ jsx(Tabs, {
+			variant: "modal",
+			value: resolvedValue,
+			className: cn("h-full min-h-0", className),
 			...props,
+			onPkChange: (event) => {
+				event.stopPropagation();
+				const next = event.detail?.value;
+				if (typeof next !== "string" || !next || isControlled) return;
+				setUncontrolledValue(next);
+			},
 			children
 		})
 	});
 }, { usesSchemaNode: true });
-function ModalTabsList({ children, ...props }) {
-	return /* @__PURE__ */ jsx(ModalTabsList$1, {
-		...props,
-		children
-	});
+function ModalTabsList({ children }) {
+	return /* @__PURE__ */ jsx(Fragment, { children });
 }
-function ModalTabsTrigger({ children, value, ...props }) {
+function ModalTabsTrigger({ children, value, className, ...props }) {
 	const tabErrors = useModalTabsErrors();
-	const hasErrors = Boolean(tabErrors[value]);
-	return /* @__PURE__ */ jsxs(ModalTabsTrigger$1, {
+	const hasErrors = Boolean(value && tabErrors[value]);
+	return /* @__PURE__ */ jsx(Tab, {
 		value,
-		"data-has-errors": hasErrors,
-		className: cn("flex items-center gap-1", hasErrors && "text-error"),
+		"data-has-errors": hasErrors ? "true" : void 0,
+		className,
 		...props,
-		children: [children, hasErrors && /* @__PURE__ */ jsx(FontAwesomeIcon, {
-			icon: faTriangleExclamation,
-			className: "block size-3"
-		})]
+		slot: "nav",
+		children: /* @__PURE__ */ jsxs("span", {
+			className: "inline-flex items-center gap-1",
+			children: [children, hasErrors ? /* @__PURE__ */ jsx(Icon, {
+				icon: "triangle-exclamation",
+				className: "block size-3"
+			}) : null]
+		})
 	});
 }
-function ModalTabsContent({ children, value, ...props }) {
-	return /* @__PURE__ */ jsx(ModalTabsContent$1, {
-		value,
+function ModalTabsContent({ children, className, ...props }) {
+	return /* @__PURE__ */ jsx(TabPanel, {
+		className,
 		...props,
 		children: /* @__PURE__ */ jsx("div", {
-			className: cn("grid grid-cols-1 gap-4"),
+			className: "grid grid-cols-1 gap-4",
 			children
 		})
 	});

package/dist/forms/components/ModalTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalTabs.js","names":[],"sources":["../../../src/forms/components/ModalTabs.tsx"],"sourcesContent":["import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faTriangleExclamation } from '@fortawesome/pro-solid-svg-icons';\n\nimport {\n    ModalTabs as BaseModalTabs,\n    ModalTabsList as BaseModalTabsList,\n    ModalTabsTrigger as BaseModalTabsTrigger,\n    ModalTabsContent as BaseModalTabsContent,\n} from '../../components';\n\nimport { cn } from '../../utils';\nimport { hasSchemaErrorsCached } from '../../utils/schemaIndexCache';\n\nimport {\n    createContext, useCallback, useContext, useEffect, useState,\n} from 'react';\n\nimport type { SchemaFormComponentProps } from '../engine/context';\nimport { SchemaEngineContext } from '../engine/context';\nimport type { SchemaNode } from '../engine/SchemaIndex';\n\n// Create a context to pass tab error information down\nconst ModalTabsErrorsContext = createContext<Record<string, boolean>>({});\n\nexport const useModalTabsErrors = () => {\n    return useContext(ModalTabsErrorsContext);\n};\n\nconst ModalTabs = Object.assign(({\n    children, schema, schemaNode, ...props\n}: SchemaFormComponentProps) => {\n    const form = useContext(SchemaEngineContext);\n    const node = schemaNode ?? schema;\n\n    const [tabErrors, setTabErrors] = useState<Record<string, boolean>>({});\n\n    const getTabErrors = useCallback(() => {\n        const errors: Record<string, boolean> = {};\n\n        if (!node?.children || !form?.getErrorMapFields) {\n            return errors;\n        }\n\n        const formErrors = form.getErrorMapFields?.() || {};\n\n        // Process schema children to find tab content\n        Object.values(node.children as Record<string, unknown>).forEach((item) => {\n            if (typeof item !== 'object' || item === null || Array.isArray(item)) {\n                return;\n            }\n\n            const childNode = item as SchemaNode;\n            const value = typeof childNode.props?.value === 'string' ? childNode.props.value : '';\n            if (childNode.$cmp === 'ModalTabsContent' && value) {\n                errors[value] = hasSchemaErrorsCached(formErrors, childNode.children || []);\n            }\n        });\n\n        return errors;\n    }, [form, node]);\n\n    useEffect(() => {\n        if (!form?.store?.subscribe) {\n            setTabErrors(getTabErrors());\n            return;\n        }\n\n        const update = () => {\n            setTabErrors(getTabErrors());\n        };\n\n        update();\n        const unsubscribe = form.store.subscribe(update);\n        return unsubscribe;\n    }, [form, getTabErrors]);\n\n    return (\n        <ModalTabsErrorsContext.Provider value={tabErrors}>\n            <BaseModalTabs {...props}>{children}</BaseModalTabs>\n        </ModalTabsErrorsContext.Provider>\n    );\n}, { usesSchemaNode: true as const });\n\nfunction ModalTabsList({ children, ...props }) {\n    return <BaseModalTabsList {...props}>{children}</BaseModalTabsList>;\n}\n\nfunction ModalTabsTrigger({ children, value, ...props }) {\n    // Get tab errors from context\n    const tabErrors = useModalTabsErrors();\n\n    // Check if this specific tab has errors\n    const hasErrors = Boolean(tabErrors[value]);\n\n    return <BaseModalTabsTrigger\n        value={value}\n        data-has-errors={hasErrors}\n        className={cn(\n            'flex items-center gap-1',\n            hasErrors && 'text-error',\n        )}\n        {...props}\n    >\n        {children}\n\n        {hasErrors && (\n            <FontAwesomeIcon icon={faTriangleExclamation} className=\"block size-3\" />\n        )}\n    </BaseModalTabsTrigger>;\n}\n\nfunction ModalTabsContent({\n    children, value, ...props\n}) {\n    return (\n        <BaseModalTabsContent value={value} {...props}>\n            <div className={cn(\n                'grid grid-cols-1 gap-4',\n            )}>{children}</div>\n        </BaseModalTabsContent>\n    );\n}\n\nexport {\n    ModalTabs,\n    ModalTabsList,\n    ModalTabsTrigger,\n    ModalTabsContent,\n};\n"],"mappings":";;;;;;;;;;;AAsBA,IAAM,yBAAyB,cAAuC,EAAE,CAAC;AAEzE,IAAa,2BAA2B;AACpC,QAAO,WAAW,uBAAuB;;AAG7C,IAAM,YAAY,OAAO,QAAQ,EAC7B,UAAU,QAAQ,YAAY,GAAG,YACL;CAC5B,MAAM,OAAO,WAAW,oBAAoB;CAC5C,MAAM,OAAO,cAAc;CAE3B,MAAM,CAAC,WAAW,gBAAgB,SAAkC,EAAE,CAAC;CAEvE,MAAM,eAAe,kBAAkB;EACnC,MAAM,SAAkC,EAAE;AAE1C,MAAI,CAAC,MAAM,YAAY,CAAC,MAAM,kBAC1B,QAAO;EAGX,MAAM,aAAa,KAAK,qBAAqB,IAAI,EAAE;AAGnD,SAAO,OAAO,KAAK,SAAoC,CAAC,SAAS,SAAS;AACtE,OAAI,OAAO,SAAS,YAAY,SAAS,QAAQ,MAAM,QAAQ,KAAK,CAChE;GAGJ,MAAM,YAAY;GAClB,MAAM,QAAQ,OAAO,UAAU,OAAO,UAAU,WAAW,UAAU,MAAM,QAAQ;AACnF,OAAI,UAAU,SAAS,sBAAsB,MACzC,QAAO,SAAS,sBAAsB,YAAY,UAAU,YAAY,EAAE,CAAC;IAEjF;AAEF,SAAO;IACR,CAAC,MAAM,KAAK,CAAC;AAEhB,iBAAgB;AACZ,MAAI,CAAC,MAAM,OAAO,WAAW;AACzB,gBAAa,cAAc,CAAC;AAC5B;;EAGJ,MAAM,eAAe;AACjB,gBAAa,cAAc,CAAC;;AAGhC,UAAQ;AAER,SADoB,KAAK,MAAM,UAAU,OAClC;IACR,CAAC,MAAM,aAAa,CAAC;AAExB,QACI,oBAAC,uBAAuB,UAAxB;EAAiC,OAAO;YACpC,oBAAC,aAAD;GAAe,GAAI;GAAQ;GAAyB,CAAA;EACtB,CAAA;GAEvC,EAAE,gBAAgB,MAAe,CAAC;AAErC,SAAS,cAAc,EAAE,UAAU,GAAG,SAAS;AAC3C,QAAO,oBAAC,iBAAD;EAAmB,GAAI;EAAQ;EAA6B,CAAA;;AAGvE,SAAS,iBAAiB,EAAE,UAAU,OAAO,GAAG,SAAS;CAErD,MAAM,YAAY,oBAAoB;CAGtC,MAAM,YAAY,QAAQ,UAAU,OAAO;AAE3C,QAAO,qBAAC,oBAAD;EACI;EACP,mBAAiB;EACjB,WAAW,GACP,2BACA,aAAa,aAChB;EACD,GAAI;YAPD,CASF,UAEA,aACG,oBAAC,iBAAD;GAAiB,MAAM;GAAuB,WAAU;GAAiB,CAAA,CAE1D;;;AAG3B,SAAS,iBAAiB,EACtB,UAAU,OAAO,GAAG,SACrB;AACC,QACI,oBAAC,oBAAD;EAA6B;EAAO,GAAI;YACpC,oBAAC,OAAD;GAAK,WAAW,GACZ,yBACH;GAAG;GAAe,CAAA;EACA,CAAA"}
+{"version":3,"file":"ModalTabs.js","names":[],"sources":["../../../src/forms/components/ModalTabs.tsx"],"sourcesContent":["import {\n    Fragment,\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useState,\n    type ReactNode,\n} from 'react';\n\nimport { evaluateCondition } from '@verbb/plugin-kit-forms';\nimport { Icon, Tab, TabPanel, Tabs } from '../../components/index.js';\nimport { cn } from '../../utils/index.js';\nimport type { SchemaFormComponentProps } from '../engine/context.js';\nimport { SchemaEngineContext } from '../engine/context.js';\nimport type { SchemaNode } from '@verbb/plugin-kit-forms';\n\nimport { schemaSubtreeHasErrors } from './schemaErrors.js';\n\nconst ModalTabsErrorsContext = createContext<Record<string, boolean>>({});\n\nexport const useModalTabsErrors = () => {\n    return useContext(ModalTabsErrorsContext);\n};\n\ntype ModalTabsRootProps = SchemaFormComponentProps & {\n    children?: ReactNode;\n    className?: string;\n    value?: string;\n    defaultValue?: string;\n};\n\ntype TabHandleMeta = {\n    value: string;\n    if?: string;\n};\n\nconst isRecord = (value: unknown): value is Record<string, unknown> => {\n    return typeof value === 'object' && value !== null && !Array.isArray(value);\n};\n\n/**\n * Collect ModalTabsTrigger handles + optional tab-level `if` from schema.\n * O(schema nodes under this ModalTabs) once per schema identity — not nested field visibility.\n */\nconst collectTabHandles = (node: SchemaNode | undefined): TabHandleMeta[] => {\n    if (!node?.children) {\n        return [];\n    }\n\n    const handles: TabHandleMeta[] = [];\n\n    const visit = (items: unknown): void => {\n        if (!Array.isArray(items)) {\n            return;\n        }\n\n        items.forEach((item) => {\n            if (!isRecord(item)) {\n                return;\n            }\n\n            const child = item as SchemaNode;\n\n            if (child.$cmp === 'ModalTabsTrigger') {\n                const value = typeof child.props?.value === 'string'\n                    ? child.props.value\n                    : (typeof (child as { value?: unknown }).value === 'string'\n                        ? (child as { value: string }).value\n                        : '');\n\n                if (value) {\n                    handles.push({\n                        value,\n                        if: typeof child.if === 'string' ? child.if : undefined,\n                    });\n                }\n\n                return;\n            }\n\n            if (child.children) {\n                visit(child.children);\n            }\n        });\n    };\n\n    visit(node.children);\n\n    return handles;\n};\n\n/**\n * Schema `$cmp: 'ModalTabs'` — wraps stock `Tabs` `variant=\"modal\"`.\n * Owns tab ↔ schema error mapping (same contract as kit v1 ModalTabs).\n */\nconst ModalTabs = Object.assign(({\n    children,\n    schemaNode,\n    // Pull schema bookkeeping off before Tabs — even if the renderer strips these,\n    // keep the same contract as kit v1 (schemaNode ?? schema for error mapping).\n    schema,\n    _id: _schemaId,\n    _data: _schemaData,\n    className,\n    value: controlledValue,\n    defaultValue = '',\n    ...props\n}: ModalTabsRootProps & {\n    schema?: SchemaNode;\n    _id?: string;\n    _data?: Record<string, unknown>;\n}) => {\n    void _schemaId;\n    void _schemaData;\n\n    const form = useContext(SchemaEngineContext);\n    const node = schemaNode ?? schema;\n    const [tabErrors, setTabErrors] = useState<Record<string, boolean>>({});\n    const [uncontrolledValue, setUncontrolledValue] = useState(\n        () => controlledValue ?? defaultValue ?? '',\n    );\n\n    const isControlled = controlledValue !== undefined && controlledValue !== null;\n    const resolvedValue = isControlled ? String(controlledValue) : uncontrolledValue;\n\n    // Tab handles + optional `if` — fixed for a given schema node (not recomputed per field).\n    const tabHandles = useMemo(() => collectTabHandles(node), [node]);\n\n    const getTabErrors = useCallback(() => {\n        const errors: Record<string, boolean> = {};\n\n        if (!node?.children || !form?.getErrorMapFields) {\n            return errors;\n        }\n\n        const formErrors = form.getErrorMapFields?.() || {};\n\n        Object.values(node.children as Record<string, unknown>).forEach((item) => {\n            if (typeof item !== 'object' || item === null || Array.isArray(item)) {\n                return;\n            }\n\n            const childNode = item as SchemaNode;\n            const value = typeof childNode.props?.value === 'string' ? childNode.props.value : '';\n            if (childNode.$cmp === 'ModalTabsContent' && value) {\n                errors[value] = schemaSubtreeHasErrors(formErrors, childNode.children || []);\n            }\n        });\n\n        return errors;\n    }, [form, node]);\n\n    /** First tab whose tab-level `if` (if any) currently passes. */\n    const getFirstVisibleTabValue = useCallback((values: Record<string, unknown>) => {\n        for (const handle of tabHandles) {\n            if (!handle.if || evaluateCondition(handle.if, values)) {\n                return handle.value;\n            }\n        }\n\n        return tabHandles[0]?.value ?? '';\n    }, [tabHandles]);\n\n    const isTabVisible = useCallback((tabValue: string, values: Record<string, unknown>) => {\n        const handle = tabHandles.find((item) => item.value === tabValue);\n\n        if (!handle) {\n            return false;\n        }\n\n        if (!handle.if) {\n            return true;\n        }\n\n        return evaluateCondition(handle.if, values);\n    }, [tabHandles]);\n\n    useEffect(() => {\n        if (!form?.store?.subscribe) {\n            setTabErrors(getTabErrors());\n            return undefined;\n        }\n\n        const update = () => {\n            setTabErrors(getTabErrors());\n\n            // Tab-level `if` can hide the active tab (e.g. Name → multi fields).\n            // Cheap: only re-eval each tab's own `if` — never walk nested field visibility.\n            if (isControlled) {\n                return;\n            }\n\n            const { values } = form.store.state;\n            const formValues = (values && typeof values === 'object')\n                ? values as Record<string, unknown>\n                : {};\n\n            if (!resolvedValue || isTabVisible(resolvedValue, formValues)) {\n                return;\n            }\n\n            const next = getFirstVisibleTabValue(formValues);\n\n            if (next && next !== resolvedValue) {\n                setUncontrolledValue(next);\n            }\n        };\n\n        update();\n        return form.store.subscribe(update);\n    }, [\n        form,\n        getFirstVisibleTabValue,\n        getTabErrors,\n        isControlled,\n        isTabVisible,\n        resolvedValue,\n    ]);\n\n    return (\n        <ModalTabsErrorsContext.Provider value={tabErrors}>\n            <Tabs\n                variant=\"modal\"\n                value={resolvedValue}\n                className={cn('h-full min-h-0', className)}\n                {...props}\n                onPkChange={(event) => {\n                    // Nested inside FormBuilderTabs — stop bubble so pane routing does not navigate away.\n                    event.stopPropagation();\n\n                    const detail = (event as CustomEvent<{ value?: string }>).detail;\n                    const next = detail?.value;\n                    if (typeof next !== 'string' || !next || isControlled) {\n                        return;\n                    }\n                    setUncontrolledValue(next);\n                }}\n            >\n                {children}\n            </Tabs>\n        </ModalTabsErrorsContext.Provider>\n    );\n}, { usesSchemaNode: true as const });\n\nfunction ModalTabsList({ children }: { children?: ReactNode }) {\n    // pk-tabs only indexes `pk-tab` nodes on `slot=\"nav\"` — no list wrapper.\n    return <Fragment>{children}</Fragment>;\n}\n\nfunction ModalTabsTrigger({\n    children,\n    value,\n    className,\n    ...props\n}: {\n    children?: ReactNode;\n    value?: string;\n    className?: string;\n}) {\n    const tabErrors = useModalTabsErrors();\n    const hasErrors = Boolean(value && tabErrors[value]);\n\n    return (\n        <Tab\n            value={value}\n            data-has-errors={hasErrors ? 'true' : undefined}\n            // Host text-* cannot pierce pk-tab — error color is :host([data-has-errors]) in kit.\n            className={className}\n            {...props}\n            slot=\"nav\"\n        >\n            {/* Default slot (not status): :has(::slotted(*)) on .status is unreliable across browsers. */}\n            <span className=\"inline-flex items-center gap-1\">\n                {children}\n                {hasErrors ? (\n                    <Icon icon=\"triangle-exclamation\" className=\"block size-3\" />\n                ) : null}\n            </span>\n        </Tab>\n    );\n}\n\nfunction ModalTabsContent({\n    children,\n    className,\n    ...props\n}: {\n    children?: ReactNode;\n    className?: string;\n    value?: string;\n}) {\n    return (\n        <TabPanel className={className} {...props}>\n            <div className=\"grid grid-cols-1 gap-4\">\n                {children}\n            </div>\n        </TabPanel>\n    );\n}\n\nexport {\n    ModalTabs,\n    ModalTabsList,\n    ModalTabsTrigger,\n    ModalTabsContent,\n};\n"],"mappings":"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"}

package/dist/forms/components/index.d.ts

@@ -1,3 +1,4 @@
-export * from './FieldWrap';
-export * from './ModalTabs';
+export { FieldWrap } from './FieldWrap.js';
+export { ModalTabs, ModalTabsList, ModalTabsTrigger, ModalTabsContent, useModalTabsErrors, } from './ModalTabs.js';
+export { collectSchemaFieldNames, schemaSubtreeHasErrors, } from './schemaErrors.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/forms/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/forms/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EACH,SAAS,EACT,aAAa,EACb,gBAAgB,EAChB,gBAAgB,EAChB,kBAAkB,GACrB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EACH,uBAAuB,EACvB,sBAAsB,GACzB,MAAM,mBAAmB,CAAC"}

package/dist/forms/components/schemaErrors.d.ts

@@ -0,0 +1,5 @@
+import { SchemaRenderable } from '@verbb/plugin-kit-forms';
+/** Collect `$field` names under a schema subtree for tab/wrapper error chrome. */
+export declare const collectSchemaFieldNames: (schema: SchemaRenderable, names?: Set<string>) => Set<string>;
+export declare const schemaSubtreeHasErrors: (errors: Record<string, unknown> | undefined, schema: SchemaRenderable) => boolean;
+//# sourceMappingURL=schemaErrors.d.ts.map

package/dist/forms/components/schemaErrors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"schemaErrors.d.ts","sourceRoot":"","sources":["../../../src/forms/components/schemaErrors.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAc,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAqB5E,kFAAkF;AAClF,eAAO,MAAM,uBAAuB,GAAI,QAAQ,gBAAgB,EAAE,QAAO,GAAG,CAAC,MAAM,CAAa,KAAG,GAAG,CAAC,MAAM,CA2B5G,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAC/B,QAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,SAAS,EAC3C,QAAQ,gBAAgB,KACzB,OAOF,CAAC"}

package/dist/forms/components/schemaErrors.js

@@ -0,0 +1,34 @@
+//#region src/forms/components/schemaErrors.ts
+var hasErrorValue = (value) => {
+	if (Array.isArray(value)) return value.length > 0;
+	if (!value) return false;
+	if (typeof value === "object") {
+		const entry = value;
+		if (Array.isArray(entry.errors)) return entry.errors.length > 0;
+	}
+	return Boolean(value);
+};
+/** Collect `$field` names under a schema subtree for tab/wrapper error chrome. */
+var collectSchemaFieldNames = (schema, names = /* @__PURE__ */ new Set()) => {
+	if (Array.isArray(schema)) {
+		schema.forEach((entry) => {
+			collectSchemaFieldNames(entry, names);
+		});
+		return names;
+	}
+	if (!schema || typeof schema !== "object") return names;
+	const node = schema;
+	if (node.$field && typeof node.name === "string" && node.name) names.add(node.name);
+	if (node.children) collectSchemaFieldNames(node.children, names);
+	if (node.schema) collectSchemaFieldNames(node.schema, names);
+	return names;
+};
+var schemaSubtreeHasErrors = (errors, schema) => {
+	if (!errors || !schema) return false;
+	const fieldNames = collectSchemaFieldNames(schema);
+	return Array.from(fieldNames).some((fieldName) => hasErrorValue(errors[fieldName]));
+};
+//#endregion
+export { collectSchemaFieldNames, schemaSubtreeHasErrors };
+
+//# sourceMappingURL=schemaErrors.js.map

package/dist/forms/components/schemaErrors.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"schemaErrors.js","names":[],"sources":["../../../src/forms/components/schemaErrors.ts"],"sourcesContent":["import type { SchemaNode, SchemaRenderable } from '@verbb/plugin-kit-forms';\n\nconst hasErrorValue = (value: unknown): boolean => {\n    if (Array.isArray(value)) {\n        return value.length > 0;\n    }\n\n    if (!value) {\n        return false;\n    }\n\n    if (typeof value === 'object') {\n        const entry = value as { errors?: unknown[] };\n        if (Array.isArray(entry.errors)) {\n            return entry.errors.length > 0;\n        }\n    }\n\n    return Boolean(value);\n};\n\n/** Collect `$field` names under a schema subtree for tab/wrapper error chrome. */\nexport const collectSchemaFieldNames = (schema: SchemaRenderable, names: Set<string> = new Set()): Set<string> => {\n    if (Array.isArray(schema)) {\n        schema.forEach((entry) => {\n            collectSchemaFieldNames(entry, names);\n        });\n        return names;\n    }\n\n    if (!schema || typeof schema !== 'object') {\n        return names;\n    }\n\n    const node = schema as SchemaNode;\n\n    if (node.$field && typeof node.name === 'string' && node.name) {\n        names.add(node.name);\n    }\n\n    if (node.children) {\n        collectSchemaFieldNames(node.children as SchemaRenderable, names);\n    }\n\n    if (node.schema) {\n        collectSchemaFieldNames(node.schema as SchemaRenderable, names);\n    }\n\n    return names;\n};\n\nexport const schemaSubtreeHasErrors = (\n    errors: Record<string, unknown> | undefined,\n    schema: SchemaRenderable,\n): boolean => {\n    if (!errors || !schema) {\n        return false;\n    }\n\n    const fieldNames = collectSchemaFieldNames(schema);\n    return Array.from(fieldNames).some((fieldName) => hasErrorValue(errors[fieldName]));\n};\n"],"mappings":";AAEA,IAAM,iBAAiB,UAA4B;AAC/C,KAAI,MAAM,QAAQ,MAAM,CACpB,QAAO,MAAM,SAAS;AAG1B,KAAI,CAAC,MACD,QAAO;AAGX,KAAI,OAAO,UAAU,UAAU;EAC3B,MAAM,QAAQ;AACd,MAAI,MAAM,QAAQ,MAAM,OAAO,CAC3B,QAAO,MAAM,OAAO,SAAS;;AAIrC,QAAO,QAAQ,MAAM;;;AAIzB,IAAa,2BAA2B,QAA0B,wBAAqB,IAAI,KAAK,KAAkB;AAC9G,KAAI,MAAM,QAAQ,OAAO,EAAE;AACvB,SAAO,SAAS,UAAU;AACtB,2BAAwB,OAAO,MAAM;IACvC;AACF,SAAO;;AAGX,KAAI,CAAC,UAAU,OAAO,WAAW,SAC7B,QAAO;CAGX,MAAM,OAAO;AAEb,KAAI,KAAK,UAAU,OAAO,KAAK,SAAS,YAAY,KAAK,KACrD,OAAM,IAAI,KAAK,KAAK;AAGxB,KAAI,KAAK,SACL,yBAAwB,KAAK,UAA8B,MAAM;AAGrE,KAAI,KAAK,OACL,yBAAwB,KAAK,QAA4B,MAAM;AAGnE,QAAO;;AAGX,IAAa,0BACT,QACA,WACU;AACV,KAAI,CAAC,UAAU,CAAC,OACZ,QAAO;CAGX,MAAM,aAAa,wBAAwB,OAAO;AAClD,QAAO,MAAM,KAAK,WAAW,CAAC,MAAM,cAAc,cAAc,OAAO,WAAW,CAAC"}