@lattice-php/lattice 0.2.0 → 0.3.0

package/dist/form/components/fields/table-rows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-rows.js","names":[],"sources":["../../../../resources/js/form/components/fields/table-rows.tsx"],"sourcesContent":["import type { Node } from \"@lattice-php/lattice/core/types\";\nimport { RenderNode } from \"@lattice-php/lattice/core/renderer\";\nimport { DEFAULT_COLUMN_WIDTH, type SizableColumn } from \"@lattice-php/lattice/core/column-sizing\";\nimport { useColumnResizing } from \"@lattice-php/lattice/core/use-column-resizing\";\nimport { Icon } from \"@lattice-php/lattice/icons\";\nimport { useT } from \"@lattice-php/lattice/i18n\";\nimport { memo, useEffect, useMemo, useState } from \"react\";\nimport type { ColumnWidth, RowAction as WireRowAction } from \"@lattice-php/lattice/types/generated\";\nimport { FieldScopeProvider } from \"../field-scope\";\nimport { TableCellProvider } from \"../row-layout-context\";\nimport { buildRowActions } from \"./row-action-menu\";\nimport { RowActions } from \"./row-actions\";\nimport { RowButton, RowItem } from \"./row-item\";\nimport type { RepeaterRow } from \"./repeater-rows\";\n\nconst rowControlTrack = \"3rem\";\nconst rowActionTrack = \"3rem\";\nconst rowControlTracks = [rowControlTrack];\nconst rowActionTracks = [rowActionTrack];\nconst tableViewportQuery = \"(min-width: 768px)\";\n\nexport type TableColumn = { name: string; label: string; columnWidth: ColumnWidth };\n\nexport type TableRowModel = {\n  key: string;\n  index: number;\n  row: RepeaterRow;\n  template: Node[];\n  span: boolean;\n  heading?: string;\n};\n\nfunction tableViewportMatches(): boolean {\n  if (typeof window === \"undefined\" || typeof window.matchMedia !== \"function\") {\n    return true;\n  }\n\n  return window.matchMedia(tableViewportQuery).matches;\n}\n\nfunction useTableViewport(): boolean {\n  const [matches, setMatches] = useState(tableViewportMatches);\n\n  useEffect(() => {\n    if (typeof window.matchMedia !== \"function\") {\n      return;\n    }\n\n    const query = window.matchMedia(tableViewportQuery);\n    const update = () => setMatches(query.matches);\n\n    update();\n    query.addEventListener(\"change\", update);\n\n    return () => query.removeEventListener(\"change\", update);\n  }, []);\n\n  return matches;\n}\n\nexport function columnsFromSchema(nodes: Node[]): TableColumn[] {\n  return nodes.map((node) => {\n    const props = node.props as {\n      name: unknown;\n      label?: unknown;\n      columnWidth?: ColumnWidth | null;\n    };\n    return {\n      name: String(props.name),\n      label: String(props.label ?? props.name),\n      columnWidth: props.columnWidth ?? DEFAULT_COLUMN_WIDTH,\n    };\n  });\n}\n\ntype TableRowItemProps = {\n  base: string;\n  index: number;\n  row: RepeaterRow;\n  template: Node[];\n  span: boolean;\n  isFirst: boolean;\n  isLast: boolean;\n  columnCount: number;\n  gridTemplateColumns: string;\n  flipKey: string;\n  reorderable: boolean;\n  removable: boolean;\n  rowActions: WireRowAction[] | null;\n  onField: (index: number, field: string, value: unknown) => void;\n  onMove: (index: number, delta: number) => void;\n  onRemove: (index: number) => void;\n  onDuplicate: (index: number) => void;\n  registerRow?: (key: string, el: HTMLElement | null) => void;\n};\n\nconst TableRowItem = memo(function TableRowItem({\n  base,\n  index,\n  row,\n  template,\n  span,\n  isFirst,\n  isLast,\n  columnCount,\n  gridTemplateColumns,\n  flipKey,\n  reorderable,\n  removable,\n  rowActions,\n  onField,\n  onMove,\n  onRemove,\n  onDuplicate,\n  registerRow,\n}: TableRowItemProps) {\n  const { t } = useT(\"lattice\");\n\n  return (\n    <div\n      ref={(el) => registerRow?.(flipKey, el)}\n      data-flip-key={flipKey}\n      data-test={`table-row-${base}-${index}`}\n      className=\"grid items-start gap-x-3\"\n      style={{ gridTemplateColumns }}\n    >\n      <div className=\"flex items-center gap-1 [&_svg]:size-lt-icon-sm\">\n        {reorderable && !isFirst && (\n          <RowButton\n            label=\"Move up\"\n            testId={`table-${base}-up-${index}`}\n            onClick={() => onMove(index, -1)}\n          >\n            <Icon name=\"arrow-up\" />\n          </RowButton>\n        )}\n        {reorderable && !isLast && (\n          <RowButton\n            label=\"Move down\"\n            testId={`table-${base}-down-${index}`}\n            onClick={() => onMove(index, 1)}\n          >\n            <Icon name=\"arrow-down\" />\n          </RowButton>\n        )}\n      </div>\n\n      <FieldScopeProvider\n        base={base}\n        index={index}\n        row={row}\n        onChange={(field, value) => onField(index, field, value)}\n      >\n        <TableCellProvider>\n          {span ? (\n            <div\n              data-test={`table-row-${base}-${index}-span`}\n              className=\"flex flex-col gap-2\"\n              style={{ gridColumn: `span ${columnCount}` }}\n            >\n              {template.map((child) => (\n                <RenderNode key={child.key ?? child.id} node={child} />\n              ))}\n            </div>\n          ) : (\n            template.map((child) => (\n              <div key={child.key ?? child.id}>\n                <RenderNode node={child} />\n              </div>\n            ))\n          )}\n        </TableCellProvider>\n      </FieldScopeProvider>\n\n      <div className=\"flex items-center\">\n        <RowActions\n          actions={buildRowActions(rowActions, { index, removable, onRemove, onDuplicate, t })}\n        />\n      </div>\n    </div>\n  );\n});\n\nexport function TableRows({\n  base,\n  columns,\n  rows,\n  reorderable,\n  removable,\n  rowActions,\n  onField,\n  onMove,\n  onRemove,\n  onDuplicate,\n  registerRow,\n  resizableColumns = false,\n  resizeIndicator = false,\n}: {\n  base: string;\n  columns: TableColumn[];\n  rows: TableRowModel[];\n  reorderable: boolean;\n  removable: (index: number) => boolean;\n  rowActions: WireRowAction[] | null;\n  onField: (index: number, field: string, value: unknown) => void;\n  onMove: (index: number, delta: number) => void;\n  onRemove: (index: number) => void;\n  onDuplicate: (index: number) => void;\n  registerRow?: (key: string, el: HTMLElement | null) => void;\n  resizableColumns?: boolean;\n  resizeIndicator?: boolean;\n}) {\n  const { t } = useT(\"lattice\");\n  const isTableViewport = useTableViewport();\n  const sizingColumns = useMemo<SizableColumn[]>(\n    () =>\n      columns.map((column) => ({\n        key: column.name,\n        label: column.label,\n        width: column.columnWidth,\n      })),\n    [columns],\n  );\n  const { getResizeHandleProps, gridTemplateColumns, hasOverrides, resetColumns } =\n    useColumnResizing({\n      columns: sizingColumns,\n      enabled: resizableColumns,\n      columnGapPx: 12,\n      leadingTracks: rowControlTracks,\n      showIndicator: resizeIndicator,\n      storageKey: resizableColumns ? `lattice:table-columns:form:${base}` : undefined,\n      trailingTracks: rowActionTracks,\n    });\n\n  if (!isTableViewport) {\n    return (\n      <div className=\"flex flex-col gap-3\">\n        {rows.map((row) => (\n          <div key={row.key} ref={(el) => registerRow?.(row.key, el)} data-flip-key={row.key}>\n            <RowItem\n              base={base}\n              index={row.index}\n              row={row.row}\n              template={row.template}\n              heading={row.heading ?? `#${row.index + 1}`}\n              reorderable={reorderable}\n              isFirst={row.index === 0}\n              isLast={row.index === rows.length - 1}\n              removable={removable(row.index)}\n              rowActions={rowActions}\n              onField={onField}\n              onRemove={onRemove}\n              onMove={onMove}\n              onDuplicate={onDuplicate}\n            />\n          </div>\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"relative\">\n      {hasOverrides && (\n        <button\n          aria-label={t(\"a11y.resetColumnWidths\", \"Reset column widths\")}\n          className=\"absolute right-1 top-1 z-10 hidden rounded-lt-sm p-1 text-lt-muted-fg hover:text-lt-fg md:inline-flex\"\n          data-test=\"table-reset-columns\"\n          onClick={resetColumns}\n          title={t(\"a11y.resetColumnWidths\", \"Reset column widths\")}\n          type=\"button\"\n        >\n          <Icon name=\"rotate-ccw\" className=\"size-lt-icon-sm\" />\n        </button>\n      )}\n      <div className=\"overflow-x-auto\">\n        <div className=\"flex min-w-max flex-col gap-2\">\n          <div className=\"grid items-center gap-x-3\" style={{ gridTemplateColumns }}>\n            <div />\n            {columns.map((column, index) => (\n              <div\n                key={column.name}\n                className=\"relative min-w-0 pr-3 text-xs font-medium text-lt-muted-fg\"\n              >\n                {column.label}\n                {resizableColumns && <div {...getResizeHandleProps(sizingColumns[index])} />}\n              </div>\n            ))}\n            <div />\n          </div>\n\n          {rows.map((row) => (\n            <TableRowItem\n              key={row.key}\n              base={base}\n              index={row.index}\n              row={row.row}\n              template={row.template}\n              span={row.span}\n              isFirst={row.index === 0}\n              isLast={row.index === rows.length - 1}\n              columnCount={columns.length}\n              gridTemplateColumns={gridTemplateColumns}\n              flipKey={row.key}\n              reorderable={reorderable}\n              removable={removable(row.index)}\n              rowActions={rowActions}\n              onField={onField}\n              onMove={onMove}\n              onRemove={onRemove}\n              onDuplicate={onDuplicate}\n              registerRow={registerRow}\n            />\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/form/components/fields/text-input.d.ts

