@mohasinac/appkit 4.21.0 → 4.22.0

package/dist/ui/forms/FormShell.js

@@ -45,6 +45,9 @@ export function applyZodIssues(issues, setFieldError) {
  */
 export function useFormShellState(schema, nav) {
     const [errors, setErrors] = useState({});
+    const [submitAttemptCount, setSubmitAttemptCount] = useState(0);
+    const markSubmitAttempted = useCallback(() => setSubmitAttemptCount((n) => n + 1), []);
+    const submitAttempted = submitAttemptCount > 0;
     const setFieldError = useCallback((name, error) => {
         setErrors((prev) => {
             if (!error) {
@@ -59,6 +62,19 @@ export function useFormShellState(schema, nav) {
     }, []);
     const clearErrors = useCallback(() => setErrors({}), []);
     const validate = useCallback((values) => {
+        /*
+         * 🛑 validate() does NOT mark the submit attempt, and must not.
+         *
+         * ELEVEN views call `validate(draft)` from a MOUNT EFFECT to keep the
+         * summary and the submit-button state live as the user types — which
+         * is the behaviour worth having. Marking here would fire on first
+         * paint in exactly those views and defeat the gate entirely.
+         *
+         * The attempt is marked where an attempt actually happens: <Form>'s
+         * native submit handler, <SectionForm>'s submit button, and
+         * QuickFormDrawer's. A caller whose submit is an onClick on a
+         * type="button" calls markSubmitAttempted() itself.
+         */
         if (!schema)
             return values;
         const parsed = schema.safeParse(values);
@@ -90,12 +106,28 @@ export function useFormShellState(schema, nav) {
         isSubmitting: false,
         stepErrorCounts: [],
         fieldToStepIndex: navFieldMap,
-    }), [errors, setFieldError, navSections, navGoTo, navFieldMap]);
-    return { shellCtx, setFieldError, clearErrors, hasErrors: Object.keys(errors).length > 0, validate };
+        submitAttempted,
+        submitAttemptCount,
+        markSubmitAttempted,
+    }), [errors, setFieldError, navSections, navGoTo, navFieldMap, submitAttempted, submitAttemptCount, markSubmitAttempted]);
+    return {
+        shellCtx,
+        setFieldError,
+        clearErrors,
+        hasErrors: Object.keys(errors).length > 0,
+        validate,
+        submitAttempted,
+        submitAttemptCount,
+        markSubmitAttempted,
+    };
 }
-export function FormShellProvider({ children, onSaveDraft, isDirty = false, autoSaveDelayMs = 2000, values = {}, schema, fieldToStepIndex, onGoToStep, sections, }) {
+export function FormShellProvider({ children, onSaveDraft, isDirty = false, autoSaveDelayMs = 2000, values = {}, schema, fieldToStepIndex, onGoToStep, sections, submitAttempted: submitAttemptedProp = false, }) {
     const [errors, setErrors] = useState({});
     const [touched, setTouched] = useState({});
+    const [ownAttemptCount, setOwnAttemptCount] = useState(0);
+    const markSubmitAttempted = useCallback(() => setOwnAttemptCount((n) => n + 1), []);
+    const submitAttemptCount = ownAttemptCount + (submitAttemptedProp ? 1 : 0);
+    const submitAttempted = submitAttemptCount > 0;
     const autoSaveTimer = useRef(null);
     const valuesRef = useRef(values);
     valuesRef.current = values;
@@ -169,6 +201,9 @@ export function FormShellProvider({ children, onSaveDraft, isDirty = false, auto
         isSubmitting: false,
         stepErrorCounts: [],
         fieldToStepIndex,
-    }), [errors, touched, setFieldError, setFieldTouched, clearFieldError, isDirty, onGoToStep, fieldToStepIndex, sections]);
+        submitAttempted,
+        submitAttemptCount,
+        markSubmitAttempted,
+    }), [errors, touched, setFieldError, setFieldTouched, clearFieldError, isDirty, onGoToStep, fieldToStepIndex, sections, submitAttempted, submitAttemptCount, markSubmitAttempted]);
     return _jsx(FormShellContext.Provider, { value: ctx, children: children });
 }

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

@@ -12,3 +12,5 @@ export type { ColorPickerFieldProps } from "./ColorPickerField";
 export { ColorPickerField } from "./ColorPickerField";
 export type { FormErrorSummaryProps } from "./FormErrorSummary";
 export { FormErrorSummary } from "./FormErrorSummary";
+export type { FormErrorListProps } from "./FormErrorList";
+export { FormErrorList } from "./FormErrorList";

package/dist/ui/forms/index.js

@@ -5,3 +5,4 @@ export { FieldCheckbox } from "./FieldCheckbox";
 export { FieldTextarea } from "./FieldTextarea";
 export { ColorPickerField } from "./ColorPickerField";
 export { FormErrorSummary } from "./FormErrorSummary";
+export { FormErrorList } from "./FormErrorList";

package/package.json

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