@whatsaaaa/form-builder-react 0.2.0 → 0.3.0

package/README.md

@@ -304,14 +304,14 @@ function Signup({ definition }: { definition: JsonForm }) {
 }
 ```
 
-| Member              |                                                                                                      |
-| ------------------- | ---------------------------------------------------------------------------------------------------- |
-| `list`              | every step, with its `step` as written (`id`, `label`, `description`, `ui`), `children` and `fields` |
-| `index`, `current`  | the step `<JsonFields>` renders                                                                      |
-| `isFirst`, `isLast` |                                                                                                      |
-| `next()`            | validates, and moves on when the step's fields have no issues. Resolves to whether it moved          |
-| `back()`            | moves back, without validating                                                                       |
-| `goTo(index)`       | back freely; forward through each step on the way, stopping at the first with issues                 |
+| Member              |                                                                                                                                                                                                    |
+| ------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `list`              | the steps on show, each with its `step` as written (`id`, `label`, `description`, `ui`), `children` and `fields`: a step that [conditions](#conditions) hide is left out, unless the user is on it |
+| `index`, `current`  | the step `<JsonFields>` renders                                                                                                                                                                    |
+| `isFirst`, `isLast` |                                                                                                                                                                                                    |
+| `next()`            | validates, and moves on when the step's fields have no issues. Resolves to whether it moved                                                                                                        |
+| `back()`            | moves back, without validating                                                                                                                                                                     |
+| `goTo(index)`       | back freely; forward through each step on the way, stopping at the first with issues                                                                                                               |
 
 The form is one Formisch form, so Formisch validates all of it at once. The steps make that work:
 
@@ -322,6 +322,30 @@ The form is one Formisch form, so Formisch validates all of it at once. The step
 - **A submit that fails because of an earlier step**, like a form rule that reads fields of two steps, goes back to that step.
 - `<JsonFields step={2} />` renders a given step instead of the current one, e.g. on a review page. A form without steps has one, and nothing changes for it.
 
+## Conditions
+
+With the [affects package](https://github.com/whatsaaaa/form-builder/tree/main/packages/affects), fields, sections and steps show and hide by the values of other fields. Pass `useJsonForm` a builder with the extension:
+
+```tsx
+import { affects } from '@whatsaaaa/form-builder-affects'
+
+const builder = createSchemaBuilder({ extensions: [affects()] })
+
+function DefinitionForm({ definition }: { definition: JsonForm }) {
+  const jsonForm = useJsonForm(definition, { builder, components, layoutComponents })
+  // ...
+}
+```
+
+- **`<JsonFields>` and `<JsonField>` leave out what the conditions hide**: a hidden field, a hidden section, and a group, section or row whose fields are all hidden. A field hidden in a row drops out of it, and the others keep their spans.
+- **Steps skip the hidden ones.** `steps.list` holds the steps on show, so a step whose fields are all hidden is left out, and Next and Back go past it. The step the user is on stays, until they leave it.
+- **`useJsonForm` clears what `hideAndClear` clears**, with Formisch's `setInput`, as soon as it is cleared, wherever the field renders: in `<JsonFields>`, with `<JsonField>`, or by your own code. A field that starts hidden this way starts blank.
+- **The schema skips hidden fields**, so they never block the form, and submits what the affects package says.
+- **The form renders again only when what is hidden changes**, not on every keystroke: `useJsonForm` watches the input outside React, through `@formisch/react/internals`.
+- **`jsonForm.visibility`** is the state for the form's input now, for your own renderers: `isHidden(node, indexes)`, `isStepHidden(step)`, `shownNodes(nodes, indexes)`. It is a new object only when what is hidden changes.
+
+Without conditions, nothing is hidden, nothing is watched, and nothing changes.
+
 ## Placing fields yourself
 
 Without a `layout`, `<JsonFields>` renders every field in the order of the definition. To put some of them somewhere else, in code rather than in the definition, place them with `<JsonField>` and leave them out of `<JsonFields>` with `except`:

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { FieldNode, FieldNode as FieldNode$1, FieldPath, FieldPath as FieldPath$1, FieldRole, FormLayout, FormLayout as FormLayout$1, JsonField as JsonField$1, JsonForm, JsonFormSchema, JsonFormSchema as JsonFormSchema$1, JsonLayoutRow, JsonLayoutSection, LayoutNode, LayoutStep, LayoutStep as LayoutStep$1, SchemaBuilder, TypedJsonFormSchema, TypedJsonFormSchema as TypedJsonFormSchema$1, ValueKind } from "@whatsaaaa/form-builder-schema";
+import { FieldNode, FieldNode as FieldNode$1, FieldPath, FieldPath as FieldPath$1, FieldRole, FormLayout, FormLayout as FormLayout$1, JsonField as JsonField$1, JsonForm, JsonFormSchema, JsonFormSchema as JsonFormSchema$1, JsonLayoutRow, JsonLayoutSection, LayoutNode, LayoutStep, LayoutStep as LayoutStep$1, SchemaBuilder, TypedJsonFormSchema, TypedJsonFormSchema as TypedJsonFormSchema$1, ValueKind, VisibilityState, VisibilityState as VisibilityState$1 } from "@whatsaaaa/form-builder-schema";
 import { FieldElementProps, FormSchema, FormStore, ValidationMode } from "@formisch/react";
 import { ComponentType, ReactElement, ReactNode } from "react";
 /**
@@ -75,7 +75,10 @@ interface RowProps {
 }
 /** The steps of a form, from its layout. A form without `steps` in its layout has one. */
 interface JsonFormSteps {
-  /** Every step, in order. */
+  /**
+   * The steps on show, in order. A step whose fields are all hidden by conditions, or that is
+   * hidden itself, is left out, unless it is the current one: Next and Back skip it.
+   */
   readonly list: readonly LayoutStep$1[];
   /** The index of the current step in `list`. */
   readonly index: number;
@@ -125,6 +128,13 @@ interface JsonFormInstance<TSchema extends FormSchema = JsonFormSchema$1> {
   readonly layout: FormLayout$1;
   /** The layout's steps: the current one, and Next, Back and Go to. A form without steps has one. */
   readonly steps: JsonFormSteps;
+  /**
+   * What the conditions of the builder's extensions hide for the form's input now, like the
+   * `affects` of `@whatsaaaa/form-builder-affects`: `<JsonFields>` and `<JsonField>` leave it out.
+   * Read it in your own renderers. A new object only when what is hidden changes, so the form
+   * re-renders for that, not for every keystroke. Without conditions, it hides nothing.
+   */
+  readonly visibility: VisibilityState$1;
 }
 /** Any form `useJsonForm` returns, typed or not: what the components take. */
 type AnyJsonFormInstance = JsonFormInstance<FormSchema>;
@@ -133,7 +143,9 @@ type AnyJsonFormInstance = JsonFormInstance<FormSchema>;
  * definition with issues throws the builder's `DefinitionError`, so run `validate()` first when it
  * comes from outside your code. Like Formisch's `useForm`, it reads the definition, the builder and
  * the validation modes on the first render: give the component a new `key` to use another
- * definition. The components and layout components are read on every render.
+ * definition. The components and layout components are read on every render. With conditions, it
+ * clears the fields they clear as soon as they do, with Formisch's `setInput`, wherever the fields
+ * are rendered.
  */
 export declare function useJsonForm(definition: JsonForm, options?: UseJsonFormOptions): JsonFormInstance;
 /**
@@ -152,8 +164,9 @@ interface JsonFieldProps {
 /**
  * Renders one field of a `useJsonForm` form, wherever you put it inside Formisch's `<Form>`. A
  * group or an array comes with its fields. Leave the field out of `<JsonFields>` with `except`.
+ * It renders nothing while conditions hide the field.
  */
-export declare function JsonField({ of, path, components }: JsonFieldProps): ReactElement;
+export declare function JsonField({ of, path, components }: JsonFieldProps): ReactElement | null;
 interface JsonFieldsProps {
   /** What `useJsonForm` returned. */
   of: AnyJsonFormInstance;
@@ -179,5 +192,5 @@ interface JsonFieldsProps {
  * nothing of its own, so put it inside Formisch's `<Form>` with your own submit button.
  */
 export declare function JsonFields(props: JsonFieldsProps): ReactElement;
-export type { AnyJsonFormInstance, ArrayFieldProps, DisplayFieldProps, FieldComponents, FieldNode, FieldPath, FieldRole, FormLayout, GroupFieldProps, JsonFieldProps, JsonFieldsProps, JsonFormInstance, JsonFormSchema, JsonFormSteps, LayoutComponents, LayoutNode, LayoutStep, RowProps, SectionProps, TypedJsonFormSchema, UseJsonFormOptions, ValueFieldProps };
+export type { AnyJsonFormInstance, ArrayFieldProps, DisplayFieldProps, FieldComponents, FieldNode, FieldPath, FieldRole, FormLayout, GroupFieldProps, JsonFieldProps, JsonFieldsProps, JsonFormInstance, JsonFormSchema, JsonFormSteps, LayoutComponents, LayoutNode, LayoutStep, RowProps, SectionProps, TypedJsonFormSchema, UseJsonFormOptions, ValueFieldProps, VisibilityState };
 //# sourceMappingURL=index.d.ts.map

package/dist/index.js

@@ -1,19 +1,21 @@
-import { checkComponents, checkLayoutComponents, coerceInput, createSchemaBuilder, dotPathOf, fieldPathsOf, findField, isRequired, issuesOfStep, selectFields, shownNodes, toFieldPath } from "@whatsaaaa/form-builder-schema";
-import { focus, getErrors, getInput, insert, move, remove, setErrors, useField, useFieldArray, useForm, validate } from "@formisch/react";
-import { Fragment, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { checkComponents, checkLayoutComponents, coerceInput, createSchemaBuilder, dotPathOf, fieldPathsOf, findField, isRequired, issuesOfStep, selectFields, toFieldPath } from "@whatsaaaa/form-builder-schema";
+import { focus, getErrors, getInput, insert, move, remove, setErrors, setInput, useField, useFieldArray, useForm, validate } from "@formisch/react";
+import { Fragment, useCallback, useEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
 import { Fragment as Fragment$1, jsx } from "react/jsx-runtime";
+import { INTERNAL, getFieldInput, setListener, untrack } from "@formisch/react/internals";
 // src/json-form-steps.ts
 const fieldEvents = /* @__PURE__ */ new WeakMap();
 /** What a field of `form` calls on each event, for a form with steps. Undefined with one step. */
 const fieldEventsOf = (form) => fieldEvents.get(form);
 /**
 * The steps of `layout`, for `useJsonForm`. With more than one, a step shows the errors it had
-* when the user left it, and none the first time they get to it, a step that failed Next revalidates as the user fixes it, a submit
-* before the last step moves on like Next, and a submit that fails because of an earlier step
-* goes back to it. Like Formisch's `useForm`, it reads the validation modes on the first render.
+* when the user left it, and none the first time they get to it, a step that failed Next
+* revalidates as the user fixes it, a submit before the last step moves on like Next, and a submit
+* that fails because of an earlier step goes back to it. The steps `visibility` hides are skipped.
+* Like Formisch's `useForm`, it reads the validation modes on the first render.
 */
-function useJsonFormSteps(form, layout, modes) {
-	const list = layout.steps;
+function useJsonFormSteps(form, layout, modes, visibility) {
+	const all = layout.steps;
 	const [index, setIndex] = useState(0);
 	const state = useRef({
 		index: 0,
@@ -25,22 +27,27 @@ function useJsonFormSteps(form, layout, modes) {
 	});
 	const methods = useMemo(() => {
 		const at = state.current;
+		const shown = () => all.filter((step, i) => i === at.index || !visibility.isStepHidden(step));
+		const position = (list) => list.indexOf(all[at.index]);
 		async function goTo(target) {
+			const list = shown();
 			if (!Number.isInteger(target) || target < 0 || target >= list.length) throw new RangeError(`No step ${target}. The form has ${list.length}.`);
-			if (target <= at.index) {
-				move(target);
+			const to = all.indexOf(list[target]);
+			if (target <= position(list)) {
+				move(to);
 				return true;
 			}
+			await afterTask();
 			const { issues } = await validate(form);
-			for (let step = at.index; step < target; step++) {
-				const found = issuesOfStep(list[step], issues);
+			for (const step of list.slice(position(list), target)) {
+				const found = issuesOfStep(step, issues);
 				if (found.length) {
-					stop(step, found);
+					stop(all.indexOf(step), found);
 					return false;
 				}
-				at.failed.delete(step);
+				at.failed.delete(all.indexOf(step));
 			}
-			move(target);
+			move(to);
 			return true;
 		}
 		/**
@@ -51,7 +58,7 @@ function useJsonFormSteps(form, layout, modes) {
 		function move(target) {
 			leave();
 			const errors = at.left.get(target);
-			for (const path of fieldPathsOf(list[target], getInput(form))) setErrors(form, {
+			for (const path of fieldPathsOf(all[target], getInput(form))) setErrors(form, {
 				path,
 				errors: errors?.get(JSON.stringify(path)) ?? null
 			});
@@ -60,7 +67,7 @@ function useJsonFormSteps(form, layout, modes) {
 		}
 		/** Keeps the errors of the current step, for when the user comes back to it. */
 		function leave() {
-			const errors = fieldPathsOf(list[at.index], getInput(form)).map((path) => [JSON.stringify(path), getErrors(form, { path })]);
+			const errors = fieldPathsOf(all[at.index], getInput(form)).map((path) => [JSON.stringify(path), getErrors(form, { path })]);
 			at.left.set(at.index, new Map(errors));
 		}
 		/** Stays on, or goes to, the step at `target`, with its issues shown. */
@@ -84,33 +91,45 @@ function useJsonFormSteps(form, layout, modes) {
 		/** After a failed submit: back to the first step before this one with issues, if any. */
 		async function afterSubmit() {
 			const { issues } = await validate(form);
-			const step = list.findIndex((each) => issuesOfStep(each, issues).length);
-			if (step !== -1 && step < at.index) stop(step, issuesOfStep(list[step], issues));
+			const list = shown();
+			const step = list.find((each) => issuesOfStep(each, issues).length);
+			if (step && list.indexOf(step) < position(list)) stop(all.indexOf(step), issuesOfStep(step, issues));
 		}
-		const next = () => at.index === list.length - 1 ? Promise.resolve(false) : goTo(at.index + 1);
+		const isLast = () => {
+			const list = shown();
+			return position(list) === list.length - 1;
+		};
+		const next = () => isLast() ? Promise.resolve(false) : goTo(position(shown()) + 1);
 		const back = () => {
-			if (at.index > 0) move(at.index - 1);
+			const list = shown();
+			const before = list[position(list) - 1];
+			if (before) move(all.indexOf(before));
 		};
 		return {
 			goTo,
 			next,
 			back,
+			isLast,
 			events,
 			afterSubmit
 		};
-	}, [form, list]);
+	}, [
+		form,
+		all,
+		visibility
+	]);
 	useEffect(() => {
 		const path = state.current.focus;
 		state.current.focus = void 0;
 		if (path) focus(form, { path });
 	}, [form, index]);
-	const stepped = list.length > 1;
+	const stepped = all.length > 1;
 	useEffect(() => {
 		if (!stepped) return;
 		fieldEvents.set(form, methods.events);
 		const onSubmit = (event) => {
 			if (event.target !== formElementOf(form)) return;
-			if (state.current.index === list.length - 1) {
+			if (methods.isLast()) {
 				state.current.submitting = true;
 				return;
 			}
@@ -125,7 +144,6 @@ function useJsonFormSteps(form, layout, modes) {
 		};
 	}, [
 		form,
-		list,
 		methods,
 		stepped
 	]);
@@ -135,21 +153,29 @@ function useJsonFormSteps(form, layout, modes) {
 		state.current.submitting = false;
 		if (!form.isValid) methods.afterSubmit();
 	});
-	return useMemo(() => ({
-		list,
-		index,
-		current: list[index],
-		isFirst: index === 0,
-		isLast: index === list.length - 1,
-		next: methods.next,
-		back: methods.back,
-		goTo: methods.goTo
-	}), [
-		list,
+	return useMemo(() => {
+		const list = all.filter((step, i) => i === index || !visibility.isStepHidden(step));
+		const current = all[index];
+		const at = list.indexOf(current);
+		return {
+			list,
+			index: at,
+			current,
+			isFirst: at === 0,
+			isLast: at === list.length - 1,
+			next: methods.next,
+			back: methods.back,
+			goTo: methods.goTo
+		};
+	}, [
+		all,
 		index,
+		visibility,
 		methods
 	]);
 }
+/** Resolves once the task that called it is over, and the browser is done with its event. */
+const afterTask = () => new Promise((resolve) => setTimeout(resolve));
 /** The `<form>` Formisch's `<Form>` renders, which it keeps on the store for its `submit()`. */
 function formElementOf(form) {
 	return form["~internal"]?.element;
@@ -246,9 +272,13 @@ function resolveComponents(components, of) {
 	if (!resolved) throw new TypeError("No field components. Pass them to useJsonForm, or to the component.");
 	return resolved;
 }
-/** `indexes` are the indexes of the array items the fields are in, outermost first. */
+/**
+* Renders the fields that conditions don't hide. `indexes` are the indexes of the array items the
+* fields are in, outermost first.
+*/
 function renderFields(ctx, nodes, indexes) {
-	return nodes.map((node, position) => renderField(ctx, node, indexes, dotPathOf(node) ?? `#${position}`, (inner) => renderFields(ctx, node.children, inner)));
+	const { visibility } = ctx.of;
+	return nodes.flatMap((node, position) => visibility.isHidden(node, indexes) ? [] : [renderField(ctx, node, indexes, dotPathOf(node) ?? `#${position}`, (inner) => renderFields(ctx, node.children, inner))]);
 }
 /**
 * Renders one field with its component. `children` renders the fields inside a group, or inside
@@ -283,6 +313,7 @@ function renderField(ctx, node, indexes, key, children) {
 /**
 * Renders one field of a `useJsonForm` form, wherever you put it inside Formisch's `<Form>`. A
 * group or an array comes with its fields. Leave the field out of `<JsonFields>` with `except`.
+* It renders nothing while conditions hide the field.
 */
 function JsonField({ of, path, components }) {
 	const node = findField(of.fields, path, { placed: true });
@@ -291,15 +322,17 @@ function JsonField({ of, path, components }) {
 		components: resolveComponents(components, of)
 	};
 	checkComponents([node], ctx.components);
+	if (of.visibility.isHidden(node, [])) return null;
 	return renderField(ctx, node, [], dotPathOf(node) ?? "#0", (indexes) => renderFields(ctx, node.children, indexes));
 }
 // src/render-layout.tsx
 /**
-* Renders layout nodes. A field left out drops out, and so does a section or a row left without
-* fields. `indexes` are the indexes of the array items the nodes are in, outermost first.
+* Renders layout nodes. A field left out or hidden by conditions drops out, and so does a section
+* hidden by them, and a section or a row left without fields. `indexes` are the indexes of the
+* array items the nodes are in, outermost first.
 */
 function renderLayout(ctx, nodes, indexes) {
-	return shownNodes(nodes, indexes, ctx.isShown).map((node) => renderNode(ctx, node, indexes));
+	return ctx.of.visibility.shownNodes(nodes, indexes, ctx.isShown).map((node) => renderNode(ctx, node, indexes));
 }
 function renderNode(ctx, node, indexes) {
 	const { key } = node;
@@ -366,6 +399,47 @@ function fieldsOf(nodes) {
 		return node.type === "field" ? [node.node, ...inner] : inner;
 	});
 }
