@bluprynt/forms-viewer 4.0.1 → 4.1.0

package/README.md

@@ -5,7 +5,7 @@ Headless React components for rendering and editing JSON-driven dynamic forms. P
 ## Key Capabilities
 
 - **Read-only rendering** — `FormViewer` renders a form from a definition and document using your custom view components, with automatic visibility and validation display.
-- **Editable forms** — `FormEditor` renders an editable form with per-field `onChange` handlers, array item manipulation (add, remove, move), and live re-validation on every change.
+- **Editable forms** — `FormEditor` renders an editable form with per-field `onChange` handlers, array and array-of-rows item manipulation (add, remove, move), and live re-validation on every change.
 - **Section navigation** — `FormSections` enumerates visible top-level sections (including a synthetic root for ungrouped fields) and tracks the active section.
 - **Validation display** — `FormFieldsValidation` groups field-level errors by field; `FormDocumentValidation` renders document-level errors (schema mismatch, missing `submittedAt`, etc.).
 - **Headless architecture** — all rendering is delegated to component maps you provide (`ViewerComponentMap`, `EditorComponentMap`), so the package has zero UI opinions.
@@ -220,11 +220,18 @@ Component map for read-only rendering. Each key maps a field type to a React com
 | `date` | `DateViewProps` | Date field display |
 | `select` | `SelectViewProps` | Select field display (receives `options`) |
 | `array` | `ArrayViewProps` | Array field display (receives `children` for items, `itemDef`) |
+| `array_obj?` | `ArrayObjViewProps` | Array-of-rows display. Receives `itemsDef`, the resolved `kind` (`'list'` \| `'table'`) and `children: ReactNode[][]`, indexed `children[row][subField]` and aligned with `itemsDef`. |
 | `file` | `FileViewProps` | File field display |
 | `section` | `SectionViewProps` | Section wrapper (receives `children`) |
+| `multiselect?` | `MultiselectViewProps` | Multi-select display. Value is `(string \| number)[]`; receives `options`. |
+| `static?` | `StaticViewProps` | Display-only text block. Receives **only** `field` — no `value`, `errors` or `suggestion`. |
+| `blockchain?` | `BlockchainViewProps` | CAIP address display. Value is a `string`, stored verbatim. |
+| `sustainability?` | `SustainabilityViewProps` | Sustainability references display. Value is `{ address, ccri?, cmc? }`. |
 | `error?` | `ErrorProps` | Optional inline error renderer |
 
-All view field props extend `BaseViewFieldProps` which provides `field: FieldContentItem` and `errors: FieldValidationError[]`.
+All view field props extend `BaseViewFieldProps` which provides `field: FieldContentItem` and `errors: FieldValidationError[]`. `StaticViewProps` is the exception: it carries only `field: StaticFieldContentItem`, whose `text` is the content and whose `label` is an optional heading.
+
+`array_obj`, `multiselect`, `static`, `blockchain` and `sustainability` are **optional** keys, so existing maps keep compiling. A field whose component is not supplied renders nothing rather than throwing.
 
 ### EditorComponentMap
 
@@ -238,11 +245,24 @@ Component map for editable rendering. Extends view props with mutation callbacks
 | `date` | `DateEditProps` | Date input with `onChange(value)` |
 | `select` | `SelectEditProps` | Select input with `onChange(value)` and `options` |
 | `array` | `ArrayEditProps` | Array editor with `onAddItem`, `onRemoveItem(index)`, `onMoveItem(from, to)` |
+| `array_obj?` | `ArrayObjEditProps` | Array-of-rows editor with the same three row handlers. `onAddItem` appends an empty row; the per-cell `onChange` reaches each sub-field component. |
 | `file` | `FileEditProps` | File input with `onChange(value)` |
 | `section` | `SectionEditProps` | Section wrapper (receives `children`) |
