@mohasinac/appkit 4.13.1 → 4.14.0

package/dist/ui/forms/FormShell.js

@@ -33,12 +33,17 @@ export function applyZodIssues(issues, setFieldError) {
     }
 }
 /**
- * `useFormShellState(schema?)` — caller-owned form state with optional Zod
- * validation. When a schema is supplied, `validate(values)` runs it and pipes
- * issues into the FormShellContext error map. `audit-form-schema` requires
- * every callsite to pass a schema.
+ * `useFormShellState(schema?, nav?)` — caller-owned form state with optional
+ * Zod validation. When a schema is supplied, `validate(values)` runs it and
+ * pipes issues into the FormShellContext error map. `audit-form-schema`
+ * requires every callsite to pass a schema.
+ *
+ * Pass `nav` when the form is split into sections (see `useSectionFormNav`)
+ * so `<FormErrorSummary>` can name the owning section and jump to it. Omit it
+ * for single-segment forms; the summary renders a flat list, which is right
+ * for them.
  */
-export function useFormShellState(schema) {
+export function useFormShellState(schema, nav) {
     const [errors, setErrors] = useState({});
     const setFieldError = useCallback((name, error) => {
         setErrors((prev) => {
@@ -64,25 +69,31 @@ export function useFormShellState(schema) {
         applyZodIssues(parsed.error.issues, setFieldError);
         return null;
     }, [schema, setFieldError]);
+    const navSections = nav?.sections;
+    const navGoTo = nav?.onGoToSection;
+    const navFieldMap = nav?.fieldToSectionIndex;
     const shellCtx = useMemo(() => ({
         errors,
         touched: Object.fromEntries(Object.keys(errors).map((k) => [k, true])),
         setFieldError,
         setFieldTouched: () => { },
         clearFieldError: (name) => setFieldError(name, null),
-        steps: [],
+        // Real sections when the caller supplied nav — this is what makes
+        // <FormErrorSummary>'s jump link resolve a label instead of `undefined`.
+        steps: navSections ?? [],
         currentStep: 0,
-        goToStep: () => { },
+        goToStep: navGoTo ?? (() => { }),
         nextStep: () => { },
         prevStep: () => { },
         isPublishReady: Object.keys(errors).length === 0,
         isDirty: false,
         isSubmitting: false,
         stepErrorCounts: [],
-    }), [errors, setFieldError]);
+        fieldToStepIndex: navFieldMap,
+    }), [errors, setFieldError, navSections, navGoTo, navFieldMap]);
     return { shellCtx, setFieldError, clearErrors, hasErrors: Object.keys(errors).length > 0, validate };
 }
-export function FormShellProvider({ children, onSaveDraft, isDirty = false, autoSaveDelayMs = 2000, values = {}, schema, fieldToStepIndex, onGoToStep, }) {
+export function FormShellProvider({ children, onSaveDraft, isDirty = false, autoSaveDelayMs = 2000, values = {}, schema, fieldToStepIndex, onGoToStep, sections, }) {
     const [errors, setErrors] = useState({});
     const [touched, setTouched] = useState({});
     const autoSaveTimer = useRef(null);
@@ -148,7 +159,7 @@ export function FormShellProvider({ children, onSaveDraft, isDirty = false, auto
         setFieldError,
         setFieldTouched,
         clearFieldError,
-        steps: [],
+        steps: sections ?? [],
         currentStep: 0,
         goToStep: onGoToStep ?? (() => { }),
         nextStep: () => { },
@@ -158,6 +169,6 @@ export function FormShellProvider({ children, onSaveDraft, isDirty = false, auto
         isSubmitting: false,
         stepErrorCounts: [],
         fieldToStepIndex,
-    }), [errors, touched, setFieldError, setFieldTouched, clearFieldError, isDirty, onGoToStep, fieldToStepIndex]);
+    }), [errors, touched, setFieldError, setFieldTouched, clearFieldError, isDirty, onGoToStep, fieldToStepIndex, sections]);
     return _jsx(FormShellContext.Provider, { value: ctx, children: children });
 }

package/dist/ui/forms/index.d.ts

@@ -1,4 +1,4 @@
-export type { FormShellProviderProps, FormShellStep, FormShellContextValue, UseFormShellStateResult, } from "./FormShell";
+export type { FormShellProviderProps, FormShellStep, FormShellNav, FormShellContextValue, UseFormShellStateResult, } from "./FormShell";
 export { FormShellProvider, FormShellContext, useFormShell, useFormShellState, applyZodIssues } from "./FormShell";
 export type { FieldInputProps } from "./FieldInput";
 export { FieldInput } from "./FieldInput";

package/dist/ui/index.d.ts

@@ -1,6 +1,6 @@
 import "./components/index.style.css";
 import "./forms/FormShell.style.css";
-export type { FormShellStep, FormShellContextValue, } from "./forms";
+export type { FormShellStep, FormShellNav, FormShellContextValue, } from "./forms";
 export { FormShellProvider, useFormShell } from "./forms";
 export type { FieldInputProps } from "./forms";
 export { FieldInput } from "./forms";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mohasinac/appkit",
-  "version": "4.13.1",
+  "version": "4.14.0",
   "license": "MIT",
   "publishConfig": {
     "access": "public"