@form-engine-ts/react 2.7.0 → 2.8.0

package/README.md

@@ -123,3 +123,8 @@ be created with the SSR-safe `createLocalStorageSubmissionReceiptStore`; `render
 state. Text controls forward schema `minLength`, `maxLength`, and `pattern` constraints to the DOM, and
 `renderCharacterCount` can replace the default count. Guard evaluation, confirmation, receipt persistence, and provider
 submission share an in-flight lock so rapid clicks cannot submit twice.
+
+The Builder basic-settings section edits source `title` and `description` through the same policy-aware action pipeline.
+Submission confirmation slots receive the effective message, localized schema, and visible answers. An `onSubmit` result
+may provide `submissionId` and `submittedAt`, which Renderer copies into its receipt. Receipt stores support `getBatch`,
+and `useSubmissionReceipts` loads multiple form/version receipts for list and dashboard surfaces.

package/dist/index.cjs

@@ -25,9 +25,11 @@ __export(index_exports, {
   FormRenderer: () => FormRenderer,
   createLocalStorageSubmissionReceiptStore: () => createLocalStorageSubmissionReceiptStore,
   resolveInitialFieldType: () => resolveInitialFieldType,
+  submissionReceiptQueryKey: () => submissionReceiptQueryKey,
   useField: () => useField,
   useForm: () => useForm,
-  useFormBuilder: () => useFormBuilder
+  useFormBuilder: () => useFormBuilder,
+  useSubmissionReceipts: () => useSubmissionReceipts
 });
 module.exports = __toCommonJS(index_exports);
 
@@ -972,6 +974,9 @@ var FIELD_TYPES = [
 ];
 var BUILDER_DEFAULTS = {
   "builder.formBuilder": "Form builder",
+  "builder.basicSettings": "Basic settings",
+  "builder.formTitle": "Form title",
+  "builder.formDescription": "Form description",
   "builder.moveUp": "Move {{title}} up",
   "builder.moveDown": "Move {{title}} down",
   "builder.delete": "Delete {{title}}",
@@ -1137,7 +1142,7 @@ function FormBuilder({
 }) {
   const resolvedComponents = { ...DEFAULT_COMPONENTS, ...componentOverrides };
   const components = GUARDED_COMPONENTS;
-  const { Button, Checkbox, ErrorMessage, Fieldset, IconButton, Section, Select, TextInput } = components;
+  const { Button, Checkbox, ErrorMessage, Fieldset, IconButton, Section, Select, TextArea, TextInput } = components;
   const ToolbarSlot = slots?.toolbar;
   const FieldEditorSlot = slots?.fieldEditor;
   const OptionEditorSlot = slots?.optionEditor;
@@ -1440,6 +1445,42 @@ function FormBuilder({
         }
       },
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Fieldset, { className: "form-engine-builder__controls", disabled: readOnly, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          Section,
+          {
+            className: "form-engine-builder__basic-settings",
+            headingId: "builder-basic-settings-heading",
+            title: translate("builder.basicSettings"),
+            children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "form-engine-builder__grid", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
+                translate("builder.formTitle"),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  TextInput,
+                  {
+                    name: "title",
+                    required: true,
+                    error: schema.title.trim().length === 0,
+                    helperText: schema.title.trim().length === 0 ? translate("builder.required") : "",
+                    value: schema.title,
+                    onChange: (value) => setSourceText({ kind: "form" }, "title", value)
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", { children: [
+                translate("builder.formDescription"),
+                /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                  TextArea,
+                  {
+                    name: "description",
+                    rows: 3,
+                    value: schema.description ?? "",
+                    onChange: (value) => setSourceText({ kind: "form" }, "description", value)
+                  }
+                )
+              ] })
+            ] })
+          }
+        ),
         pagesEnabled ? PagesSlot === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Section,
           {
@@ -2300,10 +2341,10 @@ function FormProvider({
           setSubmitStatus("idle");
           return { status: "cancelled" };
         }
-        await onSubmit(visibleValues);
+        const response = await onSubmit(visibleValues);
         if (resetOnSuccess) setValues({ ...initialValues });
         setSubmitStatus("success");
-        return { status: "success" };
+        return response === void 0 ? { status: "success" } : { status: "success", response };
       } catch (cause) {
         const error = cause instanceof Error ? cause : new Error(String(cause));
         setSubmitError(error);
@@ -2372,6 +2413,10 @@ function useField(fieldId) {
 }
 
 // src/receipt.ts
+var import_react4 = require("react");
+function submissionReceiptQueryKey(formId, formVersion) {
+  return `${formId}:v${formVersion}`;
+}
 function receiptKey(namespace, formId, formVersion) {
   return `${namespace}:${formId}:v${formVersion}`;
 }
@@ -2403,18 +2448,27 @@ function parseReceipt(serialized) {
 function createLocalStorageSubmissionReceiptStore(options = {}) {
   const namespace = options.namespace ?? "form_engine_receipt";
   if (namespace.trim().length === 0) throw new TypeError("Receipt namespace must not be empty.");
+  const get = async (formId, formVersion) => {
+    const storage = browserStorage();
+    if (storage === null) return null;
+    try {
+      const serialized = storage.getItem(receiptKey(namespace, formId, formVersion));
+      if (serialized === null) return null;
+      const receipt = parseReceipt(serialized);
+      return receipt?.formId === formId && receipt.formVersion === formVersion ? receipt : null;
+    } catch {
+      return null;
+    }
+  };
   return {
-    async get(formId, formVersion) {
-      const storage = browserStorage();
-      if (storage === null) return null;
-      try {
-        const serialized = storage.getItem(receiptKey(namespace, formId, formVersion));
-        if (serialized === null) return null;
-        const receipt = parseReceipt(serialized);
-        return receipt?.formId === formId && receipt.formVersion === formVersion ? receipt : null;
-      } catch {
-        return null;
-      }
+    get,
+    async getBatch(queries) {
+      const receipts = await Promise.all(queries.map((query) => get(query.formId, query.formVersion)));
+      return new Map(
+        receipts.flatMap(
+          (receipt) => receipt === null ? [] : [[submissionReceiptQueryKey(receipt.formId, receipt.formVersion), receipt]]
+        )
+      );
     },
     async save(receipt) {
       const storage = browserStorage();
@@ -2428,10 +2482,49 @@ function createLocalStorageSubmissionReceiptStore(options = {}) {
     }
   };
 }
+function useSubmissionReceipts(store, queries) {
+  const querySignature = JSON.stringify(queries.map(({ formId, formVersion }) => [formId, formVersion]));
+  const stableQueries = (0, import_react4.useMemo)(() => {
+    const parsed = JSON.parse(querySignature);
+    if (!Array.isArray(parsed)) return [];
+    return parsed.flatMap(
+      (entry) => Array.isArray(entry) && typeof entry[0] === "string" && typeof entry[1] === "number" && Number.isSafeInteger(entry[1]) ? [{ formId: entry[0], formVersion: entry[1] }] : []
+    );
+  }, [querySignature]);
+  const [state, setState] = (0, import_react4.useState)({
+    receipts: /* @__PURE__ */ new Map(),
+    isLoading: stableQueries.length > 0,
+    error: null
+  });
+  (0, import_react4.useEffect)(() => {
+    let active = true;
+    if (stableQueries.length === 0) {
+      setState({ receipts: /* @__PURE__ */ new Map(), isLoading: false, error: null });
+      return () => {
+        active = false;
+      };
+    }
+    setState((current) => ({ ...current, isLoading: true, error: null }));
+    void store.getBatch(stableQueries).then((receipts) => {
+      if (active) setState({ receipts, isLoading: false, error: null });
+    }).catch((cause) => {
+      if (!active) return;
+      setState({
+        receipts: /* @__PURE__ */ new Map(),
+        isLoading: false,
+        error: cause instanceof Error ? cause : new Error(String(cause))
+      });
+    });
+    return () => {
+      active = false;
+    };
+  }, [stableQueries, store]);
+  return state;
+}
 
 // src/renderer.tsx
 var import_core4 = require("@form-engine-ts/core");
-var import_react4 = require("react");
+var import_react5 = require("react");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function describedBy(field, error, helpId, errorId) {
   const ids = [field.description === void 0 ? void 0 : helpId, error === void 0 ? void 0 : errorId].filter(
@@ -2659,28 +2752,29 @@ function ContextFormRenderer({
   slots = {}
 }) {
   const form = useForm();
-  const prefix = (0, import_react4.useId)().replace(/:/g, "");
-  const formRef = (0, import_react4.useRef)(null);
-  const loadedDraftKey = (0, import_react4.useRef)(null);
-  const [draftRestored, setDraftRestored] = (0, import_react4.useState)(false);
-  const [currentPageIndex, setCurrentPageIndex] = (0, import_react4.useState)(0);
-  const [focusFieldId, setFocusFieldId] = (0, import_react4.useState)(null);
-  const [confirmation, setConfirmation] = (0, import_react4.useState)(null);
-  const [guardMessage, setGuardMessage] = (0, import_react4.useState)(null);
-  const [receipt, setReceipt] = (0, import_react4.useState)(null);
-  const [receiptLoaded, setReceiptLoaded] = (0, import_react4.useState)(receiptStore === void 0);
-  const rendererSubmissionInFlight = (0, import_react4.useRef)(false);
+  const prefix = (0, import_react5.useId)().replace(/:/g, "");
+  const formRef = (0, import_react5.useRef)(null);
+  const loadedDraftKey = (0, import_react5.useRef)(null);
+  const [draftRestored, setDraftRestored] = (0, import_react5.useState)(false);
+  const [currentPageIndex, setCurrentPageIndex] = (0, import_react5.useState)(0);
+  const [focusFieldId, setFocusFieldId] = (0, import_react5.useState)(null);
+  const [confirmation, setConfirmation] = (0, import_react5.useState)(null);
+  const [guardMessage, setGuardMessage] = (0, import_react5.useState)(null);
+  const [receipt, setReceipt] = (0, import_react5.useState)(null);
+  const [receiptLoaded, setReceiptLoaded] = (0, import_react5.useState)(receiptStore === void 0);
+  const rendererSubmissionInFlight = (0, import_react5.useRef)(false);
   const pages = form.schema.pages;
-  const visiblePageIndexes = (0, import_react4.useMemo)(
+  const visiblePageIndexes = (0, import_react5.useMemo)(
     () => pages === void 0 ? [] : pages.flatMap((page, index) => form.pageVisibility[page.id] === true ? [index] : []),
     [form.pageVisibility, pages]
   );
   const activePage = pages?.[currentPageIndex];
   const activeVisibleIndex = visiblePageIndexes.indexOf(currentPageIndex);
   const fieldIds = activePage === void 0 ? void 0 : new Set(activePage.questionIds);
+  const visibleValues = (0, import_react5.useMemo)(() => (0, import_core4.selectVisibleAnswers)(form.schema, form.values), [form.schema, form.values]);
   const submitState = confirmation === null ? form.submitStatus : "confirming";
   const interactionLocked = submitState === "confirming" || submitState === "submitting";
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     let active = true;
     if (receiptStore === void 0) {
       setReceipt(null);
@@ -2701,14 +2795,14 @@ function ContextFormRenderer({
       active = false;
     };
   }, [form.schema.id, form.schema.version, receiptStore]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     if (pages === void 0 || visiblePageIndexes.length === 0) {
       setCurrentPageIndex(0);
       return;
     }
     if (!visiblePageIndexes.includes(currentPageIndex)) setCurrentPageIndex(visiblePageIndexes[0] ?? 0);
   }, [currentPageIndex, pages, visiblePageIndexes]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     if (focusFieldId === null) return;
     const fieldContainer = [...formRef.current?.querySelectorAll("[data-field-id]") ?? []].find(
       (element) => element.dataset.fieldId === focusFieldId
@@ -2719,7 +2813,7 @@ function ContextFormRenderer({
       setFocusFieldId(null);
     }
   }, [focusFieldId]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     if (autoSaveKey === void 0 || typeof globalThis.localStorage === "undefined") return;
     const loadIdentity = `${autoSaveKey}:${form.schema.id}:${form.schema.version}`;
     if (loadedDraftKey.current === loadIdentity) return;
@@ -2731,7 +2825,7 @@ function ContextFormRenderer({
     form.restoreValues(draft.values);
     setDraftRestored(true);
   }, [autoSaveKey, form.restoreValues, form.schema.id, form.schema.version]);
-  (0, import_react4.useEffect)(() => {
+  (0, import_react5.useEffect)(() => {
     if (form.submitStatus === "success") return;
     const timeout = globalThis.setTimeout(() => {
       onDraftSave?.(form.values);
@@ -2764,7 +2858,7 @@ function ContextFormRenderer({
     let confirmationMessage;
     let requiresConfirmation = false;
     for (const guard of guards) {
-      const result = await guard(form.schema, (0, import_core4.selectVisibleAnswers)(form.schema, form.values));
+      const result = await guard(form.schema, visibleValues);
       if (result.status === "allow") continue;
       findings.push(...result.findings);
       if (result.status === "block") {
@@ -2794,7 +2888,7 @@ function ContextFormRenderer({
       try {
         const guardResult = await runSubmissionGuards(submissionGuards);
         if (guardResult.status === "block") {
-          setGuardMessage(guardResult.message ?? "Submission blocked because sensitive data was detected.");
+          setGuardMessage(guardResult.message ?? form.translate("form.submissionBlocked"));
           return { status: "cancelled" };
         }
         if (guardResult.status === "confirm") {
@@ -2823,10 +2917,12 @@ function ContextFormRenderer({
       }
       if (result.status !== "success") return result;
       if (receiptStore !== void 0) {
+        const response = result.response;
         const storedReceipt = {
           formId: form.schema.id,
           formVersion: form.schema.version,
-          submittedAt: (/* @__PURE__ */ new Date()).toISOString()
+          submittedAt: response?.submittedAt ?? (/* @__PURE__ */ new Date()).toISOString(),
+          ...response?.submissionId === void 0 ? {} : { submissionId: response.submissionId }
         };
         await receiptStore.save(storedReceipt);
         setReceipt(storedReceipt);
@@ -2869,8 +2965,8 @@ function ContextFormRenderer({
       receipt,
       ...receiptStore === void 0 ? {} : { onReset: () => void resetReceipt() }
     }) ?? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { role: "status", children: [
-      "Already submitted.",
-      receiptStore === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: () => void resetReceipt(), children: "Submit another response" })
+      form.translate("form.alreadySubmitted"),
+      receiptStore === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: () => void resetReceipt(), children: form.translate("form.submitAnother") })
     ] }) });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("form", { ref: formRef, className: `fe-form ${className}`.trim(), noValidate: true, onSubmit: handleSubmit, children: [
@@ -2924,7 +3020,7 @@ function ContextFormRenderer({
         ...slots.renderCharacterCount === void 0 ? {} : { renderCharacterCount: slots.renderCharacterCount }
       };
       if (slots.renderField !== void 0) {
-        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react4.Fragment, { children: slots.renderField({
+        return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react5.Fragment, { children: slots.renderField({
           question: field,
           value: form.values[field.id],
           onChange: (value) => {
@@ -2939,12 +3035,15 @@ function ContextFormRenderer({
     guardMessage === null ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { role: "alert", children: guardMessage }),
     confirmation === null ? null : slots.renderSubmissionConfirmation?.({
       findings: confirmation.findings,
+      message: confirmation.message ?? form.translate("form.confirmSensitiveData"),
+      schema: form.schema,
+      visibleValues,
       onConfirm: confirmSubmission,
       onCancel: cancelSubmission
     }) ?? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "fe-submission-confirmation", role: "dialog", "aria-modal": "true", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { children: confirmation.message ?? "Sensitive data may be included. Confirm before submitting." }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: confirmSubmission, children: "Confirm submission" }),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: cancelSubmission, children: "Cancel" })
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("p", { children: confirmation.message ?? form.translate("form.confirmSensitiveData") }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: confirmSubmission, children: form.translate("form.confirmSubmission") }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: cancelSubmission, children: form.translate("form.cancelSubmission") })
     ] }),
     validationIssues.length === 0 ? null : slots.renderValidationSummary?.({ issues: validationIssues }) ?? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "fe-validation-summary", role: "alert", children: [
       validationIssues.length,
@@ -3001,6 +3100,12 @@ var RENDERER_MESSAGES = {
   "form.next": "Next",
   "form.step": "Step {{current}} / {{total}}",
   "form.draftRestored": "Draft restored",
+  "form.submissionBlocked": "Submission blocked because sensitive data was detected.",
+  "form.confirmSensitiveData": "Sensitive data may be included. Confirm before submitting.",
+  "form.confirmSubmission": "Confirm submission",
+  "form.cancelSubmission": "Cancel",
+  "form.alreadySubmitted": "Already submitted.",
+  "form.submitAnother": "Submit another response",
   "validation.required": "This field is required."
 };
 var defaultRendererTranslator = {
@@ -3042,7 +3147,9 @@ function FormRenderer(props) {
   FormRenderer,
   createLocalStorageSubmissionReceiptStore,
   resolveInitialFieldType,
+  submissionReceiptQueryKey,
   useField,
   useForm,
-  useFormBuilder
+  useFormBuilder,
+  useSubmissionReceipts
 });

package/dist/index.d.cts

@@ -1,6 +1,6 @@
 import * as react from 'react';
 import { ReactNode, ComponentType, MouseEvent } from 'react';
-import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, FieldOption, TranslationReport, ValidationError, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, FormValues, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
+import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, FieldOption, TranslationReport, ValidationError, FormValues, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
 import { SensitiveDataFinding } from '@form-engine-ts/privacy';
 
 /** @deprecated Import FormPolicy from @form-engine-ts/core instead. */
@@ -91,14 +91,26 @@ interface SubmissionReceipt {
     readonly submissionId?: string;
     readonly submittedAt: string;
 }
+interface SubmissionReceiptQuery {
+    readonly formId: string;
+    readonly formVersion: number;
+}
 interface SubmissionReceiptStore {
     get(formId: string, formVersion: number): Promise<SubmissionReceipt | null>;
+    getBatch(queries: readonly SubmissionReceiptQuery[]): Promise<Map<string, SubmissionReceipt>>;
     save(receipt: SubmissionReceipt): Promise<void>;
     remove(formId: string, formVersion: number): Promise<void>;
 }
+interface UseSubmissionReceiptsResult {
+    readonly receipts: ReadonlyMap<string, SubmissionReceipt>;
+    readonly isLoading: boolean;
+    readonly error: Error | null;
+}
+declare function submissionReceiptQueryKey(formId: string, formVersion: number): string;
 declare function createLocalStorageSubmissionReceiptStore(options?: {
     readonly namespace?: string;
 }): SubmissionReceiptStore;
+declare function useSubmissionReceipts(store: SubmissionReceiptStore, queries: readonly SubmissionReceiptQuery[]): UseSubmissionReceiptsResult;
 
 interface ComponentBaseProps {
     readonly id?: string;
@@ -261,10 +273,16 @@ type SubmitResult = {
     readonly status: "cancelled";
 } | {
     readonly status: "success";
+    readonly response?: SubmitResponse;
 } | {
     readonly status: "error";
     readonly error: Error;
 };
+interface SubmitResponse {
+    readonly submissionId?: string;
+    readonly submittedAt?: string;
+}
+type FormSubmitHandler = (answers: FormValues) => SubmitResponse | void | Promise<SubmitResponse | undefined> | Promise<void>;
 type SubmissionGuardResult = {
     readonly status: "allow";
 } | {
@@ -278,6 +296,14 @@ type SubmissionGuardResult = {
 };
 type SubmissionGuard = (schema: FormSchema, values: Record<string, unknown>) => SubmissionGuardResult | Promise<SubmissionGuardResult>;
 type FormSubmitState = "idle" | "submitting" | "confirming" | "success" | "error";
+interface SubmissionConfirmationSlotProps {
+    readonly findings: readonly SensitiveDataFinding[];
+    readonly message?: string;
+    readonly schema: FormSchema;
+    readonly visibleValues: Record<string, unknown>;
+    readonly onConfirm: () => void;
+    readonly onCancel: () => void;
+}
 interface FormRendererSlots {
     readonly renderHeader?: (props: {
         readonly title: string;
@@ -316,11 +342,7 @@ interface FormRendererSlots {
         readonly error: Error;
         readonly onRetry?: () => void;
     }) => ReactNode;
-    readonly renderSubmissionConfirmation?: (props: {
-        readonly findings: readonly SensitiveDataFinding[];
-        readonly onConfirm: () => void;
-        readonly onCancel: () => void;
-    }) => ReactNode;
+    readonly renderSubmissionConfirmation?: (props: SubmissionConfirmationSlotProps) => ReactNode;
     readonly renderAlreadySubmitted?: (props: {
         readonly receipt: SubmissionReceipt;
         readonly onReset?: () => void;
@@ -390,7 +412,7 @@ interface FormProviderProps {
     readonly translator: TranslationAdapter;
     readonly initialValues?: FormValues;
     readonly resetOnSuccess?: boolean;
-    readonly onSubmit: (values: FormValues) => void | Promise<void>;
+    readonly onSubmit: FormSubmitHandler;
     readonly children: ReactNode;
 }
 declare function FormProvider({ schema, locale, translator, initialValues, resetOnSuccess, onSubmit, children }: FormProviderProps): react.JSX.Element;
@@ -431,9 +453,9 @@ interface StandaloneFormRendererProps extends FormRendererPresentationProps {
     readonly translator?: TranslationAdapter;
     readonly initialValues?: FormValues;
     readonly resetOnSuccess?: boolean;
-    readonly onSubmit: (answers: FormValues) => Promise<void> | void;
+    readonly onSubmit: FormSubmitHandler;
 }
 type FormRendererProps = FormRendererPresentationProps | StandaloneFormRendererProps;
 declare function FormRenderer(props: FormRendererProps): react.JSX.Element;
 
-export { type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldState, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSlots, type FormContextValue, FormProvider, type FormProviderProps, FormRenderer, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormSubmitState, type InputComponentProps, type ManualTranslationContext, type StandaloneFormRendererProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptStore, type SubmitResult, type SubmitStatus, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, useField, useForm, useFormBuilder };
+export { type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldState, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSlots, type FormContextValue, FormProvider, type FormProviderProps, FormRenderer, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormSubmitHandler, type FormSubmitState, type InputComponentProps, type ManualTranslationContext, type StandaloneFormRendererProps, type SubmissionConfirmationSlotProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptQuery, type SubmissionReceiptStore, type SubmitResponse, type SubmitResult, type SubmitStatus, type UseSubmissionReceiptsResult, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, submissionReceiptQueryKey, useField, useForm, useFormBuilder, useSubmissionReceipts };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react from 'react';
 import { ReactNode, ComponentType, MouseEvent } from 'react';
-import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, FieldOption, TranslationReport, ValidationError, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, FormValues, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
+import { QuestionType, FormField, ChoiceOption, FormPage, FormSchema, DisplayCondition, JsonValue, SchemaIssue, FormPolicy, FieldOption, TranslationReport, ValidationError, FormValues, TranslationAdapter, AsyncTranslationAdapter, PopulateTranslationOptions, FormValue, ValidationIssue, AnswerValidationResult, FieldType } from '@form-engine-ts/core';
 import { SensitiveDataFinding } from '@form-engine-ts/privacy';
 
 /** @deprecated Import FormPolicy from @form-engine-ts/core instead. */
@@ -91,14 +91,26 @@ interface SubmissionReceipt {
     readonly submissionId?: string;
     readonly submittedAt: string;
 }
+interface SubmissionReceiptQuery {
+    readonly formId: string;
+    readonly formVersion: number;
+}
 interface SubmissionReceiptStore {
     get(formId: string, formVersion: number): Promise<SubmissionReceipt | null>;
+    getBatch(queries: readonly SubmissionReceiptQuery[]): Promise<Map<string, SubmissionReceipt>>;
     save(receipt: SubmissionReceipt): Promise<void>;
     remove(formId: string, formVersion: number): Promise<void>;
 }
+interface UseSubmissionReceiptsResult {
+    readonly receipts: ReadonlyMap<string, SubmissionReceipt>;
+    readonly isLoading: boolean;
+    readonly error: Error | null;
+}
+declare function submissionReceiptQueryKey(formId: string, formVersion: number): string;
 declare function createLocalStorageSubmissionReceiptStore(options?: {
     readonly namespace?: string;
 }): SubmissionReceiptStore;
+declare function useSubmissionReceipts(store: SubmissionReceiptStore, queries: readonly SubmissionReceiptQuery[]): UseSubmissionReceiptsResult;
 
 interface ComponentBaseProps {
     readonly id?: string;
@@ -261,10 +273,16 @@ type SubmitResult = {
     readonly status: "cancelled";
 } | {
     readonly status: "success";
+    readonly response?: SubmitResponse;
 } | {
     readonly status: "error";
     readonly error: Error;
 };
+interface SubmitResponse {
+    readonly submissionId?: string;
+    readonly submittedAt?: string;
+}
+type FormSubmitHandler = (answers: FormValues) => SubmitResponse | void | Promise<SubmitResponse | undefined> | Promise<void>;
 type SubmissionGuardResult = {
     readonly status: "allow";
 } | {
@@ -278,6 +296,14 @@ type SubmissionGuardResult = {
 };
 type SubmissionGuard = (schema: FormSchema, values: Record<string, unknown>) => SubmissionGuardResult | Promise<SubmissionGuardResult>;
 type FormSubmitState = "idle" | "submitting" | "confirming" | "success" | "error";
+interface SubmissionConfirmationSlotProps {
+    readonly findings: readonly SensitiveDataFinding[];
+    readonly message?: string;
+    readonly schema: FormSchema;
+    readonly visibleValues: Record<string, unknown>;
+    readonly onConfirm: () => void;
+    readonly onCancel: () => void;
+}
 interface FormRendererSlots {
     readonly renderHeader?: (props: {
         readonly title: string;
@@ -316,11 +342,7 @@ interface FormRendererSlots {
         readonly error: Error;
         readonly onRetry?: () => void;
     }) => ReactNode;
-    readonly renderSubmissionConfirmation?: (props: {
-        readonly findings: readonly SensitiveDataFinding[];
-        readonly onConfirm: () => void;
-        readonly onCancel: () => void;
-    }) => ReactNode;
+    readonly renderSubmissionConfirmation?: (props: SubmissionConfirmationSlotProps) => ReactNode;
     readonly renderAlreadySubmitted?: (props: {
         readonly receipt: SubmissionReceipt;
         readonly onReset?: () => void;
@@ -390,7 +412,7 @@ interface FormProviderProps {
     readonly translator: TranslationAdapter;
     readonly initialValues?: FormValues;
     readonly resetOnSuccess?: boolean;
-    readonly onSubmit: (values: FormValues) => void | Promise<void>;
+    readonly onSubmit: FormSubmitHandler;
     readonly children: ReactNode;
 }
 declare function FormProvider({ schema, locale, translator, initialValues, resetOnSuccess, onSubmit, children }: FormProviderProps): react.JSX.Element;
@@ -431,9 +453,9 @@ interface StandaloneFormRendererProps extends FormRendererPresentationProps {
     readonly translator?: TranslationAdapter;
     readonly initialValues?: FormValues;
     readonly resetOnSuccess?: boolean;
-    readonly onSubmit: (answers: FormValues) => Promise<void> | void;
+    readonly onSubmit: FormSubmitHandler;
 }
 type FormRendererProps = FormRendererPresentationProps | StandaloneFormRendererProps;
 declare function FormRenderer(props: FormRendererProps): react.JSX.Element;
 
-export { type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldState, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSlots, type FormContextValue, FormProvider, type FormProviderProps, FormRenderer, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormSubmitState, type InputComponentProps, type ManualTranslationContext, type StandaloneFormRendererProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptStore, type SubmitResult, type SubmitStatus, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, useField, useForm, useFormBuilder };
+export { type BeforeSubmit, type BuilderActionContext, type BuilderActionError, type BuilderActionResult, type BuilderButtonProps, type BuilderCheckboxProps, type BuilderFactories, type BuilderFieldEditorSlotProps, type BuilderFieldsetProps, type BuilderIconButtonProps, type BuilderIdKind, type BuilderLocalizationSlotProps, type BuilderOptionEditorSlotProps, type BuilderPagesSlotProps, type BuilderPolicy, type BuilderSectionProps, type BuilderSelectOption, type BuilderSelectProps, type BuilderTextAreaProps, type BuilderTextInputProps, type BuilderTextTarget, type BuilderToolbarSlotProps, type BuilderTranslationActionsSlotProps, type ComponentBaseProps, type FieldComponentProps, type FieldComponents, type FieldState, FormBuilder, type FormBuilderActions, type FormBuilderComponents, type FormBuilderFeatures, type FormBuilderOptions, type FormBuilderProps, type FormBuilderResult, type FormBuilderSlots, type FormContextValue, FormProvider, type FormProviderProps, FormRenderer, type FormRendererPresentationProps, type FormRendererProps, type FormRendererSlots, type FormSubmitHandler, type FormSubmitState, type InputComponentProps, type ManualTranslationContext, type StandaloneFormRendererProps, type SubmissionConfirmationSlotProps, type SubmissionGuard, type SubmissionGuardResult, type SubmissionProtectionProps, type SubmissionReceipt, type SubmissionReceiptQuery, type SubmissionReceiptStore, type SubmitResponse, type SubmitResult, type SubmitStatus, type UseSubmissionReceiptsResult, createLocalStorageSubmissionReceiptStore, resolveInitialFieldType, submissionReceiptQueryKey, useField, useForm, useFormBuilder, useSubmissionReceipts };

package/dist/index.js

@@ -945,6 +945,9 @@ var FIELD_TYPES = [
 ];
 var BUILDER_DEFAULTS = {
   "builder.formBuilder": "Form builder",
+  "builder.basicSettings": "Basic settings",
+  "builder.formTitle": "Form title",
+  "builder.formDescription": "Form description",
   "builder.moveUp": "Move {{title}} up",
   "builder.moveDown": "Move {{title}} down",
   "builder.delete": "Delete {{title}}",
@@ -1110,7 +1113,7 @@ function FormBuilder({
 }) {
   const resolvedComponents = { ...DEFAULT_COMPONENTS, ...componentOverrides };
   const components = GUARDED_COMPONENTS;
-  const { Button, Checkbox, ErrorMessage, Fieldset, IconButton, Section, Select, TextInput } = components;
+  const { Button, Checkbox, ErrorMessage, Fieldset, IconButton, Section, Select, TextArea, TextInput } = components;
   const ToolbarSlot = slots?.toolbar;
   const FieldEditorSlot = slots?.fieldEditor;
   const OptionEditorSlot = slots?.optionEditor;
@@ -1413,6 +1416,42 @@ function FormBuilder({
         }
       },
       children: /* @__PURE__ */ jsxs(Fieldset, { className: "form-engine-builder__controls", disabled: readOnly, children: [
+        /* @__PURE__ */ jsx(
+          Section,
+          {
+            className: "form-engine-builder__basic-settings",
+            headingId: "builder-basic-settings-heading",
+            title: translate("builder.basicSettings"),
+            children: /* @__PURE__ */ jsxs("div", { className: "form-engine-builder__grid", children: [
+              /* @__PURE__ */ jsxs("label", { children: [
+                translate("builder.formTitle"),
+                /* @__PURE__ */ jsx(
+                  TextInput,
+                  {
+                    name: "title",
+                    required: true,
+                    error: schema.title.trim().length === 0,
+                    helperText: schema.title.trim().length === 0 ? translate("builder.required") : "",
+                    value: schema.title,
+                    onChange: (value) => setSourceText({ kind: "form" }, "title", value)
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsxs("label", { children: [
+                translate("builder.formDescription"),
+                /* @__PURE__ */ jsx(
+                  TextArea,
+                  {
+                    name: "description",
+                    rows: 3,
+                    value: schema.description ?? "",
+                    onChange: (value) => setSourceText({ kind: "form" }, "description", value)
+                  }
+                )
+              ] })
+            ] })
+          }
+        ),
         pagesEnabled ? PagesSlot === void 0 ? /* @__PURE__ */ jsx(
           Section,
           {
@@ -2281,10 +2320,10 @@ function FormProvider({
           setSubmitStatus("idle");
           return { status: "cancelled" };
         }
-        await onSubmit(visibleValues);
+        const response = await onSubmit(visibleValues);
         if (resetOnSuccess) setValues({ ...initialValues });
         setSubmitStatus("success");
-        return { status: "success" };
+        return response === void 0 ? { status: "success" } : { status: "success", response };
       } catch (cause) {
         const error = cause instanceof Error ? cause : new Error(String(cause));
         setSubmitError(error);
@@ -2353,6 +2392,10 @@ function useField(fieldId) {
 }
 
 // src/receipt.ts
+import { useEffect as useEffect2, useMemo as useMemo3, useState as useState3 } from "react";
+function submissionReceiptQueryKey(formId, formVersion) {
+  return `${formId}:v${formVersion}`;
+}
 function receiptKey(namespace, formId, formVersion) {
   return `${namespace}:${formId}:v${formVersion}`;
 }
@@ -2384,18 +2427,27 @@ function parseReceipt(serialized) {
 function createLocalStorageSubmissionReceiptStore(options = {}) {
   const namespace = options.namespace ?? "form_engine_receipt";
   if (namespace.trim().length === 0) throw new TypeError("Receipt namespace must not be empty.");
+  const get = async (formId, formVersion) => {
+    const storage = browserStorage();
+    if (storage === null) return null;
+    try {
+      const serialized = storage.getItem(receiptKey(namespace, formId, formVersion));
+      if (serialized === null) return null;
+      const receipt = parseReceipt(serialized);
+      return receipt?.formId === formId && receipt.formVersion === formVersion ? receipt : null;
+    } catch {
+      return null;
+    }
+  };
   return {
-    async get(formId, formVersion) {
-      const storage = browserStorage();
-      if (storage === null) return null;
-      try {
-        const serialized = storage.getItem(receiptKey(namespace, formId, formVersion));
-        if (serialized === null) return null;
-        const receipt = parseReceipt(serialized);
-        return receipt?.formId === formId && receipt.formVersion === formVersion ? receipt : null;
-      } catch {
-        return null;
-      }
+    get,
+    async getBatch(queries) {
+      const receipts = await Promise.all(queries.map((query) => get(query.formId, query.formVersion)));
+      return new Map(
+        receipts.flatMap(
+          (receipt) => receipt === null ? [] : [[submissionReceiptQueryKey(receipt.formId, receipt.formVersion), receipt]]
+        )
+      );
     },
     async save(receipt) {
       const storage = browserStorage();
@@ -2409,6 +2461,45 @@ function createLocalStorageSubmissionReceiptStore(options = {}) {
     }
   };
 }
+function useSubmissionReceipts(store, queries) {
+  const querySignature = JSON.stringify(queries.map(({ formId, formVersion }) => [formId, formVersion]));
+  const stableQueries = useMemo3(() => {
+    const parsed = JSON.parse(querySignature);
+    if (!Array.isArray(parsed)) return [];
+    return parsed.flatMap(
+      (entry) => Array.isArray(entry) && typeof entry[0] === "string" && typeof entry[1] === "number" && Number.isSafeInteger(entry[1]) ? [{ formId: entry[0], formVersion: entry[1] }] : []
+    );
+  }, [querySignature]);
+  const [state, setState] = useState3({
+    receipts: /* @__PURE__ */ new Map(),
+    isLoading: stableQueries.length > 0,
+    error: null
+  });
+  useEffect2(() => {
+    let active = true;
+    if (stableQueries.length === 0) {
+      setState({ receipts: /* @__PURE__ */ new Map(), isLoading: false, error: null });
+      return () => {
+        active = false;
+      };
+    }
+    setState((current) => ({ ...current, isLoading: true, error: null }));
+    void store.getBatch(stableQueries).then((receipts) => {
+      if (active) setState({ receipts, isLoading: false, error: null });
+    }).catch((cause) => {
+      if (!active) return;
+      setState({
+        receipts: /* @__PURE__ */ new Map(),
+        isLoading: false,
+        error: cause instanceof Error ? cause : new Error(String(cause))
+      });
+    });
+    return () => {
+      active = false;
+    };
+  }, [stableQueries, store]);
+  return state;
+}
 
 // src/renderer.tsx
 import {
@@ -2417,11 +2508,11 @@ import {
 } from "@form-engine-ts/core";
 import {
   Fragment as Fragment2,
-  useEffect as useEffect2,
+  useEffect as useEffect3,
   useId,
-  useMemo as useMemo3,
+  useMemo as useMemo4,
   useRef as useRef2,
-  useState as useState3
+  useState as useState4
 } from "react";
 import { Fragment as Fragment3, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 function describedBy(field, error, helpId, errorId) {
@@ -2653,25 +2744,26 @@ function ContextFormRenderer({
   const prefix = useId().replace(/:/g, "");
   const formRef = useRef2(null);
   const loadedDraftKey = useRef2(null);
-  const [draftRestored, setDraftRestored] = useState3(false);
-  const [currentPageIndex, setCurrentPageIndex] = useState3(0);
-  const [focusFieldId, setFocusFieldId] = useState3(null);
-  const [confirmation, setConfirmation] = useState3(null);
-  const [guardMessage, setGuardMessage] = useState3(null);
-  const [receipt, setReceipt] = useState3(null);
-  const [receiptLoaded, setReceiptLoaded] = useState3(receiptStore === void 0);
+  const [draftRestored, setDraftRestored] = useState4(false);
+  const [currentPageIndex, setCurrentPageIndex] = useState4(0);
+  const [focusFieldId, setFocusFieldId] = useState4(null);
+  const [confirmation, setConfirmation] = useState4(null);
+  const [guardMessage, setGuardMessage] = useState4(null);
+  const [receipt, setReceipt] = useState4(null);
+  const [receiptLoaded, setReceiptLoaded] = useState4(receiptStore === void 0);
   const rendererSubmissionInFlight = useRef2(false);
   const pages = form.schema.pages;
-  const visiblePageIndexes = useMemo3(
+  const visiblePageIndexes = useMemo4(
     () => pages === void 0 ? [] : pages.flatMap((page, index) => form.pageVisibility[page.id] === true ? [index] : []),
     [form.pageVisibility, pages]
   );
   const activePage = pages?.[currentPageIndex];
   const activeVisibleIndex = visiblePageIndexes.indexOf(currentPageIndex);
   const fieldIds = activePage === void 0 ? void 0 : new Set(activePage.questionIds);
+  const visibleValues = useMemo4(() => selectVisibleAnswers2(form.schema, form.values), [form.schema, form.values]);
   const submitState = confirmation === null ? form.submitStatus : "confirming";
   const interactionLocked = submitState === "confirming" || submitState === "submitting";
-  useEffect2(() => {
+  useEffect3(() => {
     let active = true;
     if (receiptStore === void 0) {
       setReceipt(null);
@@ -2692,14 +2784,14 @@ function ContextFormRenderer({
       active = false;
     };
   }, [form.schema.id, form.schema.version, receiptStore]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (pages === void 0 || visiblePageIndexes.length === 0) {
       setCurrentPageIndex(0);
       return;
     }
     if (!visiblePageIndexes.includes(currentPageIndex)) setCurrentPageIndex(visiblePageIndexes[0] ?? 0);
   }, [currentPageIndex, pages, visiblePageIndexes]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (focusFieldId === null) return;
     const fieldContainer = [...formRef.current?.querySelectorAll("[data-field-id]") ?? []].find(
       (element) => element.dataset.fieldId === focusFieldId
@@ -2710,7 +2802,7 @@ function ContextFormRenderer({
       setFocusFieldId(null);
     }
   }, [focusFieldId]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (autoSaveKey === void 0 || typeof globalThis.localStorage === "undefined") return;
     const loadIdentity = `${autoSaveKey}:${form.schema.id}:${form.schema.version}`;
     if (loadedDraftKey.current === loadIdentity) return;
@@ -2722,7 +2814,7 @@ function ContextFormRenderer({
     form.restoreValues(draft.values);
     setDraftRestored(true);
   }, [autoSaveKey, form.restoreValues, form.schema.id, form.schema.version]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (form.submitStatus === "success") return;
     const timeout = globalThis.setTimeout(() => {
       onDraftSave?.(form.values);
@@ -2755,7 +2847,7 @@ function ContextFormRenderer({
     let confirmationMessage;
     let requiresConfirmation = false;
     for (const guard of guards) {
-      const result = await guard(form.schema, selectVisibleAnswers2(form.schema, form.values));
+      const result = await guard(form.schema, visibleValues);
       if (result.status === "allow") continue;
       findings.push(...result.findings);
       if (result.status === "block") {
@@ -2785,7 +2877,7 @@ function ContextFormRenderer({
       try {
         const guardResult = await runSubmissionGuards(submissionGuards);
         if (guardResult.status === "block") {
-          setGuardMessage(guardResult.message ?? "Submission blocked because sensitive data was detected.");
+          setGuardMessage(guardResult.message ?? form.translate("form.submissionBlocked"));
           return { status: "cancelled" };
         }
         if (guardResult.status === "confirm") {
@@ -2814,10 +2906,12 @@ function ContextFormRenderer({
       }
       if (result.status !== "success") return result;
       if (receiptStore !== void 0) {
+        const response = result.response;
         const storedReceipt = {
           formId: form.schema.id,
           formVersion: form.schema.version,
-          submittedAt: (/* @__PURE__ */ new Date()).toISOString()
+          submittedAt: response?.submittedAt ?? (/* @__PURE__ */ new Date()).toISOString(),
+          ...response?.submissionId === void 0 ? {} : { submissionId: response.submissionId }
         };
         await receiptStore.save(storedReceipt);
         setReceipt(storedReceipt);
@@ -2860,8 +2954,8 @@ function ContextFormRenderer({
       receipt,
       ...receiptStore === void 0 ? {} : { onReset: () => void resetReceipt() }
     }) ?? /* @__PURE__ */ jsxs2("div", { role: "status", children: [
-      "Already submitted.",
-      receiptStore === void 0 ? null : /* @__PURE__ */ jsx3("button", { type: "button", onClick: () => void resetReceipt(), children: "Submit another response" })
+      form.translate("form.alreadySubmitted"),
+      receiptStore === void 0 ? null : /* @__PURE__ */ jsx3("button", { type: "button", onClick: () => void resetReceipt(), children: form.translate("form.submitAnother") })
     ] }) });
   }
   return /* @__PURE__ */ jsxs2("form", { ref: formRef, className: `fe-form ${className}`.trim(), noValidate: true, onSubmit: handleSubmit, children: [
@@ -2930,12 +3024,15 @@ function ContextFormRenderer({
     guardMessage === null ? null : /* @__PURE__ */ jsx3("div", { role: "alert", children: guardMessage }),
     confirmation === null ? null : slots.renderSubmissionConfirmation?.({
       findings: confirmation.findings,
+      message: confirmation.message ?? form.translate("form.confirmSensitiveData"),
+      schema: form.schema,
+      visibleValues,
       onConfirm: confirmSubmission,
       onCancel: cancelSubmission
     }) ?? /* @__PURE__ */ jsxs2("div", { className: "fe-submission-confirmation", role: "dialog", "aria-modal": "true", children: [
-      /* @__PURE__ */ jsx3("p", { children: confirmation.message ?? "Sensitive data may be included. Confirm before submitting." }),
-      /* @__PURE__ */ jsx3("button", { type: "button", onClick: confirmSubmission, children: "Confirm submission" }),
-      /* @__PURE__ */ jsx3("button", { type: "button", onClick: cancelSubmission, children: "Cancel" })
+      /* @__PURE__ */ jsx3("p", { children: confirmation.message ?? form.translate("form.confirmSensitiveData") }),
+      /* @__PURE__ */ jsx3("button", { type: "button", onClick: confirmSubmission, children: form.translate("form.confirmSubmission") }),
+      /* @__PURE__ */ jsx3("button", { type: "button", onClick: cancelSubmission, children: form.translate("form.cancelSubmission") })
     ] }),
     validationIssues.length === 0 ? null : slots.renderValidationSummary?.({ issues: validationIssues }) ?? /* @__PURE__ */ jsxs2("div", { className: "fe-validation-summary", role: "alert", children: [
       validationIssues.length,
@@ -2992,6 +3089,12 @@ var RENDERER_MESSAGES = {
   "form.next": "Next",
   "form.step": "Step {{current}} / {{total}}",
   "form.draftRestored": "Draft restored",
+  "form.submissionBlocked": "Submission blocked because sensitive data was detected.",
+  "form.confirmSensitiveData": "Sensitive data may be included. Confirm before submitting.",
+  "form.confirmSubmission": "Confirm submission",
+  "form.cancelSubmission": "Cancel",
+  "form.alreadySubmitted": "Already submitted.",
+  "form.submitAnother": "Submit another response",
   "validation.required": "This field is required."
 };
 var defaultRendererTranslator = {
@@ -3032,7 +3135,9 @@ export {
   FormRenderer,
   createLocalStorageSubmissionReceiptStore,
   resolveInitialFieldType,
+  submissionReceiptQueryKey,
   useField,
   useForm,
-  useFormBuilder
+  useFormBuilder,
+  useSubmissionReceipts
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@form-engine-ts/react",
-  "version": "2.7.0",
+  "version": "2.8.0",
   "publishConfig": {
     "access": "public"
   },
@@ -42,8 +42,8 @@
     "typescript"
   ],
   "dependencies": {
-    "@form-engine-ts/core": "2.7.0",
-    "@form-engine-ts/privacy": "2.7.0"
+    "@form-engine-ts/core": "2.8.0",
+    "@form-engine-ts/privacy": "2.8.0"
   },
   "peerDependencies": {
     "react": ">=18.2 <20",