+| `multiselect?` | `MultiselectEditProps` | Checkbox group. `onChange((string \| number)[] \| undefined)` — send the whole array. |
+| `static?` | `StaticEditProps` | Display-only text block. Identical to `StaticViewProps`; there is nothing to edit. |
+| `blockchain?` | `BlockchainEditProps` | Text input with `onChange(value)`. The CAIP format is never checked by the engine. |
+| `sustainability?` | `SustainabilityEditProps` | Object editor with `onChange(value)` — send the whole `{ address, ccri, cmc }`. Emit `undefined` when every part is blank. |
 | `error?` | `ErrorProps` | Optional inline error renderer |
 
-All edit field props extend `BaseEditFieldProps` which adds `onChange(value)` to the base view props.
+All edit field props extend `BaseEditFieldProps`, which adds `onChange(value)` plus the optional
+`onAcceptSuggestion()` / `onRejectSuggestion()` handlers to the base view props. `StaticEditProps` does
+not — a static block has no `onChange`, so the same component serves both maps.
+
+Every field component — read-only and editable — also receives the field's authoring metadata on
+`field` (`description`, `placeholder`, `answer_guidelines`, `reference_id`) and an optional
+`suggestion` (`{ value, confidence, source }`) when the document carries one for that field. Accepting
+copies the suggested value into the field's value and keeps the suggestion; rejecting removes the
+suggestion and leaves the value alone. See [CHANGES.md](../../CHANGES.md).
 
 ## Exported API
 
@@ -267,10 +287,13 @@ All edit field props extend `BaseEditFieldProps` which adds `onChange(value)` to
 | `FormValuesEditor` | Class | Fluent editor for reading and writing form values against a definition |
 | `DocumentError` | Class | Error representing a document-level validation failure |
 | `FormDefinition` | Type | JSON schema describing form structure, fields, sections, and rules |
-| `FormDocument` | Type | JSON document containing user-submitted form values |
+| `FormDocument` | Type | JSON document containing user-submitted form values and optional suggestions |
+| `FieldSuggestion` | Type | A machine-proposed answer: `{ value, confidence, source }` |
+| `FormSuggestions` | Type | Sparse map of suggestions keyed by stringified field id |
 | `FormValidationResult` | Type | Validation outcome with document-level and field-level errors |
-| `FieldType` | Type | Union of supported field types (`string`, `number`, `boolean`, `date`, `select`, `array`, `file`) |
+| `FieldType` | Type | Union of supported field types (`string`, `number`, `boolean`, `date`, `select`, `multiselect`, `array`, `array_obj`, `file`, `static`, `blockchain`, `sustainability`) |
 | `FileValue` | Type | File field value containing name, MIME type, size, and URL |
+| `SustainabilityValue` | Type | Sustainability field value: `{ address, ccri?, cmc? }` |
 
 ## Documentation
 

package/dist/index.cjs