@@ -1,2 +1,2 @@
 import { RendererComponent } from '../../../core/types';
-export declare const TextInputComponent: RendererComponent<"form.text-input">;
+export declare const TextInputComponent: RendererComponent<"field.text-input">;

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

@@ -7,9 +7,10 @@ var TextInputComponent = ({ node }) => {
 	return /* @__PURE__ */ jsx(SimpleField, {
 		node,
 		label: props.label ?? "",
-		children: ({ name, value, readOnly, disabled, commit }) => /* @__PURE__ */ jsx(Input, {
+		children: ({ name, testId, value, readOnly, disabled, commit }) => /* @__PURE__ */ jsx(Input, {
 			autoComplete: props.autoComplete ?? "",
 			autoFocus: props.autoFocus ?? false,
+			"data-test": testId,
 			disabled,
 			id: name,
 			name,

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

@@ -1 +1 @@
-{"version":3,"file":"text-input.js","names":[],"sources":["../../../../resources/js/form/components/fields/text-input.tsx"],"sourcesContent":["import type { RendererComponent } from \"@lattice/lattice/core/types\";\nimport { Input } from \"../base/input\";\nimport { SimpleField } from \"./simple-field\";\n\nexport const TextInputComponent: RendererComponent<\"form.text-input\"> = ({ node }) => {\n  const props = node.props;\n\n  return (\n    <SimpleField node={node} label={props.label ?? \"\"}>\n      {({ name, value, readOnly, disabled, commit }) => (\n        <Input\n          autoComplete={props.autoComplete ?? \"\"}\n          autoFocus={props.autoFocus ?? false}\n          disabled={disabled}\n          id={name}\n          name={name}\n          onChange={(event) => commit(event.target.value)}\n          placeholder={props.placeholder ?? \"\"}\n          readOnly={readOnly}\n          tabIndex={props.tabIndex ?? undefined}\n          type={props.type ?? \"text\"}\n          value={value}\n        />\n      )}\n    </SimpleField>\n  );\n};\n"],"mappings":";;;;AAIA,IAAa,sBAA4D,EAAE,WAAW;CACpF,MAAM,QAAQ,KAAK;CAEnB,OACE,oBAAC,aAAD;EAAmB;EAAM,OAAO,MAAM,SAAS;aAC3C,EAAE,MAAM,OAAO,UAAU,UAAU,aACnC,oBAAC,OAAD;GACE,cAAc,MAAM,gBAAgB;GACpC,WAAW,MAAM,aAAa;GACpB;GACV,IAAI;GACE;GACN,WAAW,UAAU,OAAO,MAAM,OAAO,KAAK;GAC9C,aAAa,MAAM,eAAe;GACxB;GACV,UAAU,MAAM,YAAY,KAAA;GAC5B,MAAM,MAAM,QAAQ;GACb;EACR,CAAA;CAEQ,CAAA;AAEjB"}
+{"version":3,"file":"text-input.js","names":[],"sources":["../../../../resources/js/form/components/fields/text-input.tsx"],"sourcesContent":["import type { RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { Input } from \"../base/input\";\nimport { SimpleField } from \"./simple-field\";\n\nexport const TextInputComponent: RendererComponent<\"field.text-input\"> = ({ node }) => {\n  const props = node.props;\n\n  return (\n    <SimpleField node={node} label={props.label ?? \"\"}>\n      {({ name, testId, value, readOnly, disabled, commit }) => (\n        <Input\n          autoComplete={props.autoComplete ?? \"\"}\n          autoFocus={props.autoFocus ?? false}\n          data-test={testId}\n          disabled={disabled}\n          id={name}\n          name={name}\n          onChange={(event) => commit(event.target.value)}\n          placeholder={props.placeholder ?? \"\"}\n          readOnly={readOnly}\n          tabIndex={props.tabIndex ?? undefined}\n          type={props.type ?? \"text\"}\n          value={value}\n        />\n      )}\n    </SimpleField>\n  );\n};\n"],"mappings":";;;;AAIA,IAAa,sBAA6D,EAAE,WAAW;CACrF,MAAM,QAAQ,KAAK;CAEnB,OACE,oBAAC,aAAD;EAAmB;EAAM,OAAO,MAAM,SAAS;aAC3C,EAAE,MAAM,QAAQ,OAAO,UAAU,UAAU,aAC3C,oBAAC,OAAD;GACE,cAAc,MAAM,gBAAgB;GACpC,WAAW,MAAM,aAAa;GAC9B,aAAW;GACD;GACV,IAAI;GACE;GACN,WAAW,UAAU,OAAO,MAAM,OAAO,KAAK;GAC9C,aAAa,MAAM,eAAe;GACxB;GACV,UAAU,MAAM,YAAY,KAAA;GAC5B,MAAM,MAAM,QAAQ;GACb;EACR,CAAA;CAEQ,CAAA;AAEjB"}

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

@@ -1,2 +1,2 @@
 import { RendererComponent } from '../../../core/types';
-export declare const TextareaComponent: RendererComponent<"form.textarea">;
+export declare const TextareaComponent: RendererComponent<"field.textarea">;

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

@@ -7,8 +7,9 @@ var TextareaComponent = ({ node }) => {
 	return /* @__PURE__ */ jsx(SimpleField, {
 		node,
 		label: props.label ?? "",
-		children: ({ name, value, readOnly, disabled, commit }) => /* @__PURE__ */ jsx(Textarea, {
+		children: ({ name, testId, value, readOnly, disabled, commit }) => /* @__PURE__ */ jsx(Textarea, {
 			autoFocus: props.autoFocus ?? false,
+			"data-test": testId,
 			disabled,
 			id: name,
 			name,

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

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","names":[],"sources":["../../../../resources/js/form/components/fields/textarea.tsx"],"sourcesContent":["import type { RendererComponent } from \"@lattice/lattice/core/types\";\nimport { Textarea } from \"../base/textarea\";\nimport { SimpleField } from \"./simple-field\";\n\nexport const TextareaComponent: RendererComponent<\"form.textarea\"> = ({ node }) => {\n  const props = node.props;\n\n  return (\n    <SimpleField node={node} label={props.label ?? \"\"}>\n      {({ name, value, readOnly, disabled, commit }) => (\n        <Textarea\n          autoFocus={props.autoFocus ?? false}\n          disabled={disabled}\n          id={name}\n          name={name}\n          onChange={(event) => commit(event.target.value)}\n          placeholder={props.placeholder ?? \"\"}\n          readOnly={readOnly}\n          rows={props.rows ?? undefined}\n          tabIndex={props.tabIndex ?? undefined}\n          value={value}\n        />\n      )}\n    </SimpleField>\n  );\n};\n"],"mappings":";;;;AAIA,IAAa,qBAAyD,EAAE,WAAW;CACjF,MAAM,QAAQ,KAAK;CAEnB,OACE,oBAAC,aAAD;EAAmB;EAAM,OAAO,MAAM,SAAS;aAC3C,EAAE,MAAM,OAAO,UAAU,UAAU,aACnC,oBAAC,UAAD;GACE,WAAW,MAAM,aAAa;GACpB;GACV,IAAI;GACE;GACN,WAAW,UAAU,OAAO,MAAM,OAAO,KAAK;GAC9C,aAAa,MAAM,eAAe;GACxB;GACV,MAAM,MAAM,QAAQ,KAAA;GACpB,UAAU,MAAM,YAAY,KAAA;GACrB;EACR,CAAA;CAEQ,CAAA;AAEjB"}
+{"version":3,"file":"textarea.js","names":[],"sources":["../../../../resources/js/form/components/fields/textarea.tsx"],"sourcesContent":["import type { RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { Textarea } from \"../base/textarea\";\nimport { SimpleField } from \"./simple-field\";\n\nexport const TextareaComponent: RendererComponent<\"field.textarea\"> = ({ node }) => {\n  const props = node.props;\n\n  return (\n    <SimpleField node={node} label={props.label ?? \"\"}>\n      {({ name, testId, value, readOnly, disabled, commit }) => (\n        <Textarea\n          autoFocus={props.autoFocus ?? false}\n          data-test={testId}\n          disabled={disabled}\n          id={name}\n          name={name}\n          onChange={(event) => commit(event.target.value)}\n          placeholder={props.placeholder ?? \"\"}\n          readOnly={readOnly}\n          rows={props.rows ?? undefined}\n          tabIndex={props.tabIndex ?? undefined}\n          value={value}\n        />\n      )}\n    </SimpleField>\n  );\n};\n"],"mappings":";;;;AAIA,IAAa,qBAA0D,EAAE,WAAW;CAClF,MAAM,QAAQ,KAAK;CAEnB,OACE,oBAAC,aAAD;EAAmB;EAAM,OAAO,MAAM,SAAS;aAC3C,EAAE,MAAM,QAAQ,OAAO,UAAU,UAAU,aAC3C,oBAAC,UAAD;GACE,WAAW,MAAM,aAAa;GAC9B,aAAW;GACD;GACV,IAAI;GACE;GACN,WAAW,UAAU,OAAO,MAAM,OAAO,KAAK;GAC9C,aAAa,MAAM,eAAe;GACxB;GACV,MAAM,MAAM,QAAQ,KAAA;GACpB,UAAU,MAAM,YAAY,KAAA;GACrB;EACR,CAAA;CAEQ,CAAA;AAEjB"}

package/dist/form/components/fields/use-flip-reorder.d.ts

@@ -0,0 +1,6 @@
+/**
+ * FLIP reorder: animates registered elements from their previous to current
+ * position whenever `orderSignature` changes. Imperative style writes only, so
+ * it does not affect React render or the memoised rows.
+ */
+export declare function useFlipReorder(orderSignature: string): (key: string, el: HTMLElement | null) => void;

package/dist/form/components/fields/use-flip-reorder.js

@@ -0,0 +1,51 @@
+import { useCallback, useLayoutEffect, useRef } from "react";
+//#region resources/js/form/components/fields/use-flip-reorder.ts
+var DURATION_MS = 180;
+function prefersReducedMotion() {
+	return typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches;
+}
+/**
+* FLIP reorder: animates registered elements from their previous to current
+* position whenever `orderSignature` changes. Imperative style writes only, so
+* it does not affect React render or the memoised rows.
+*/
+function useFlipReorder(orderSignature) {
+	const elements = useRef(/* @__PURE__ */ new Map());
+	const previous = useRef(/* @__PURE__ */ new Map());
+	const register = useCallback((key, el) => {
+		if (el) elements.current.set(key, el);
+		else elements.current.delete(key);
+	}, []);
+	useLayoutEffect(() => {
+		const handles = [];
+		const next = /* @__PURE__ */ new Map();
+		elements.current.forEach((el, key) => {
+			el.style.transition = "";
+			el.style.transform = "";
+			next.set(key, el.getBoundingClientRect());
+		});
+		if (!prefersReducedMotion()) elements.current.forEach((el, key) => {
+			const before = previous.current.get(key);
+			const after = next.get(key);
+			if (before && after) {
+				const dy = before.top - after.top;
+				if (dy) {
+					el.style.transform = `translateY(${dy}px)`;
+					handles.push(requestAnimationFrame(() => {
+						el.style.transition = `transform ${DURATION_MS}ms ease-out`;
+						el.style.transform = "";
+					}));
+				}
+			}
+		});
+		previous.current = next;
+		return () => {
+			for (const handle of handles) cancelAnimationFrame(handle);
+		};
+	}, [orderSignature]);
+	return register;
+}
+//#endregion
+export { useFlipReorder };
+
+//# sourceMappingURL=use-flip-reorder.js.map

package/dist/form/components/fields/use-flip-reorder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-flip-reorder.js","names":[],"sources":["../../../../resources/js/form/components/fields/use-flip-reorder.ts"],"sourcesContent":["import { useCallback, useLayoutEffect, useRef } from \"react\";\n\nconst DURATION_MS = 180;\n\nfunction prefersReducedMotion(): boolean {\n  return typeof matchMedia === \"function\" && matchMedia(\"(prefers-reduced-motion: reduce)\").matches;\n}\n\n/**\n * FLIP reorder: animates registered elements from their previous to current\n * position whenever `orderSignature` changes. Imperative style writes only, so\n * it does not affect React render or the memoised rows.\n */\nexport function useFlipReorder(\n  orderSignature: string,\n): (key: string, el: HTMLElement | null) => void {\n  const elements = useRef(new Map<string, HTMLElement>());\n  const previous = useRef(new Map<string, DOMRect>());\n\n  // register is the FLIP measurement target; the element must be a zero-overhead positioning wrapper (no padding/margin) for the delta to match the visible row.\n  const register = useCallback((key: string, el: HTMLElement | null): void => {\n    if (el) {\n      elements.current.set(key, el);\n    } else {\n      elements.current.delete(key);\n    }\n  }, []);\n\n  useLayoutEffect(() => {\n    const handles: number[] = [];\n    const next = new Map<string, DOMRect>();\n    elements.current.forEach((el, key) => {\n      el.style.transition = \"\";\n      el.style.transform = \"\";\n      next.set(key, el.getBoundingClientRect());\n    });\n\n    if (!prefersReducedMotion()) {\n      elements.current.forEach((el, key) => {\n        const before = previous.current.get(key);\n        const after = next.get(key);\n        if (before && after) {\n          const dy = before.top - after.top;\n          if (dy) {\n            el.style.transform = `translateY(${dy}px)`;\n            handles.push(\n              requestAnimationFrame(() => {\n                el.style.transition = `transform ${DURATION_MS}ms ease-out`;\n                el.style.transform = \"\";\n              }),\n            );\n          }\n        }\n      });\n    }\n\n    previous.current = next;\n\n    return () => {\n      for (const handle of handles) {\n        cancelAnimationFrame(handle);\n      }\n    };\n  }, [orderSignature]);\n\n  return register;\n}\n"],"mappings":";;AAEA,IAAM,cAAc;AAEpB,SAAS,uBAAgC;CACvC,OAAO,OAAO,eAAe,cAAc,WAAW,kCAAkC,EAAE;AAC5F;;;;;;AAOA,SAAgB,eACd,gBAC+C;CAC/C,MAAM,WAAW,uBAAO,IAAI,IAAyB,CAAC;CACtD,MAAM,WAAW,uBAAO,IAAI,IAAqB,CAAC;CAGlD,MAAM,WAAW,aAAa,KAAa,OAAiC;EAC1E,IAAI,IACF,SAAS,QAAQ,IAAI,KAAK,EAAE;OAE5B,SAAS,QAAQ,OAAO,GAAG;CAE/B,GAAG,CAAC,CAAC;CAEL,sBAAsB;EACpB,MAAM,UAAoB,CAAC;EAC3B,MAAM,uBAAO,IAAI,IAAqB;EACtC,SAAS,QAAQ,SAAS,IAAI,QAAQ;GACpC,GAAG,MAAM,aAAa;GACtB,GAAG,MAAM,YAAY;GACrB,KAAK,IAAI,KAAK,GAAG,sBAAsB,CAAC;EAC1C,CAAC;EAED,IAAI,CAAC,qBAAqB,GACxB,SAAS,QAAQ,SAAS,IAAI,QAAQ;GACpC,MAAM,SAAS,SAAS,QAAQ,IAAI,GAAG;GACvC,MAAM,QAAQ,KAAK,IAAI,GAAG;GAC1B,IAAI,UAAU,OAAO;IACnB,MAAM,KAAK,OAAO,MAAM,MAAM;IAC9B,IAAI,IAAI;KACN,GAAG,MAAM,YAAY,cAAc,GAAG;KACtC,QAAQ,KACN,4BAA4B;MAC1B,GAAG,MAAM,aAAa,aAAa,YAAY;MAC/C,GAAG,MAAM,YAAY;KACvB,CAAC,CACH;IACF;GACF;EACF,CAAC;EAGH,SAAS,UAAU;EAEnB,aAAa;GACX,KAAK,MAAM,UAAU,SACnB,qBAAqB,MAAM;EAE/B;CACF,GAAG,CAAC,cAAc,CAAC;CAEnB,OAAO;AACT"}

package/dist/form/components/fields/use-row-collection.d.ts

@@ -0,0 +1,11 @@
+import { RepeaterRow } from './repeater-rows';
+export type RowCollection = {
+    path: string;
+    rows: RepeaterRow[];
+    onField: (index: number, field: string, value: unknown) => void;
+    onRemove: (index: number) => void;
+    onMove: (index: number, delta: number) => void;
+    onDuplicate: (index: number) => void;
+    append: (row: RepeaterRow) => void;
+};
+export declare function useRowCollection(name: string, defaultItems: number): RowCollection;

package/dist/form/components/fields/use-row-collection.js

@@ -0,0 +1,44 @@
+import { duplicateRow, ensureRowIds, moveRow, removeRow, seedRows, withRowId } from "./repeater-rows.js";
+import { useFieldScope } from "../field-scope.js";
+import { useFormValue, useSetFormValue } from "../values.js";
+import { useCallback, useLayoutEffect } from "react";
+//#region resources/js/form/components/fields/use-row-collection.ts
+function useRowCollection(name, defaultItems) {
+	const scope = useFieldScope();
+	const path = scope ? scope.errorKey(name) : name;
+	const setValue = useSetFormValue();
+	const stored = useFormValue(path);
+	const raw = Array.isArray(stored) ? stored : seedRows(stored, defaultItems);
+	const rows = ensureRowIds(raw);
+	useLayoutEffect(() => {
+		if (rows !== raw) setValue(path, rows);
+	}, [
+		raw,
+		rows,
+		setValue,
+		path
+	]);
+	const mutate = useCallback((fn) => {
+		setValue(path, (prev) => fn(Array.isArray(prev) ? prev : seedRows(prev, defaultItems)));
+	}, [
+		setValue,
+		path,
+		defaultItems
+	]);
+	return {
+		path,
+		rows,
+		onField: useCallback((index, field, value) => mutate((current) => current.map((r, i) => i === index ? {
+			...r,
+			[field]: value
+		} : r)), [mutate]),
+		onRemove: useCallback((index) => mutate((current) => removeRow(current, index)), [mutate]),
+		onMove: useCallback((index, delta) => mutate((current) => moveRow(current, index, index + delta)), [mutate]),
+		onDuplicate: useCallback((index) => mutate((current) => duplicateRow(current, index)), [mutate]),
+		append: useCallback((row) => mutate((current) => [...current, withRowId(row)]), [mutate])
+	};
+}
+//#endregion
+export { useRowCollection };
+
+//# sourceMappingURL=use-row-collection.js.map

package/dist/form/components/fields/use-row-collection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-row-collection.js","names":[],"sources":["../../../../resources/js/form/components/fields/use-row-collection.ts"],"sourcesContent":["import { useCallback, useLayoutEffect } from \"react\";\nimport { useFieldScope } from \"../field-scope\";\nimport { useFormValue, useSetFormValue } from \"../values\";\nimport {\n  duplicateRow,\n  ensureRowIds,\n  moveRow,\n  removeRow,\n  seedRows,\n  withRowId,\n  type RepeaterRow,\n} from \"./repeater-rows\";\n\nexport type RowCollection = {\n  path: string;\n  rows: RepeaterRow[];\n  onField: (index: number, field: string, value: unknown) => void;\n  onRemove: (index: number) => void;\n  onMove: (index: number, delta: number) => void;\n  onDuplicate: (index: number) => void;\n  append: (row: RepeaterRow) => void;\n};\n\nexport function useRowCollection(name: string, defaultItems: number): RowCollection {\n  const scope = useFieldScope();\n  const path = scope ? scope.errorKey(name) : name;\n  const setValue = useSetFormValue();\n  const stored = useFormValue(path);\n  const raw: RepeaterRow[] = Array.isArray(stored) ? stored : seedRows(stored, defaultItems);\n  const rows = ensureRowIds(raw);\n\n  useLayoutEffect(() => {\n    if (rows !== raw) {\n      setValue(path, rows);\n    }\n  }, [raw, rows, setValue, path]);\n\n  // Functional store updates preserve the identity of untouched rows, which lets\n  // the memoised RowItem skip re-rendering siblings on a single-row edit.\n  const mutate = useCallback(\n    (fn: (rows: RepeaterRow[]) => RepeaterRow[]): void => {\n      setValue(path, (prev: unknown) =>\n        fn(Array.isArray(prev) ? (prev as RepeaterRow[]) : seedRows(prev, defaultItems)),\n      );\n    },\n    [setValue, path, defaultItems],\n  );\n\n  const onField = useCallback(\n    (index: number, field: string, value: unknown): void =>\n      mutate((current) => current.map((r, i) => (i === index ? { ...r, [field]: value } : r))),\n    [mutate],\n  );\n  const onRemove = useCallback(\n    (index: number): void => mutate((current) => removeRow(current, index)),\n    [mutate],\n  );\n  const onMove = useCallback(\n    (index: number, delta: number): void =>\n      mutate((current) => moveRow(current, index, index + delta)),\n    [mutate],\n  );\n  const onDuplicate = useCallback(\n    (index: number): void => mutate((current) => duplicateRow(current, index)),\n    [mutate],\n  );\n  const append = useCallback(\n    (row: RepeaterRow): void => mutate((current) => [...current, withRowId(row)]),\n    [mutate],\n  );\n\n  return { path, rows, onField, onRemove, onMove, onDuplicate, append };\n}\n"],"mappings":";;;;;AAuBA,SAAgB,iBAAiB,MAAc,cAAqC;CAClF,MAAM,QAAQ,cAAc;CAC5B,MAAM,OAAO,QAAQ,MAAM,SAAS,IAAI,IAAI;CAC5C,MAAM,WAAW,gBAAgB;CACjC,MAAM,SAAS,aAAa,IAAI;CAChC,MAAM,MAAqB,MAAM,QAAQ,MAAM,IAAI,SAAS,SAAS,QAAQ,YAAY;CACzF,MAAM,OAAO,aAAa,GAAG;CAE7B,sBAAsB;EACpB,IAAI,SAAS,KACX,SAAS,MAAM,IAAI;CAEvB,GAAG;EAAC;EAAK;EAAM;EAAU;CAAI,CAAC;CAI9B,MAAM,SAAS,aACZ,OAAqD;EACpD,SAAS,OAAO,SACd,GAAG,MAAM,QAAQ,IAAI,IAAK,OAAyB,SAAS,MAAM,YAAY,CAAC,CACjF;CACF,GACA;EAAC;EAAU;EAAM;CAAY,CAC/B;CAyBA,OAAO;EAAE;EAAM;EAAM,SAvBL,aACb,OAAe,OAAe,UAC7B,QAAQ,YAAY,QAAQ,KAAK,GAAG,MAAO,MAAM,QAAQ;GAAE,GAAG;IAAI,QAAQ;EAAM,IAAI,CAAE,CAAC,GACzF,CAAC,MAAM,CAoBY;EAAS,UAlBb,aACd,UAAwB,QAAQ,YAAY,UAAU,SAAS,KAAK,CAAC,GACtE,CAAC,MAAM,CAgBqB;EAAU,QAdzB,aACZ,OAAe,UACd,QAAQ,YAAY,QAAQ,SAAS,OAAO,QAAQ,KAAK,CAAC,GAC5D,CAAC,MAAM,CAW+B;EAAQ,aAT5B,aACjB,UAAwB,QAAQ,YAAY,aAAa,SAAS,KAAK,CAAC,GACzE,CAAC,MAAM,CAOuC;EAAa,QAL9C,aACZ,QAA2B,QAAQ,YAAY,CAAC,GAAG,SAAS,UAAU,GAAG,CAAC,CAAC,GAC5E,CAAC,MAAM,CAGoD;CAAO;AACtE"}

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

@@ -0,0 +1,5 @@
+export declare function pathParts(path: string): string[];
+export declare function appendPath(base: string | null | undefined, ...parts: Array<string | number>): string;
+export declare function toHtmlName(path: string): string;
+export declare function getPath(values: Record<string, unknown>, path: string): unknown;
+export declare function setPath(values: Record<string, unknown>, path: string, value: unknown): Record<string, unknown>;

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

@@ -0,0 +1,40 @@
+//#region resources/js/form/components/form-path.ts
+function pathParts(path) {
+	return path.split(".").filter((part) => part !== "");
+}
+function appendPath(base, ...parts) {
+	const suffix = parts.map(String).filter((part) => part !== "");
+	return [base ?? "", ...suffix].filter((part) => part !== "").join(".");
+}
+function toHtmlName(path) {
+	const [head, ...tail] = pathParts(path);
+	return tail.reduce((name, part) => `${name}[${part}]`, head ?? "");
+}
+function getPath(values, path) {
+	let current = values;
+	for (const part of pathParts(path)) {
+		if (current == null) return;
+		current = current[part];
+	}
+	return current;
+}
+function emptyContainer(nextPart) {
+	return nextPart !== void 0 && /^\d+$/.test(nextPart) ? [] : {};
+}
+function setPath(values, path, value) {
+	const parts = pathParts(path);
+	if (parts.length === 0) return values;
+	const write = (current, index) => {
+		const part = parts[index];
+		const last = index === parts.length - 1;
+		const source = current && typeof current === "object" ? current : emptyContainer(parts[index + 1]);
+		const next = Array.isArray(source) ? [...source] : { ...source };
+		next[part] = last ? value : write(source[part], index + 1);
+		return next;
+	};
+	return write(values, 0);
+}
+//#endregion
+export { appendPath, getPath, pathParts, setPath, toHtmlName };
+
+//# sourceMappingURL=form-path.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"form-path.js","names":[],"sources":["../../../resources/js/form/components/form-path.ts"],"sourcesContent":["export function pathParts(path: string): string[] {\n  return path.split(\".\").filter((part) => part !== \"\");\n}\n\nexport function appendPath(\n  base: string | null | undefined,\n  ...parts: Array<string | number>\n): string {\n  const suffix = parts.map(String).filter((part) => part !== \"\");\n\n  return [base ?? \"\", ...suffix].filter((part) => part !== \"\").join(\".\");\n}\n\nexport function toHtmlName(path: string): string {\n  const [head, ...tail] = pathParts(path);\n\n  return tail.reduce((name, part) => `${name}[${part}]`, head ?? \"\");\n}\n\nexport function getPath(values: Record<string, unknown>, path: string): unknown {\n  let current: unknown = values;\n\n  for (const part of pathParts(path)) {\n    if (current == null) {\n      return undefined;\n    }\n\n    current = (current as Record<string, unknown>)[part];\n  }\n\n  return current;\n}\n\nfunction emptyContainer(nextPart: string | undefined): Record<string, unknown> | unknown[] {\n  return nextPart !== undefined && /^\\d+$/.test(nextPart) ? [] : {};\n}\n\nexport function setPath(\n  values: Record<string, unknown>,\n  path: string,\n  value: unknown,\n): Record<string, unknown> {\n  const parts = pathParts(path);\n\n  if (parts.length === 0) {\n    return values;\n  }\n\n  const write = (current: unknown, index: number): unknown => {\n    const part = parts[index];\n    const last = index === parts.length - 1;\n    const source =\n      current && typeof current === \"object\" ? current : emptyContainer(parts[index + 1]);\n    const next = Array.isArray(source) ? [...source] : { ...(source as Record<string, unknown>) };\n\n    (next as Record<string, unknown>)[part] = last\n      ? value\n      : write((source as Record<string, unknown>)[part], index + 1);\n\n    return next;\n  };\n\n  return write(values, 0) as Record<string, unknown>;\n}\n"],"mappings":";AAAA,SAAgB,UAAU,MAAwB;CAChD,OAAO,KAAK,MAAM,GAAG,EAAE,QAAQ,SAAS,SAAS,EAAE;AACrD;AAEA,SAAgB,WACd,MACA,GAAG,OACK;CACR,MAAM,SAAS,MAAM,IAAI,MAAM,EAAE,QAAQ,SAAS,SAAS,EAAE;CAE7D,OAAO,CAAC,QAAQ,IAAI,GAAG,MAAM,EAAE,QAAQ,SAAS,SAAS,EAAE,EAAE,KAAK,GAAG;AACvE;AAEA,SAAgB,WAAW,MAAsB;CAC/C,MAAM,CAAC,MAAM,GAAG,QAAQ,UAAU,IAAI;CAEtC,OAAO,KAAK,QAAQ,MAAM,SAAS,GAAG,KAAK,GAAG,KAAK,IAAI,QAAQ,EAAE;AACnE;AAEA,SAAgB,QAAQ,QAAiC,MAAuB;CAC9E,IAAI,UAAmB;CAEvB,KAAK,MAAM,QAAQ,UAAU,IAAI,GAAG;EAClC,IAAI,WAAW,MACb;EAGF,UAAW,QAAoC;CACjD;CAEA,OAAO;AACT;AAEA,SAAS,eAAe,UAAmE;CACzF,OAAO,aAAa,KAAA,KAAa,QAAQ,KAAK,QAAQ,IAAI,CAAC,IAAI,CAAC;AAClE;AAEA,SAAgB,QACd,QACA,MACA,OACyB;CACzB,MAAM,QAAQ,UAAU,IAAI;CAE5B,IAAI,MAAM,WAAW,GACnB,OAAO;CAGT,MAAM,SAAS,SAAkB,UAA2B;EAC1D,MAAM,OAAO,MAAM;EACnB,MAAM,OAAO,UAAU,MAAM,SAAS;EACtC,MAAM,SACJ,WAAW,OAAO,YAAY,WAAW,UAAU,eAAe,MAAM,QAAQ,EAAE;EACpF,MAAM,OAAO,MAAM,QAAQ,MAAM,IAAI,CAAC,GAAG,MAAM,IAAI,EAAE,GAAI,OAAmC;EAE5F,KAAkC,QAAQ,OACtC,QACA,MAAO,OAAmC,OAAO,QAAQ,CAAC;EAE9D,OAAO;CACT;CAEA,OAAO,MAAM,QAAQ,CAAC;AACxB"}

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

@@ -1,8 +1,7 @@
 /**
- * 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.
+ * Shared client transport for the lattice form endpoint: every form sub-action
+ * (validation resolve, option search) POSTs to the same signed URL, so the
+ * request shape — notably stripping client-only row ids — lives here once.
  */
 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

@@ -1,31 +1,30 @@
-import { withRefHeader } from "../../core/component-ref.js";
+import { apiFetch } from "../../core/api.js";
+import "./fields/repeater-rows.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.
+* Shared client transport for the lattice form endpoint: every form sub-action
+* (validation resolve, option search) POSTs to the same signed URL, so the
+* request shape — notably stripping client-only row ids — lives here once.
 */
 var FORM_DEBOUNCE_MS = 250;
-function xsrfToken() {
-	const match = document.cookie.match(/XSRF-TOKEN=([^;]+)/);
-	return match ? decodeURIComponent(match[1]) : "";
+function scrubFormPayload(value) {
+	if (Array.isArray(value)) return value.map(scrubFormPayload);
+	if (value !== null && typeof value === "object") return Object.entries(value).reduce((payload, [key, item]) => {
+		if (key !== "__rowId") payload[key] = scrubFormPayload(item);
+		return payload;
+	}, {});
+	return value;
 }
 function postFormAction(action, componentRef, body, signal) {
-	return fetch(action, {
+	return apiFetch(action, {
 		method: "POST",
-		credentials: "same-origin",
+		ref: componentRef,
 		signal,
-		headers: {
-			"Content-Type": "application/json",
-			Accept: "application/json",
-			"X-Requested-With": "XMLHttpRequest",
-			"X-XSRF-TOKEN": xsrfToken(),
-			...withRefHeader(componentRef)
-		},
-		body: JSON.stringify(body)
+		body: JSON.stringify(scrubFormPayload(body)),
+		throwOnError: false
 	}).then((response) => response.ok ? response.json() : null);
 }
 //#endregion
-export { FORM_DEBOUNCE_MS, postFormAction, xsrfToken };
+export { FORM_DEBOUNCE_MS, postFormAction };
 
 //# sourceMappingURL=form-transport.js.map

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

@@ -1 +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"}
+{"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 URL, so the\n * request shape — notably stripping client-only row ids — lives here once.\n */\n\nimport { apiFetch } from \"@lattice-php/lattice/core/api\";\nimport { ROW_ID_KEY } from \"./fields/repeater-rows\";\n\nexport const FORM_DEBOUNCE_MS = 250;\n\nfunction scrubFormPayload(value: unknown): unknown {\n  if (Array.isArray(value)) {\n    return value.map(scrubFormPayload);\n  }\n\n  if (value !== null && typeof value === \"object\") {\n    return Object.entries(value as Record<string, unknown>).reduce<Record<string, unknown>>(\n      (payload, [key, item]) => {\n        if (key !== ROW_ID_KEY) {\n          payload[key] = scrubFormPayload(item);\n        }\n\n        return payload;\n      },\n      {},\n    );\n  }\n\n  return value;\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 apiFetch(action, {\n    method: \"POST\",\n    ref: componentRef,\n    signal,\n    body: JSON.stringify(scrubFormPayload(body)),\n    throwOnError: false,\n  }).then((response) => (response.ok ? (response.json() as Promise<T>) : null));\n}\n"],"mappings":";;;;;;;;AASA,IAAa,mBAAmB;AAEhC,SAAS,iBAAiB,OAAyB;CACjD,IAAI,MAAM,QAAQ,KAAK,GACrB,OAAO,MAAM,IAAI,gBAAgB;CAGnC,IAAI,UAAU,QAAQ,OAAO,UAAU,UACrC,OAAO,OAAO,QAAQ,KAAgC,EAAE,QACrD,SAAS,CAAC,KAAK,UAAU;EACxB,IAAI,QAAA,WACF,QAAQ,OAAO,iBAAiB,IAAI;EAGtC,OAAO;CACT,GACA,CAAC,CACH;CAGF,OAAO;AACT;AAEA,SAAgB,eACd,QACA,cACA,MACA,QACmB;CACnB,OAAO,SAAS,QAAQ;EACtB,QAAQ;EACR,KAAK;EACL;EACA,MAAM,KAAK,UAAU,iBAAiB,IAAI,CAAC;EAC3C,cAAc;CAChB,CAAC,EAAE,MAAM,aAAc,SAAS,KAAM,SAAS,KAAK,IAAmB,IAAK;AAC9E"}

package/dist/form/components/form.js

@@ -1,7 +1,8 @@
-import { withRefHeader } from "../../core/component-ref.js";
 import { LATTICE_EVENT } from "../../events/event-names.js";
+import { withHeaders } from "../../core/headers.js";
 import { FormProvider } from "./context.js";
 import { walkFields } from "./field-props.js";
+import { PrefillProvider } from "./prefill-context.js";
 import { ResolvedNodesProvider } from "./resolved-nodes.js";
 import { FormValuesProvider } from "./values.js";
 import { useFormResolver } from "./use-form-resolver.js";
@@ -34,17 +35,21 @@ function FormResetListener({ componentId, reset }) {
 	return null;
 }
 function FormBody({ action, children, componentRef, nodes, shouldRenderSubmitButton, submitLabel, summaryLabel }) {
-	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,
-					summaryLabel
-				})
-			})]
+	const { nodes: resolvedNodes, markUserEdit } = useFormResolver(action, componentRef, nodes);
+	return /* @__PURE__ */ jsx(PrefillProvider, {
+		value: { markUserEdit },
+		children: /* @__PURE__ */ jsx(ResolvedNodesProvider, {
+			nodes: resolvedNodes,
+			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,
+						summaryLabel
+					})
+				})]
+			})
 		})
 	});
 }