+// src/use-visibility.ts
+/**
+* What the conditions of the definition hide for the form's input, as it changes. Formisch
+* re-renders a component for each signal it reads, so reading the whole input in `useJsonForm`
+* would re-render the form on every keystroke. This watches the input outside React instead, and
+* re-renders only when the state changes: `of()` gives the same object until then. Without
+* conditions, it watches nothing.
+*/
+function useVisibility(form, visibility) {
+	const subscribe = useCallback((onChange) => visibility.conditional ? watchInput(form, onChange) : () => {}, [form, visibility]);
+	const getSnapshot = () => visibility.of(visibility.conditional ? untrack(() => getFieldInput(form[INTERNAL])) : void 0);
+	return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);
+}
+/**
+* Calls `onChange` after each change of the form's input, until the function it returns is called.
+* It reads the input as Formisch's own components do, with a listener: a signal that changes calls
+* it once, so it reads the input again each time, the items of new array items too.
+*/
+function watchInput(form, onChange) {
+	const listener = [() => {
+		read();
+		onChange();
+	}, /* @__PURE__ */ new Set()];
+	const stop = () => {
+		for (const subscribers of listener[1]) subscribers.delete(listener);
+		listener[1].clear();
+	};
+	function read() {
+		stop();
+		untrack(() => {
+			setListener(listener);
+			try {
+				getFieldInput(form[INTERNAL]);
+			} finally {
+				setListener(void 0);
+			}
+		});
+	}
+	read();
+	return stop;
+}
 // src/use-json-form.ts
 function useJsonForm(definition, options = {}) {
 	const [built] = useState(() => {
@@ -376,7 +450,8 @@ function useJsonForm(definition, options = {}) {
 			schema: builder.build(definition),
 			initialInput: builder.getInitialInput(definition),
 			fields: builder.getFieldTree(definition),
-			layout: builder.getLayout(definition)
+			layout: builder.getLayout(definition),
+			visibility: builder.getVisibility(definition)
 		};
 	});
 	const form = useForm({
@@ -385,7 +460,15 @@ function useJsonForm(definition, options = {}) {
 		validate: options.validate,
 		revalidate: options.revalidate
 	});
-	const steps = useJsonFormSteps(form, built.layout, options);
+	const visibility = useVisibility(form, built.visibility);
+	const { toClear } = visibility;
+	useEffect(() => {
+		for (const { path, input } of toClear) setInput(form, {
+			path,
+			input
+		});
+	}, [form, toClear]);
+	const steps = useJsonFormSteps(form, built.layout, options, visibility);
 	const { components, layoutComponents } = options;
 	return useMemo(() => ({
 		form,
@@ -395,13 +478,15 @@ function useJsonForm(definition, options = {}) {
 		layoutComponents,
 		fields: built.fields,
 		layout: built.layout,
-		steps
+		steps,
+		visibility
 	}), [
 		form,
 		built,
 		components,
 		layoutComponents,
-		steps
+		steps,
+		visibility
 	]);
 }
 export { JsonField, JsonFields, useJsonForm };

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["Display","Group"],"sources":["../src/json-form-steps.ts","../src/array-field.tsx","../src/value-field.tsx","../src/render-fields.tsx","../src/json-field.tsx","../src/render-layout.tsx","../src/json-fields.tsx","../src/use-json-form.ts"],"sourcesContent":["import {\n  focus,\n  type FormStore,\n  getErrors,\n  getInput,\n  setErrors,\n  validate,\n  type ValidationMode,\n} from '@formisch/react'\nimport {\n  type FieldPath,\n  fieldPathsOf,\n  type FormLayout,\n  issuesOfStep,\n  type LayoutStep,\n  type StepIssue,\n} from '@whatsaaaa/form-builder-schema'\nimport { useEffect, useMemo, useRef, useState } from 'react'\n\n/** The steps of a form, from its layout. A form without `steps` in its layout has one. */\nexport interface JsonFormSteps {\n  /** Every step, in order. */\n  readonly list: readonly LayoutStep[]\n  /** The index of the current step in `list`. */\n  readonly index: number\n  /** The step `<JsonFields>` renders. */\n  readonly current: LayoutStep\n  readonly isFirst: boolean\n  readonly isLast: boolean\n  /**\n   * Validates the whole form, and moves to the next step when the fields of this one have no\n   * issues. Otherwise it stays, and focuses the first field with an issue, in layout order.\n   * Resolves to whether it moved.\n   */\n  next(): Promise<boolean>\n  /** Moves to the step before, without validating. */\n  back(): void\n  /**\n   * Moves to the step at `index`. Back is free, and forward validates every step on the way, like\n   * `next()`, and stops at the first with issues. Resolves to whether it got there.\n   */\n  goTo(index: number): Promise<boolean>\n}\n\n/** A field's error messages in Formisch, or null. */\ntype Errors = [string, ...string[]] | null\n\n/** What a field tells the steps it was through, by Formisch's name for the validation mode. */\nexport type FieldEvent = Exclude<ValidationMode, 'initial' | 'submit'>\n\n/** Revalidates a step that failed Next on each field event, like a form after a failed submit. */\ntype FieldEvents = (event: FieldEvent) => void\n\nconst fieldEvents = new WeakMap<FormStore, FieldEvents>()\n\n/** What a field of `form` calls on each event, for a form with steps. Undefined with one step. */\nexport const fieldEventsOf = (form: FormStore): FieldEvents | undefined => fieldEvents.get(form)\n\ninterface Modes {\n  validate?: ValidationMode | undefined\n  revalidate?: Exclude<ValidationMode, 'initial'> | undefined\n}\n\n/**\n * The steps of `layout`, for `useJsonForm`. With more than one, a step shows the errors it had\n * when the user left it, and none the first time they get to it, a step that failed Next revalidates as the user fixes it, a submit\n * before the last step moves on like Next, and a submit that fails because of an earlier step\n * goes back to it. Like Formisch's `useForm`, it reads the validation modes on the first render.\n */\nexport function useJsonFormSteps(form: FormStore, layout: FormLayout, modes: Modes): JsonFormSteps {\n  const list = layout.steps\n  const [index, setIndex] = useState(0)\n  // What the async methods and the event handlers read: always the latest.\n  const state = useRef({\n    index: 0,\n    // The errors each step had when the user left it, by the JSON of each field's path.\n    left: new Map<number, Map<string, Errors>>(),\n    // The steps that failed Next, and haven't passed since.\n    failed: new Set<number>(),\n    // The field to focus once the step it is on has rendered.\n    focus: undefined as FieldPath | undefined,\n    // Whether a submit on the last step is on its way through Formisch.\n    submitting: false,\n    modes,\n  })\n\n  const methods = useMemo(() => {\n    const at = state.current\n\n    async function goTo(target: number): Promise<boolean> {\n      if (!Number.isInteger(target) || target < 0 || target >= list.length) {\n        throw new RangeError(`No step ${target}. The form has ${list.length}.`)\n      }\n      if (target <= at.index) {\n        move(target)\n        return true\n      }\n      const { issues } = await validate(form)\n      for (let step = at.index; step < target; step++) {\n        const found = issuesOfStep(list[step] as LayoutStep, issues)\n        if (found.length) {\n          stop(step, found)\n          return false\n        }\n        at.failed.delete(step)\n      }\n      move(target)\n      return true\n    }\n\n    /**\n     * Moves to a step as the user left it: with the errors it had then, and none the first time, and\n     * revalidating if it failed Next. Validating the steps before set errors on its fields, which\n     * the user never saw.\n     */\n    function move(target: number) {\n      leave()\n      const errors = at.left.get(target)\n      for (const path of fieldPathsOf(list[target] as LayoutStep, getInput(form))) {\n        setErrors(form, { path, errors: errors?.get(JSON.stringify(path)) ?? null } as never)\n      }\n      at.index = target\n      setIndex(target)\n    }\n\n    /** Keeps the errors of the current step, for when the user comes back to it. */\n    function leave() {\n      const paths = fieldPathsOf(list[at.index] as LayoutStep, getInput(form))\n      const errors = paths.map((path): [string, Errors] => [\n        JSON.stringify(path),\n        getErrors(form, { path } as never),\n      ])\n      at.left.set(at.index, new Map(errors))\n    }\n\n    /** Stays on, or goes to, the step at `target`, with its issues shown. */\n    function stop(target: number, found: readonly StepIssue[]) {\n      at.failed.add(target)\n      // A group or an array has no element: the first field that has one gets the focus.\n      const path = found.find((issue) => issue.field.role === 'value')?.path\n      if (target === at.index) {\n        if (path) focus(form, { path: path as never })\n        return\n      }\n      leave()\n      at.focus = path\n      at.index = target\n      setIndex(target)\n    }\n\n    const events: FieldEvents = (event) => {\n      // In the other modes, Formisch revalidates a field with errors itself.\n      const validateMode = at.modes.validate ?? 'submit'\n      if (!at.failed.has(at.index) || validateMode !== 'submit' || form.isSubmitted) return\n      if (event === (at.modes.revalidate ?? 'input')) void validate(form)\n    }\n\n    /** After a failed submit: back to the first step before this one with issues, if any. */\n    async function afterSubmit() {\n      const { issues } = await validate(form)\n      const step = list.findIndex((each) => issuesOfStep(each, issues).length)\n      if (step !== -1 && step < at.index) stop(step, issuesOfStep(list[step] as LayoutStep, issues))\n    }\n\n    const next = () => (at.index === list.length - 1 ? Promise.resolve(false) : goTo(at.index + 1))\n    const back = () => {\n      if (at.index > 0) move(at.index - 1)\n    }\n    return { goTo, next, back, events, afterSubmit }\n  }, [form, list])\n\n  // The field a step was stopped on, once the step has rendered.\n  useEffect(() => {\n    const path = state.current.focus\n    state.current.focus = undefined\n    if (path) focus(form, { path: path as never })\n  }, [form, index])\n\n  const stepped = list.length > 1\n  useEffect(() => {\n    if (!stepped) return\n    fieldEvents.set(form, methods.events)\n    // Before the last step, a submit, like Enter in a step with a single text input, is a Next.\n    // It is caught on its way down to the form, before Formisch's own handler sees it.\n    const onSubmit = (event: Event) => {\n      if (event.target !== formElementOf(form)) return\n      if (state.current.index === list.length - 1) {\n        state.current.submitting = true\n        return\n      }\n      event.preventDefault()\n      event.stopImmediatePropagation()\n      void methods.next()\n    }\n    document.addEventListener('submit', onSubmit, { capture: true })\n    return () => {\n      fieldEvents.delete(form)\n      document.removeEventListener('submit', onSubmit, { capture: true })\n    }\n  }, [form, list, methods, stepped])\n\n  // A submit that fails because of a step before the last, e.g. on a form rule, goes back to it.\n  // React can batch the start and the end of a submit into one render, so the submit is marked\n  // as it starts, and each render checks whether Formisch has finished it.\n  const submitting = form.isSubmitting\n  useEffect(() => {\n    if (!state.current.submitting || submitting) return\n    state.current.submitting = false\n    if (!form.isValid) void methods.afterSubmit()\n  })\n\n  return useMemo(\n    () => ({\n      list,\n      index,\n      current: list[index] as LayoutStep,\n      isFirst: index === 0,\n      isLast: index === list.length - 1,\n      next: methods.next,\n      back: methods.back,\n      goTo: methods.goTo,\n    }),\n    [list, index, methods],\n  )\n}\n\n/** The `<form>` Formisch's `<Form>` renders, which it keeps on the store for its `submit()`. */\nfunction formElementOf(form: FormStore): HTMLFormElement | undefined {\n  return (form as unknown as { '~internal'?: { element?: HTMLFormElement } })['~internal']?.element\n}\n","import { insert, move, remove, useFieldArray } from '@formisch/react'\nimport type { FieldNode, FieldPath } from '@whatsaaaa/form-builder-schema'\nimport { type ComponentType, type ReactElement, type ReactNode, useMemo } from 'react'\nimport type { ArrayFieldProps } from './field-components'\nimport { fieldEventsOf } from './json-form-steps'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\ninterface ArrayFieldConnectionProps {\n  of: AnyJsonFormInstance\n  node: FieldNode\n  path: FieldPath\n  component: ComponentType<ArrayFieldProps>\n  /** Renders the fields of the item at `index`. */\n  renderItem: (index: number) => ReactNode\n}\n\n/** Connects a container of kind `array` to Formisch, and renders your component for it. */\nexport function ArrayField({\n  of,\n  node,\n  path,\n  component: Component,\n  renderItem,\n}: ArrayFieldConnectionProps): ReactElement {\n  // The path comes from the definition at runtime, so the schema's types can't check it.\n  const array = useFieldArray(of.form, { path: path as never })\n\n  // Formisch keeps the path it got while the array is the same, so the methods stay the same too.\n  const { form, builder } = of\n  const { field } = node\n  const at = array.path\n  // In a form with steps, a step that failed Next revalidates on a change of its items too.\n  const methods = useMemo(\n    () => ({\n      // A new item starts with the defaults of its fields, like the items of a new form.\n      add: () => {\n        insert(form, { path: at, initialInput: builder.getItemInput(field) as never })\n        fieldEventsOf(form)?.('input')\n      },\n      remove: (index: number) => {\n        remove(form, { path: at, at: index })\n        fieldEventsOf(form)?.('input')\n      },\n      move: (from: number, to: number) => {\n        move(form, { path: at, from, to })\n        fieldEventsOf(form)?.('input')\n      },\n    }),\n    [form, builder, field, at],\n  )\n\n  return (\n    <Component field={field} path={path} items={array.items} errors={array.errors} {...methods}>\n      {renderItem}\n    </Component>\n  )\n}\n","import { useField } from '@formisch/react'\nimport {\n  coerceInput,\n  type FieldNode,\n  type FieldPath,\n  isRequired,\n} from '@whatsaaaa/form-builder-schema'\nimport { type ComponentType, type ReactElement, useCallback } from 'react'\nimport type { ValueFieldProps } from './field-components'\nimport { fieldEventsOf } from './json-form-steps'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\ninterface ValueFieldConnectionProps {\n  of: AnyJsonFormInstance\n  node: FieldNode\n  path: FieldPath\n  component: ComponentType<ValueFieldProps>\n}\n\n/** Connects a field with a value to Formisch, and renders your component for it. */\nexport function ValueField({\n  of,\n  node,\n  path,\n  component: Component,\n}: ValueFieldConnectionProps): ReactElement {\n  // The path comes from the definition at runtime, so the schema's types can't check it.\n  const field = useField(of.form, { path: path as never })\n  const { form } = of\n  const setInput = useCallback(\n    (input: unknown) => {\n      field.onChange(coerceInput(input, node) as never)\n      fieldEventsOf(form)?.('input')\n    },\n    [field, node, form],\n  )\n  // In a form with steps, a step that failed Next revalidates on these events too.\n  const inputProps =\n    of.steps.list.length > 1\n      ? {\n          ...field.props,\n          onFocus: () => {\n            field.props.onFocus()\n            fieldEventsOf(form)?.('touch')\n          },\n          onChange: (event: Parameters<typeof field.props.onChange>[0]) => {\n            field.props.onChange(event)\n            fieldEventsOf(form)?.('input')\n            fieldEventsOf(form)?.('change')\n          },\n          onBlur: () => {\n            field.props.onBlur()\n            fieldEventsOf(form)?.('blur')\n          },\n        }\n      : field.props\n\n  return (\n    <Component\n      field={node.field}\n      path={path}\n      kind={node.kind}\n      required={isRequired(node.field)}\n      input={field.input}\n      errors={field.errors}\n      inputProps={inputProps}\n      setInput={setInput}\n    />\n  )\n}\n","import { dotPathOf, type FieldNode, toFieldPath } from '@whatsaaaa/form-builder-schema'\nimport type { ComponentType, ReactElement, ReactNode } from 'react'\nimport { ArrayField } from './array-field'\nimport type {\n  ArrayFieldProps,\n  DisplayFieldProps,\n  FieldComponents,\n  GroupFieldProps,\n  ValueFieldProps,\n} from './field-components'\nimport type { AnyJsonFormInstance } from './use-json-form'\nimport { ValueField } from './value-field'\n\n/** What `<JsonFields>` and `<JsonField>` render with. */\nexport interface RenderContext {\n  of: AnyJsonFormInstance\n  components: FieldComponents\n}\n\n/** The components from the props, or else the ones `useJsonForm` got. */\nexport function resolveComponents(\n  components: FieldComponents | undefined,\n  of: AnyJsonFormInstance,\n): FieldComponents {\n  const resolved = components ?? of.components\n  if (!resolved) {\n    throw new TypeError('No field components. Pass them to useJsonForm, or to the component.')\n  }\n  return resolved\n}\n\n/** `indexes` are the indexes of the array items the fields are in, outermost first. */\nexport function renderFields(\n  ctx: RenderContext,\n  nodes: readonly FieldNode[],\n  indexes: readonly number[],\n): ReactElement[] {\n  return nodes.map((node, position) =>\n    renderField(ctx, node, indexes, dotPathOf(node) ?? `#${position}`, (inner) =>\n      renderFields(ctx, node.children, inner),\n    ),\n  )\n}\n\n/**\n * Renders one field with its component. `children` renders the fields inside a group, or inside\n * the item of an array, with the indexes of the items they are in.\n */\nexport function renderField(\n  ctx: RenderContext,\n  node: FieldNode,\n  indexes: readonly number[],\n  key: string,\n  children: (indexes: readonly number[]) => ReactNode,\n): ReactElement {\n  // The fields were checked for components, and the role tells which props the component takes.\n  const component = ctx.components[node.type]\n  const path = toFieldPath(node.dataPath, indexes)\n  switch (node.role) {\n    case 'display': {\n      const Display = component as ComponentType<DisplayFieldProps>\n      return <Display key={key} field={node.field} />\n    }\n    case 'group': {\n      const Group = component as ComponentType<GroupFieldProps>\n      return (\n        <Group key={key} field={node.field} path={path}>\n          {children(indexes)}\n        </Group>\n      )\n    }\n    case 'array':\n      return (\n        <ArrayField\n          key={key}\n          of={ctx.of}\n          node={node}\n          path={path}\n          component={component as ComponentType<ArrayFieldProps>}\n          renderItem={(index) => children([...indexes, index])}\n        />\n      )\n    case 'value':\n      return (\n        <ValueField\n          key={key}\n          of={ctx.of}\n          node={node}\n          path={path}\n          component={component as ComponentType<ValueFieldProps>}\n        />\n      )\n  }\n}\n","import { checkComponents, dotPathOf, findField } from '@whatsaaaa/form-builder-schema'\nimport type { ReactElement } from 'react'\nimport type { FieldComponents } from './field-components'\nimport { type RenderContext, renderField, renderFields, resolveComponents } from './render-fields'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\nexport interface JsonFieldProps {\n  /** What `useJsonForm` returned. */\n  of: AnyJsonFormInstance\n  /** The field's path: `'email'`, or `'address.city'` for a field of a group. */\n  path: string\n  /** Defaults to the components `useJsonForm` got. */\n  components?: FieldComponents | undefined\n}\n\n/**\n * Renders one field of a `useJsonForm` form, wherever you put it inside Formisch's `<Form>`. A\n * group or an array comes with its fields. Leave the field out of `<JsonFields>` with `except`.\n */\nexport function JsonField({ of, path, components }: JsonFieldProps): ReactElement {\n  const node = findField(of.fields, path, { placed: true })\n  const ctx: RenderContext = { of, components: resolveComponents(components, of) }\n  checkComponents([node], ctx.components)\n\n  return renderField(ctx, node, [], dotPathOf(node) ?? '#0', (indexes) =>\n    renderFields(ctx, node.children, indexes),\n  )\n}\n","import { type IsFieldShown, type LayoutNode, shownNodes } from '@whatsaaaa/form-builder-schema'\nimport { type ComponentType, Fragment, type ReactElement, type ReactNode } from 'react'\nimport type { LayoutComponents, RowProps, SectionProps } from './field-components'\nimport { type RenderContext, renderField } from './render-fields'\n\n/** What `<JsonFields>` renders a layout with. */\nexport interface LayoutContext extends RenderContext {\n  layoutComponents: LayoutComponents\n  /** The content of the layout's slots, by name. */\n  slots: Readonly<Record<string, ReactNode>>\n  /** False for a field left out with `except`. */\n  isShown: IsFieldShown\n}\n\n/**\n * Renders layout nodes. A field left out drops out, and so does a section or a row left without\n * fields. `indexes` are the indexes of the array items the nodes are in, outermost first.\n */\nexport function renderLayout(\n  ctx: LayoutContext,\n  nodes: readonly LayoutNode[],\n  indexes: readonly number[],\n): ReactElement[] {\n  return shownNodes(nodes, indexes, ctx.isShown).map((node) => renderNode(ctx, node, indexes))\n}\n\nfunction renderNode(\n  ctx: LayoutContext,\n  node: LayoutNode,\n  indexes: readonly number[],\n): ReactElement {\n  const { key } = node\n  switch (node.type) {\n    case 'field':\n      return renderField(ctx, node.node, indexes, key, (inner) =>\n        renderLayout(ctx, node.children, inner),\n      )\n    case 'section': {\n      // The layout was checked for components.\n      const Section = ctx.layoutComponents.section as ComponentType<SectionProps>\n      return (\n        <Section key={key} section={node.section}>\n          {renderLayout(ctx, node.children, indexes)}\n        </Section>\n      )\n    }\n    case 'row': {\n      const Row = ctx.layoutComponents.row as ComponentType<RowProps>\n      return (\n        <Row key={key} row={node.row} spans={node.children.map((cell) => cell.span)}>\n          {(index) => renderNode(ctx, node.children[index] as LayoutNode, indexes)}\n        </Row>\n      )\n    }\n    case 'slot':\n      return <Fragment key={key}>{ctx.slots[node.name]}</Fragment>\n  }\n}\n","import {\n  checkComponents,\n  checkLayoutComponents,\n  dotPathOf,\n  type FieldNode,\n  type LayoutNode,\n  selectFields,\n} from '@whatsaaaa/form-builder-schema'\nimport { Fragment, type ReactElement, type ReactNode } from 'react'\nimport type { FieldComponents, LayoutComponents } from './field-components'\nimport { type LayoutContext, renderLayout } from './render-layout'\nimport { type RenderContext, renderFields, resolveComponents } from './render-fields'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\nexport interface JsonFieldsProps {\n  /** What `useJsonForm` returned. */\n  of: AnyJsonFormInstance\n  /** Defaults to the components `useJsonForm` got. */\n  components?: FieldComponents | undefined\n  /** Defaults to the layout components `useJsonForm` got. */\n  layoutComponents?: LayoutComponents | undefined\n  /** The content of the layout's slots, by name: `{ submit: <button type=\"submit\">Save</button> }`. */\n  slots?: Readonly<Record<string, ReactNode>> | undefined\n  /** Renders only these fields, by path, in the order of the definition, without the layout. */\n  only?: readonly string[] | undefined\n  /**\n   * Leaves out these fields, by path, e.g. the ones you place with `<JsonField>`. A section or a\n   * row left without fields drops out too.\n   */\n  except?: readonly string[] | undefined\n  /** Renders the step at this index instead of the current one, e.g. on a review page. */\n  step?: number | undefined\n}\n\n/**\n * Renders the fields of a `useJsonForm` form with your components, one per field type, where the\n * definition's `layout` puts them: the current step, with its sections, rows and slots. It renders\n * nothing of its own, so put it inside Formisch's `<Form>` with your own submit button.\n */\nexport function JsonFields(props: JsonFieldsProps): ReactElement {\n  const { of, only, except } = props\n  const ctx: RenderContext = { of, components: resolveComponents(props.components, of) }\n  const nodes = selectFields(of.fields, { only, except })\n  // Without a layout, it renders the fields the way it always did, and so with `only`.\n  if (only || !of.definition.layout) {\n    checkComponents(nodes, ctx.components)\n    return <>{renderFields(ctx, nodes, [])}</>\n  }\n\n  const { layout, steps } = of\n  const left = new Set(except)\n  const layoutCtx: LayoutContext = {\n    ...ctx,\n    layoutComponents: props.layoutComponents ?? of.layoutComponents ?? {},\n    slots: props.slots ?? {},\n    isShown: (node) => !left.has(dotPathOf(node) ?? ''),\n  }\n  checkComponents(\n    layout.steps.flatMap((step) => fieldsOf(step.children)),\n    ctx.components,\n  )\n  checkLayoutComponents(layout, layoutCtx.layoutComponents, layoutCtx.slots)\n\n  const index = props.step ?? steps.index\n  const step = steps.list[index]\n  if (!step) throw new RangeError(`No step ${props.step}. The form has ${steps.list.length}.`)\n  // Keyed by the step, so another step's fields don't take over this one's components.\n  return <Fragment key={index}>{renderLayout(layoutCtx, step.children, [])}</Fragment>\n}\n\n/** Every field of the nodes, display elements written in the layout included. */\nfunction fieldsOf(nodes: readonly LayoutNode[]): FieldNode[] {\n  return nodes.flatMap((node) => {\n    if (node.type === 'slot') return []\n    const inner = fieldsOf(node.children)\n    return node.type === 'field' ? [node.node, ...inner] : inner\n  })\n}\n","import { type FormSchema, type FormStore, useForm, type ValidationMode } from '@formisch/react'\nimport {\n  createSchemaBuilder,\n  type FieldNode,\n  type FormLayout,\n  type JsonForm,\n  type JsonFormSchema,\n  type SchemaBuilder,\n  type TypedJsonFormSchema,\n} from '@whatsaaaa/form-builder-schema'\nimport { useMemo, useState } from 'react'\nimport type { FieldComponents, LayoutComponents } from './field-components'\nimport { type JsonFormSteps, useJsonFormSteps } from './json-form-steps'\n\nexport interface UseJsonFormOptions {\n  /** Builds the schema and knows your own types and rules. Defaults to `createSchemaBuilder()`. */\n  builder?: SchemaBuilder\n  /** Your component for each field type, so `<JsonFields>` and `<JsonField>` don't need them. */\n  components?: FieldComponents\n  /** Your component for each layout type the definition's `layout` uses, like `section`. */\n  layoutComponents?: LayoutComponents\n  /** When a field is validated the first time, as in Formisch. */\n  validate?: ValidationMode\n  /** When a field is validated again after that, as in Formisch. */\n  revalidate?: Exclude<ValidationMode, 'initial'>\n}\n\n/** What `useJsonForm` returns. Pass it to `<JsonFields>`. */\nexport interface JsonFormInstance<TSchema extends FormSchema = JsonFormSchema> {\n  /** The Formisch form: pass it to Formisch's `<Form of>`, or to any of its methods. */\n  readonly form: FormStore<TSchema>\n  readonly definition: JsonForm\n  readonly builder: SchemaBuilder\n  /** The components from the options, if any. */\n  readonly components: FieldComponents | undefined\n  /** The layout components from the options, if any. */\n  readonly layoutComponents: LayoutComponents | undefined\n  /** The definition's fields as a tree, for `<JsonFields only>` and `<JsonField>`. */\n  readonly fields: readonly FieldNode[]\n  /** The definition's layout, the way `<JsonFields>` renders it. */\n  readonly layout: FormLayout\n  /** The layout's steps: the current one, and Next, Back and Go to. A form without steps has one. */\n  readonly steps: JsonFormSteps\n}\n\n/** Any form `useJsonForm` returns, typed or not: what the components take. */\nexport type AnyJsonFormInstance = JsonFormInstance<FormSchema>\n\n/**\n * A Formisch form for a definition, with its schema and initial input from the builder. A\n * definition with issues throws the builder's `DefinitionError`, so run `validate()` first when it\n * comes from outside your code. Like Formisch's `useForm`, it reads the definition, the builder and\n * the validation modes on the first render: give the component a new `key` to use another\n * definition. The components and layout components are read on every render.\n */\nexport function useJsonForm(definition: JsonForm, options?: UseJsonFormOptions): JsonFormInstance\n/**\n * The same, with the form typed by your input type, and output type when it differs, so Formisch's\n * paths and values are checked. The types are yours to keep in step with the definition.\n */\nexport function useJsonForm<TInput extends object, TOutput extends object = TInput>(\n  definition: JsonForm,\n  options?: UseJsonFormOptions,\n): JsonFormInstance<TypedJsonFormSchema<TInput, TOutput>>\nexport function useJsonForm(\n  definition: JsonForm,\n  options: UseJsonFormOptions = {},\n): JsonFormInstance {\n  // Formisch reads its config on the first render only, so the schema is built once too.\n  const [built] = useState(() => {\n    const builder = options.builder ?? createSchemaBuilder()\n    return {\n      definition,\n      builder,\n      schema: builder.build(definition),\n      initialInput: builder.getInitialInput(definition),\n      fields: builder.getFieldTree(definition),\n      layout: builder.getLayout(definition),\n    }\n  })\n  const form = useForm({\n    schema: built.schema,\n    initialInput: built.initialInput,\n    validate: options.validate,\n    revalidate: options.revalidate,\n  })\n  const steps = useJsonFormSteps(form, built.layout, options)\n  const { components, layoutComponents } = options\n  return useMemo(\n    () => ({\n      form,\n      definition: built.definition,\n      builder: built.builder,\n      components,\n      layoutComponents,\n      fields: built.fields,\n      layout: built.layout,\n      steps,\n    }),\n    [form, built, components, layoutComponents, steps],\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["Display","Group"],"sources":["../src/json-form-steps.ts","../src/array-field.tsx","../src/value-field.tsx","../src/render-fields.tsx","../src/json-field.tsx","../src/render-layout.tsx","../src/json-fields.tsx","../src/use-visibility.ts","../src/use-json-form.ts"],"sourcesContent":["import {\n  focus,\n  type FormStore,\n  getErrors,\n  getInput,\n  setErrors,\n  validate,\n  type ValidationMode,\n} from '@formisch/react'\nimport {\n  type FieldPath,\n  fieldPathsOf,\n  type FormLayout,\n  issuesOfStep,\n  type LayoutStep,\n  type StepIssue,\n  type VisibilityState,\n} from '@whatsaaaa/form-builder-schema'\nimport { useEffect, useMemo, useRef, useState } from 'react'\n\n/** The steps of a form, from its layout. A form without `steps` in its layout has one. */\nexport interface JsonFormSteps {\n  /**\n   * The steps on show, in order. A step whose fields are all hidden by conditions, or that is\n   * hidden itself, is left out, unless it is the current one: Next and Back skip it.\n   */\n  readonly list: readonly LayoutStep[]\n  /** The index of the current step in `list`. */\n  readonly index: number\n  /** The step `<JsonFields>` renders. */\n  readonly current: LayoutStep\n  readonly isFirst: boolean\n  readonly isLast: boolean\n  /**\n   * Validates the whole form, and moves to the next step when the fields of this one have no\n   * issues. Otherwise it stays, and focuses the first field with an issue, in layout order.\n   * Resolves to whether it moved.\n   */\n  next(): Promise<boolean>\n  /** Moves to the step before, without validating. */\n  back(): void\n  /**\n   * Moves to the step at `index`. Back is free, and forward validates every step on the way, like\n   * `next()`, and stops at the first with issues. Resolves to whether it got there.\n   */\n  goTo(index: number): Promise<boolean>\n}\n\n/** A field's error messages in Formisch, or null. */\ntype Errors = [string, ...string[]] | null\n\n/** What a field tells the steps it was through, by Formisch's name for the validation mode. */\nexport type FieldEvent = Exclude<ValidationMode, 'initial' | 'submit'>\n\n/** Revalidates a step that failed Next on each field event, like a form after a failed submit. */\ntype FieldEvents = (event: FieldEvent) => void\n\nconst fieldEvents = new WeakMap<FormStore, FieldEvents>()\n\n/** What a field of `form` calls on each event, for a form with steps. Undefined with one step. */\nexport const fieldEventsOf = (form: FormStore): FieldEvents | undefined => fieldEvents.get(form)\n\ninterface Modes {\n  validate?: ValidationMode | undefined\n  revalidate?: Exclude<ValidationMode, 'initial'> | undefined\n}\n\n/**\n * The steps of `layout`, for `useJsonForm`. With more than one, a step shows the errors it had\n * when the user left it, and none the first time they get to it, a step that failed Next\n * revalidates as the user fixes it, a submit before the last step moves on like Next, and a submit\n * that fails because of an earlier step goes back to it. The steps `visibility` hides are skipped.\n * Like Formisch's `useForm`, it reads the validation modes on the first render.\n */\nexport function useJsonFormSteps(\n  form: FormStore,\n  layout: FormLayout,\n  modes: Modes,\n  visibility: VisibilityState,\n): JsonFormSteps {\n  const all = layout.steps\n  // The current step, by its index in `all`, as are the steps in `state` below.\n  const [index, setIndex] = useState(0)\n  // What the async methods and the event handlers read: always the latest.\n  const state = useRef({\n    index: 0,\n    // The errors each step had when the user left it, by the JSON of each field's path.\n    left: new Map<number, Map<string, Errors>>(),\n    // The steps that failed Next, and haven't passed since.\n    failed: new Set<number>(),\n    // The field to focus once the step it is on has rendered.\n    focus: undefined as FieldPath | undefined,\n    // Whether a submit on the last step is on its way through Formisch.\n    submitting: false,\n    modes,\n  })\n\n  const methods = useMemo(() => {\n    const at = state.current\n    // The current step stays on show, so it never goes from under the user.\n    const shown = () => all.filter((step, i) => i === at.index || !visibility.isStepHidden(step))\n    const position = (list: readonly LayoutStep[]) => list.indexOf(all[at.index] as LayoutStep)\n\n    async function goTo(target: number): Promise<boolean> {\n      const list = shown()\n      if (!Number.isInteger(target) || target < 0 || target >= list.length) {\n        throw new RangeError(`No step ${target}. The form has ${list.length}.`)\n      }\n      const to = all.indexOf(list[target] as LayoutStep)\n      if (target <= position(list)) {\n        move(to)\n        return true\n      }\n      // Next goes on once the task that called it is over. A click runs its default action after its\n      // handlers, and React can render in between: a Next button that turns into the submit button on\n      // the last step would then submit the form as the user gets there.\n      await afterTask()\n      const { issues } = await validate(form)\n      for (const step of list.slice(position(list), target)) {\n        const found = issuesOfStep(step, issues)\n        if (found.length) {\n          stop(all.indexOf(step), found)\n          return false\n        }\n        at.failed.delete(all.indexOf(step))\n      }\n      move(to)\n      return true\n    }\n\n    /**\n     * Moves to a step as the user left it: with the errors it had then, and none the first time, and\n     * revalidating if it failed Next. Validating the steps before set errors on its fields, which\n     * the user never saw.\n     */\n    function move(target: number) {\n      leave()\n      const errors = at.left.get(target)\n      for (const path of fieldPathsOf(all[target] as LayoutStep, getInput(form))) {\n        setErrors(form, { path, errors: errors?.get(JSON.stringify(path)) ?? null } as never)\n      }\n      at.index = target\n      setIndex(target)\n    }\n\n    /** Keeps the errors of the current step, for when the user comes back to it. */\n    function leave() {\n      const paths = fieldPathsOf(all[at.index] as LayoutStep, getInput(form))\n      const errors = paths.map((path): [string, Errors] => [\n        JSON.stringify(path),\n        getErrors(form, { path } as never),\n      ])\n      at.left.set(at.index, new Map(errors))\n    }\n\n    /** Stays on, or goes to, the step at `target`, with its issues shown. */\n    function stop(target: number, found: readonly StepIssue[]) {\n      at.failed.add(target)\n      // A group or an array has no element: the first field that has one gets the focus.\n      const path = found.find((issue) => issue.field.role === 'value')?.path\n      if (target === at.index) {\n        if (path) focus(form, { path: path as never })\n        return\n      }\n      leave()\n      at.focus = path\n      at.index = target\n      setIndex(target)\n    }\n\n    const events: FieldEvents = (event) => {\n      // In the other modes, Formisch revalidates a field with errors itself.\n      const validateMode = at.modes.validate ?? 'submit'\n      if (!at.failed.has(at.index) || validateMode !== 'submit' || form.isSubmitted) return\n      if (event === (at.modes.revalidate ?? 'input')) void validate(form)\n    }\n\n    /** After a failed submit: back to the first step before this one with issues, if any. */\n    async function afterSubmit() {\n      const { issues } = await validate(form)\n      const list = shown()\n      const step = list.find((each) => issuesOfStep(each, issues).length)\n      if (step && list.indexOf(step) < position(list)) {\n        stop(all.indexOf(step), issuesOfStep(step, issues))\n      }\n    }\n\n    const isLast = () => {\n      const list = shown()\n      return position(list) === list.length - 1\n    }\n    const next = () => (isLast() ? Promise.resolve(false) : goTo(position(shown()) + 1))\n    const back = () => {\n      const list = shown()\n      const before = list[position(list) - 1]\n      if (before) move(all.indexOf(before))\n    }\n    return { goTo, next, back, isLast, events, afterSubmit }\n  }, [form, all, visibility])\n\n  // The field a step was stopped on, once the step has rendered.\n  useEffect(() => {\n    const path = state.current.focus\n    state.current.focus = undefined\n    if (path) focus(form, { path: path as never })\n  }, [form, index])\n\n  const stepped = all.length > 1\n  useEffect(() => {\n    if (!stepped) return\n    fieldEvents.set(form, methods.events)\n    // Before the last step, a submit, like Enter in a step with a single text input, is a Next.\n    // It is caught on its way down to the form, before Formisch's own handler sees it.\n    const onSubmit = (event: Event) => {\n      if (event.target !== formElementOf(form)) return\n      if (methods.isLast()) {\n        state.current.submitting = true\n        return\n      }\n      event.preventDefault()\n      event.stopImmediatePropagation()\n      void methods.next()\n    }\n    document.addEventListener('submit', onSubmit, { capture: true })\n    return () => {\n      fieldEvents.delete(form)\n      document.removeEventListener('submit', onSubmit, { capture: true })\n    }\n  }, [form, methods, stepped])\n\n  // A submit that fails because of a step before the last, e.g. on a form rule, goes back to it.\n  // React can batch the start and the end of a submit into one render, so the submit is marked\n  // as it starts, and each render checks whether Formisch has finished it.\n  const submitting = form.isSubmitting\n  useEffect(() => {\n    if (!state.current.submitting || submitting) return\n    state.current.submitting = false\n    if (!form.isValid) void methods.afterSubmit()\n  })\n\n  return useMemo(() => {\n    const list = all.filter((step, i) => i === index || !visibility.isStepHidden(step))\n    const current = all[index] as LayoutStep\n    const at = list.indexOf(current)\n    return {\n      list,\n      index: at,\n      current,\n      isFirst: at === 0,\n      isLast: at === list.length - 1,\n      next: methods.next,\n      back: methods.back,\n      goTo: methods.goTo,\n    }\n  }, [all, index, visibility, methods])\n}\n\n/** Resolves once the task that called it is over, and the browser is done with its event. */\nconst afterTask = () => new Promise<void>((resolve) => setTimeout(resolve))\n\n/** The `<form>` Formisch's `<Form>` renders, which it keeps on the store for its `submit()`. */\nfunction formElementOf(form: FormStore): HTMLFormElement | undefined {\n  return (form as unknown as { '~internal'?: { element?: HTMLFormElement } })['~internal']?.element\n}\n","import { insert, move, remove, useFieldArray } from '@formisch/react'\nimport type { FieldNode, FieldPath } from '@whatsaaaa/form-builder-schema'\nimport { type ComponentType, type ReactElement, type ReactNode, useMemo } from 'react'\nimport type { ArrayFieldProps } from './field-components'\nimport { fieldEventsOf } from './json-form-steps'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\ninterface ArrayFieldConnectionProps {\n  of: AnyJsonFormInstance\n  node: FieldNode\n  path: FieldPath\n  component: ComponentType<ArrayFieldProps>\n  /** Renders the fields of the item at `index`. */\n  renderItem: (index: number) => ReactNode\n}\n\n/** Connects a container of kind `array` to Formisch, and renders your component for it. */\nexport function ArrayField({\n  of,\n  node,\n  path,\n  component: Component,\n  renderItem,\n}: ArrayFieldConnectionProps): ReactElement {\n  // The path comes from the definition at runtime, so the schema's types can't check it.\n  const array = useFieldArray(of.form, { path: path as never })\n\n  // Formisch keeps the path it got while the array is the same, so the methods stay the same too.\n  const { form, builder } = of\n  const { field } = node\n  const at = array.path\n  // In a form with steps, a step that failed Next revalidates on a change of its items too.\n  const methods = useMemo(\n    () => ({\n      // A new item starts with the defaults of its fields, like the items of a new form.\n      add: () => {\n        insert(form, { path: at, initialInput: builder.getItemInput(field) as never })\n        fieldEventsOf(form)?.('input')\n      },\n      remove: (index: number) => {\n        remove(form, { path: at, at: index })\n        fieldEventsOf(form)?.('input')\n      },\n      move: (from: number, to: number) => {\n        move(form, { path: at, from, to })\n        fieldEventsOf(form)?.('input')\n      },\n    }),\n    [form, builder, field, at],\n  )\n\n  return (\n    <Component field={field} path={path} items={array.items} errors={array.errors} {...methods}>\n      {renderItem}\n    </Component>\n  )\n}\n","import { useField } from '@formisch/react'\nimport {\n  coerceInput,\n  type FieldNode,\n  type FieldPath,\n  isRequired,\n} from '@whatsaaaa/form-builder-schema'\nimport { type ComponentType, type ReactElement, useCallback } from 'react'\nimport type { ValueFieldProps } from './field-components'\nimport { fieldEventsOf } from './json-form-steps'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\ninterface ValueFieldConnectionProps {\n  of: AnyJsonFormInstance\n  node: FieldNode\n  path: FieldPath\n  component: ComponentType<ValueFieldProps>\n}\n\n/** Connects a field with a value to Formisch, and renders your component for it. */\nexport function ValueField({\n  of,\n  node,\n  path,\n  component: Component,\n}: ValueFieldConnectionProps): ReactElement {\n  // The path comes from the definition at runtime, so the schema's types can't check it.\n  const field = useField(of.form, { path: path as never })\n  const { form } = of\n  const setInput = useCallback(\n    (input: unknown) => {\n      field.onChange(coerceInput(input, node) as never)\n      fieldEventsOf(form)?.('input')\n    },\n    [field, node, form],\n  )\n  // In a form with steps, a step that failed Next revalidates on these events too.\n  const inputProps =\n    of.steps.list.length > 1\n      ? {\n          ...field.props,\n          onFocus: () => {\n            field.props.onFocus()\n            fieldEventsOf(form)?.('touch')\n          },\n          onChange: (event: Parameters<typeof field.props.onChange>[0]) => {\n            field.props.onChange(event)\n            fieldEventsOf(form)?.('input')\n            fieldEventsOf(form)?.('change')\n          },\n          onBlur: () => {\n            field.props.onBlur()\n            fieldEventsOf(form)?.('blur')\n          },\n        }\n      : field.props\n\n  return (\n    <Component\n      field={node.field}\n      path={path}\n      kind={node.kind}\n      required={isRequired(node.field)}\n      input={field.input}\n      errors={field.errors}\n      inputProps={inputProps}\n      setInput={setInput}\n    />\n  )\n}\n","import { dotPathOf, type FieldNode, toFieldPath } from '@whatsaaaa/form-builder-schema'\nimport type { ComponentType, ReactElement, ReactNode } from 'react'\nimport { ArrayField } from './array-field'\nimport type {\n  ArrayFieldProps,\n  DisplayFieldProps,\n  FieldComponents,\n  GroupFieldProps,\n  ValueFieldProps,\n} from './field-components'\nimport type { AnyJsonFormInstance } from './use-json-form'\nimport { ValueField } from './value-field'\n\n/** What `<JsonFields>` and `<JsonField>` render with. */\nexport interface RenderContext {\n  of: AnyJsonFormInstance\n  components: FieldComponents\n}\n\n/** The components from the props, or else the ones `useJsonForm` got. */\nexport function resolveComponents(\n  components: FieldComponents | undefined,\n  of: AnyJsonFormInstance,\n): FieldComponents {\n  const resolved = components ?? of.components\n  if (!resolved) {\n    throw new TypeError('No field components. Pass them to useJsonForm, or to the component.')\n  }\n  return resolved\n}\n\n/**\n * Renders the fields that conditions don't hide. `indexes` are the indexes of the array items the\n * fields are in, outermost first.\n */\nexport function renderFields(\n  ctx: RenderContext,\n  nodes: readonly FieldNode[],\n  indexes: readonly number[],\n): ReactElement[] {\n  const { visibility } = ctx.of\n  // A display element is keyed by its position among all the nodes, which stays the same.\n  return nodes.flatMap((node, position) =>\n    visibility.isHidden(node, indexes)\n      ? []\n      : [\n          renderField(ctx, node, indexes, dotPathOf(node) ?? `#${position}`, (inner) =>\n            renderFields(ctx, node.children, inner),\n          ),\n        ],\n  )\n}\n\n/**\n * Renders one field with its component. `children` renders the fields inside a group, or inside\n * the item of an array, with the indexes of the items they are in.\n */\nexport function renderField(\n  ctx: RenderContext,\n  node: FieldNode,\n  indexes: readonly number[],\n  key: string,\n  children: (indexes: readonly number[]) => ReactNode,\n): ReactElement {\n  // The fields were checked for components, and the role tells which props the component takes.\n  const component = ctx.components[node.type]\n  const path = toFieldPath(node.dataPath, indexes)\n  switch (node.role) {\n    case 'display': {\n      const Display = component as ComponentType<DisplayFieldProps>\n      return <Display key={key} field={node.field} />\n    }\n    case 'group': {\n      const Group = component as ComponentType<GroupFieldProps>\n      return (\n        <Group key={key} field={node.field} path={path}>\n          {children(indexes)}\n        </Group>\n      )\n    }\n    case 'array':\n      return (\n        <ArrayField\n          key={key}\n          of={ctx.of}\n          node={node}\n          path={path}\n          component={component as ComponentType<ArrayFieldProps>}\n          renderItem={(index) => children([...indexes, index])}\n        />\n      )\n    case 'value':\n      return (\n        <ValueField\n          key={key}\n          of={ctx.of}\n          node={node}\n          path={path}\n          component={component as ComponentType<ValueFieldProps>}\n        />\n      )\n  }\n}\n","import { checkComponents, dotPathOf, findField } from '@whatsaaaa/form-builder-schema'\nimport type { ReactElement } from 'react'\nimport type { FieldComponents } from './field-components'\nimport { type RenderContext, renderField, renderFields, resolveComponents } from './render-fields'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\nexport interface JsonFieldProps {\n  /** What `useJsonForm` returned. */\n  of: AnyJsonFormInstance\n  /** The field's path: `'email'`, or `'address.city'` for a field of a group. */\n  path: string\n  /** Defaults to the components `useJsonForm` got. */\n  components?: FieldComponents | undefined\n}\n\n/**\n * Renders one field of a `useJsonForm` form, wherever you put it inside Formisch's `<Form>`. A\n * group or an array comes with its fields. Leave the field out of `<JsonFields>` with `except`.\n * It renders nothing while conditions hide the field.\n */\nexport function JsonField({ of, path, components }: JsonFieldProps): ReactElement | null {\n  const node = findField(of.fields, path, { placed: true })\n  const ctx: RenderContext = { of, components: resolveComponents(components, of) }\n  checkComponents([node], ctx.components)\n\n  if (of.visibility.isHidden(node, [])) return null\n  return renderField(ctx, node, [], dotPathOf(node) ?? '#0', (indexes) =>\n    renderFields(ctx, node.children, indexes),\n  )\n}\n","import type { IsFieldShown, LayoutNode } from '@whatsaaaa/form-builder-schema'\nimport { type ComponentType, Fragment, type ReactElement, type ReactNode } from 'react'\nimport type { LayoutComponents, RowProps, SectionProps } from './field-components'\nimport { type RenderContext, renderField } from './render-fields'\n\n/** What `<JsonFields>` renders a layout with. */\nexport interface LayoutContext extends RenderContext {\n  layoutComponents: LayoutComponents\n  /** The content of the layout's slots, by name. */\n  slots: Readonly<Record<string, ReactNode>>\n  /** False for a field left out with `except`. */\n  isShown: IsFieldShown\n}\n\n/**\n * Renders layout nodes. A field left out or hidden by conditions drops out, and so does a section\n * hidden by them, and a section or a row left without fields. `indexes` are the indexes of the\n * array items the nodes are in, outermost first.\n */\nexport function renderLayout(\n  ctx: LayoutContext,\n  nodes: readonly LayoutNode[],\n  indexes: readonly number[],\n): ReactElement[] {\n  return ctx.of.visibility\n    .shownNodes(nodes, indexes, ctx.isShown)\n    .map((node) => renderNode(ctx, node, indexes))\n}\n\nfunction renderNode(\n  ctx: LayoutContext,\n  node: LayoutNode,\n  indexes: readonly number[],\n): ReactElement {\n  const { key } = node\n  switch (node.type) {\n    case 'field':\n      return renderField(ctx, node.node, indexes, key, (inner) =>\n        renderLayout(ctx, node.children, inner),\n      )\n    case 'section': {\n      // The layout was checked for components.\n      const Section = ctx.layoutComponents.section as ComponentType<SectionProps>\n      return (\n        <Section key={key} section={node.section}>\n          {renderLayout(ctx, node.children, indexes)}\n        </Section>\n      )\n    }\n    case 'row': {\n      const Row = ctx.layoutComponents.row as ComponentType<RowProps>\n      return (\n        <Row key={key} row={node.row} spans={node.children.map((cell) => cell.span)}>\n          {(index) => renderNode(ctx, node.children[index] as LayoutNode, indexes)}\n        </Row>\n      )\n    }\n    case 'slot':\n      return <Fragment key={key}>{ctx.slots[node.name]}</Fragment>\n  }\n}\n","import {\n  checkComponents,\n  checkLayoutComponents,\n  dotPathOf,\n  type FieldNode,\n  type LayoutNode,\n  selectFields,\n} from '@whatsaaaa/form-builder-schema'\nimport { Fragment, type ReactElement, type ReactNode } from 'react'\nimport type { FieldComponents, LayoutComponents } from './field-components'\nimport { type LayoutContext, renderLayout } from './render-layout'\nimport { type RenderContext, renderFields, resolveComponents } from './render-fields'\nimport type { AnyJsonFormInstance } from './use-json-form'\n\nexport interface JsonFieldsProps {\n  /** What `useJsonForm` returned. */\n  of: AnyJsonFormInstance\n  /** Defaults to the components `useJsonForm` got. */\n  components?: FieldComponents | undefined\n  /** Defaults to the layout components `useJsonForm` got. */\n  layoutComponents?: LayoutComponents | undefined\n  /** The content of the layout's slots, by name: `{ submit: <button type=\"submit\">Save</button> }`. */\n  slots?: Readonly<Record<string, ReactNode>> | undefined\n  /** Renders only these fields, by path, in the order of the definition, without the layout. */\n  only?: readonly string[] | undefined\n  /**\n   * Leaves out these fields, by path, e.g. the ones you place with `<JsonField>`. A section or a\n   * row left without fields drops out too.\n   */\n  except?: readonly string[] | undefined\n  /** Renders the step at this index instead of the current one, e.g. on a review page. */\n  step?: number | undefined\n}\n\n/**\n * Renders the fields of a `useJsonForm` form with your components, one per field type, where the\n * definition's `layout` puts them: the current step, with its sections, rows and slots. It renders\n * nothing of its own, so put it inside Formisch's `<Form>` with your own submit button.\n */\nexport function JsonFields(props: JsonFieldsProps): ReactElement {\n  const { of, only, except } = props\n  const ctx: RenderContext = { of, components: resolveComponents(props.components, of) }\n  const nodes = selectFields(of.fields, { only, except })\n  // Without a layout, it renders the fields the way it always did, and so with `only`.\n  if (only || !of.definition.layout) {\n    checkComponents(nodes, ctx.components)\n    return <>{renderFields(ctx, nodes, [])}</>\n  }\n\n  const { layout, steps } = of\n  const left = new Set(except)\n  const layoutCtx: LayoutContext = {\n    ...ctx,\n    layoutComponents: props.layoutComponents ?? of.layoutComponents ?? {},\n    slots: props.slots ?? {},\n    isShown: (node) => !left.has(dotPathOf(node) ?? ''),\n  }\n  checkComponents(\n    layout.steps.flatMap((step) => fieldsOf(step.children)),\n    ctx.components,\n  )\n  checkLayoutComponents(layout, layoutCtx.layoutComponents, layoutCtx.slots)\n\n  const index = props.step ?? steps.index\n  const step = steps.list[index]\n  if (!step) throw new RangeError(`No step ${props.step}. The form has ${steps.list.length}.`)\n  // Keyed by the step, so another step's fields don't take over this one's components.\n  return <Fragment key={index}>{renderLayout(layoutCtx, step.children, [])}</Fragment>\n}\n\n/** Every field of the nodes, display elements written in the layout included. */\nfunction fieldsOf(nodes: readonly LayoutNode[]): FieldNode[] {\n  return nodes.flatMap((node) => {\n    if (node.type === 'slot') return []\n    const inner = fieldsOf(node.children)\n    return node.type === 'field' ? [node.node, ...inner] : inner\n  })\n}\n","import type { FormStore } from '@formisch/react'\nimport {\n  getFieldInput,\n  INTERNAL,\n  type Listener,\n  setListener,\n  untrack,\n} from '@formisch/react/internals'\nimport type { Visibility, VisibilityState } from '@whatsaaaa/form-builder-schema'\nimport { useCallback, useSyncExternalStore } from 'react'\n\n/**\n * What the conditions of the definition hide for the form's input, as it changes. Formisch\n * re-renders a component for each signal it reads, so reading the whole input in `useJsonForm`\n * would re-render the form on every keystroke. This watches the input outside React instead, and\n * re-renders only when the state changes: `of()` gives the same object until then. Without\n * conditions, it watches nothing.\n */\nexport function useVisibility(form: FormStore, visibility: Visibility): VisibilityState {\n  const subscribe = useCallback(\n    (onChange: () => void) => (visibility.conditional ? watchInput(form, onChange) : () => {}),\n    [form, visibility],\n  )\n  const getSnapshot = () =>\n    visibility.of(visibility.conditional ? untrack(() => getFieldInput(form[INTERNAL])) : undefined)\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot)\n}\n\n/**\n * Calls `onChange` after each change of the form's input, until the function it returns is called.\n * It reads the input as Formisch's own components do, with a listener: a signal that changes calls\n * it once, so it reads the input again each time, the items of new array items too.\n */\nfunction watchInput(form: FormStore, onChange: () => void): () => void {\n  const listener: Listener = [\n    () => {\n      read()\n      onChange()\n    },\n    new Set(),\n  ]\n  const stop = () => {\n    for (const subscribers of listener[1]) subscribers.delete(listener)\n    listener[1].clear()\n  }\n  function read() {\n    stop()\n    // untrack() sets back the listener of a component that may be rendering now.\n    untrack(() => {\n      setListener(listener)\n      try {\n        getFieldInput(form[INTERNAL])\n      } finally {\n        setListener(undefined)\n      }\n    })\n  }\n  read()\n  return stop\n}\n","import {\n  type FormSchema,\n  type FormStore,\n  setInput,\n  useForm,\n  type ValidationMode,\n} from '@formisch/react'\nimport {\n  createSchemaBuilder,\n  type FieldNode,\n  type FormLayout,\n  type JsonForm,\n  type JsonFormSchema,\n  type SchemaBuilder,\n  type TypedJsonFormSchema,\n  type VisibilityState,\n} from '@whatsaaaa/form-builder-schema'\nimport { useEffect, useMemo, useState } from 'react'\nimport type { FieldComponents, LayoutComponents } from './field-components'\nimport { type JsonFormSteps, useJsonFormSteps } from './json-form-steps'\nimport { useVisibility } from './use-visibility'\n\nexport interface UseJsonFormOptions {\n  /** Builds the schema and knows your own types and rules. Defaults to `createSchemaBuilder()`. */\n  builder?: SchemaBuilder\n  /** Your component for each field type, so `<JsonFields>` and `<JsonField>` don't need them. */\n  components?: FieldComponents\n  /** Your component for each layout type the definition's `layout` uses, like `section`. */\n  layoutComponents?: LayoutComponents\n  /** When a field is validated the first time, as in Formisch. */\n  validate?: ValidationMode\n  /** When a field is validated again after that, as in Formisch. */\n  revalidate?: Exclude<ValidationMode, 'initial'>\n}\n\n/** What `useJsonForm` returns. Pass it to `<JsonFields>`. */\nexport interface JsonFormInstance<TSchema extends FormSchema = JsonFormSchema> {\n  /** The Formisch form: pass it to Formisch's `<Form of>`, or to any of its methods. */\n  readonly form: FormStore<TSchema>\n  readonly definition: JsonForm\n  readonly builder: SchemaBuilder\n  /** The components from the options, if any. */\n  readonly components: FieldComponents | undefined\n  /** The layout components from the options, if any. */\n  readonly layoutComponents: LayoutComponents | undefined\n  /** The definition's fields as a tree, for `<JsonFields only>` and `<JsonField>`. */\n  readonly fields: readonly FieldNode[]\n  /** The definition's layout, the way `<JsonFields>` renders it. */\n  readonly layout: FormLayout\n  /** The layout's steps: the current one, and Next, Back and Go to. A form without steps has one. */\n  readonly steps: JsonFormSteps\n  /**\n   * What the conditions of the builder's extensions hide for the form's input now, like the\n   * `affects` of `@whatsaaaa/form-builder-affects`: `<JsonFields>` and `<JsonField>` leave it out.\n   * Read it in your own renderers. A new object only when what is hidden changes, so the form\n   * re-renders for that, not for every keystroke. Without conditions, it hides nothing.\n   */\n  readonly visibility: VisibilityState\n}\n\n/** Any form `useJsonForm` returns, typed or not: what the components take. */\nexport type AnyJsonFormInstance = JsonFormInstance<FormSchema>\n\n/**\n * A Formisch form for a definition, with its schema and initial input from the builder. A\n * definition with issues throws the builder's `DefinitionError`, so run `validate()` first when it\n * comes from outside your code. Like Formisch's `useForm`, it reads the definition, the builder and\n * the validation modes on the first render: give the component a new `key` to use another\n * definition. The components and layout components are read on every render. With conditions, it\n * clears the fields they clear as soon as they do, with Formisch's `setInput`, wherever the fields\n * are rendered.\n */\nexport function useJsonForm(definition: JsonForm, options?: UseJsonFormOptions): JsonFormInstance\n/**\n * The same, with the form typed by your input type, and output type when it differs, so Formisch's\n * paths and values are checked. The types are yours to keep in step with the definition.\n */\nexport function useJsonForm<TInput extends object, TOutput extends object = TInput>(\n  definition: JsonForm,\n  options?: UseJsonFormOptions,\n): JsonFormInstance<TypedJsonFormSchema<TInput, TOutput>>\nexport function useJsonForm(\n  definition: JsonForm,\n  options: UseJsonFormOptions = {},\n): JsonFormInstance {\n  // Formisch reads its config on the first render only, so the schema is built once too.\n  const [built] = useState(() => {\n    const builder = options.builder ?? createSchemaBuilder()\n    return {\n      definition,\n      builder,\n      schema: builder.build(definition),\n      initialInput: builder.getInitialInput(definition),\n      fields: builder.getFieldTree(definition),\n      layout: builder.getLayout(definition),\n      visibility: builder.getVisibility(definition),\n    }\n  })\n  const form = useForm({\n    schema: built.schema,\n    initialInput: built.initialInput,\n    validate: options.validate,\n    revalidate: options.revalidate,\n  })\n  const visibility = useVisibility(form, built.visibility)\n  // A new state means something to clear may have come. It is empty once the fields are blank.\n  const { toClear } = visibility\n  useEffect(() => {\n    // The paths come from the definition at runtime, so the schema's types can't check them.\n    for (const { path, input } of toClear) setInput(form, { path, input } as never)\n  }, [form, toClear])\n  const steps = useJsonFormSteps(form, built.layout, options, visibility)\n  const { components, layoutComponents } = options\n  return useMemo(\n    () => ({\n      form,\n      definition: built.definition,\n      builder: built.builder,\n      components,\n      layoutComponents,\n      fields: built.fields,\n      layout: built.layout,\n      steps,\n      visibility,\n    }),\n    [form, built, components, layoutComponents, steps, visibility],\n  )\n}\n"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whatsaaaa/form-builder-react",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Render JSON form definitions with Formisch and your own React components.",
   "keywords": [
     "form",
@@ -33,7 +33,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@whatsaaaa/form-builder-schema": "^0.14.0"
+    "@whatsaaaa/form-builder-schema": "^0.15.0"
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.5",
@@ -42,6 +42,7 @@
     "@types/react": "^19.3.0",
     "@types/react-dom": "^19.3.0",
     "@vitest/coverage-v8": "^5.0.5",
+    "@whatsaaaa/form-builder-affects": "^0.1.0",
     "happy-dom": "^20.0.0",
     "publint": "^0.3.25",
     "react": "^19.3.1",