@fuentis/phoenix-ui 0.0.9-alpha.526 → 0.0.9-alpha.528

package/fesm2022/fuentis-phoenix-ui.mjs

@@ -3783,33 +3783,45 @@ function getFieldType(control) {
     }
 }
 
+/**
+ * MetaFormService is a small UI-state bus used by MetaForm/GroupsForm components.
+ *
+ * - formReadOnlyState: global read-only mode (Edit toggles it).
+ * - formBuildCompleted: emits TRUE when MetaForm finished rebuilding controls & validators.
+ *
+ * Angular dev-mode NOTE:
+ * Emitting "build completed = true" synchronously during the same change detection cycle
+ * can cause NG0100 ExpressionChangedAfterItHasBeenCheckedError.
+ * Therefore we emit TRUE in a macrotask (setTimeout 0).
+ */
 class MetaFormService {
     router = inject(Router);
     formEvent = new Subject();
     formReadOnlySubject = new BehaviorSubject(false);
     formTabContent = new BehaviorSubject('FORM');
     formDirtyStatus = new BehaviorSubject(false);
+    /**
+     * Build completion flag:
+     * - false = rebuilding (controls/validators may change)
+     * - true  = stable and ready
+     */
     formBuildCompletedSubject = new BehaviorSubject(false);
+    /** Prevent stale timers from flipping the flag after a new rebuild already started. */
+    buildDoneTimer = null;
+    // Public streams
     currentFormState = this.formEvent.asObservable();
     formReadOnlyState = this.formReadOnlySubject.asObservable();
     currentFormTabContent = this.formTabContent.asObservable();
     currentFormDirtyStatus = this.formDirtyStatus.asObservable();
-    /**
-     * Notify when form is completed
-     * @description Notifies you about when form bild is completed in meta-form component class. Usefull when you need to attach some listeners on form controls or any other action related to form when all controls are avaiable
-     * @returns {boolean}
-     */
     formBuildCompleted = this.formBuildCompletedSubject.asObservable();
-    constructor() { }
     setFormEvent(event) {
         this.formEvent.next(event);
     }
     setFormReadOnlyState(state) {
         this.formReadOnlySubject.next(state);
+        // Optional query param sync (disabled by default):
         // this.router.navigate([], {
-        //   queryParams: {
-        //     edit: state ? null : !state,
-        //   },
+        //   queryParams: { edit: state ? null : !state },
         //   queryParamsHandling: 'merge',
         // });
     }
@@ -3820,25 +3832,46 @@ class MetaFormService {
         this.formDirtyStatus.next(status);
     }
     /**
-     * Sets the form build completion status to indicate when the form is created.
-     *
-     * @param {boolean} isCompleted - A boolean value to indicate whether the form build is completed.
-     *                               Set to `true` when the form is fully created.
-     *
-     * @description This method is used to notify when the form is created and ready for use.
+     * Call at the BEGINNING of each rebuild.
+     * Safe to emit synchronously.
+     */
+    startFormBuild() {
+        if (this.buildDoneTimer != null) {
+            clearTimeout(this.buildDoneTimer);
+            this.buildDoneTimer = null;
+        }
+        this.formBuildCompletedSubject.next(false);
+    }
+    /**
+     * Call at the END of each rebuild.
+     * Emit in a macrotask to avoid NG0100.
+     */
+    finishFormBuild() {
+        if (this.buildDoneTimer != null) {
+            clearTimeout(this.buildDoneTimer);
+            this.buildDoneTimer = null;
+        }
+        this.buildDoneTimer = setTimeout(() => {
+            this.formBuildCompletedSubject.next(true);
+            this.buildDoneTimer = null;
+        }, 0);
+    }
+    /**
+     * Backward compatibility for old callers.
      */
     setFormBuildCompletition(isCompleted) {
-        this.formBuildCompletedSubject.next(isCompleted);
+        if (!isCompleted)
+            this.startFormBuild();
+        else
+            this.finishFormBuild();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFormService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFormService, providedIn: 'root' });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: MetaFormService, decorators: [{
             type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: () => [] });
