@lattice-php/lattice 0.1.0

package/dist/form/components/fields/text-input.js

@@ -0,0 +1,33 @@
+import { getBooleanProp, getOptionalNumberProp, getStringProp } from "../../../core/props.js";
+import { FormFieldFrame } from "../base/field.js";
+import { useControlledField } from "../use-controlled-field.js";
+import { Input } from "../base/input.js";
+import { jsx } from "react/jsx-runtime";
+//#region resources/js/form/components/fields/text-input.tsx
+var TextInputComponent = ({ node }) => {
+	const { name, value, error, hidden, required, readonly, disabled, commit } = useControlledField(node);
+	if (hidden) return null;
+	return /* @__PURE__ */ jsx(FormFieldFrame, {
+		error,
+		label: getStringProp(node.props, "label"),
+		name,
+		required,
+		children: /* @__PURE__ */ jsx(Input, {
+			autoComplete: getStringProp(node.props, "autoComplete"),
+			autoFocus: getBooleanProp(node.props, "autoFocus"),
+			disabled,
+			id: name,
+			name,
+			onChange: (event) => commit(event.target.value),
+			placeholder: getStringProp(node.props, "placeholder"),
+			readOnly: readonly,
+			tabIndex: getOptionalNumberProp(node.props, "tabIndex"),
+			type: getStringProp(node.props, "type", "text"),
+			value
+		})
+	});
+};
+//#endregion
+export { TextInputComponent };
+
+//# sourceMappingURL=text-input.js.map

package/dist/form/components/fields/text-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-input.js","names":[],"sources":["../../../../resources/js/form/components/fields/text-input.tsx"],"sourcesContent":["import { getBooleanProp, getOptionalNumberProp, getStringProp } from \"@lattice/lattice/core/props\";\nimport type { RendererComponent } from \"@lattice/lattice/core/types\";\nimport { FormFieldFrame } from \"../base/field\";\nimport { Input } from \"../base/input\";\nimport { useControlledField } from \"../use-controlled-field\";\n\ndeclare module \"@lattice/lattice/core/types\" {\n  interface ComponentProps {\n    \"form.text-input\": {\n      autoComplete?: string;\n      autoFocus?: boolean;\n      conditions?: unknown;\n      disabled?: boolean;\n      hidden?: boolean;\n      label?: string;\n      name?: string;\n      placeholder?: string;\n      readonly?: boolean;\n      required?: boolean;\n      tabIndex?: number;\n      type?: \"email\" | \"text\";\n      value?: string;\n    };\n  }\n}\n\nexport const TextInputComponent: RendererComponent<\"form.text-input\"> = ({ node }) => {\n  const { name, value, error, hidden, required, readonly, disabled, commit } =\n    useControlledField(node);\n\n  if (hidden) {\n    return null;\n  }\n\n  return (\n    <FormFieldFrame\n      error={error}\n      label={getStringProp(node.props, \"label\")}\n      name={name}\n      required={required}\n    >\n      <Input\n        autoComplete={getStringProp(node.props, \"autoComplete\")}\n        autoFocus={getBooleanProp(node.props, \"autoFocus\")}\n        disabled={disabled}\n        id={name}\n        name={name}\n        onChange={(event) => commit(event.target.value)}\n        placeholder={getStringProp(node.props, \"placeholder\")}\n        readOnly={readonly}\n        tabIndex={getOptionalNumberProp(node.props, \"tabIndex\")}\n        type={getStringProp(node.props, \"type\", \"text\")}\n        value={value}\n      />\n    </FormFieldFrame>\n  );\n};\n"],"mappings":";;;;;;AA0BA,IAAa,sBAA4D,EAAE,WAAW;CACpF,MAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,UAAU,UAAU,UAAU,WAChE,mBAAmB,IAAI;CAEzB,IAAI,QACF,OAAO;CAGT,OACE,oBAAC,gBAAD;EACS;EACP,OAAO,cAAc,KAAK,OAAO,OAAO;EAClC;EACI;YAEV,oBAAC,OAAD;GACE,cAAc,cAAc,KAAK,OAAO,cAAc;GACtD,WAAW,eAAe,KAAK,OAAO,WAAW;GACvC;GACV,IAAI;GACE;GACN,WAAW,UAAU,OAAO,MAAM,OAAO,KAAK;GAC9C,aAAa,cAAc,KAAK,OAAO,aAAa;GACpD,UAAU;GACV,UAAU,sBAAsB,KAAK,OAAO,UAAU;GACtD,MAAM,cAAc,KAAK,OAAO,QAAQ,MAAM;GACvC;EACR,CAAA;CACa,CAAA;AAEpB"}

package/dist/form/components/fields/textarea.d.ts

@@ -0,0 +1,20 @@
+import { RendererComponent } from '../../../../../core/types';
+declare module '../../../../../core/types' {
+    interface ComponentProps {
+        "form.textarea": {
+            autoFocus?: boolean;
+            conditions?: unknown;
+            disabled?: boolean;
+            hidden?: boolean;
+            label?: string;
+            name?: string;
+            placeholder?: string;
+            readonly?: boolean;
+            required?: boolean;
+            rows?: number;
+            tabIndex?: number;
+            value?: string;
+        };
+    }
+}
+export declare const TextareaComponent: RendererComponent<"form.textarea">;

package/dist/form/components/fields/textarea.js

@@ -0,0 +1,32 @@
+import { getBooleanProp, getOptionalNumberProp, getStringProp } from "../../../core/props.js";
+import { FormFieldFrame } from "../base/field.js";
+import { useControlledField } from "../use-controlled-field.js";
+import { Textarea } from "../base/textarea.js";
+import { jsx } from "react/jsx-runtime";
+//#region resources/js/form/components/fields/textarea.tsx
+var TextareaComponent = ({ node }) => {
+	const { name, value, error, hidden, required, readonly, disabled, commit } = useControlledField(node);
+	if (hidden) return null;
+	return /* @__PURE__ */ jsx(FormFieldFrame, {
+		error,
+		label: getStringProp(node.props, "label"),
+		name,
+		required,
+		children: /* @__PURE__ */ jsx(Textarea, {
+			autoFocus: getBooleanProp(node.props, "autoFocus"),
+			disabled,
+			id: name,
+			name,
+			onChange: (event) => commit(event.target.value),
+			placeholder: getStringProp(node.props, "placeholder"),
+			readOnly: readonly,
+			rows: getOptionalNumberProp(node.props, "rows"),
+			tabIndex: getOptionalNumberProp(node.props, "tabIndex"),
+			value
+		})
+	});
+};
+//#endregion
+export { TextareaComponent };
+
+//# sourceMappingURL=textarea.js.map