@@ -54,16 +59,16 @@ var FormComponent = ({ children, node }) => {
 	const errorBag = props.errorBag;
 	const componentRef = props.ref ?? "";
 	const method = props.method ?? "post";
-	const precognitive = props.precognitive ?? false;
+	const precognitive = props.precognitive;
 	const resetOnError = props.resetOnError ?? false;
 	const resetOnSuccess = props.resetOnSuccess ?? [];
 	const state = props.state;
 	const { labels: fieldLabels, values: fieldValues } = useMemo(() => collectFields(node.schema), [node.schema]);
-	const initialValues = {
+	const initialValues = useMemo(() => ({
 		...fieldValues,
 		...state
-	};
-	const shouldRenderSubmitButton = props.submitButton ?? true;
+	}), [fieldValues, state]);
+	const shouldRenderSubmitButton = props.submitButton;
 	const submitLabel = props.submitLabel ?? "Submit";
 	const summaryLabel = props.validationSummaryLabel;
 	const validationTimeout = props.validationTimeout ?? void 0;
@@ -75,12 +80,13 @@ var FormComponent = ({ children, node }) => {
 		resetOnError,
 		resetOnSuccess,
 		validationTimeout: precognitive ? validationTimeout : void 0,
-		headers: withRefHeader(componentRef),
+		headers: withHeaders(componentRef),
 		className: "mx-auto flex w-full max-w-2xl flex-col gap-6",
 		children: ({ clearErrors, errors, processing, reset, validate }) => /* @__PURE__ */ jsxs(FormProvider, {
 			value: {
 				action,
 				clearErrors: (field) => clearErrors(field),
+				componentId: node.id,
 				componentRef,
 				errors,
 				fieldLabels,
@@ -94,7 +100,7 @@ var FormComponent = ({ children, node }) => {
 					reset
 				}),
 				props.status && /* @__PURE__ */ jsx("div", {
-					className: "text-center text-sm font-medium text-green-600 dark:text-green-400",
+					className: "text-center text-sm font-medium text-lt-success",
 					children: props.status
 				}),
 				/* @__PURE__ */ jsx(FormValuesProvider, {

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

@@ -1 +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 { LATTICE_EVENT } from \"@lattice/lattice/events/event-names\";\nimport type { Node, RendererComponent } from \"@lattice/lattice/core/types\";\nimport { useEffect, useMemo } from \"react\";\nimport { FormSubmitButton } from \"./base/submit-button\";\nimport { FormProvider } from \"./context\";\nimport { walkFields } from \"./field-props\";\nimport { ResolvedNodesProvider } from \"./resolved-nodes\";\nimport { useFormResolver } from \"./use-form-resolver\";\nimport { FormValuesProvider } from \"./values\";\n\ntype CollectedFields = {\n  labels: Record<string, string>;\n  values: Record<string, unknown>;\n};\n\nfunction collectFields(nodes: Node[] | undefined): CollectedFields {\n  const collected: CollectedFields = { labels: {}, values: {} };\n\n  walkFields(nodes, (props) => {\n    if (!props.name) {\n      return;\n    }\n    if (props.label) {\n      collected.labels[props.name] = props.label;\n    }\n    if (props.value !== undefined) {\n      collected.values[props.name] = props.value;\n    }\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 | null }>).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  summaryLabel,\n}: {\n  action: string;\n  children: React.ReactNode;\n  componentRef: string;\n  nodes: Node[] | undefined;\n  shouldRenderSubmitButton: boolean;\n  submitLabel: string;\n  summaryLabel: 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} summaryLabel={summaryLabel} />\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 = props.ref ?? \"\";\n  const method = props.method ?? \"post\";\n  const precognitive = props.precognitive ?? false;\n  const resetOnError = props.resetOnError ?? false;\n  const resetOnSuccess = props.resetOnSuccess ?? [];\n  const state = props.state;\n  const { labels: fieldLabels, values: fieldValues } = useMemo(\n    () => collectFields(node.schema),\n    [node.schema],\n  );\n  const initialValues = { ...fieldValues, ...state };\n  const shouldRenderSubmitButton = props.submitButton ?? true;\n  const submitLabel = props.submitLabel ?? \"Submit\";\n  const summaryLabel = props.validationSummaryLabel;\n  const validationTimeout = props.validationTimeout ?? undefined;\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      {({ clearErrors, errors, processing, reset, validate }) => (\n        <FormProvider\n          value={{\n            action,\n            clearErrors: (field) => clearErrors(field),\n            componentRef,\n            errors: errors as Record<string, string | undefined>,\n            fieldLabels,\n            precognitive,\n            processing,\n            validate: (field) => validate(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.schema}\n              shouldRenderSubmitButton={shouldRenderSubmitButton}\n              submitLabel={submitLabel}\n              summaryLabel={summaryLabel}\n            >\n              {children}\n            </FormBody>\n          </FormValuesProvider>\n        </FormProvider>\n      )}\n    </InertiaForm>\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAiBA,SAAS,cAAc,OAA4C;CACjE,MAAM,YAA6B;EAAE,QAAQ,CAAC;EAAG,QAAQ,CAAC;CAAE;CAE5D,WAAW,QAAQ,UAAU;EAC3B,IAAI,CAAC,MAAM,MACT;EAEF,IAAI,MAAM,OACR,UAAU,OAAO,MAAM,QAAQ,MAAM;EAEvC,IAAI,MAAM,UAAU,KAAA,GAClB,UAAU,OAAO,MAAM,QAAQ,MAAM;CAEzC,CAAC;CAED,OAAO;AACT;AAEA,SAAS,kBAAkB,EACzB,aACA,SAIC;CACD,gBAAgB;EACd,MAAM,WAAW,UAAiB;GAChC,MAAM,SAAU,MAA+C;GAE/D,IAAI,CAAC,QAAQ,QAAQ,OAAO,SAAS,aACnC,MAAM;EAEV;EAEA,OAAO,iBAAiB,cAAc,WAAW,OAAO;EAExD,aAAa,OAAO,oBAAoB,cAAc,WAAW,OAAO;CAC1E,GAAG,CAAC,aAAa,KAAK,CAAC;CAEvB,OAAO;AACT;AAEA,SAAS,SAAS,EAChB,QACA,UACA,cACA,OACA,0BACA,aACA,gBASC;CAGD,OACE,oBAAC,uBAAD;EAAuB,OAHH,gBAAgB,QAAQ,cAAc,KAG5B;YAC5B,qBAAC,OAAD;GAAK,WAAU;aAAf,CACG,UAEA,4BACC,oBAAC,OAAD;IAAK,WAAU;cACb,oBAAC,kBAAD;KAAkB,OAAO;KAA2B;IAAe,CAAA;GAChE,CAAA,CAEJ;;CACgB,CAAA;AAE3B;AAEA,IAAa,iBAA4C,EAAE,UAAU,WAAW;CAC9E,MAAM,QAAQ,KAAK;CACnB,MAAM,SAAS,MAAM,UAAU;CAC/B,MAAM,WAAW,MAAM;CACvB,MAAM,eAAe,MAAM,OAAO;CAClC,MAAM,SAAS,MAAM,UAAU;CAC/B,MAAM,eAAe,MAAM,gBAAgB;CAC3C,MAAM,eAAe,MAAM,gBAAgB;CAC3C,MAAM,iBAAiB,MAAM,kBAAkB,CAAC;CAChD,MAAM,QAAQ,MAAM;CACpB,MAAM,EAAE,QAAQ,aAAa,QAAQ,gBAAgB,cAC7C,cAAc,KAAK,MAAM,GAC/B,CAAC,KAAK,MAAM,CACd;CACA,MAAM,gBAAgB;EAAE,GAAG;EAAa,GAAG;CAAM;CACjD,MAAM,2BAA2B,MAAM,gBAAgB;CACvD,MAAM,cAAc,MAAM,eAAe;CACzC,MAAM,eAAe,MAAM;CAC3B,MAAM,oBAAoB,MAAM,qBAAqB,KAAA;CAErD,OACE,oBAAC,MAAD;EACU;EACR,0BAAwB,KAAK;EACnB;EACF;EACM;EACE;EAChB,mBAAmB,eAAe,oBAAoB,KAAA;EACtD,SAAS,cAAc,YAAY;EACnC,WAAU;aAER,EAAE,aAAa,QAAQ,YAAY,OAAO,eAC1C,qBAAC,cAAD;GACE,OAAO;IACL;IACA,cAAc,UAAU,YAAY,KAAK;IACzC;IACQ;IACR;IACA;IACA;IACA,WAAW,UAAU,SAAS,KAAK;GACrC;aAVF;IAYE,oBAAC,mBAAD;KAAmB,aAAa,KAAK;KAAW;IAAQ,CAAA;IAEvD,MAAM,UACL,oBAAC,OAAD;KAAK,WAAU;eACZ,MAAM;IACJ,CAAA;IAGP,oBAAC,oBAAD;KAAoB,SAAS;eAC3B,oBAAC,UAAD;MACU;MACM;MACd,OAAO,KAAK;MACc;MACb;MACC;MAEb;KACO,CAAA;IACQ,CAAA;GACR;;CAEL,CAAA;AAEjB"}
+{"version":3,"file":"form.js","names":[],"sources":["../../../resources/js/form/components/form.tsx"],"sourcesContent":["import { Form as InertiaForm } from \"@inertiajs/react\";\nimport { withHeaders } from \"@lattice-php/lattice/core/headers\";\nimport { LATTICE_EVENT } from \"@lattice-php/lattice/events/event-names\";\nimport type { Node, RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { useEffect, useMemo } from \"react\";\nimport { FormSubmitButton } from \"./base/submit-button\";\nimport { FormProvider } from \"./context\";\nimport { walkFields } from \"./field-props\";\nimport { PrefillProvider } from \"./prefill-context\";\nimport { ResolvedNodesProvider } from \"./resolved-nodes\";\nimport { useFormResolver } from \"./use-form-resolver\";\nimport { FormValuesProvider } from \"./values\";\n\ntype CollectedFields = {\n  labels: Record<string, string>;\n  values: Record<string, unknown>;\n};\n\nfunction collectFields(nodes: Node[] | undefined): CollectedFields {\n  const collected: CollectedFields = { labels: {}, values: {} };\n\n  walkFields(nodes, (props) => {\n    if (!props.name) {\n      return;\n    }\n    if (props.label) {\n      collected.labels[props.name] = props.label;\n    }\n    if (props.value !== undefined) {\n      collected.values[props.name] = props.value;\n    }\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 | null }>).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  summaryLabel,\n}: {\n  action: string;\n  children: React.ReactNode;\n  componentRef: string;\n  nodes: Node[] | undefined;\n  shouldRenderSubmitButton: boolean;\n  submitLabel: string;\n  summaryLabel: string;\n}) {\n  const { nodes: resolvedNodes, markUserEdit } = useFormResolver(action, componentRef, nodes);\n\n  return (\n    <PrefillProvider value={{ markUserEdit }}>\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} summaryLabel={summaryLabel} />\n            </div>\n          )}\n        </div>\n      </ResolvedNodesProvider>\n    </PrefillProvider>\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 = props.ref ?? \"\";\n  const method = props.method ?? \"post\";\n  const precognitive = props.precognitive;\n  const resetOnError = props.resetOnError ?? false;\n  const resetOnSuccess = props.resetOnSuccess ?? [];\n  const state = props.state;\n  const { labels: fieldLabels, values: fieldValues } = useMemo(\n    () => collectFields(node.schema),\n    [node.schema],\n  );\n  const initialValues = useMemo(() => ({ ...fieldValues, ...state }), [fieldValues, state]);\n  const shouldRenderSubmitButton = props.submitButton;\n  const submitLabel = props.submitLabel ?? \"Submit\";\n  const summaryLabel = props.validationSummaryLabel;\n  const validationTimeout = props.validationTimeout ?? undefined;\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={withHeaders(componentRef)}\n      className=\"mx-auto flex w-full max-w-2xl flex-col gap-6\"\n    >\n      {({ clearErrors, errors, processing, reset, validate }) => (\n        <FormProvider\n          value={{\n            action,\n            clearErrors: (field) => clearErrors(field),\n            componentId: node.id,\n            componentRef,\n            errors: errors as Record<string, string | undefined>,\n            fieldLabels,\n            precognitive,\n            processing,\n            validate: (field) => validate(field),\n          }}\n        >\n          <FormResetListener componentId={node.id} reset={reset} />\n\n          {props.status && (\n            <div className=\"text-center text-sm font-medium text-lt-success\">{props.status}</div>\n          )}\n\n          <FormValuesProvider initial={initialValues}>\n            <FormBody\n              action={action}\n              componentRef={componentRef}\n              nodes={node.schema}\n              shouldRenderSubmitButton={shouldRenderSubmitButton}\n              submitLabel={submitLabel}\n              summaryLabel={summaryLabel}\n            >\n              {children}\n            </FormBody>\n          </FormValuesProvider>\n        </FormProvider>\n      )}\n    </InertiaForm>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AAkBA,SAAS,cAAc,OAA4C;CACjE,MAAM,YAA6B;EAAE,QAAQ,CAAC;EAAG,QAAQ,CAAC;CAAE;CAE5D,WAAW,QAAQ,UAAU;EAC3B,IAAI,CAAC,MAAM,MACT;EAEF,IAAI,MAAM,OACR,UAAU,OAAO,MAAM,QAAQ,MAAM;EAEvC,IAAI,MAAM,UAAU,KAAA,GAClB,UAAU,OAAO,MAAM,QAAQ,MAAM;CAEzC,CAAC;CAED,OAAO;AACT;AAEA,SAAS,kBAAkB,EACzB,aACA,SAIC;CACD,gBAAgB;EACd,MAAM,WAAW,UAAiB;GAChC,MAAM,SAAU,MAA+C;GAE/D,IAAI,CAAC,QAAQ,QAAQ,OAAO,SAAS,aACnC,MAAM;EAEV;EAEA,OAAO,iBAAiB,cAAc,WAAW,OAAO;EAExD,aAAa,OAAO,oBAAoB,cAAc,WAAW,OAAO;CAC1E,GAAG,CAAC,aAAa,KAAK,CAAC;CAEvB,OAAO;AACT;AAEA,SAAS,SAAS,EAChB,QACA,UACA,cACA,OACA,0BACA,aACA,gBASC;CACD,MAAM,EAAE,OAAO,eAAe,iBAAiB,gBAAgB,QAAQ,cAAc,KAAK;CAE1F,OACE,oBAAC,iBAAD;EAAiB,OAAO,EAAE,aAAa;YACrC,oBAAC,uBAAD;GAAuB,OAAO;aAC5B,qBAAC,OAAD;IAAK,WAAU;cAAf,CACG,UAEA,4BACC,oBAAC,OAAD;KAAK,WAAU;eACb,oBAAC,kBAAD;MAAkB,OAAO;MAA2B;KAAe,CAAA;IAChE,CAAA,CAEJ;;EACgB,CAAA;CACR,CAAA;AAErB;AAEA,IAAa,iBAA4C,EAAE,UAAU,WAAW;CAC9E,MAAM,QAAQ,KAAK;CACnB,MAAM,SAAS,MAAM,UAAU;CAC/B,MAAM,WAAW,MAAM;CACvB,MAAM,eAAe,MAAM,OAAO;CAClC,MAAM,SAAS,MAAM,UAAU;CAC/B,MAAM,eAAe,MAAM;CAC3B,MAAM,eAAe,MAAM,gBAAgB;CAC3C,MAAM,iBAAiB,MAAM,kBAAkB,CAAC;CAChD,MAAM,QAAQ,MAAM;CACpB,MAAM,EAAE,QAAQ,aAAa,QAAQ,gBAAgB,cAC7C,cAAc,KAAK,MAAM,GAC/B,CAAC,KAAK,MAAM,CACd;CACA,MAAM,gBAAgB,eAAe;EAAE,GAAG;EAAa,GAAG;CAAM,IAAI,CAAC,aAAa,KAAK,CAAC;CACxF,MAAM,2BAA2B,MAAM;CACvC,MAAM,cAAc,MAAM,eAAe;CACzC,MAAM,eAAe,MAAM;CAC3B,MAAM,oBAAoB,MAAM,qBAAqB,KAAA;CAErD,OACE,oBAAC,MAAD;EACU;EACR,0BAAwB,KAAK;EACnB;EACF;EACM;EACE;EAChB,mBAAmB,eAAe,oBAAoB,KAAA;EACtD,SAAS,YAAY,YAAY;EACjC,WAAU;aAER,EAAE,aAAa,QAAQ,YAAY,OAAO,eAC1C,qBAAC,cAAD;GACE,OAAO;IACL;IACA,cAAc,UAAU,YAAY,KAAK;IACzC,aAAa,KAAK;IAClB;IACQ;IACR;IACA;IACA;IACA,WAAW,UAAU,SAAS,KAAK;GACrC;aAXF;IAaE,oBAAC,mBAAD;KAAmB,aAAa,KAAK;KAAW;IAAQ,CAAA;IAEvD,MAAM,UACL,oBAAC,OAAD;KAAK,WAAU;eAAmD,MAAM;IAAY,CAAA;IAGtF,oBAAC,oBAAD;KAAoB,SAAS;eAC3B,oBAAC,UAAD;MACU;MACM;MACd,OAAO,KAAK;MACc;MACb;MACC;MAEb;KACO,CAAA;IACQ,CAAA;GACR;;CAEL,CAAA;AAEjB"}

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

@@ -1,10 +1,13 @@
+export { BuilderComponent } from './fields/builder';
 export { CheckboxComponent } from './fields/checkbox';
 export { ChoiceComponent } from './fields/choice';
 export { DateInputComponent } from './fields/date-input';
+export { FileUploadComponent } from './fields/file-upload';
 export { FormComponent } from './form';
 export { HiddenInputComponent } from './fields/hidden-input';
 export { NumberInputComponent } from './fields/number-input';
 export { PasswordInputComponent } from './fields/password-input';
+export { RepeaterComponent } from './fields/repeater';
 export { SelectComponent } from './fields/select';
 export { TextareaComponent } from './fields/textarea';
 export { TextInputComponent } from './fields/text-input';

package/dist/form/components/index.js

@@ -1,11 +1,14 @@
 import { FormComponent } from "./form.js";
+import { BuilderComponent } from "./fields/builder.js";
 import { CheckboxComponent } from "./fields/checkbox.js";
 import { ChoiceComponent } from "./fields/choice.js";
 import { DateInputComponent } from "./fields/date-input.js";
+import { FileUploadComponent } from "./fields/file-upload.js";
 import { HiddenInputComponent } from "./fields/hidden-input.js";
 import { NumberInputComponent } from "./fields/number-input.js";
 import { PasswordInputComponent } from "./fields/password-input.js";
+import { RepeaterComponent } from "./fields/repeater.js";
 import { SelectComponent } from "./fields/select.js";
 import { TextareaComponent } from "./fields/textarea.js";
 import { TextInputComponent } from "./fields/text-input.js";
-export { CheckboxComponent, ChoiceComponent, DateInputComponent, FormComponent, HiddenInputComponent, NumberInputComponent, PasswordInputComponent, SelectComponent, TextInputComponent, TextareaComponent };
+export { BuilderComponent, CheckboxComponent, ChoiceComponent, DateInputComponent, FileUploadComponent, FormComponent, HiddenInputComponent, NumberInputComponent, PasswordInputComponent, RepeaterComponent, SelectComponent, TextInputComponent, TextareaComponent };

package/dist/form/components/override-keys.d.ts

@@ -0,0 +1,2 @@
+export declare function rowIdFrom(row: Record<string, unknown>): string | null;
+export declare function buildOverrideKey(base: string, rowId: string | null, index: number, name: string): string;

package/dist/form/components/override-keys.js

@@ -0,0 +1,12 @@
+import { ROW_ID_KEY } from "./fields/repeater-rows.js";
+//#region resources/js/form/components/override-keys.ts
+function rowIdFrom(row) {
+	return typeof row["__rowId"] === "string" ? row[ROW_ID_KEY] : null;
+}
+function buildOverrideKey(base, rowId, index, name) {
+	return `${base}.${rowId ?? String(index)}.${name}`;
+}
+//#endregion
+export { buildOverrideKey, rowIdFrom };
+
+//# sourceMappingURL=override-keys.js.map

package/dist/form/components/override-keys.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"override-keys.js","names":[],"sources":["../../../resources/js/form/components/override-keys.ts"],"sourcesContent":["import { ROW_ID_KEY } from \"./fields/repeater-rows\";\n\nexport function rowIdFrom(row: Record<string, unknown>): string | null {\n  return typeof row[ROW_ID_KEY] === \"string\" ? row[ROW_ID_KEY] : null;\n}\n\nexport function buildOverrideKey(\n  base: string,\n  rowId: string | null,\n  index: number,\n  name: string,\n): string {\n  return `${base}.${rowId ?? String(index)}.${name}`;\n}\n"],"mappings":";;AAEA,SAAgB,UAAU,KAA6C;CACrE,OAAO,OAAO,IAAA,eAAoB,WAAW,IAAI,cAAc;AACjE;AAEA,SAAgB,iBACd,MACA,OACA,OACA,MACQ;CACR,OAAO,GAAG,KAAK,GAAG,SAAS,OAAO,KAAK,EAAE,GAAG;AAC9C"}

package/dist/form/components/prefill-context.d.ts

@@ -0,0 +1,5 @@
+export type PrefillController = {
+    markUserEdit: (overrideKey: string) => void;
+};
+export declare const PrefillProvider: import('react').Provider<PrefillController | null>;
+export declare function usePrefillController(): PrefillController | null;

package/dist/form/components/prefill-context.js

@@ -0,0 +1,11 @@
+import { createContext, useContext } from "react";
+//#region resources/js/form/components/prefill-context.ts
+var PrefillContext = createContext(null);
+var PrefillProvider = PrefillContext.Provider;
+function usePrefillController() {
+	return useContext(PrefillContext);
+}
+//#endregion
+export { PrefillProvider, usePrefillController };
+
+//# sourceMappingURL=prefill-context.js.map

package/dist/form/components/prefill-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"prefill-context.js","names":[],"sources":["../../../resources/js/form/components/prefill-context.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\n\nexport type PrefillController = {\n  markUserEdit: (overrideKey: string) => void;\n};\n\nconst PrefillContext = createContext<PrefillController | null>(null);\n\nexport const PrefillProvider = PrefillContext.Provider;\n\nexport function usePrefillController(): PrefillController | null {\n  return useContext(PrefillContext);\n}\n"],"mappings":";;AAMA,IAAM,iBAAiB,cAAwC,IAAI;AAEnE,IAAa,kBAAkB,eAAe;AAE9C,SAAgB,uBAAiD;CAC/D,OAAO,WAAW,cAAc;AAClC"}

package/dist/form/components/prefill-targets.d.ts

@@ -0,0 +1,17 @@
+import { Node } from '../../core/types';
+export type PrefillTarget = {
+    path: string;
+    overrideKey: string;
+    resetOn: string[];
+    refreshOn: string[];
+};
+type PrefillSnapshot = {
+    targets: PrefillTarget[];
+    values: Record<string, unknown>;
+};
+export { getPath } from './form-path';
+export declare function collectPrefillTargets(nodes: Node[] | undefined, values: Record<string, unknown>): PrefillTarget[];
+export declare function applyPrefillValue(setValue: (name: string, value: unknown) => void, path: string, value: unknown): void;
+export declare function pathsToClear(previous: PrefillSnapshot, next: PrefillSnapshot): string[];
+export declare function seededOverrides(targets: PrefillTarget[], values: Record<string, unknown>): string[];
+export declare function pruneOverrides(overrides: Set<string>, targets: PrefillTarget[]): Set<string>;