+            args: [{ providedIn: 'root' }]
+        }] });
 
 class MetaFormAbstract {
     fb;
@@ -3848,8 +3881,10 @@ class MetaFormAbstract {
     metaFormValues;
     metaFormControls;
     /**
-     * Hook for wiring dependent fields (category -> color, entity -> assignees etc).
-     * This hook is re-bound safely when meta changes, without duplicating subscriptions.
+     * Hook for wiring dependent fields (category -> color, entity -> assignees etc.).
+     * Rebound safely when metadata changes, without duplicating subscriptions.
+     *
+     * Optionally return a cleanup function.
      */
     setupDependencies;
     loading = false;
@@ -3860,26 +3895,9 @@ class MetaFormAbstract {
     onFormSubmit = new EventEmitter();
     onFormCancel = new EventEmitter();
     formActive$;
-    /**
-     * IMPORTANT:
-     * Do not subscribe in the constructor, because @Input() metaForm arrives later.
-     * We wire subscriptions in ngOnChanges when the real FormGroup instance is available.
-     */
     formSub;
-    /**
-     * Dependency setup may create subscriptions. We allow cleanup by supporting
-     * optional cleanup functions returned by setupDependencies().
-     */
     dependencyCleanup = [];
-    /**
-     * Metadata signature used to detect when controls changed.
-     * If the signature changes, dependencies are cleaned up and re-bound.
-     */
     lastMetaSignature = '';
-    /**
-     * Subscriptions used to remove server-side validation errors when the user edits the field.
-     * This prevents "sticky" errors blocking save after the value is corrected.
-     */
     clearServerErrorSubs = new Map();
     constructor(fb, metaService, translateService) {
         this.fb = fb;
@@ -3888,29 +3906,22 @@ class MetaFormAbstract {
         this.formActive$ = this.metaService.formReadOnlyState;
     }
     ngOnChanges(changes) {
-        /**
-         * Re-wire form subscription whenever the input form instance changes.
-         * This is critical because the component does NOT own the FormGroup;
-         * it is provided by the parent.
-         */
         if (changes['metaForm']) {
             this.rewireFormSubscription();
         }
-        /**
-         * If metadata, initial values, or disabled flag changes, rebuild/sync the form.
-         * Safe to call multiple times.
-         */
         if (changes['metaFormControls'] ||
             changes['metaFormValues'] ||
-            changes['disableForm']) {
-            if (!this.metaForm)
-                return;
+            changes['disableForm'] ||
+            changes['setupDependencies']) {
+            if (!this.metaForm) {
+                throw new Error('[MetaFormAbstract] metaForm input is required. Parent must pass [metaForm].');
+            }
             this.syncForm();
         }
     }
     /**
      * Backwards compatible API:
-     * Older code may call createForm(controls). Keep it working.
+     * Older code may call createForm(controls).
      */
     createForm(controls) {
         if (controls)
@@ -3921,60 +3932,48 @@ class MetaFormAbstract {
         this.syncForm();
     }
     /**
-     * Main sync:
-     * - ensures controls exist
-     * - applies validators
-     * - patches values (without emitting)
-     * - applies disabled state
-     * - binds dependencies (safe rebind)
-     * - recomputes validity
+     * Rebuild flow (stable + fast):
+     * 1) startFormBuild()  (sync)
+     * 2) ensure controls & validators (no emits)
+     * 3) patch values (emitEvent:false)
+     * 4) enable/disable (emitEvent:false)
+     * 5) bind dependencies (safe rebind)
+     * 6) updateValueAndValidity (emitEvent:false)
+     * 7) finishFormBuild() (macrotask -> avoids NG0100)
      */
     syncForm() {
         const flatControls = this.flattenControls(this.metaFormControls);
         const values = this.metaFormValues ?? null;
-        // 1) Ensure form controls exist + validators are applied
+        this.metaService.startFormBuild();
         this.ensureControls(flatControls);
-        // 2) Patch initial values WITHOUT firing valueChanges
         if (values) {
             this.metaForm.patchValue(values, { emitEvent: false });
         }
-        // 3) Enable/disable entire form if requested
         if (this.disableForm)
             this.metaForm.disable({ emitEvent: false });
         else
             this.metaForm.enable({ emitEvent: false });
-        // 4) Bind dependencies if needed (rebind when metadata changes)
         this.bindDependenciesIfNeeded(flatControls);
-        // 5) Notify that the form is ready
-        this.metaService.setFormBuildCompletition(true);
-        // 6) Emit one stable status update AFTER the current CD cycle
-        queueMicrotask(() => {
-            this.metaForm.updateValueAndValidity({ emitEvent: true });
-        });
+        // Recompute validity WITHOUT emitting events during build.
+        this.metaForm.updateValueAndValidity({ emitEvent: false });
+        // Emit "build completed" AFTER CD cycle.
+        this.metaService.finishFormBuild();
     }
-    /**
-     * Supports both:
-     *  - Flat controls: [ {configuration:{key}}, ...]
-     *  - Grouped controls: [ { ctrl: [ ... ] }, ... ]
-     */
     flattenControls(input) {
         if (!Array.isArray(input))
             return [];
         const isFlat = input.every((x) => !!x?.configuration?.key);
         if (isFlat)
             return input;
-        const flattened = input.flatMap((x) => Array.isArray(x?.ctrl) ? x.ctrl : x);
-        return flattened.filter((x) => !!x?.configuration?.key);
+        return input
+            .flatMap((x) => (Array.isArray(x?.ctrl) ? x.ctrl : x))
+            .filter((x) => !!x?.configuration?.key);
     }
     metaSignature(controls) {
         return (controls ?? [])
             .map((c) => `${c?.configuration?.key ?? ''}:${c?.configuration?.type ?? ''}`)
             .join('|');
     }
-    /**
-     * Ensures dependencies are bound exactly once per metadata signature.
-     * If metadata changes (new controls, different keys), we clean up and re-bind.
-     */
     bindDependenciesIfNeeded(flatControls) {
         if (!this.setupDependencies)
             return;
@@ -3990,7 +3989,6 @@ class MetaFormAbstract {
             findMeta: (key) => flatControls.find((c) => c?.configuration?.key === key) ?? null,
         };
         const maybeCleanup = this.setupDependencies(ctx);
-        // Allow setupDependencies to return a cleanup function (optional)
         if (typeof maybeCleanup === 'function') {
             this.dependencyCleanup.push(maybeCleanup);
         }
@@ -4004,31 +4002,22 @@ class MetaFormAbstract {
             catch { }
         });
         this.dependencyCleanup = [];
-        this.lastMetaSignature = '';
     }
-    /**
-     * Creates missing controls, applies validators, and removes stale controls.
-     * Also attaches "clear server error on edit" subscriptions per control.
-     */
     ensureControls(controls) {
         (controls ?? []).forEach((control) => {
             const key = control?.configuration?.key;
             if (!key)
                 return;
-            // Create control once
             if (!this.metaForm.contains(key)) {
                 this.metaForm.addControl(key, this.fb.control(getFieldType(control)));
             }
-            // Apply sync validators
             this.applyValidators(control);
-            // Clear server-side errors when user edits this field
             this.bindClearServerError(key);
-            // Disable if metadata says so
             if (control?.disable) {
                 this.metaForm.get(key)?.disable({ emitEvent: false });
             }
         });
-        // Remove stale controls when metadata changes
+        // remove stale controls when metadata changes
         const allowed = new Set((controls ?? [])
             .map((c) => c?.configuration?.key)
             .filter(Boolean));
@@ -4041,10 +4030,8 @@ class MetaFormAbstract {
         });
     }
     /**
-     * Removes only server-originated uniqueness errors when the user changes the value.
-     * This prevents a corrected value from staying blocked by an old server error.
-     *
-     * We DO NOT touch other errors (required, pattern, etc.).
+     * Removes ONLY server-origin uniqueness errors on user edit.
+     * Keeps required/pattern/email/etc.
      */
     bindClearServerError(key) {
         if (this.clearServerErrorSubs.has(key))
@@ -4063,17 +4050,11 @@ class MetaFormAbstract {
             ctrl.setErrors(Object.keys(rest).length ? rest : null, {
                 emitEvent: false,
             });
-            // Recompute the parent form validity so UI can enable Save immediately.
-            queueMicrotask(() => {
-                this.metaForm.updateValueAndValidity({ emitEvent: true });
-            });
+            // Here it's a user interaction, so emitting is safe and desired:
+            this.metaForm.updateValueAndValidity({ emitEvent: true });
         });
         this.clearServerErrorSubs.set(key, sub);
     }
-    /**
-     * Applies synchronous validators based on metadata.
-     * Uses emitEvent:false to avoid unnecessary loops.
-     */
     applyValidators(control) {
         const key = control?.configuration?.key;
         if (!key)
@@ -4109,12 +4090,9 @@ class MetaFormAbstract {
         ctrl.setValidators(validators);
         ctrl.updateValueAndValidity({ emitEvent: false });
     }
-    /**
-     * Subscribes MetaFormService to the correct FormGroup instance.
-     * Must run after @Input metaForm is available.
-     */
     rewireFormSubscription() {
         this.formSub?.unsubscribe();
+        // metaForm is required, but keep fallback safe
         if (!this.metaForm) {
             this.metaForm = this.fb.group({});
         }