package/dist/form/components/fields/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.js","names":[],"sources":["../../../../resources/js/form/components/fields/textarea.tsx"],"sourcesContent":["import { getBooleanProp, getOptionalNumberProp, getStringProp } from \"@lattice/lattice/core/props\";\nimport type { RendererComponent } from \"@lattice/lattice/core/types\";\nimport { FormFieldFrame } from \"../base/field\";\nimport { Textarea } from \"../base/textarea\";\nimport { useControlledField } from \"../use-controlled-field\";\n\ndeclare module \"@lattice/lattice/core/types\" {\n  interface ComponentProps {\n    \"form.textarea\": {\n      autoFocus?: boolean;\n      conditions?: unknown;\n      disabled?: boolean;\n      hidden?: boolean;\n      label?: string;\n      name?: string;\n      placeholder?: string;\n      readonly?: boolean;\n      required?: boolean;\n      rows?: number;\n      tabIndex?: number;\n      value?: string;\n    };\n  }\n}\n\nexport const TextareaComponent: RendererComponent<\"form.textarea\"> = ({ node }) => {\n  const { name, value, error, hidden, required, readonly, disabled, commit } =\n    useControlledField(node);\n\n  if (hidden) {\n    return null;\n  }\n\n  return (\n    <FormFieldFrame\n      error={error}\n      label={getStringProp(node.props, \"label\")}\n      name={name}\n      required={required}\n    >\n      <Textarea\n        autoFocus={getBooleanProp(node.props, \"autoFocus\")}\n        disabled={disabled}\n        id={name}\n        name={name}\n        onChange={(event) => commit(event.target.value)}\n        placeholder={getStringProp(node.props, \"placeholder\")}\n        readOnly={readonly}\n        rows={getOptionalNumberProp(node.props, \"rows\")}\n        tabIndex={getOptionalNumberProp(node.props, \"tabIndex\")}\n        value={value}\n      />\n    </FormFieldFrame>\n  );\n};\n"],"mappings":";;;;;;AAyBA,IAAa,qBAAyD,EAAE,WAAW;CACjF,MAAM,EAAE,MAAM,OAAO,OAAO,QAAQ,UAAU,UAAU,UAAU,WAChE,mBAAmB,IAAI;CAEzB,IAAI,QACF,OAAO;CAGT,OACE,oBAAC,gBAAD;EACS;EACP,OAAO,cAAc,KAAK,OAAO,OAAO;EAClC;EACI;YAEV,oBAAC,UAAD;GACE,WAAW,eAAe,KAAK,OAAO,WAAW;GACvC;GACV,IAAI;GACE;GACN,WAAW,UAAU,OAAO,MAAM,OAAO,KAAK;GAC9C,aAAa,cAAc,KAAK,OAAO,aAAa;GACpD,UAAU;GACV,MAAM,sBAAsB,KAAK,OAAO,MAAM;GAC9C,UAAU,sBAAsB,KAAK,OAAO,UAAU;GAC/C;EACR,CAAA;CACa,CAAA;AAEpB"}

package/dist/form/components/form-transport.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Shared client transport for the lattice form endpoint. Every form sub-action
+ * (validation resolve, option search) POSTs to the same signed form URL, so the
+ * CSRF header, component-ref header, and request shape live here in one place.
+ */
+export declare const FORM_DEBOUNCE_MS = 250;
+export declare function xsrfToken(): string;
+export declare function postFormAction<T>(action: string, componentRef: string, body: Record<string, unknown>, signal: AbortSignal): Promise<T | null>;

package/dist/form/components/form-transport.js

@@ -0,0 +1,31 @@
+import { withRefHeader } from "../../core/component-ref.js";
+//#region resources/js/form/components/form-transport.ts
+/**
+* Shared client transport for the lattice form endpoint. Every form sub-action
+* (validation resolve, option search) POSTs to the same signed form URL, so the
+* CSRF header, component-ref header, and request shape live here in one place.
+*/
+var FORM_DEBOUNCE_MS = 250;
+function xsrfToken() {
+	const match = document.cookie.match(/XSRF-TOKEN=([^;]+)/);
+	return match ? decodeURIComponent(match[1]) : "";
+}
+function postFormAction(action, componentRef, body, signal) {
+	return fetch(action, {
+		method: "POST",
+		credentials: "same-origin",
+		signal,
+		headers: {
+			"Content-Type": "application/json",
+			Accept: "application/json",
+			"X-Requested-With": "XMLHttpRequest",
+			"X-XSRF-TOKEN": xsrfToken(),
+			...withRefHeader(componentRef)
+		},
+		body: JSON.stringify(body)
+	}).then((response) => response.ok ? response.json() : null);
+}
+//#endregion
+export { FORM_DEBOUNCE_MS, postFormAction, xsrfToken };
+
+//# sourceMappingURL=form-transport.js.map