@@ -98,12 +98,15 @@ const getFieldErrors = (fieldErrors, fieldId, itemIndex) => {
 * Array fields store their per-item schema in `arrayField.item` ({@link ArrayItemDef}).
 * Components that render individual array items need a standard `FieldContentItem` shape,
 * so this helper projects the item definition into one, preserving the parent field's `id`
-* while adopting the item's `type`, `label`, `description`, `validation`, and `options`.
+* while adopting the item's `type`, `label`, authoring metadata, `validation`, and `options`.
+*
+* A `static` item projects to a `StaticFieldContentItem`, so the return type is
+* the wider {@link AnyFieldContentItem}.
 *
 * @param arrayField - The array field definition whose `.item` property describes the item schema.
 * @param _index - The zero-based position of the item in the array (reserved for future use,
 *   e.g. per-item overrides).
-* @returns A `FieldContentItem` that can be passed directly to a typed field component.
+* @returns An `AnyFieldContentItem` that can be passed directly to a typed field component.
 *
 * @example
 * ```ts
@@ -118,16 +121,79 @@ const getFieldErrors = (fieldErrors, fieldId, itemIndex) => {
 */
 const getArrayField = (arrayField, _index) => {
 	const itemDef = arrayField.item;
+	const metadata = {
+		description: itemDef.description,
+		placeholder: itemDef.placeholder,
+		answer_guidelines: itemDef.answer_guidelines,
+		reference_id: itemDef.reference_id
+	};
+	if (itemDef.type === "static") return {
+		id: arrayField.id,
+		type: "static",
+		text: itemDef.text,
+		label: itemDef.label,
+		...metadata
+	};
 	return {
 		id: arrayField.id,
 		type: itemDef.type,
 		label: itemDef.label,
-		description: itemDef.description,
+		...metadata,
 		validation: itemDef.validation,
 		options: itemDef.options
 	};
 };
 /**
+* Creates a {@link AnyFieldContentItem} representing one sub-field of an `array_obj` field.
+*
+* Unlike an `array` item, a sub-field carries its own id, so the projection keeps it:
+* it is both the key its value is stored under inside each row and a stable React key.
+*
+* @param subField - The sub-field definition taken from the field's `items` list.
+* @returns An `AnyFieldContentItem` that can be passed directly to a typed field component.
+*/
+const getArrayObjField = (subField) => {
+	const metadata = {
+		description: subField.description,
+		placeholder: subField.placeholder,
+		answer_guidelines: subField.answer_guidelines,
+		reference_id: subField.reference_id
+	};
+	if (subField.type === "static") return {
+		id: subField.id,
+		type: "static",
+		text: subField.text,
+		label: subField.label,
+		...metadata
+	};
+	return {
+		id: subField.id,
+		type: subField.type,
+		label: subField.label,
+		...metadata,
+		validation: subField.validation,
+		options: subField.options
+	};
+};
+/**
+* Retrieves the validation errors for one sub-field of one row of an `array_obj` field.
+*
+* Errors for an `array_obj` are all stored under the container's id; the row is
+* identified by `itemIndex` and the sub-field by `itemFieldId`.
+*
+* @param fieldErrors - Map from field id to its validation errors.
+* @param fieldId - The numeric id of the `array_obj` field.
+* @param index - Zero-based row index.
+* @param subFieldId - The numeric id of the sub-field.
+* @returns Errors for that cell. Empty array if none.
+*/
+const getArrayObjItemErrors = (fieldErrors, fieldId, index, subFieldId) => (fieldErrors.get(fieldId) ?? []).filter((e) => e.itemIndex === index && e.itemFieldId === subFieldId);
+/**
+* Retrieves the row-level validation errors for one row of an `array_obj` field --
+* those carrying an `itemIndex` but no `itemFieldId`, such as a row that is not an object.
+*/
+const getArrayObjRowErrors = (fieldErrors, fieldId, index) => (fieldErrors.get(fieldId) ?? []).filter((e) => e.itemIndex === index && e.itemFieldId == null);
+/**
 * Recursively searches content items for a section with the given id.
 *
 * Walks the content tree depth-first, checking sections and their nested
@@ -155,7 +221,13 @@ const findSection = (items, sectionId) => {
 };
 //#endregion
 //#region src/form/form-items.tsx
-const FormItems = ({ items, visibilityMap, values, fieldErrors, components, showInlineValidation, renderFieldProps, renderArrayItemProps }) => {
+/** Looks up the component for a value field type. Optional map keys may be absent. */
+const componentFor = (components, type) => components[type];
+/** `select` and `multiselect` components are the only ones that receive injected options. */
+const withOptions = (props, def) => {
+	if (def.type === "select" || def.type === "multiselect") props.options = def.options ?? [];
+};
+const FormItems = ({ items, visibilityMap, values, suggestions, fieldErrors, components, showInlineValidation, renderFieldProps, renderArrayItemProps, renderArrayObjItemProps }) => {
 	const SectionComponent = components.section;
 	const ErrorComponent = showInlineValidation ? components.error : void 0;
 	const elements = [];
@@ -167,11 +239,13 @@ const FormItems = ({ items, visibilityMap, values, fieldErrors, components, show
 				items: item.content,
 				visibilityMap,
 				values,
+				suggestions,
 				fieldErrors,
 				components,
 				showInlineValidation,
 				renderFieldProps,
-				renderArrayItemProps
+				renderArrayItemProps,
+				renderArrayObjItemProps
 			})
 		}, item.id));
 		else if (item.type === "array") {
@@ -180,23 +254,29 @@ const FormItems = ({ items, visibilityMap, values, fieldErrors, components, show
 			const ArrayComponent = components.array;
 			const arrayValue = values[String(item.id)] ?? [];
 			const itemDef = item.item;
-			const ItemComponent = components[itemDef.type];
-			elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ArrayComponent, {
+			const ItemComponent = componentFor(components, itemDef.type);
+			const arrayProps = {
 				field: item,
 				value: values[String(item.id)],
 				itemDef: item.item,
 				errors,
-				...modeProps,
+				...modeProps
+			};
+			const arraySuggestion = suggestions?.[String(item.id)];
+			if (arraySuggestion) arrayProps.suggestion = arraySuggestion;
+			elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ArrayComponent, {
+				...arrayProps,
 				children: ItemComponent ? arrayValue.map((itemValue, index) => {
-					const itemErrors = getFieldErrors(fieldErrors, item.id, index);
 					const synthetic = getArrayField(item, index);
+					if (synthetic.type === "static") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ItemComponent, { field: synthetic }) }, `${item.id}-${index}`);
+					const itemErrors = getFieldErrors(fieldErrors, item.id, index);
 					const baseProps = {
 						field: synthetic,
 						value: itemValue,
 						errors: itemErrors,
 						...renderArrayItemProps?.(item, index) ?? {}
 					};
-					if (itemDef.type === "select") baseProps.options = itemDef.options ?? [];
+					withOptions(baseProps, itemDef);
 					return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ItemComponent, { ...baseProps }), ErrorComponent && itemErrors.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorComponent, {
 						errors: itemErrors,
 						field: synthetic
@@ -207,6 +287,55 @@ const FormItems = ({ items, visibilityMap, values, fieldErrors, components, show
 				errors,
 				field: item
 			}, `${item.id}-error`));
+		} else if (item.type === "array_obj") {
+			const ArrayObjComponent = components.array_obj;
+			if (!ArrayObjComponent) continue;
+			const itemsDef = item.items ?? [];
+			const rows = values[String(item.id)] ?? [];
+			const errors = [...getFieldErrors(fieldErrors, item.id), ...rows.flatMap((_row, index) => getArrayObjRowErrors(fieldErrors, item.id, index))];
+			const modeProps = renderFieldProps?.(item) ?? {};
+			const arrayProps = {
+				field: item,
+				value: values[String(item.id)],
+				itemsDef,
+				kind: item.kind ?? "list",
+				errors,
+				...modeProps
+			};
+			const arraySuggestion = suggestions?.[String(item.id)];
+			if (arraySuggestion) arrayProps.suggestion = arraySuggestion;
+			const children = rows.map((row, index) => itemsDef.map((subField) => {
+				const key = `${item.id}-${index}-${subField.id}`;
+				const SubComponent = componentFor(components, subField.type);
+				if (!SubComponent) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, {}, key);
+				const synthetic = getArrayObjField(subField);
+				if (subField.type === "static") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Fragment, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SubComponent, { field: synthetic }) }, key);
+				const cellErrors = getArrayObjItemErrors(fieldErrors, item.id, index, subField.id);
+				const cellModeProps = renderArrayObjItemProps?.(item, index, subField.id) ?? {};
+				const cellProps = {
+					field: synthetic,
+					value: row?.[String(subField.id)],
+					errors: cellErrors,
+					...cellModeProps
+				};
+				withOptions(cellProps, subField);
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(SubComponent, { ...cellProps }), ErrorComponent && cellErrors.length > 0 && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorComponent, {
+					errors: cellErrors,
+					field: synthetic
+				})] }, key);
+			}));
+			elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ArrayObjComponent, {
+				...arrayProps,
+				children
+			}, item.id));
+			if (ErrorComponent && errors.length > 0) elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorComponent, {
+				errors,
+				field: item
+			}, `${item.id}-error`));
+		} else if (item.type === "static") {
+			const StaticComponent = components.static;
+			if (!StaticComponent) continue;
+			elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(StaticComponent, { field: item }, item.id));
 		} else {
 			const errors = getFieldErrors(fieldErrors, item.id);
 			const modeProps = renderFieldProps?.(item) ?? {};
@@ -216,8 +345,11 @@ const FormItems = ({ items, visibilityMap, values, fieldErrors, components, show
 				errors,
 				...modeProps
 			};
-			if (item.type === "select") fieldProps.options = item.options ?? [];
-			const FieldComponent = components[item.type];
+			const suggestion = suggestions?.[String(item.id)];
+			if (suggestion) fieldProps.suggestion = suggestion;
+			withOptions(fieldProps, item);
+			const FieldComponent = componentFor(components, item.type);
+			if (!FieldComponent) continue;
 			elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldComponent, { ...fieldProps }, item.id));
 			if (ErrorComponent && errors.length > 0) elements.push(/* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorComponent, {
 				errors,
@@ -231,18 +363,21 @@ const FormItems = ({ items, visibilityMap, values, fieldErrors, components, show
 //#endregion
 //#region src/form/form-content.tsx
 const FormContent = (props) => {
-	const { items, visibilityMap, values, fieldErrors, section, showInlineValidation } = props;
+	const { items, visibilityMap, values, suggestions, fieldErrors, section, showInlineValidation } = props;
 	const sharedProps = props.mode === "editor" ? {
 		visibilityMap,
 		values,
+		suggestions,
 		fieldErrors,
 		components: props.components,
 		showInlineValidation,
 		renderFieldProps: props.renderFieldProps,
-		renderArrayItemProps: props.renderArrayItemProps
+		renderArrayItemProps: props.renderArrayItemProps,
+		renderArrayObjItemProps: props.renderArrayObjItemProps
 	} : {
 		visibilityMap,
 		values,
+		suggestions,
 		fieldErrors,
 		components: props.components,
 		showInlineValidation
@@ -275,19 +410,21 @@ const resolveDefaultSection = (items, visibilityMap) => {
 //#region src/form-editor.tsx
 const FormEditor = ({ components, onChange }) => {
 	const { definition, data, visibilityMap, fieldErrors, section, engine, showInlineValidation, documentErrors } = useFormContext();
-	const { renderFieldProps, renderArrayItemProps } = useEditorHandlers(engine, data, onChange);
+	const { renderFieldProps, renderArrayItemProps, renderArrayObjItemProps } = useEditorHandlers(engine, data, onChange);
 	if (!definition || !data || documentErrors && documentErrors.length > 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FormContent, {
 		mode: "editor",
 		items: definition.content,
 		visibilityMap,
 		values: data.values,
+		suggestions: data.suggestions,
 		fieldErrors,
 		components,
 		section,
 		showInlineValidation,
 		renderFieldProps,
-		renderArrayItemProps
+		renderArrayItemProps,
+		renderArrayObjItemProps
 	});
 };
 const useEditorHandlers = (engine, data, onChange) => {
@@ -323,7 +460,7 @@ const useEditorHandlers = (engine, data, onChange) => {
 		return handler;
 	}, []);
 	const arrayHandlersMap = (0, react.useRef)(/* @__PURE__ */ new Map());
-	const getArrayHandlers = (0, react.useCallback)((fieldId) => {
+	const getArrayHandlers = (0, react.useCallback)((fieldId, newItem) => {
 		const key = String(fieldId);
 		let handlers = arrayHandlersMap.current.get(key);
 		if (!handlers) {
@@ -342,7 +479,7 @@ const useEditorHandlers = (engine, data, onChange) => {
 			};
 			handlers = {
 				onAddItem: () => fire((values) => {
-					values.push(void 0);
+					values.push(newItem());
 					return values;
 				}),
 				onRemoveItem: (index) => fire((values) => {
@@ -359,6 +496,26 @@ const useEditorHandlers = (engine, data, onChange) => {
 		}
 		return handlers;
 	}, []);
+	const suggestionHandlersMap = (0, react.useRef)(/* @__PURE__ */ new Map());
+	const getSuggestionHandlers = (0, react.useCallback)((fieldId) => {
+		const key = String(fieldId);
+		let handlers = suggestionHandlersMap.current.get(key);
+		if (!handlers) {
+			const fire = (next) => {
+				const { data, onChange, engine } = stateRef.current;
+				if (!data || !engine) return;
+				const document = next(data);
+				if (document === data) return;
+				onChange(document, engine.validate(document));
+			};
+			handlers = {
+				onAcceptSuggestion: () => fire((document) => (0, _bluprynt_forms_core.applySuggestion)(document, fieldId)),
+				onRejectSuggestion: () => fire((document) => (0, _bluprynt_forms_core.removeSuggestion)(document, fieldId))
+			};
+			suggestionHandlersMap.current.set(key, handlers);
+		}
+		return handlers;
+	}, []);
 	const arrayItemOnChangeMap = (0, react.useRef)(/* @__PURE__ */ new Map());
 	const getArrayItemOnChange = (0, react.useCallback)((fieldId, index) => {
 		const mapKey = `${fieldId}-${index}`;
@@ -383,15 +540,51 @@ const useEditorHandlers = (engine, data, onChange) => {
 		}
 		return handler;
 	}, []);
+	const arrayObjItemOnChangeMap = (0, react.useRef)(/* @__PURE__ */ new Map());
+	const getArrayObjItemOnChange = (0, react.useCallback)((fieldId, index, subFieldId) => {
+		const mapKey = `${fieldId}-${index}-${subFieldId}`;
+		let handler = arrayObjItemOnChangeMap.current.get(mapKey);
+		if (!handler) {
+			handler = (newValue) => {
+				const fieldKey = String(fieldId);
+				const { data, onChange, engine } = stateRef.current;
+				if (!data || !engine) return;
+				const rows = [...data.values[fieldKey] ?? []];
+				const current = rows[index];
+				rows[index] = {
+					...typeof current === "object" && current !== null && !Array.isArray(current) ? current : {},
+					[String(subFieldId)]: newValue
+				};
+				const document = {
+					...data,
+					values: {
+						...data.values,
+						[fieldKey]: rows
+					}
+				};
+				onChange(document, engine.validate(document));
+			};
+			arrayObjItemOnChangeMap.current.set(mapKey, handler);
+		}
+		return handler;
+	}, []);
 	return {
 		renderFieldProps: (field) => {
-			if (field.type === "array") return {
+			if (field.type === "array" || field.type === "array_obj") {
+				const newItem = field.type === "array_obj" ? () => ({}) : () => void 0;
+				return {
+					onChange: getFieldOnChange(field.id),
+					...getArrayHandlers(field.id, newItem),
+					...getSuggestionHandlers(field.id)
+				};
+			}
+			return {
 				onChange: getFieldOnChange(field.id),
-				...getArrayHandlers(field.id)
+				...getSuggestionHandlers(field.id)
 			};
-			return { onChange: getFieldOnChange(field.id) };
 		},
-		renderArrayItemProps: (field, index) => ({ onChange: getArrayItemOnChange(field.id, index) })
+		renderArrayItemProps: (field, index) => ({ onChange: getArrayItemOnChange(field.id, index) }),
+		renderArrayObjItemProps: (field, index, subFieldId) => ({ onChange: getArrayObjItemOnChange(field.id, index, subFieldId) })
 	};
 };
 //#endregion
@@ -418,7 +611,7 @@ const FormFieldsValidation = ({ container: ContainerComponent, field: FieldCompo
 	if (groups.length === 0) return null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ContainerComponent, { children: groups.map((group) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FieldComponent, {
 		...group,
-		children: group.errors.map((error) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorComponent, { ...error }, `${error.fieldId}-${error.rule}-${error.itemIndex ?? ""}`))
+		children: group.errors.map((error) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ErrorComponent, { ...error }, `${error.fieldId}-${error.rule}-${error.itemIndex ?? ""}-${error.itemFieldId ?? ""}`))
 	}, group.field?.id)) });
 };
 //#endregion
@@ -472,6 +665,7 @@ const FormViewer = ({ components }) => {
 		items: definition.content,
 		visibilityMap,
 		values: data.values,
+		suggestions: data.suggestions,
 		fieldErrors,
 		components,
 		section,