package/dist/form/components/form-transport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-transport.js","names":[],"sources":["../../../resources/js/form/components/form-transport.ts"],"sourcesContent":["/**\n * Shared client transport for the lattice form endpoint. Every form sub-action\n * (validation resolve, option search) POSTs to the same signed form URL, so the\n * CSRF header, component-ref header, and request shape live here in one place.\n */\n\nimport { withRefHeader } from \"@lattice/lattice/core/component-ref\";\n\nexport const FORM_DEBOUNCE_MS = 250;\n\nexport function xsrfToken(): string {\n  const match = document.cookie.match(/XSRF-TOKEN=([^;]+)/);\n\n  return match ? decodeURIComponent(match[1]) : \"\";\n}\n\nexport function postFormAction<T>(\n  action: string,\n  componentRef: string,\n  body: Record<string, unknown>,\n  signal: AbortSignal,\n): Promise<T | null> {\n  return fetch(action, {\n    method: \"POST\",\n    credentials: \"same-origin\",\n    signal,\n    headers: {\n      \"Content-Type\": \"application/json\",\n      Accept: \"application/json\",\n      \"X-Requested-With\": \"XMLHttpRequest\",\n      \"X-XSRF-TOKEN\": xsrfToken(),\n      ...withRefHeader(componentRef),\n    },\n    body: JSON.stringify(body),\n  }).then((response) => (response.ok ? (response.json() as Promise<T>) : null));\n}\n"],"mappings":";;;;;;;AAQA,IAAa,mBAAmB;AAEhC,SAAgB,YAAoB;CAClC,MAAM,QAAQ,SAAS,OAAO,MAAM,oBAAoB;CAExD,OAAO,QAAQ,mBAAmB,MAAM,EAAE,IAAI;AAChD;AAEA,SAAgB,eACd,QACA,cACA,MACA,QACmB;CACnB,OAAO,MAAM,QAAQ;EACnB,QAAQ;EACR,aAAa;EACb;EACA,SAAS;GACP,gBAAgB;GAChB,QAAQ;GACR,oBAAoB;GACpB,gBAAgB,UAAU;GAC1B,GAAG,cAAc,YAAY;EAC/B;EACA,MAAM,KAAK,UAAU,IAAI;CAC3B,CAAC,EAAE,MAAM,aAAc,SAAS,KAAM,SAAS,KAAK,IAAmB,IAAK;AAC9E"}

package/dist/form/components/form.d.ts

@@ -0,0 +1,21 @@
+import { RendererComponent } from '../../../../core/types';
+import { FormMethod } from './types';
+declare module '../../../../core/types' {
+    interface ComponentProps {
+        form: {
+            action?: string;
+            errorBag?: string;
+            ref?: string;
+            method?: FormMethod;
+            precognitive?: boolean;
+            resetOnError?: boolean | string[];
+            resetOnSuccess?: boolean | string[];
+            state?: Record<string, unknown>;
+            status?: string;
+            submitButton?: boolean;
+            submitLabel?: string;
+            validationTimeout?: number;
+        };
+    }
+}
+export declare const FormComponent: RendererComponent<"form">;

package/dist/form/components/form.js

@@ -0,0 +1,126 @@
+import { withRefHeader } from "../../core/component-ref.js";
+import { getBooleanProp, getOptionalNumberProp, getStringProp } from "../../core/props.js";
+import { LATTICE_EVENT } from "../../events/event-names.js";
+import { FormProvider } from "./context.js";
+import { FormSubmitButton } from "./base/submit-button.js";
+import { ResolvedNodesProvider } from "./resolved-nodes.js";
+import { FormValuesProvider } from "./values.js";
+import { useFormResolver } from "./use-form-resolver.js";
+import { useEffect, useMemo } from "react";
+import { Form } from "@inertiajs/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region resources/js/form/components/form.tsx
+function getFormState(props) {
+	const state = props?.state;
+	if (typeof state !== "object" || state === null || Array.isArray(state)) return {};
+	return state;
+}
+function collectFields(nodes, collected = {
+	labels: {},
+	values: {}
+}) {
+	for (const child of nodes ?? []) {
+		const name = getStringProp(child.props, "name");
+		if (name) {
+			const label = getStringProp(child.props, "label");
+			if (label) collected.labels[name] = label;
+			if (child.props?.value !== void 0) collected.values[name] = child.props.value;
+		}
+		collectFields(child.children, collected);
+	}
+	return collected;
+}
+function FormResetListener({ componentId, reset }) {
+	useEffect(() => {
+		const handler = (event) => {
+			const detail = event.detail;
+			if (!detail?.form || detail.form === componentId) reset();
+		};
+		window.addEventListener(LATTICE_EVENT.resetForm, handler);
+		return () => window.removeEventListener(LATTICE_EVENT.resetForm, handler);
+	}, [componentId, reset]);
+	return null;
+}
+function FormBody({ action, children, componentRef, nodes, shouldRenderSubmitButton, submitLabel }) {
+	return /* @__PURE__ */ jsx(ResolvedNodesProvider, {
+		nodes: useFormResolver(action, componentRef, nodes),
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-6",
+			children: [children, shouldRenderSubmitButton && /* @__PURE__ */ jsx("div", {
+				className: "flex justify-end rounded-lt border border-lt-border bg-lt-surface px-6 py-4 shadow-xs",
+				children: /* @__PURE__ */ jsx(FormSubmitButton, { label: submitLabel })
+			})]
+		})
+	});
+}
+var FormComponent = ({ children, node }) => {
+	const props = node.props ?? {};
+	const action = props.action ?? "#";
+	const errorBag = props.errorBag;
+	const componentRef = getStringProp(props, "ref");
+	const method = props.method ?? "post";
+	const precognitive = getBooleanProp(props, "precognitive");
+	const resetOnError = props.resetOnError ?? false;
+	const resetOnSuccess = props.resetOnSuccess ?? [];
+	const state = getFormState(node.props);
+	const { labels: fieldLabels, values: fieldValues } = useMemo(() => collectFields(node.children), [node.children]);
+	const initialValues = {
+		...fieldValues,
+		...state
+	};
+	const shouldRenderSubmitButton = getBooleanProp(props, "submitButton", true);
+	const submitLabel = props.submitLabel ?? "Submit";
+	const validationTimeout = getOptionalNumberProp(props, "validationTimeout");
+	return /* @__PURE__ */ jsx(Form, {
+		action,
+		"data-lattice-component": node.id,
+		errorBag,
+		method,
+		resetOnError,
+		resetOnSuccess,
+		validationTimeout: precognitive ? validationTimeout : void 0,
+		headers: withRefHeader(componentRef),
+		className: "mx-auto flex w-full max-w-2xl flex-col gap-6",
+		children: ({ clearErrors, errors, invalid, processing, reset, touch, validate, validating, valid }) => /* @__PURE__ */ jsxs(FormProvider, {
+			value: {
+				action,
+				clearErrors: (field) => clearErrors(field),
+				componentRef,
+				errors,
+				fieldLabels,
+				invalid: (field) => invalid(field),
+				precognitive,
+				processing,
+				touch: (field) => touch(field),
+				validate: (field) => validate(field),
+				validating,
+				valid: (field) => valid(field)
+			},
+			children: [
+				/* @__PURE__ */ jsx(FormResetListener, {
+					componentId: node.id,
+					reset
+				}),
+				props.status && /* @__PURE__ */ jsx("div", {
+					className: "text-center text-sm font-medium text-green-600 dark:text-green-400",
+					children: props.status
+				}),
+				/* @__PURE__ */ jsx(FormValuesProvider, {
+					initial: initialValues,
+					children: /* @__PURE__ */ jsx(FormBody, {
+						action,
+						componentRef,
+						nodes: node.children,
+						shouldRenderSubmitButton,
+						submitLabel,
+						children
+					})
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { FormComponent };
+
+//# sourceMappingURL=form.js.map

package/dist/form/components/form.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form.js","names":[],"sources":["../../../resources/js/form/components/form.tsx"],"sourcesContent":["import { Form as InertiaForm } from \"@inertiajs/react\";\nimport { withRefHeader } from \"@lattice/lattice/core/component-ref\";\nimport { getBooleanProp, getOptionalNumberProp, getStringProp } from \"@lattice/lattice/core/props\";\nimport { LATTICE_EVENT } from \"@lattice/lattice/events/event-names\";\nimport type { Node, NodeProps, RendererComponent } from \"@lattice/lattice/core/types\";\nimport { useEffect, useMemo } from \"react\";\nimport { FormSubmitButton } from \"./base/submit-button\";\nimport { FormProvider } from \"./context\";\nimport { ResolvedNodesProvider } from \"./resolved-nodes\";\nimport type { FormMethod } from \"./types\";\nimport { useFormResolver } from \"./use-form-resolver\";\nimport { FormValuesProvider } from \"./values\";\n\ndeclare module \"@lattice/lattice/core/types\" {\n  interface ComponentProps {\n    form: {\n      action?: string;\n      errorBag?: string;\n      ref?: string;\n      method?: FormMethod;\n      precognitive?: boolean;\n      resetOnError?: boolean | string[];\n      resetOnSuccess?: boolean | string[];\n      state?: Record<string, unknown>;\n      status?: string;\n      submitButton?: boolean;\n      submitLabel?: string;\n      validationTimeout?: number;\n    };\n  }\n}\n\nfunction getFormState(props: NodeProps | undefined): Record<string, unknown> {\n  const state = props?.state;\n\n  if (typeof state !== \"object\" || state === null || Array.isArray(state)) {\n    return {};\n  }\n\n  return state as Record<string, unknown>;\n}\n\ntype CollectedFields = {\n  labels: Record<string, string>;\n  values: Record<string, unknown>;\n};\n\nfunction collectFields(\n  nodes: Node[] | undefined,\n  collected: CollectedFields = { labels: {}, values: {} },\n): CollectedFields {\n  for (const child of nodes ?? []) {\n    const name = getStringProp(child.props, \"name\");\n\n    if (name) {\n      const label = getStringProp(child.props, \"label\");\n      if (label) {\n        collected.labels[name] = label;\n      }\n      if (child.props?.value !== undefined) {\n        collected.values[name] = child.props.value;\n      }\n    }\n\n    collectFields(child.children, collected);\n  }\n\n  return collected;\n}\n\nfunction FormResetListener({\n  componentId,\n  reset,\n}: {\n  componentId?: string;\n  reset: (...fields: string[]) => void;\n}) {\n  useEffect(() => {\n    const handler = (event: Event) => {\n      const detail = (event as CustomEvent<{ form?: string }>).detail;\n\n      if (!detail?.form || detail.form === componentId) {\n        reset();\n      }\n    };\n\n    window.addEventListener(LATTICE_EVENT.resetForm, handler);\n\n    return () => window.removeEventListener(LATTICE_EVENT.resetForm, handler);\n  }, [componentId, reset]);\n\n  return null;\n}\n\nfunction FormBody({\n  action,\n  children,\n  componentRef,\n  nodes,\n  shouldRenderSubmitButton,\n  submitLabel,\n}: {\n  action: string;\n  children: React.ReactNode;\n  componentRef: string;\n  nodes: Node[] | undefined;\n  shouldRenderSubmitButton: boolean;\n  submitLabel: string;\n}) {\n  const resolvedNodes = useFormResolver(action, componentRef, nodes);\n\n  return (\n    <ResolvedNodesProvider nodes={resolvedNodes}>\n      <div className=\"flex flex-col gap-6\">\n        {children}\n\n        {shouldRenderSubmitButton && (\n          <div className=\"flex justify-end rounded-lt border border-lt-border bg-lt-surface px-6 py-4 shadow-xs\">\n            <FormSubmitButton label={submitLabel} />\n          </div>\n        )}\n      </div>\n    </ResolvedNodesProvider>\n  );\n}\n\nexport const FormComponent: RendererComponent<\"form\"> = ({ children, node }) => {\n  const props = node.props ?? {};\n  const action = props.action ?? \"#\";\n  const errorBag = props.errorBag;\n  const componentRef = getStringProp(props, \"ref\");\n  const method = props.method ?? \"post\";\n  const precognitive = getBooleanProp(props, \"precognitive\");\n  const resetOnError = props.resetOnError ?? false;\n  const resetOnSuccess = props.resetOnSuccess ?? [];\n  const state = getFormState(node.props);\n  const { labels: fieldLabels, values: fieldValues } = useMemo(\n    () => collectFields(node.children),\n    [node.children],\n  );\n  const initialValues = { ...fieldValues, ...state };\n  const shouldRenderSubmitButton = getBooleanProp(props, \"submitButton\", true);\n  const submitLabel = props.submitLabel ?? \"Submit\";\n  const validationTimeout = getOptionalNumberProp(props, \"validationTimeout\");\n\n  return (\n    <InertiaForm\n      action={action}\n      data-lattice-component={node.id}\n      errorBag={errorBag}\n      method={method}\n      resetOnError={resetOnError}\n      resetOnSuccess={resetOnSuccess}\n      validationTimeout={precognitive ? validationTimeout : undefined}\n      headers={withRefHeader(componentRef)}\n      className=\"mx-auto flex w-full max-w-2xl flex-col gap-6\"\n    >\n      {({\n        clearErrors,\n        errors,\n        invalid,\n        processing,\n        reset,\n        touch,\n        validate,\n        validating,\n        valid,\n      }) => (\n        <FormProvider\n          value={{\n            action,\n            clearErrors: (field) => clearErrors(field),\n            componentRef,\n            errors: errors as Record<string, string | undefined>,\n            fieldLabels,\n            invalid: (field) => invalid(field),\n            precognitive,\n            processing,\n            touch: (field) => touch(field),\n            validate: (field) => validate(field),\n            validating,\n            valid: (field) => valid(field),\n          }}\n        >\n          <FormResetListener componentId={node.id} reset={reset} />\n\n          {props.status && (\n            <div className=\"text-center text-sm font-medium text-green-600 dark:text-green-400\">\n              {props.status}\n            </div>\n          )}\n\n          <FormValuesProvider initial={initialValues}>\n            <FormBody\n              action={action}\n              componentRef={componentRef}\n              nodes={node.children}\n              shouldRenderSubmitButton={shouldRenderSubmitButton}\n              submitLabel={submitLabel}\n            >\n              {children}\n            </FormBody>\n          </FormValuesProvider>\n        </FormProvider>\n      )}\n    </InertiaForm>\n  );\n};\n"],"mappings":"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"}

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

@@ -0,0 +1,11 @@
+export { CheckboxComponent } from './fields/checkbox';
+export { ChoiceComponent } from './fields/choice';
+export { DateInputComponent } from './fields/date-input';
+export { FormComponent } from './form';
+export { HiddenInputComponent } from './fields/hidden-input';
+export { NumberInputComponent } from './fields/number-input';
+export { PasswordInputComponent } from './fields/password-input';
+export { SelectComponent } from './fields/select';
+export { SubmitButtonComponent } from './fields/submit-button';
+export { TextareaComponent } from './fields/textarea';
+export { TextInputComponent } from './fields/text-input';

package/dist/form/components/index.js

@@ -0,0 +1,12 @@
+import { FormComponent } from "./form.js";
+import { CheckboxComponent } from "./fields/checkbox.js";
+import { ChoiceComponent } from "./fields/choice.js";
+import { DateInputComponent } from "./fields/date-input.js";
+import { HiddenInputComponent } from "./fields/hidden-input.js";
+import { NumberInputComponent } from "./fields/number-input.js";
+import { PasswordInputComponent } from "./fields/password-input.js";
+import { SelectComponent } from "./fields/select.js";
+import { SubmitButtonComponent } from "./fields/submit-button.js";
+import { TextareaComponent } from "./fields/textarea.js";
+import { TextInputComponent } from "./fields/text-input.js";
+export { CheckboxComponent, ChoiceComponent, DateInputComponent, FormComponent, HiddenInputComponent, NumberInputComponent, PasswordInputComponent, SelectComponent, SubmitButtonComponent, TextInputComponent, TextareaComponent };

package/dist/form/components/resolved-nodes.d.ts

@@ -0,0 +1,6 @@
+import { Node } from '../../../../core/types';
+export declare function ResolvedNodesProvider({ nodes, children, }: {
+    nodes: Record<string, Node>;
+    children: React.ReactNode;
+}): import("react").JSX.Element;
+export declare function useResolvedNode(node: Node): Node;

package/dist/form/components/resolved-nodes.js

@@ -0,0 +1,20 @@
+import { getStringProp } from "../../core/props.js";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region resources/js/form/components/resolved-nodes.tsx
+var ResolvedNodesContext = createContext({});
+function ResolvedNodesProvider({ nodes, children }) {
+	return /* @__PURE__ */ jsx(ResolvedNodesContext.Provider, {
+		value: nodes,
+		children
+	});
+}
+function useResolvedNode(node) {
+	const nodes = useContext(ResolvedNodesContext);
+	const name = getStringProp(node.props, "name");
+	return name && nodes[name] ? nodes[name] : node;
+}
+//#endregion
+export { ResolvedNodesProvider, useResolvedNode };
+
+//# sourceMappingURL=resolved-nodes.js.map

package/dist/form/components/resolved-nodes.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolved-nodes.js","names":[],"sources":["../../../resources/js/form/components/resolved-nodes.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { getStringProp } from \"@lattice/lattice/core/props\";\nimport type { Node } from \"@lattice/lattice/core/types\";\n\nconst ResolvedNodesContext = createContext<Record<string, Node>>({});\n\nexport function ResolvedNodesProvider({\n  nodes,\n  children,\n}: {\n  nodes: Record<string, Node>;\n  children: React.ReactNode;\n}) {\n  return <ResolvedNodesContext.Provider value={nodes}>{children}</ResolvedNodesContext.Provider>;\n}\n\nexport function useResolvedNode(node: Node): Node {\n  const nodes = useContext(ResolvedNodesContext);\n  const name = getStringProp(node.props, \"name\");\n\n  return name && nodes[name] ? nodes[name] : node;\n}\n"],"mappings":";;;;AAIA,IAAM,uBAAuB,cAAoC,CAAC,CAAC;AAEnE,SAAgB,sBAAsB,EACpC,OACA,YAIC;CACD,OAAO,oBAAC,qBAAqB,UAAtB;EAA+B,OAAO;EAAQ;CAAwC,CAAA;AAC/F;AAEA,SAAgB,gBAAgB,MAAkB;CAChD,MAAM,QAAQ,WAAW,oBAAoB;CAC7C,MAAM,OAAO,cAAc,KAAK,OAAO,MAAM;CAE7C,OAAO,QAAQ,MAAM,QAAQ,MAAM,QAAQ;AAC7C"}

package/dist/form/components/types.d.ts

@@ -0,0 +1,7 @@
+import { Method } from '@inertiajs/core';
+export type FormMethod = Method;
+export type FormLabelAction = {
+    href: string;
+    label: string;
+    tabIndex?: number;
+};

package/dist/form/components/use-controlled-field.d.ts

@@ -0,0 +1,16 @@
+import { Node } from '../../../../core/types';
+import { FieldState } from './conditions';
+type ControlledField = FieldState & {
+    name: string;
+    value: string;
+    error?: string;
+    commit: (value: unknown) => void;
+};
+/**
+ * Shared wiring for store-controlled, condition-aware fields: derives the current
+ * string value (store, falling back to the node's value prop), the field state
+ * (hidden/required/readonly/disabled), the current error, and a `commit` callback
+ * that writes to the store and triggers precognition validation / error clearing.
+ */
+export declare function useControlledField(node: Node): ControlledField;
+export {};

package/dist/form/components/use-controlled-field.js

@@ -0,0 +1,33 @@
+import { getStringProp } from "../../core/props.js";
+import { useFormContext } from "./context.js";
+import { useFormValue } from "./values.js";
+import { useDependentField } from "./use-dependent-field.js";
+import { useFieldCommit } from "./use-field-commit.js";
+//#region resources/js/form/components/use-controlled-field.ts
+/**
+* Shared wiring for store-controlled, condition-aware fields: derives the current
+* string value (store, falling back to the node's value prop), the field state
+* (hidden/required/readonly/disabled), the current error, and a `commit` callback
+* that writes to the store and triggers precognition validation / error clearing.
+*/
+function useControlledField(node) {
+	const { errors } = useFormContext();
+	const state = useDependentField(node);
+	const name = getStringProp(node.props, "name");
+	const storedValue = useFormValue(name);
+	const currentValue = storedValue !== void 0 ? storedValue : node.props?.value;
+	const value = typeof currentValue === "string" || typeof currentValue === "number" ? String(currentValue) : "";
+	const { commit: commitField } = useFieldCommit();
+	const commit = (next) => commitField(name, next);
+	return {
+		...state,
+		name,
+		value,
+		error: errors[name],
+		commit
+	};
+}
+//#endregion
+export { useControlledField };
+
+//# sourceMappingURL=use-controlled-field.js.map

package/dist/form/components/use-controlled-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-controlled-field.js","names":[],"sources":["../../../resources/js/form/components/use-controlled-field.ts"],"sourcesContent":["import { getStringProp } from \"@lattice/lattice/core/props\";\nimport type { Node } from \"@lattice/lattice/core/types\";\nimport type { FieldState } from \"./conditions\";\nimport { useFormContext } from \"./context\";\nimport { useDependentField } from \"./use-dependent-field\";\nimport { useFieldCommit } from \"./use-field-commit\";\nimport { useFormValue } from \"./values\";\n\ntype ControlledField = FieldState & {\n  name: string;\n  value: string;\n  error?: string;\n  commit: (value: unknown) => void;\n};\n\n/**\n * Shared wiring for store-controlled, condition-aware fields: derives the current\n * string value (store, falling back to the node's value prop), the field state\n * (hidden/required/readonly/disabled), the current error, and a `commit` callback\n * that writes to the store and triggers precognition validation / error clearing.\n */\nexport function useControlledField(node: Node): ControlledField {\n  const { errors } = useFormContext();\n  const state = useDependentField(node);\n  const name = getStringProp(node.props, \"name\");\n  const storedValue = useFormValue(name);\n  const currentValue = storedValue !== undefined ? storedValue : node.props?.value;\n  const value =\n    typeof currentValue === \"string\" || typeof currentValue === \"number\"\n      ? String(currentValue)\n      : \"\";\n\n  const { commit: commitField } = useFieldCommit();\n  const commit = (next: unknown): void => commitField(name, next);\n\n  return { ...state, name, value, error: errors[name], commit };\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,SAAgB,mBAAmB,MAA6B;CAC9D,MAAM,EAAE,WAAW,eAAe;CAClC,MAAM,QAAQ,kBAAkB,IAAI;CACpC,MAAM,OAAO,cAAc,KAAK,OAAO,MAAM;CAC7C,MAAM,cAAc,aAAa,IAAI;CACrC,MAAM,eAAe,gBAAgB,KAAA,IAAY,cAAc,KAAK,OAAO;CAC3E,MAAM,QACJ,OAAO,iBAAiB,YAAY,OAAO,iBAAiB,WACxD,OAAO,YAAY,IACnB;CAEN,MAAM,EAAE,QAAQ,gBAAgB,eAAe;CAC/C,MAAM,UAAU,SAAwB,YAAY,MAAM,IAAI;CAE9D,OAAO;EAAE,GAAG;EAAO;EAAM;EAAO,OAAO,OAAO;EAAO;CAAO;AAC9D"}

package/dist/form/components/use-dependent-field.d.ts

@@ -0,0 +1,3 @@
+import { Node } from '../../../../core/types';
+import { FieldState } from './conditions';
+export declare function useDependentField(node: Node): FieldState;

package/dist/form/components/use-dependent-field.js

@@ -0,0 +1,18 @@
+import { getBooleanProp } from "../../core/props.js";
+import { evaluateConditions } from "./conditions.js";
+import { useFormValues } from "./values.js";
+//#region resources/js/form/components/use-dependent-field.ts
+function useDependentField(node) {
+	const values = useFormValues();
+	const conditions = node.props?.conditions;
+	return evaluateConditions(conditions, values, {
+		hidden: getBooleanProp(node.props, "hidden"),
+		required: getBooleanProp(node.props, "required"),
+		readonly: getBooleanProp(node.props, "readonly"),
+		disabled: getBooleanProp(node.props, "disabled")
+	});
+}
+//#endregion
+export { useDependentField };
+
+//# sourceMappingURL=use-dependent-field.js.map

package/dist/form/components/use-dependent-field.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-dependent-field.js","names":[],"sources":["../../../resources/js/form/components/use-dependent-field.ts"],"sourcesContent":["import { getBooleanProp } from \"@lattice/lattice/core/props\";\nimport type { Node } from \"@lattice/lattice/core/types\";\nimport { type FieldConditions, type FieldState, evaluateConditions } from \"./conditions\";\nimport { useFormValues } from \"./values\";\n\nexport function useDependentField(node: Node): FieldState {\n  const values = useFormValues();\n  const conditions = node.props?.conditions as FieldConditions | undefined;\n\n  return evaluateConditions(conditions, values, {\n    hidden: getBooleanProp(node.props, \"hidden\"),\n    required: getBooleanProp(node.props, \"required\"),\n    readonly: getBooleanProp(node.props, \"readonly\"),\n    disabled: getBooleanProp(node.props, \"disabled\"),\n  });\n}\n"],"mappings":";;;;AAKA,SAAgB,kBAAkB,MAAwB;CACxD,MAAM,SAAS,cAAc;CAC7B,MAAM,aAAa,KAAK,OAAO;CAE/B,OAAO,mBAAmB,YAAY,QAAQ;EAC5C,QAAQ,eAAe,KAAK,OAAO,QAAQ;EAC3C,UAAU,eAAe,KAAK,OAAO,UAAU;EAC/C,UAAU,eAAe,KAAK,OAAO,UAAU;EAC/C,UAAU,eAAe,KAAK,OAAO,UAAU;CACjD,CAAC;AACH"}

package/dist/form/components/use-field-commit.d.ts

@@ -0,0 +1,14 @@
+export type FieldCommit = {
+    /** Write the value and validate immediately (precognitive) or clear errors. */
+    commit: (name: string, value: unknown) => void;
+    /** Write the value and clear errors, deferring validation to a later `blur`. */
+    change: (name: string, value: unknown) => void;
+    /** Validate the field now if precognitive (e.g. on blur or popover close). */
+    blur: (name: string) => void;
+};
+/**
+ * The shared field-mutation contract every form field uses to write its value
+ * and drive precognition. Fields that validate on change call `commit`; fields
+ * that validate on blur/close (rich editor, select) call `change` then `blur`.
+ */
+export declare function useFieldCommit(): FieldCommit;

package/dist/form/components/use-field-commit.js

@@ -0,0 +1,30 @@
+import { useFormContext } from "./context.js";
+import { useSetFormValue } from "./values.js";
+//#region resources/js/form/components/use-field-commit.ts
+/**
+* The shared field-mutation contract every form field uses to write its value
+* and drive precognition. Fields that validate on change call `commit`; fields
+* that validate on blur/close (rich editor, select) call `change` then `blur`.
+*/
+function useFieldCommit() {
+	const { clearErrors, precognitive, validate } = useFormContext();
+	const setValue = useSetFormValue();
+	return {
+		commit(name, value) {
+			setValue(name, value);
+			if (precognitive) validate(name);
+			else clearErrors(name);
+		},
+		change(name, value) {
+			setValue(name, value);
+			clearErrors(name);
+		},
+		blur(name) {
+			if (precognitive) validate(name);
+		}
+	};
+}
+//#endregion
+export { useFieldCommit };
+
+//# sourceMappingURL=use-field-commit.js.map

package/dist/form/components/use-field-commit.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-field-commit.js","names":[],"sources":["../../../resources/js/form/components/use-field-commit.ts"],"sourcesContent":["import { useFormContext } from \"./context\";\nimport { useSetFormValue } from \"./values\";\n\nexport type FieldCommit = {\n  /** Write the value and validate immediately (precognitive) or clear errors. */\n  commit: (name: string, value: unknown) => void;\n  /** Write the value and clear errors, deferring validation to a later `blur`. */\n  change: (name: string, value: unknown) => void;\n  /** Validate the field now if precognitive (e.g. on blur or popover close). */\n  blur: (name: string) => void;\n};\n\n/**\n * The shared field-mutation contract every form field uses to write its value\n * and drive precognition. Fields that validate on change call `commit`; fields\n * that validate on blur/close (rich editor, select) call `change` then `blur`.\n */\nexport function useFieldCommit(): FieldCommit {\n  const { clearErrors, precognitive, validate } = useFormContext();\n  const setValue = useSetFormValue();\n\n  return {\n    commit(name, value) {\n      setValue(name, value);\n      if (precognitive) {\n        validate(name);\n      } else {\n        clearErrors(name);\n      }\n    },\n    change(name, value) {\n      setValue(name, value);\n      clearErrors(name);\n    },\n    blur(name) {\n      if (precognitive) {\n        validate(name);\n      }\n    },\n  };\n}\n"],"mappings":";;;;;;;;AAiBA,SAAgB,iBAA8B;CAC5C,MAAM,EAAE,aAAa,cAAc,aAAa,eAAe;CAC/D,MAAM,WAAW,gBAAgB;CAEjC,OAAO;EACL,OAAO,MAAM,OAAO;GAClB,SAAS,MAAM,KAAK;GACpB,IAAI,cACF,SAAS,IAAI;QAEb,YAAY,IAAI;EAEpB;EACA,OAAO,MAAM,OAAO;GAClB,SAAS,MAAM,KAAK;GACpB,YAAY,IAAI;EAClB;EACA,KAAK,MAAM;GACT,IAAI,cACF,SAAS,IAAI;EAEjB;CACF;AACF"}

package/dist/form/components/use-form-resolver.d.ts

@@ -0,0 +1,2 @@
+import { Node } from '../../../../core/types';
+export declare function useFormResolver(action: string, componentRef: string, nodes: Node[] | undefined): Record<string, Node>;

package/dist/form/components/use-form-resolver.js

@@ -0,0 +1,57 @@
+import { getBooleanProp } from "../../core/props.js";
+import { postFormAction } from "./form-transport.js";
+import { useFormValues, useSetFormValue } from "./values.js";
+import { useEffect, useMemo, useState } from "react";
+//#region resources/js/form/components/use-form-resolver.ts
+function collectWatch(nodes, keys, state) {
+	for (const child of nodes ?? []) {
+		const dependsOnKeys = child.props?.dependsOnKeys;
+		if (Array.isArray(dependsOnKeys)) for (const key of dependsOnKeys) keys.add(String(key));
+		if (getBooleanProp(child.props, "dependsOnAny")) state.any = true;
+		collectWatch(child.children, keys, state);
+	}
+}
+function useFormResolver(action, componentRef, nodes) {
+	const values = useFormValues();
+	const setValue = useSetFormValue();
+	const [resolved, setResolved] = useState({});
+	const watch = useMemo(() => {
+		const keys = /* @__PURE__ */ new Set();
+		const state = { any: false };
+		collectWatch(nodes, keys, state);
+		return {
+			keys: [...keys],
+			any: state.any
+		};
+	}, [nodes]);
+	useEffect(() => {
+		if (watch.keys.length === 0 && !watch.any) return;
+		const controller = new AbortController();
+		const timer = window.setTimeout(() => {
+			postFormAction(action, componentRef, {
+				_resolve: true,
+				...values
+			}, controller.signal).then((response) => {
+				if (!response) return;
+				for (const [name, value] of Object.entries(response.values ?? {})) setValue(name, value);
+				if (response.fields) setResolved(response.fields);
+			}).catch(() => {});
+		}, 250);
+		return () => {
+			window.clearTimeout(timer);
+			controller.abort();
+		};
+	}, [
+		watch.any ? JSON.stringify(values) : JSON.stringify(watch.keys.map((key) => values[key])),
+		action,
+		componentRef,
+		watch.keys.length,
+		watch.any,
+		setValue
+	]);
+	return resolved;
+}
+//#endregion
+export { useFormResolver };
+
+//# sourceMappingURL=use-form-resolver.js.map

package/dist/form/components/use-form-resolver.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-form-resolver.js","names":[],"sources":["../../../resources/js/form/components/use-form-resolver.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { getBooleanProp } from \"@lattice/lattice/core/props\";\nimport type { Node } from \"@lattice/lattice/core/types\";\nimport { FORM_DEBOUNCE_MS, postFormAction } from \"./form-transport\";\nimport { useFormValues, useSetFormValue } from \"./values\";\n\ntype ResolveResponse = {\n  fields?: Record<string, Node>;\n  values?: Record<string, unknown>;\n};\n\nfunction collectWatch(nodes: Node[] | undefined, keys: Set<string>, state: { any: boolean }): void {\n  for (const child of nodes ?? []) {\n    const dependsOnKeys = child.props?.dependsOnKeys;\n    if (Array.isArray(dependsOnKeys)) {\n      for (const key of dependsOnKeys) {\n        keys.add(String(key));\n      }\n    }\n    if (getBooleanProp(child.props, \"dependsOnAny\")) {\n      state.any = true;\n    }\n    collectWatch(child.children, keys, state);\n  }\n}\n\nexport function useFormResolver(\n  action: string,\n  componentRef: string,\n  nodes: Node[] | undefined,\n): Record<string, Node> {\n  const values = useFormValues();\n  const setValue = useSetFormValue();\n  const [resolved, setResolved] = useState<Record<string, Node>>({});\n\n  const watch = useMemo(() => {\n    const keys = new Set<string>();\n    const state = { any: false };\n    collectWatch(nodes, keys, state);\n    return { keys: [...keys], any: state.any };\n  }, [nodes]);\n\n  const watched = watch.any\n    ? JSON.stringify(values)\n    : JSON.stringify(watch.keys.map((key) => values[key]));\n\n  useEffect(() => {\n    if (watch.keys.length === 0 && !watch.any) {\n      return;\n    }\n\n    const controller = new AbortController();\n\n    const timer = window.setTimeout(() => {\n      void postFormAction<ResolveResponse>(\n        action,\n        componentRef,\n        { _resolve: true, ...values },\n        controller.signal,\n      )\n        .then((response) => {\n          if (!response) {\n            return;\n          }\n          for (const [name, value] of Object.entries(response.values ?? {})) {\n            setValue(name, value);\n          }\n          if (response.fields) {\n            setResolved(response.fields);\n          }\n        })\n        .catch(() => {});\n    }, FORM_DEBOUNCE_MS);\n\n    return () => {\n      window.clearTimeout(timer);\n      controller.abort();\n    };\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [watched, action, componentRef, watch.keys.length, watch.any, setValue]);\n\n  return resolved;\n}\n"],"mappings":";;;;;AAWA,SAAS,aAAa,OAA2B,MAAmB,OAA+B;CACjG,KAAK,MAAM,SAAS,SAAS,CAAC,GAAG;EAC/B,MAAM,gBAAgB,MAAM,OAAO;EACnC,IAAI,MAAM,QAAQ,aAAa,GAC7B,KAAK,MAAM,OAAO,eAChB,KAAK,IAAI,OAAO,GAAG,CAAC;EAGxB,IAAI,eAAe,MAAM,OAAO,cAAc,GAC5C,MAAM,MAAM;EAEd,aAAa,MAAM,UAAU,MAAM,KAAK;CAC1C;AACF;AAEA,SAAgB,gBACd,QACA,cACA,OACsB;CACtB,MAAM,SAAS,cAAc;CAC7B,MAAM,WAAW,gBAAgB;CACjC,MAAM,CAAC,UAAU,eAAe,SAA+B,CAAC,CAAC;CAEjE,MAAM,QAAQ,cAAc;EAC1B,MAAM,uBAAO,IAAI,IAAY;EAC7B,MAAM,QAAQ,EAAE,KAAK,MAAM;EAC3B,aAAa,OAAO,MAAM,KAAK;EAC/B,OAAO;GAAE,MAAM,CAAC,GAAG,IAAI;GAAG,KAAK,MAAM;EAAI;CAC3C,GAAG,CAAC,KAAK,CAAC;CAMV,gBAAgB;EACd,IAAI,MAAM,KAAK,WAAW,KAAK,CAAC,MAAM,KACpC;EAGF,MAAM,aAAa,IAAI,gBAAgB;EAEvC,MAAM,QAAQ,OAAO,iBAAiB;GACpC,eACE,QACA,cACA;IAAE,UAAU;IAAM,GAAG;GAAO,GAC5B,WAAW,MACb,EACG,MAAM,aAAa;IAClB,IAAI,CAAC,UACH;IAEF,KAAK,MAAM,CAAC,MAAM,UAAU,OAAO,QAAQ,SAAS,UAAU,CAAC,CAAC,GAC9D,SAAS,MAAM,KAAK;IAEtB,IAAI,SAAS,QACX,YAAY,SAAS,MAAM;GAE/B,CAAC,EACA,YAAY,CAAC,CAAC;EACnB,GAAA,GAAmB;EAEnB,aAAa;GACX,OAAO,aAAa,KAAK;GACzB,WAAW,MAAM;EACnB;CAEF,GAAG;EArCa,MAAM,MAClB,KAAK,UAAU,MAAM,IACrB,KAAK,UAAU,MAAM,KAAK,KAAK,QAAQ,OAAO,IAAI,CAAC;EAmC1C;EAAQ;EAAc,MAAM,KAAK;EAAQ,MAAM;EAAK;CAAQ,CAAC;CAE1E,OAAO;AACT"}

package/dist/form/components/values.d.ts

@@ -0,0 +1,7 @@
+export declare function FormValuesProvider({ initial, children, }: {
+    initial: Record<string, unknown>;
+    children: React.ReactNode;
+}): import("react").JSX.Element;
+export declare function useFormValues(): Record<string, unknown>;
+export declare function useFormValue(name: string): unknown;
+export declare function useSetFormValue(): (name: string, value: unknown) => void;