@ng-forge/dynamic-forms 1.2.0-next.5 → 1.2.0-next.7

package/fesm2022/{ng-forge-dynamic-forms-ng-forge-dynamic-forms-DSXZJHcu.mjs → ng-forge-dynamic-forms-ng-forge-dynamic-forms-DCX7tvaB.mjs}

@@ -1,15 +1,16 @@
 import * as i0 from '@angular/core';
-import { reflectComponentType, Injector, inject, EnvironmentInjector, DestroyRef, computed, signal, input, ViewContainerRef, Directive, InjectionToken, linkedSignal, untracked, ChangeDetectionStrategy, Component, Injectable, isSignal, runInInjectionContext, afterNextRender, PendingTasks, ElementRef, PLATFORM_ID, isDevMode, TemplateRef, model, contentChildren, makeEnvironmentProviders } from '@angular/core';
+import { reflectComponentType, Injector, inject, EnvironmentInjector, DestroyRef, computed, signal, afterNextRender, input, ViewContainerRef, Directive, InjectionToken, Injectable, isSignal, runInInjectionContext, untracked, linkedSignal, injectAsync, resource, ChangeDetectionStrategy, Component, PendingTasks, ElementRef, PLATFORM_ID, isDevMode, TemplateRef, model, contentChildren, makeEnvironmentProviders } from '@angular/core';
 import { explicitEffect } from 'ngxtension/explicit-effect';
-import { DynamicFormLogger, WRAPPER_COMPONENT_CACHE, WRAPPER_REGISTRY, toReadonlyFieldTreeCached, writeToFieldValue, WRAPPER_AUTO_ASSOCIATIONS, DEFAULT_WRAPPERS, READONLY_FIELD_TREE_CACHE, getGridClassString, EventBus, FieldContextRegistryService, FunctionRegistryService, FORM_OPTIONS, evaluateCondition, FIELD_SIGNAL_CONTEXT, isRowField, isGenericContainerField, isContainerField, isArrayField, hasChildFields, isSimplifiedArrayField, DynamicFormError, isStateLogicConfig, isDerivationLogicConfig, isFormStateCondition, createFormStateLogicFunction, createDebouncedLogicFunction, createLogicFunction, ExpressionParser, applyValidator, isPageField, isGroupField, getFieldValueHandling, normalizeFieldsArray, keyBy, mapValues, isEqual, hasTargetProperty, ARRAY_CONTEXT, GROUP_CONTEXT, FORM_ID_PREFIX, baseFieldMapper, detectFormMode, validatePageNesting, FIELD_REGISTRY, assertNever, ADDON_TYPE_REGISTRY, deepMergeDefaults, derivedFromDeferred, createWarningTracker, RootFormRegistryService, DEFAULT_PROPS, DEFAULT_VALIDATION_MESSAGES, EXTERNAL_DATA, DEPRECATION_WARNING_TRACKER, createAddonActionRegistry, ADDON_ACTION_REGISTRY, HttpConditionCache, HTTP_CONDITION_CACHE, HttpConditionFunctionCacheService, AsyncConditionFunctionCacheService, DynamicValueFunctionCacheService, LogicFunctionCacheService, setupInitializationTracking, ComponentInitializedEvent, DF_FIELD_TEMPLATES, rowFieldMapper, groupFieldMapper, arrayFieldMapper, pageFieldMapper, textFieldMapper, containerFieldMapper, isWrapperTypeDefinition, ADDON_TYPE_COMPONENT_CACHE, ADDON_TYPE_DEFINITIONS, createDefaultDerivationLogConfig, NoopLogger, EMIT_FORM_VALUE_ON_EVENTS, DynamicTextPipe, ADDON_ACTION_HANDLERS } from '@ng-forge/dynamic-forms/internal';
-import { takeUntilDestroyed, toObservable, toSignal, outputFromObservable } from '@angular/core/rxjs-interop';
-import { of, forkJoin, from, catchError, map, switchMap, isObservable, firstValueFrom, exhaustMap, EMPTY, debounceTime, distinctUntilChanged, tap, pipe, scan, Observable, Subject, concatMap, filter, take } from 'rxjs';
-import { submit, required, disabled, readonly, hidden, applyEach, applyWhenValue, applyWhen, apply, email, minLength, maxLength, pattern, min, max, schema, validateStandardSchema, form, provideSignalFormsConfig } from '@angular/forms/signals';
-import { isStandardSchemaMarker } from '@ng-forge/dynamic-forms/schema';
+import { DynamicFormLogger, WRAPPER_COMPONENT_CACHE, WRAPPER_REGISTRY, toReadonlyFieldTreeCached, writeToFieldValue, ComponentInitializedEvent, isPageField, isGroupField, isArrayField, isRowField, isGenericContainerField, hasChildFields, normalizeFieldsArray, WRAPPER_AUTO_ASSOCIATIONS, DEFAULT_WRAPPERS, READONLY_FIELD_TREE_CACHE, EventBus, getGridClassString, GROUP_CONTEXT, isContainerField, isSimplifiedArrayField, DynamicFormError, getFieldValueHandling, keyBy, mapValues, isEqual, isDerivationLogicConfig, hasTargetProperty, ARRAY_CONTEXT, FORM_ID_PREFIX, baseFieldMapper, detectFormMode, validatePageNesting, FIELD_REGISTRY, assertNever, FunctionRegistryService, ADDON_TYPE_REGISTRY, deepMergeDefaults, FIELD_SIGNAL_CONTEXT, derivedFromDeferred, FieldContextRegistryService, FORM_OPTIONS, evaluateCondition, createWarningTracker, RootFormRegistryService, DEFAULT_PROPS, DEFAULT_VALIDATION_MESSAGES, EXTERNAL_DATA, DEPRECATION_WARNING_TRACKER, createAddonActionRegistry, ADDON_ACTION_REGISTRY, HttpConditionCache, HTTP_CONDITION_CACHE, HttpConditionFunctionCacheService, AsyncConditionFunctionCacheService, DynamicValueFunctionCacheService, LogicFunctionCacheService, DF_FIELD_TEMPLATES, rowFieldMapper, groupFieldMapper, arrayFieldMapper, pageFieldMapper, textFieldMapper, containerFieldMapper, isWrapperTypeDefinition, ADDON_TYPE_COMPONENT_CACHE, ADDON_TYPE_DEFINITIONS, createDefaultDerivationLogConfig, NoopLogger, EMIT_FORM_VALUE_ON_EVENTS, DynamicTextPipe, ADDON_ACTION_HANDLERS } from '@ng-forge/dynamic-forms/internal';
+import { takeUntilDestroyed, toObservable, outputFromObservable } from '@angular/core/rxjs-interop';
+import { of, forkJoin, from, catchError, map, switchMap, isObservable, firstValueFrom, exhaustMap, EMPTY, pipe, scan, Observable, Subject, concatMap, filter, take, shareReplay } from 'rxjs';
+import { submit, form, provideSignalFormsConfig } from '@angular/forms/signals';
 import { isPlatformBrowser, AsyncPipe, NgTemplateOutlet, NgComponentOutlet } from '@angular/common';
 import { NG_STATUS_CLASSES } from '@angular/forms/signals/compat';
 
 const EMPTY_WRAPPERS = Object.freeze([]);
+const FIELD_ERRORS_WRAPPER = 'field-errors';
+const FIELD_ERRORS_CONFIG = Object.freeze({ type: FIELD_ERRORS_WRAPPER });
 function isSameWrapperChain(a, b) {
     if (a === b)
         return true;
@@ -21,19 +22,30 @@ function isSameWrapperChain(a, b) {
     }
     return true;
 }
-function resolveWrappers(field, defaultWrappers, autoAssociations) {
-    if (field.wrappers === null) {
+function resolveWrappers(field, defaultWrappers, autoAssociations, wrapperRegistry) {
+        if (field.wrappers === null) {
         return EMPTY_WRAPPERS;
     }
     const autoWrappers = field.skipAutoWrappers ? EMPTY_WRAPPERS : (autoAssociations.get(field.type) ?? EMPTY_WRAPPERS);
     const defaults = field.skipDefaultWrappers ? EMPTY_WRAPPERS : (defaultWrappers ?? EMPTY_WRAPPERS);
     const fieldLevel = field.wrappers ?? EMPTY_WRAPPERS;
-    if (autoWrappers.length === 0 && defaults.length === 0 && fieldLevel.length === 0) {
-        return EMPTY_WRAPPERS;
+    const composed = [...autoWrappers, ...defaults, ...fieldLevel];
+            if (needsErrorWrapper(field, composed, wrapperRegistry)) {
+        composed.push(FIELD_ERRORS_CONFIG);
     }
-    return [...autoWrappers, ...defaults, ...fieldLevel];
+    return composed.length === 0 ? EMPTY_WRAPPERS : composed;
+}
+const VALIDATABLE_CONTAINERS = new Set(['group', 'array']);
+function needsErrorWrapper(field, composed, wrapperRegistry) {
+        if (!VALIDATABLE_CONTAINERS.has(field.type))
+        return false;
+    if (!field.validators || field.validators.length === 0)
+        return false;
+    return !composed.some((w) => w.type === FIELD_ERRORS_WRAPPER || wrapperRegistry.get(w.type)?.rendersFieldErrors);
 }
 
+const DEV_MODE = typeof ngDevMode === 'undefined' || !!ngDevMode;
+
 const inputNamesCache = new WeakMap();
 function getDeclaredInputs(componentType) {
     let inputs = inputNamesCache.get(componentType);
@@ -72,7 +84,9 @@ function loadWrapperComponents(configs, registry, cache, logger) {
         return of([]);
     return forkJoin(configs.map((config) => from(loadWrapperComponent(config.type, registry, cache)).pipe(catchError(() => of(undefined)), map((component) => {
         if (!component) {
-            logger.error(`Wrapper type '${config.type}' could not be loaded. Ensure it is registered via provideDynamicForm().`);
+                        if (DEV_MODE) {
+                logger.error(`Wrapper type '${config.type}' could not be loaded. Ensure it is registered via provideDynamicForm().`);
+            }
             return null;
         }
         return { config, component };
@@ -112,9 +126,11 @@ function renderStep(slot, remaining, options, refs) {
                 ref.changeDetectorRef.detectChanges();
     const inner = resolveInnerSlot(ref);
     if (!inner) {
-        options.logger.error(`Wrapper component for type '${wrapper.config.type}' does not provide a 'fieldComponent' ViewContainerRef. ` +
-            `Ensure the wrapper component has a viewChild('fieldComponent', { read: ViewContainerRef }) query ` +
-            `and that #fieldComponent is not inside a conditional (@if, @defer).`);
+                if (DEV_MODE) {
+            options.logger.error(`Wrapper component for type '${wrapper.config.type}' does not provide a 'fieldComponent' ViewContainerRef. ` +
+                `Ensure the wrapper component has a viewChild('fieldComponent', { read: ViewContainerRef }) query ` +
+                `and that #fieldComponent is not inside a conditional (@if, @defer).`);
+        }
                         while (refs.length)
             refs.pop().destroy();
         return;
@@ -156,22 +172,28 @@ function createWrapperChainController(opts) {
     const deps = injectChainDeps();
     const state = createStateSignal(opts);
     const mounted = { value: null };
+    const detached = { value: null };
     let refs = [];
                 buildEmissionStream(state, deps)
         .pipe(takeUntilDestroyed(deps.destroyRef))
         .subscribe((emission) => {
                                 try {
-            refs = applyEmission(emission, { opts, deps, mounted, refs });
+            refs = applyEmission(emission, { opts, deps, mounted, refs, detached });
         }
         catch (err) {
             deps.logger.error('Wrapper chain render failed; tearing down partial state.', err);
             opts.vcr().clear();
             refs = [];
             mounted.value = null;
+                        detached.value?.destroy();
+            detached.value = null;
         }
     });
     pushFieldInputsOnChange(opts, () => refs);
-    deps.destroyRef.onDestroy(() => opts.vcr().clear());
+    deps.destroyRef.onDestroy(() => {
+        detached.value?.destroy();
+        opts.vcr().clear();
+    });
 }
 function injectChainDeps() {
     return {
@@ -206,10 +228,21 @@ function applyEmission({ state, loaded }, ctx) {
     const { opts, deps, mounted, refs } = ctx;
     const vcr = opts.vcr();
     const structurallyChanged = isStructurallyDifferent(mounted.value, state);
-                if (!structurallyChanged && !state.open)
+                if (!structurallyChanged && !state.open) {
+        if (vcr.length > 0)
+            ctx.detached.value = vcr.detach(0) ?? ctx.detached.value;
+        return refs;
+    }
+        if (state.open && !structurallyChanged && mounted.value !== null && ctx.detached.value) {
+        vcr.insert(ctx.detached.value);
+        ctx.detached.value = null;
         return refs;
+    }
                     if (structurallyChanged && mounted.value !== null) {
-        opts.beforeRebuild?.();
+                        const preservesDetachedOuterView = opts.beforeRebuild?.() === true;
+                        if (ctx.detached.value && !preservesDetachedOuterView)
+            ctx.detached.value.destroy();
+        ctx.detached.value = null;
         vcr.clear();
         mounted.value = null;
     }
@@ -246,7 +279,7 @@ function pushFieldInputsOnChange(opts, getRefs) {
     });
 }
 
-function buildFieldInputs(rawInputs, cache, fieldType) {
+function buildFieldInputs(rawInputs, cache, fieldType, validationMessages) {
     const fieldTreeCandidate = rawInputs['field'];
             const hasFieldTree = fieldTreeCandidate !== undefined && typeof fieldTreeCandidate === 'function';
     const readonlyField = hasFieldTree ? toReadonlyFieldTreeCached(cache, fieldTreeCandidate) : undefined;
@@ -258,6 +291,7 @@ function buildFieldInputs(rawInputs, cache, fieldType) {
         type: fieldType,
         field: readonlyField,
         setValue,
+                        ...(validationMessages !== undefined && { validationMessages }),
     };
 }
 
@@ -310,13 +344,14 @@ class FieldComponentSlot {
         detach() {
         const current = this.state();
         if (current.phase !== 'mounted')
-            return;
+            return false;
         const focusSnapshot = this.captureFocus(current.ref);
         const idx = current.slot.indexOf(current.ref.hostView);
         if (idx >= 0)
             current.slot.detach(idx);
         this.lastInputs = null;
         this.state.set(Object.freeze({ phase: 'detached', ref: current.ref, focusSnapshot }));
+                        return idx < 0;
     }
         destroyOnTeardown() {
         const current = this.state();
@@ -347,6 +382,74 @@ class FieldComponentSlot {
     }
 }
 
+function emitComponentInitialized(eventBus, componentType, componentKey, injector) {
+    const logger = injector.get(DynamicFormLogger);
+    afterNextRender(() => {
+        try {
+            eventBus.dispatch(ComponentInitializedEvent, componentType, componentKey);
+        }
+        catch (error) {
+            logger.error(`Failed to emit initialization event for ${componentType} '${componentKey}'`, error);
+        }
+    }, { injector });
+}
+
+function initializationComponentKey(type, key) {
+    return `${type}:${key}`;
+}
+function initializationComponentPath(key, groupPath) {
+    return groupPath ? `${groupPath}.${key}` : key;
+}
+function initializationComponentType(field) {
+    if (isPageField(field))
+        return 'page';
+    if (isGroupField(field))
+        return 'group';
+    if (isArrayField(field))
+        return 'array';
+    if (isRowField(field) || isGenericContainerField(field))
+        return 'container';
+    return undefined;
+}
+function collectInitializingContainers(fields, groupPath = '') {
+    const identities = [];
+    for (const field of fields) {
+                if (field.hidden === true)
+            continue;
+        const type = initializationComponentType(field);
+        const componentPath = initializationComponentPath(field.key, groupPath);
+        if (type && field.key)
+            identities.push({ type, path: componentPath });
+        if (!hasChildFields(field))
+            continue;
+        const childGroupPath = isGroupField(field) ? componentPath : groupPath;
+        for (const child of normalizeFieldsArray(field.fields)) {
+            identities.push(...collectInitializingContainers((Array.isArray(child) ? child : [child]), childGroupPath));
+        }
+    }
+    return identities;
+}
+function collectInitializingContainerKeys(fields, groupPath = '') {
+    return collectInitializingContainers(fields, groupPath).map(({ type, path }) => initializationComponentKey(type, path));
+}
+function computeContainerHostClasses(containerType, className) {
+    const base = `df-field df-${containerType}`;
+    return className ? `${base} ${className}` : base;
+}
+function setupContainerInitEffect(resolvedFields, eventBus, componentType, fieldKeyFn, injector) {
+    const allReady = computed(() => {
+        const fields = resolvedFields();
+        return fields.length > 0 && fields.every((field) => field.renderReady());
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "allReady" }] : /* istanbul ignore next */ []));
+    explicitEffect([allReady], ([ready]) => {
+        if (ready) {
+            const type = typeof componentType === 'function' ? componentType() : componentType;
+            emitComponentInitialized(eventBus, type, fieldKeyFn(), injector);
+        }
+    });
+}
+
 class DfFieldOutlet {
             dfFieldOutlet = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "dfFieldOutlet" }] : /* istanbul ignore next */ []));
@@ -356,17 +459,22 @@ class DfFieldOutlet {
     vcr = signal(this.vcrRef).asReadonly();
     destroyRef = inject(DestroyRef);
     wrapperAutoAssociations = inject(WRAPPER_AUTO_ASSOCIATIONS);
+    wrapperRegistry = inject(WRAPPER_REGISTRY);
     defaultWrappersSignal = inject(DEFAULT_WRAPPERS, { optional: true });
     readonlyFieldCache = inject(READONLY_FIELD_TREE_CACHE);
+    eventBus = inject(EventBus, { optional: true });
+    injector = inject(Injector);
         fieldComponent = new FieldComponentSlot();
     componentIdentity = computed(() => this.dfFieldOutlet().component, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "componentIdentity" }] : /* istanbul ignore next */ []));
         renderReady = computed(() => this.dfFieldOutlet().renderReady() && !this.dfFieldOutlet().hidden(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "renderReady" }] : /* istanbul ignore next */ []));
+    hidden = computed(() => this.dfFieldOutlet().hidden(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hidden" }] : /* istanbul ignore next */ []));
     rawInputs = computed(() => this.dfFieldOutlet().inputs(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "rawInputs" }] : /* istanbul ignore next */ []));
-        wrappers = computed(() => resolveWrappers(this.dfFieldOutlet().fieldDef, this.defaultWrappersSignal?.(), this.wrapperAutoAssociations), { ...(ngDevMode ? { debugName: "wrappers" } : /* istanbul ignore next */ {}), equal: isSameWrapperChain });
-        fieldInputs = computed(() => buildFieldInputs(this.rawInputs(), this.readonlyFieldCache, this.dfFieldOutlet().fieldDef.type), /* @ts-ignore */
+        wrappers = computed(() => resolveWrappers(this.dfFieldOutlet().fieldDef, this.defaultWrappersSignal?.(), this.wrapperAutoAssociations, this.wrapperRegistry), { ...(ngDevMode ? { debugName: "wrappers" } : /* istanbul ignore next */ {}), equal: isSameWrapperChain });
+        fieldInputs = computed(() => buildFieldInputs(this.rawInputs(), this.readonlyFieldCache, this.dfFieldOutlet().fieldDef.type, this.dfFieldOutlet().fieldDef.validationMessages), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fieldInputs" }] : /* istanbul ignore next */ []));
     defaultEnvInjector = inject(EnvironmentInjector);
         fieldEnvInjector = computed(() => this.dfFieldOutletEnvironmentInjector() ?? this.defaultEnvInjector, /* @ts-ignore */
@@ -391,6 +499,15 @@ class DfFieldOutlet {
             },
         });
                                         explicitEffect([this.rawInputs, this.fieldInputs], ([rawInputs, fieldInputs]) => this.fieldComponent.pushInputs(rawInputs, fieldInputs));
+                                explicitEffect([this.hidden], ([hidden]) => {
+            if (!hidden || !this.eventBus)
+                return;
+            const resolved = this.dfFieldOutlet();
+            const groupContext = resolved.injector.get(GROUP_CONTEXT, null);
+            for (const { type, path } of collectInitializingContainers([resolved.fieldDef], groupContext?.groupPath())) {
+                emitComponentInitialized(this.eventBus, type, path, this.injector);
+            }
+        });
         this.destroyRef.onDestroy(() => this.fieldComponent.destroyOnTeardown());
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DfFieldOutlet, deps: [], target: i0.ɵɵFactoryTarget.Directive });
@@ -471,462 +588,72 @@ function clampWindowSize(value, fallback) {
     return Math.max(0, Math.floor(value));
 }
 
-class PageOrchestratorComponent {
-    eventBus = inject(EventBus);
-    fieldContextRegistry = inject(FieldContextRegistryService);
-    functionRegistry = inject(FunctionRegistryService);
-    formOptions = inject(FORM_OPTIONS, { optional: true });
-    globalPreloadWindow = inject(PAGE_PRELOAD_WINDOW);
-        pageFields = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "pageFields" }] : /* istanbul ignore next */ []));
-        form = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
-            fieldSignalContext = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "fieldSignalContext" }] : /* istanbul ignore next */ []));
-        pageHiddenStates = computed(() => {
-        const pages = this.pageFields();
-        return pages.map((page) => this.evaluatePageHidden(page));
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "pageHiddenStates" }] : /* istanbul ignore next */ []));
-        visiblePageIndices = computed(() => {
-        const hiddenStates = this.pageHiddenStates();
-        return hiddenStates
-            .map((hidden, index) => ({ index, hidden }))
-            .filter((item) => !item.hidden)
-            .map((item) => item.index);
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "visiblePageIndices" }] : /* istanbul ignore next */ []));
-        currentPageIndex = linkedSignal(() => {
-        const totalPages = this.pageFields().length;
-        if (totalPages === 0)
-            return 0;
-                return untracked(() => this.resolveInitialLanding());
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "currentPageIndex" }] : /* istanbul ignore next */ []));
-        resolveInitialLanding() {
-        const { index, validate } = this.initialPage();
-        const visible = this.visiblePageIndices();
-        if (index === 0 || visible.length === 0)
-            return 0;
-        const target = visible.includes(index) ? index : this.findNearestVisiblePage(index, visible);
-        if (target <= 0)
-            return Math.max(target, 0);
-        if (!validate)
-            return target;
-        const firstInvalid = visible.filter((i) => i < target).find((i) => !this.isPageValid(i));
-        return firstInvalid ?? target;
-    }
-        initialPage = computed(() => {
-        const raw = this.formOptions?.()?.initialPage;
-        const totalPages = this.pageFields().length;
-        const requested = typeof raw === 'number' ? raw : raw?.index;
-        const validate = typeof raw === 'number' ? false : (raw?.validate ?? false);
-        if (typeof requested !== 'number' || !Number.isFinite(requested) || requested < 0 || totalPages === 0) {
-            return { index: 0, validate: false };
-        }
-        return { index: Math.min(Math.trunc(requested), totalPages - 1), validate };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "initialPage" }] : /* istanbul ignore next */ []));
-        state = computed(() => {
-        const currentIndex = this.currentPageIndex();
-        const totalPages = this.pageFields().length;
-        const visibleIndices = this.visiblePageIndices();
-                const currentVisiblePosition = visibleIndices.indexOf(currentIndex);
-        const isFirstVisiblePage = currentVisiblePosition === 0 || currentVisiblePosition === -1;
-        const isLastVisiblePage = currentVisiblePosition >= visibleIndices.length - 1;
-        return {
-            currentPageIndex: currentIndex,
-            totalPages,
-            isFirstPage: isFirstVisiblePage,
-            isLastPage: isLastVisiblePage,
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
-        currentPageValid = computed(() => this.isPageValid(this.currentPageIndex()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "currentPageValid" }] : /* istanbul ignore next */ []));
-        isPageValid(pageIndex) {
-        const pages = this.pageFields();
-        const form = this.form();
-        if (pageIndex < 0 || pageIndex >= pages.length) {
-            return true;
+function collectLeafFieldKeys(fields) {
+    const keys = [];
+    for (const field of fields) {
+        if (isRowField(field) || isGenericContainerField(field)) {
+            keys.push(...collectLeafFieldKeys(field.fields));
         }
-                const leafKeys = collectLeafFieldKeys(pages[pageIndex].fields || []);
-                        for (const fieldKey of leafKeys) {
-            const field = form[fieldKey];
-            if (field && typeof field === 'function') {
-                const fieldState = field();
-                if (fieldState && typeof fieldState.valid === 'function' && !fieldState.valid()) {
-                    return false;
-                }
-            }
+        else if (field.key) {
+            keys.push(field.key);
         }
-        return true;
-    }
-        extendedFieldSignalContext = computed(() => ({
-        ...this.fieldSignalContext(),
-        currentPageValid: this.currentPageValid,
-    }), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "extendedFieldSignalContext" }] : /* istanbul ignore next */ []));
-        preloadWindow = computed(() => {
-        const perForm = this.formOptions?.()?.pagePreloadWindow;
-                return clampWindowSize(perForm, this.globalPreloadWindow);
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "preloadWindow" }] : /* istanbul ignore next */ []));
-        isWithinPreloadWindow(i) {
-        return Math.abs(i - this.state().currentPageIndex) <= this.preloadWindow();
-    }
-    constructor() {
-                this.setupEventListeners();
-                                explicitEffect([this.state, this.visiblePageIndices], ([state, visibleIndices]) => {
-            const currentVisiblePosition = visibleIndices.indexOf(state.currentPageIndex);
-            if (currentVisiblePosition === -1 && visibleIndices.length > 0) {
-                                const nearest = this.findNearestVisiblePage(state.currentPageIndex, visibleIndices);
-                if (nearest !== -1) {
-                    this.executePageChange(nearest);
-                }
-            }
-        });
     }
-        navigateToNextPage() {
-                        const disableWhenPageInvalid = this.formOptions?.()?.nextButton?.disableWhenPageInvalid ?? true;
-        if (disableWhenPageInvalid && !this.currentPageValid()) {
-            return {
-                success: false,
-                newPageIndex: this.state().currentPageIndex,
-                error: 'Current page has invalid fields',
-            };
-        }
-        const currentState = this.state();
-        const visibleIndices = this.visiblePageIndices();
-        if (currentState.isLastPage) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: 'Already on the last visible page',
-            };
+    return keys;
+}
+
+const NORMALIZED_ARRAY_METADATA = Symbol('normalizedArrayMetadata');
+function setNormalizedArrayMetadata(arrayField, metadata) {
+    arrayField[NORMALIZED_ARRAY_METADATA] = metadata;
+}
+function getNormalizedArrayMetadata(arrayField) {
+    return arrayField[NORMALIZED_ARRAY_METADATA];
+}
+
+function normalizeSimplifiedArrays(fields) {
+    return fields.flatMap((field) => {
+                if (isContainerField(field) && !isArrayField(field) && hasChildFields(field)) {
+            return [{ ...field, fields: normalizeSimplifiedArrays(field.fields) }];
         }
-                const currentVisiblePosition = visibleIndices.indexOf(currentState.currentPageIndex);
-        if (currentVisiblePosition === -1 || currentVisiblePosition >= visibleIndices.length - 1) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: 'No next visible page available',
-            };
+                if (isArrayField(field) && !isSimplifiedArrayField(field)) {
+            const normalizedItems = field.fields.map((item) => Array.isArray(item) ? normalizeSimplifiedArrays(item) : item);
+            return [{ ...field, fields: normalizedItems }];
         }
-        const nextVisiblePageIndex = visibleIndices[currentVisiblePosition + 1];
-        return this.executePageChange(nextVisiblePageIndex);
-    }
-        navigateToPreviousPage() {
-        const currentState = this.state();
-        const visibleIndices = this.visiblePageIndices();
-        if (currentState.isFirstPage) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: 'Already on the first visible page',
-            };
+                if (isSimplifiedArrayField(field)) {
+            const { arrayField, addButton } = expandSimplifiedArray(field);
+            return addButton ? [arrayField, addButton] : [arrayField];
         }
-                const currentVisiblePosition = visibleIndices.indexOf(currentState.currentPageIndex);
-        if (currentVisiblePosition <= 0) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: 'No previous visible page available',
-            };
+                return [field];
+    });
+}
+const INVALID_ARRAY_CHILD_TYPES = new Set(['page', 'array']);
+function validateSimplifiedTemplate(field) {
+    const { template, key } = field;
+    const isObjectTemplate = Array.isArray(template);
+    if (isObjectTemplate) {
+        const templateFields = template;
+        for (const tmpl of templateFields) {
+                                    if (INVALID_ARRAY_CHILD_TYPES.has(tmpl.type)) {
+                throw new DynamicFormError(`Simplified array "${key}" template contains a '${tmpl.type}' field (key: '${tmpl.key}'). ` +
+                    `Only leaf fields, rows, and groups are allowed as array children.`);
+            }
         }
-        const prevVisiblePageIndex = visibleIndices[currentVisiblePosition - 1];
-        return this.executePageChange(prevVisiblePageIndex);
     }
-        navigateToPage(pageIndex, options) {
-        const currentIndex = this.state().currentPageIndex;
-        const visibleIndices = this.visiblePageIndices();
-                        if (pageIndex <= currentIndex || !visibleIndices.includes(pageIndex)) {
-            return this.executePageChange(pageIndex);
+    else {
+        const singleTemplate = template;
+        if (INVALID_ARRAY_CHILD_TYPES.has(singleTemplate.type)) {
+            throw new DynamicFormError(`Simplified array "${key}" template has type '${singleTemplate.type}'. ` +
+                `Only leaf fields, rows, and groups are allowed as array children.`);
         }
-                if (options?.validate === false) {
-            return this.executePageChange(pageIndex);
-        }
-        const disableWhenPageInvalid = this.formOptions?.()?.nextButton?.disableWhenPageInvalid ?? true;
-        if (!disableWhenPageInvalid) {
-            return this.executePageChange(pageIndex);
-        }
-        const crossedPages = visibleIndices.filter((index) => index >= currentIndex && index < pageIndex);
-        const firstInvalidPage = crossedPages.find((index) => !this.isPageValid(index));
-        if (firstInvalidPage === undefined) {
-            return this.executePageChange(pageIndex);
-        }
-                this.executePageChange(firstInvalidPage);
-        return {
-            success: false,
-            newPageIndex: firstInvalidPage,
-            error: `Cannot navigate to page ${pageIndex}: page ${firstInvalidPage} has invalid fields`,
-        };
-    }
-        executePageChange(pageIndex) {
-        const currentState = this.state();
-        const totalPages = currentState.totalPages;
-                if (pageIndex < 0 || pageIndex >= totalPages) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: `Invalid page index: ${pageIndex}. Valid range is 0 to ${totalPages - 1}`,
-            };
-        }
-                const visibleIndices = this.visiblePageIndices();
-        if (!visibleIndices.includes(pageIndex)) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: `Cannot navigate to hidden page at index ${pageIndex}. Visible pages: [${visibleIndices.join(', ')}]`,
-            };
-        }
-                if (pageIndex === currentState.currentPageIndex) {
-            return {
-                success: true,
-                newPageIndex: pageIndex,
-            };
-        }
-                const previousIndex = currentState.currentPageIndex;
-        this.currentPageIndex.set(pageIndex);
-                this.eventBus.dispatch(PageChangeEvent, pageIndex, totalPages, previousIndex);
-        return {
-            success: true,
-            newPageIndex: pageIndex,
-        };
-    }
-        findNearestVisiblePage(currentIndex, visibleIndices) {
-        let nearest = -1;
-        let minDistance = Infinity;
-        for (const idx of visibleIndices) {
-            const distance = Math.abs(idx - currentIndex);
-                        if (distance < minDistance || (distance === minDistance && idx > nearest)) {
-                minDistance = distance;
-                nearest = idx;
-            }
-        }
-        return nearest;
-    }
-        setupEventListeners() {
-                this.eventBus
-            .on('next-page')
-            .pipe(takeUntilDestroyed())
-            .subscribe(() => {
-            this.navigateToNextPage();
-        });
-                this.eventBus
-            .on('previous-page')
-            .pipe(takeUntilDestroyed())
-            .subscribe(() => {
-            this.navigateToPreviousPage();
-        });
-                this.eventBus
-            .on('go-to-page')
-            .pipe(takeUntilDestroyed())
-            .subscribe((event) => {
-            this.navigateToPage(event.pageIndex, event.options);
-        });
-        explicitEffect([this.state], ([state]) => this.eventBus.dispatch(PagerStateEvent, state));
-    }
-        evaluatePageHidden(page) {
-                if (!page.logic || page.logic.length === 0) {
-            return false;
-        }
-                const hiddenLogic = page.logic.filter((l) => l.type === 'hidden');
-                if (hiddenLogic.length === 0) {
-            return false;
-        }
-                for (const logic of hiddenLogic) {
-                        if (typeof logic.condition === 'boolean') {
-                if (logic.condition) {
-                    return true;
-                }
-                continue;
-            }
-                        const condition = logic.condition;
-            const context = this.fieldContextRegistry.createDisplayOnlyContext(page.key || '', this.functionRegistry.getCustomFunctions());
-            if (evaluateCondition(condition, context)) {
-                return true;
-            }
-        }
-        return false;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: PageOrchestratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: PageOrchestratorComponent, isStandalone: true, selector: "div[page-orchestrator]", inputs: { pageFields: { classPropertyName: "pageFields", publicName: "pageFields", isSignal: true, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, fieldSignalContext: { classPropertyName: "fieldSignalContext", publicName: "fieldSignalContext", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.data-current-page": "state().currentPageIndex", "attr.data-total-pages": "state().totalPages" }, classAttribute: "df-page-orchestrator" }, providers: [
-            {
-                provide: FIELD_SIGNAL_CONTEXT,
-                useFactory: (orchestrator) => orchestrator.extendedFieldSignalContext(),
-                deps: [PageOrchestratorComponent],
-            },
-        ], ngImport: i0, template: `
-    @for (pageField of pageFields(); track pageField.key; let i = $index) {
-      <!--
-        Skip pages hidden by 'hidden' logic conditions entirely. FormStateManager
-        derives schema/value/validators from config (not from mounted components),
-        so unmounting a hidden page has no effect on form state — only on render +
-        CD cost. This is the page-level equivalent of the existing field-level
-        \`@if (!field.hidden())\` gate in page-field.component.ts.
-      -->
-      @if (!pageHiddenStates()[i]) {
-        @if (isWithinPreloadWindow(i)) {
-          <!-- Current and preloaded neighbour pages: render immediately for flicker-free navigation -->
-          @defer (on immediate) {
-            <section
-              page-field
-              [field]="pageField"
-              [key]="pageField.key"
-              [pageIndex]="i"
-              [isVisible]="i === state().currentPageIndex"
-            ></section>
-          } @placeholder {
-            <div class="df-page-placeholder" [attr.data-page-index]="i" [attr.data-page-key]="pageField.key"></div>
-          }
-        } @else {
-          <!--
-            Pages outside the preload window render only a lightweight placeholder
-            — they are NOT mounted. Mounting every page eagerly (previously via
-            \`@defer (on idle)\`, which fires almost immediately post-load) put all
-            fields of every page in the DOM at once: O(all-fields) initial render
-            blocking + O(all-fields) change detection on every keystroke, with no
-            visible benefit since only one page is shown at a time.
-
-            Form state (schema/value/validators) derives from config, not from
-            mounted components, so leaving a page unmounted does not affect
-            validity, derivations, or navigation. A page mounts the moment
-            navigation brings it into the preload window (above), which is
-            flicker-free for sequential next/previous navigation. The window size
-            is configurable via \`withPagePreload(n)\` or \`FormOptions.pagePreloadWindow\`.
-          -->
-          <div class="df-page-placeholder" [attr.data-page-index]="i" [attr.data-page-key]="pageField.key"></div>
-        }
-      }
-    }
-  `, isInline: true, styles: [":host{display:block;position:relative;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [/* @ts-ignore */
-                import('./ng-forge-dynamic-forms-page-field.component-B92kLZkH.mjs').then(m => m.default)]] });
-}
-i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "22.0.1", ngImport: i0, type: PageOrchestratorComponent, resolveDeferredDeps: () => [/* @ts-ignore */
-        import('./ng-forge-dynamic-forms-page-field.component-B92kLZkH.mjs').then(m => m.default)], resolveMetadata: PageFieldComponent => ({ decorators: [{
-                type: Component,
-                args: [{ selector: 'div[page-orchestrator]', imports: [PageFieldComponent], template: `
-    @for (pageField of pageFields(); track pageField.key; let i = $index) {
-      <!--
-        Skip pages hidden by 'hidden' logic conditions entirely. FormStateManager
-        derives schema/value/validators from config (not from mounted components),
-        so unmounting a hidden page has no effect on form state — only on render +
-        CD cost. This is the page-level equivalent of the existing field-level
-        \`@if (!field.hidden())\` gate in page-field.component.ts.
-      -->
-      @if (!pageHiddenStates()[i]) {
-        @if (isWithinPreloadWindow(i)) {
-          <!-- Current and preloaded neighbour pages: render immediately for flicker-free navigation -->
-          @defer (on immediate) {
-            <section
-              page-field
-              [field]="pageField"
-              [key]="pageField.key"
-              [pageIndex]="i"
-              [isVisible]="i === state().currentPageIndex"
-            ></section>
-          } @placeholder {
-            <div class="df-page-placeholder" [attr.data-page-index]="i" [attr.data-page-key]="pageField.key"></div>
-          }
-        } @else {
-          <!--
-            Pages outside the preload window render only a lightweight placeholder
-            — they are NOT mounted. Mounting every page eagerly (previously via
-            \`@defer (on idle)\`, which fires almost immediately post-load) put all
-            fields of every page in the DOM at once: O(all-fields) initial render
-            blocking + O(all-fields) change detection on every keystroke, with no
-            visible benefit since only one page is shown at a time.
-
-            Form state (schema/value/validators) derives from config, not from
-            mounted components, so leaving a page unmounted does not affect
-            validity, derivations, or navigation. A page mounts the moment
-            navigation brings it into the preload window (above), which is
-            flicker-free for sequential next/previous navigation. The window size
-            is configurable via \`withPagePreload(n)\` or \`FormOptions.pagePreloadWindow\`.
-          -->
-          <div class="df-page-placeholder" [attr.data-page-index]="i" [attr.data-page-key]="pageField.key"></div>
-        }
-      }
-    }
-  `, host: {
-                            class: 'df-page-orchestrator',
-                            '[attr.data-current-page]': 'state().currentPageIndex',
-                            '[attr.data-total-pages]': 'state().totalPages',
-                        }, providers: [
-                            {
-                                provide: FIELD_SIGNAL_CONTEXT,
-                                useFactory: (orchestrator) => orchestrator.extendedFieldSignalContext(),
-                                deps: [PageOrchestratorComponent],
-                            },
-                        ], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;width:100%}\n"] }]
-            }], ctorParameters: () => [], propDecorators: { pageFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageFields", required: true }] }], form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: true }] }], fieldSignalContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldSignalContext", required: true }] }] } }) });
-function collectLeafFieldKeys(fields) {
-    const keys = [];
-    for (const field of fields) {
-        if (isRowField(field) || isGenericContainerField(field)) {
-            keys.push(...collectLeafFieldKeys(field.fields));
-        }
-        else if (field.key) {
-            keys.push(field.key);
-        }
-    }
-    return keys;
-}
-
-const NORMALIZED_ARRAY_METADATA = Symbol('normalizedArrayMetadata');
-function setNormalizedArrayMetadata(arrayField, metadata) {
-    arrayField[NORMALIZED_ARRAY_METADATA] = metadata;
-}
-function getNormalizedArrayMetadata(arrayField) {
-    return arrayField[NORMALIZED_ARRAY_METADATA];
-}
-
-function normalizeSimplifiedArrays(fields) {
-    return fields.flatMap((field) => {
-                if (isContainerField(field) && !isArrayField(field) && hasChildFields(field)) {
-            return [{ ...field, fields: normalizeSimplifiedArrays(field.fields) }];
-        }
-                if (isArrayField(field) && !isSimplifiedArrayField(field)) {
-            const normalizedItems = field.fields.map((item) => Array.isArray(item) ? normalizeSimplifiedArrays(item) : item);
-            return [{ ...field, fields: normalizedItems }];
-        }
-                if (isSimplifiedArrayField(field)) {
-            const { arrayField, addButton } = expandSimplifiedArray(field);
-            return addButton ? [arrayField, addButton] : [arrayField];
-        }
-                return [field];
-    });
-}
-const INVALID_ARRAY_CHILD_TYPES = new Set(['page', 'array']);
-function validateSimplifiedTemplate(field) {
-    const { template, key } = field;
-    const isObjectTemplate = Array.isArray(template);
-    if (isObjectTemplate) {
-        const templateFields = template;
-        for (const tmpl of templateFields) {
-                                    if (INVALID_ARRAY_CHILD_TYPES.has(tmpl.type)) {
-                throw new DynamicFormError(`Simplified array "${key}" template contains a '${tmpl.type}' field (key: '${tmpl.key}'). ` +
-                    `Only leaf fields, rows, and groups are allowed as array children.`);
-            }
-        }
-    }
-    else {
-        const singleTemplate = template;
-        if (INVALID_ARRAY_CHILD_TYPES.has(singleTemplate.type)) {
-            throw new DynamicFormError(`Simplified array "${key}" template has type '${singleTemplate.type}'. ` +
-                `Only leaf fields, rows, and groups are allowed as array children.`);
-        }
-    }
-}
-function expandSimplifiedArray(field) {
-    const { template, value = [], addButton, removeButton, key, logic, minLength, maxLength, wrappers, skipAutoWrappers, skipDefaultWrappers, } = field;
-    const isObjectTemplate = Array.isArray(template);
-    const values = value;
-        validateSimplifiedTemplate(field);
-        const items = values.map((v) => {
-        if (isObjectTemplate) {
-            return buildObjectItem(template, v, removeButton);
+    }
+}
+function expandSimplifiedArray(field) {
+    const { template, value = [], addButton, removeButton, key, logic, minLength, maxLength, wrappers, skipAutoWrappers, skipDefaultWrappers, validators, validationMessages, required, validateWhenHidden, } = field;
+    const isObjectTemplate = Array.isArray(template);
+    const values = value;
+        validateSimplifiedTemplate(field);
+        const items = values.map((v) => {
+        if (isObjectTemplate) {
+            return buildObjectItem(template, v, removeButton);
         }
         return buildPrimitiveItem(template, v);
     });
@@ -956,6 +683,18 @@ function expandSimplifiedArray(field) {
     }
     if (skipDefaultWrappers !== undefined) {
         arrayFieldObj['skipDefaultWrappers'] = skipDefaultWrappers;
+    }
+            if (validators !== undefined) {
+        arrayFieldObj['validators'] = validators;
+    }
+    if (validationMessages !== undefined) {
+        arrayFieldObj['validationMessages'] = validationMessages;
+    }
+    if (required !== undefined) {
+        arrayFieldObj['required'] = required;
+    }
+    if (validateWhenHidden !== undefined) {
+        arrayFieldObj['validateWhenHidden'] = validateWhenHidden;
     }
         const arrayField = arrayFieldObj;
                                                 const primitiveFieldKey = !isObjectTemplate ? template.key : undefined;
@@ -1082,499 +821,104 @@ class SchemaRegistryService {
         registerSchema(schema) {
         this.registeredSchemas.set(schema.name, schema);
     }
-        getSchema(name) {
-        return this.registeredSchemas.get(name);
-    }
-        getAllSchemas() {
-        return new Map(this.registeredSchemas);
-    }
-        clearSchemas() {
-        this.registeredSchemas.clear();
-    }
-        resolveSchema(schema) {
-        if (typeof schema === 'string') {
-            return this.getSchema(schema) || null;
-        }
-        return schema;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SchemaRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SchemaRegistryService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SchemaRegistryService, decorators: [{
-            type: Injectable
-        }] });
-
-const DEV_MODE = typeof ngDevMode === 'undefined' || !!ngDevMode;
-
-const DEFAULT_DEBOUNCE_MS = 500;
-function createDebouncedEffect(source, callback, options) {
-    const { ms = DEFAULT_DEBOUNCE_MS, injector } = options;
-    const source$ = toObservable(source, { injector }).pipe(debounceTime(ms), distinctUntilChanged(), tap((value) => callback(value)));
-    return toSignal(source$, { injector });
-}
-function createDebouncedSignal(source, options) {
-    const { ms = DEFAULT_DEBOUNCE_MS, injector } = options;
-    const source$ = toObservable(source, { injector }).pipe(debounceTime(ms), distinctUntilChanged());
-    return toSignal(source$, { injector });
-}
-
-function getConfigTrigger(config) {
-    if (!isStateLogicConfig(config)) {
-        return 'onChange';
-    }
-    return config.trigger ?? 'onChange';
-}
-function getConfigDebounceMs(config) {
-    if (!isStateLogicConfig(config)) {
-        return undefined;
-    }
-        if (config.trigger === 'debounced') {
-        return config.debounceMs;
-    }
-    return undefined;
-}
-function applyLogic(config, fieldPath) {
-        if (isDerivationLogicConfig(config))
-        return;
-        if (!isStateLogicConfig(config)) {
-        if (DEV_MODE) {
-            console.warn(`[Dynamic Forms] Unrecognized logic config type '${config.type}' in applyLogic. ` +
-                'This config will be ignored. If this is a new logic type, ensure it is handled explicitly.');
-        }
-        return;
-    }
-    const path = fieldPath;
-    const trigger = getConfigTrigger(config);
-    const debounceMs = getConfigDebounceMs(config) ?? DEFAULT_DEBOUNCE_MS;
-    if (typeof config.condition === 'boolean') {
-        applyLogicFn(config.type, path, () => config.condition);
-        return;
-    }
-        if (isFormStateCondition(config.condition)) {
-                        if (config.condition === 'formInvalid' || config.condition === 'pageInvalid') {
-            const reason = config.condition === 'formInvalid'
-                ? `it would create a validation cycle against the form's own validity`
-                : `a value field has no page context for it to resolve against`;
-            throw new DynamicFormError(`The '${config.condition}' form-state condition is not supported on value-field logic because ${reason}. ` +
-                `Use 'formSubmitting', or apply this condition to a button or container instead.`);
-        }
-        applyLogicFn(config.type, path, createFormStateLogicFunction(config.condition));
-        return;
-    }
-        const logicFn = trigger === 'debounced'
-        ? createDebouncedLogicFunction(config.condition, debounceMs)
-        : createLogicFunction(config.condition);
-    applyLogicFn(config.type, path, logicFn);
-}
-function applyLogicFn(type, path, logicFn) {
-    switch (type) {
-        case 'hidden':
-            hidden(path, logicFn);
-            break;
-        case 'readonly':
-            readonly(path, logicFn);
-            break;
-        case 'disabled':
-            disabled(path, logicFn);
-            break;
-        case 'required':
-            required(path, { when: logicFn });
-            break;
-        default: {
-            const _exhaustive = type;
-            throw new DynamicFormError(`Unhandled state logic type: ${_exhaustive}`);
-        }
-    }
-}
-function applyMultipleLogic(configs, fieldPath) {
-    configs.forEach((config) => applyLogic(config, fieldPath));
-}
-
-function createTypePredicateFunction(predicate, logger) {
-    return (value) => {
-        try {
-                        const result = ExpressionParser.evaluate(predicate, { value });
-            return Boolean(result);
-        }
-        catch (error) {
-            logger.error('Error evaluating type predicate:', predicate, error);
-            return false;
-        }
-    };
-}
-
-function applySchema(config, fieldPath) {
-    const logger = inject(DynamicFormLogger);
-    const schemaRegistry = inject(SchemaRegistryService);
-    const schema = schemaRegistry.resolveSchema(config.schema);
-    if (!schema) {
-        const availableSchemas = Array.from(schemaRegistry.getAllSchemas().keys()).join(', ') || '<none>';
-        logger.error(`Schema not found: '${config.schema}'. ` +
-            `Available schemas: ${availableSchemas}. ` +
-            `Ensure the schema is registered in your schema registry.`);
-        return;
-    }
-    const schemaFn = createSchemaFunction(schema, logger);
-        const path = fieldPath;
-    switch (config.type) {
-        case 'apply':
-            apply(path, schemaFn);
-            break;
-        case 'applyWhen':
-            if (config.condition) {
-                const conditionFn = createLogicFunction(config.condition);
-                applyWhen(path, conditionFn, schemaFn);
-            }
-            break;
-        case 'applyWhenValue':
-            if (config.typePredicate) {
-                const predicate = createTypePredicateFunction(config.typePredicate, logger);
-                applyWhenValue(path, predicate, schemaFn);
-            }
-            break;
-        case 'applyEach':
-            applyEach(path, schemaFn);
-            break;
-    }
-}
-function createSchemaFunction(schema, logger) {
-    return (path) => {
-                schema.validators?.forEach((validatorConfig) => {
-            applyValidator(validatorConfig, path);
-        });
-                schema.logic?.forEach((logicConfig) => {
-            applyLogic(logicConfig, path);
-        });
-                schema.subSchemas?.forEach((subSchemaConfig) => {
-            applySchema(subSchemaConfig, path);
-        });
-    };
-}
-
-function combineAncestorHiddenLogics(logics) {
-    if (logics.length === 0)
-        return undefined;
-    if (logics.length === 1)
-        return logics[0];
-    return (ctx) => logics.some((fn) => fn(ctx));
-}
-function resolveFieldOwnContext(fieldDef, parentContext) {
-    if (fieldDef.validateWhenHidden === undefined)
-        return parentContext;
-    if (fieldDef.validateWhenHidden === parentContext.validateWhenHidden)
-        return parentContext;
-    return {
-        ...parentContext,
-        validateWhenHidden: fieldDef.validateWhenHidden,
-    };
-}
-function resolveDescendantContext(fieldDef, ownContext) {
-    let ancestorAlwaysHidden = ownContext.ancestorAlwaysHidden;
-    let ancestorHiddenLogics = ownContext.ancestorHiddenLogics;
-    let mutated = false;
-    if (fieldDef.hidden === true && !ancestorAlwaysHidden) {
-        ancestorAlwaysHidden = true;
-        mutated = true;
-    }
-    if (fieldDef.logic) {
-        for (const logic of fieldDef.logic) {
-            if (!isStateLogicConfig(logic) || logic.type !== 'hidden')
-                continue;
-            const condition = logic.condition;
-            if (condition === true) {
-                if (!ancestorAlwaysHidden) {
-                    ancestorAlwaysHidden = true;
-                    mutated = true;
-                }
-                continue;
-            }
-            if (condition === false)
-                continue;
-                                    if (typeof condition === 'string')
-                continue;
-                                    const fn = createLogicFunction(condition);
-            ancestorHiddenLogics = ancestorHiddenLogics.length === 0 ? [fn] : [...ancestorHiddenLogics, fn];
-            mutated = true;
-        }
-    }
-    if (!mutated)
-        return ownContext;
-    return {
-        validateWhenHidden: ownContext.validateWhenHidden,
-        ancestorAlwaysHidden,
-        ancestorHiddenLogics,
-    };
-}
-
-const DEFAULT_FIELD_TREE_MAPPING_CONTEXT = {
-    validateWhenHidden: false,
-    ancestorAlwaysHidden: false,
-    ancestorHiddenLogics: [],
-};
-function applyStringValidators(path, config) {
-    if (config.email) {
-        email(path);
-    }
-    if (config.minLength !== undefined) {
-        minLength(path, config.minLength);
-    }
-    if (config.maxLength !== undefined) {
-        maxLength(path, config.maxLength);
-    }
-    if (config.pattern) {
-        let regex;
-        if (typeof config.pattern === 'string') {
-            try {
-                regex = new RegExp(config.pattern);
-            }
-            catch (e) {
-                throw new DynamicFormError(`Invalid regex pattern: '${config.pattern}' — ${e instanceof Error ? e.message : String(e)}`);
-            }
-        }
-        else {
-            regex = config.pattern;
-        }
-        pattern(path, regex);
-    }
-}
-function applyNumberValidators(path, config) {
-    if (config.min !== undefined) {
-        min(path, config.min);
-    }
-    if (config.max !== undefined) {
-        max(path, config.max);
-    }
-}
-function getStringValidationConfig(fieldDef) {
-    if (!fieldDef.email && fieldDef.minLength === undefined && fieldDef.maxLength === undefined && !fieldDef.pattern) {
-        return undefined;
-    }
-    return {
-        email: fieldDef.email,
-        minLength: fieldDef.minLength,
-        maxLength: fieldDef.maxLength,
-        pattern: fieldDef.pattern,
-    };
-}
-function getNumberValidationConfig(fieldDef) {
-    const minVal = fieldDef.min ?? fieldDef.minValue;
-    const maxVal = fieldDef.max ?? fieldDef.maxValue;
-    if (minVal === undefined && maxVal === undefined) {
-        return undefined;
-    }
-    return { min: minVal, max: maxVal };
-}
-function mapFieldToForm(fieldDef, fieldPath, inheritedContext = DEFAULT_FIELD_TREE_MAPPING_CONTEXT) {
-    const ownContext = resolveFieldOwnContext(fieldDef, inheritedContext);
-                if (isPageField(fieldDef) || isRowField(fieldDef) || isGenericContainerField(fieldDef)) {
-        const descendantContext = resolveDescendantContext(fieldDef, ownContext);
-        mapContainerChildren(fieldDef.fields, fieldPath, descendantContext);
-        return;
-    }
-                    if (isGroupField(fieldDef)) {
-        const descendantContext = resolveDescendantContext(fieldDef, ownContext);
-        mapContainerChildren(fieldDef.fields, fieldPath, descendantContext);
-        return;
-    }
-        if (isArrayField(fieldDef)) {
-        const descendantContext = resolveDescendantContext(fieldDef, ownContext);
-        mapArrayFieldToForm(fieldDef, fieldPath, descendantContext);
-        return;
-    }
-                mapLeafField(fieldDef, fieldPath, ownContext);
-}
-function mapContainerChildren(fields, parentPath, inheritedContext) {
-    if (!fields)
-        return;
-    const pathRecord = parentPath;
-    for (const field of fields) {
-        if (isPageField(field) || isRowField(field) || isGenericContainerField(field)) {
-                                    const layoutOwn = resolveFieldOwnContext(field, inheritedContext);
-            const layoutDescendant = resolveDescendantContext(field, layoutOwn);
-            mapContainerChildren(field.fields, parentPath, layoutDescendant);
-            continue;
-        }
-        if (!field.key)
-            continue;
-        const childPath = pathRecord[field.key];
-        if (childPath) {
-            mapFieldToForm(field, childPath, inheritedContext);
-        }
-    }
-}
-function isValidationStateLogic(config) {
-    return isStateLogicConfig(config) && config.type === 'required';
-}
-function mapLeafField(fieldDef, fieldPath, context) {
-    const validationField = fieldDef;
-    const path = fieldPath;
-                applyFieldState(fieldDef, path);
-    if (validationField.logic) {
-        for (const config of validationField.logic) {
-            if (!isValidationStateLogic(config)) {
-                applyLogic(config, fieldPath);
-            }
-        }
-    }
-    if (validationField.schemas) {
-        for (const config of validationField.schemas) {
-            applySchema(config, fieldPath);
-        }
-    }
-        const applyValidation = (validationPath) => {
-        applySimpleValidationRules(validationField, validationPath);
-        if (validationField.validators) {
-            for (const config of validationField.validators) {
-                applyValidator(config, validationPath);
-            }
-        }
-        if (validationField.logic) {
-            for (const config of validationField.logic) {
-                if (isValidationStateLogic(config)) {
-                    applyLogic(config, validationPath);
-                }
-            }
-        }
-    };
-    if (context.validateWhenHidden) {
-        applyValidation(path);
-        return;
-    }
-            if (context.ancestorAlwaysHidden) {
-        return;
-    }
-                            const ancestorHiddenLogic = combineAncestorHiddenLogics(context.ancestorHiddenLogics);
-    applyWhen(path, (ctx) => {
-        if (ctx.state.hidden())
-            return false;
-        if (ancestorHiddenLogic && ancestorHiddenLogic(ctx))
-            return false;
-        return true;
-    }, schema((subPath) => applyValidation(subPath)));
-}
-function applySimpleValidationRules(fieldDef, path) {
-    if (fieldDef.required) {
-        required(path);
-    }
-        const stringConfig = getStringValidationConfig(fieldDef);
-    if (stringConfig) {
-        applyStringValidators(path, stringConfig);
-    }
-        const numberConfig = getNumberValidationConfig(fieldDef);
-    if (numberConfig) {
-        applyNumberValidators(path, numberConfig);
-    }
-}
-function applyFieldState(fieldDef, path) {
-    if (fieldDef.disabled) {
-        disabled(path);
-    }
-    if (fieldDef.readonly) {
-        readonly(path);
-    }
-    if (fieldDef.hidden) {
-        hidden(path, () => true);
-    }
-}
-function mapArrayFieldToForm(arrayField, fieldPath, context) {
-    if (!isArrayField(arrayField)) {
-        return;
-    }
-        if (arrayField.minLength !== undefined) {
-        minLength(fieldPath, arrayField.minLength);
-    }
-    if (arrayField.maxLength !== undefined) {
-        maxLength(fieldPath, arrayField.maxLength);
+        getSchema(name) {
+        return this.registeredSchemas.get(name);
     }
-        let itemDefinitions = arrayField.fields;
-                    if (!itemDefinitions || itemDefinitions.length === 0) {
-        const metadataTemplate = getNormalizedArrayMetadata(arrayField)?.template;
-        if (metadataTemplate) {
-            itemDefinitions = [
-                Array.isArray(metadataTemplate) ? [...metadataTemplate] : metadataTemplate,
-            ];
-        }
+        getAllSchemas() {
+        return new Map(this.registeredSchemas);
     }
-            if (!itemDefinitions || itemDefinitions.length === 0) {
-        const emptyItemSchema = schema(() => {
-                    });
-        applyEach(fieldPath, emptyItemSchema);
-        return;
+        clearSchemas() {
+        this.registeredSchemas.clear();
     }
-        let hasPrimitiveItems = false;
-    const allObjectFields = [];
-    for (const itemDef of itemDefinitions) {
-        if (Array.isArray(itemDef)) {
-                        collectFieldsFromObjectItem(itemDef, allObjectFields);
-        }
-        else if (isPageField(itemDef) ||
-            isRowField(itemDef) ||
-            isGenericContainerField(itemDef)) {
-                                                collectFieldsFromObjectItem([itemDef], allObjectFields);
-        }
-        else {
-                        hasPrimitiveItems = true;
+        resolveSchema(schema) {
+        if (typeof schema === 'string') {
+            return this.getSchema(schema) || null;
         }
+        return schema;
     }
-        if (hasPrimitiveItems && allObjectFields.length === 0) {
-        const primitiveItemSchema = schema(() => {
-                    });
-        applyEach(fieldPath, primitiveItemSchema);
-        return;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SchemaRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SchemaRegistryService });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: SchemaRegistryService, decorators: [{
+            type: Injectable
+        }] });
+
+function inheritContainerExclusion(container, child) {
+    const inheritedHidden = container.hidden === true || child.inheritedExclusionState?.hidden === true;
+    const inheritedDisabled = container.disabled === true || child.inheritedExclusionState?.disabled === true;
+    const inheritedReadonly = container.readonly === true || child.inheritedExclusionState?.readonly === true;
+    const hasInheritedState = inheritedHidden || inheritedDisabled || inheritedReadonly;
+    const containerExcludeConfig = container.excludeValueIfHidden !== undefined ||
+        container.excludeValueIfDisabled !== undefined ||
+        container.excludeValueIfReadonly !== undefined;
+    if (!hasInheritedState && !containerExcludeConfig) {
+        return child;
     }
-            const itemSchema = schema((itemPath) => {
-        const pathRecord = itemPath;
-                for (const templateField of allObjectFields) {
-            if (isRowField(templateField) || isPageField(templateField) || isGenericContainerField(templateField)) {
-                                const layoutOwn = resolveFieldOwnContext(templateField, context);
-                const layoutDescendant = resolveDescendantContext(templateField, layoutOwn);
-                mapContainerChildren(templateField.fields, itemPath, layoutDescendant);
-            }
-            else if (isGroupField(templateField)) {
-                                const groupKey = templateField.key;
-                const groupOwn = resolveFieldOwnContext(templateField, context);
-                const groupDescendant = resolveDescendantContext(templateField, groupOwn);
-                if (groupKey) {
-                    const groupPath = pathRecord[groupKey];
-                    if (groupPath) {
-                        mapContainerChildren(templateField.fields, groupPath, groupDescendant);
-                    }
-                }
-                else {
-                                        mapContainerChildren(templateField.fields, itemPath, groupDescendant);
-                }
-            }
-            else {
-                                const fieldKey = templateField.key;
-                if (fieldKey) {
-                    const fieldPathForKey = pathRecord[fieldKey];
-                    if (fieldPathForKey) {
-                        mapFieldToForm(templateField, fieldPathForKey, context);
-                    }
-                }
+    return {
+        ...child,
+        ...(hasInheritedState
+            ? { inheritedExclusionState: { hidden: inheritedHidden, disabled: inheritedDisabled, readonly: inheritedReadonly } }
+            : {}),
+                excludeValueIfHidden: child.excludeValueIfHidden ?? container.excludeValueIfHidden,
+        excludeValueIfDisabled: child.excludeValueIfDisabled ?? container.excludeValueIfDisabled,
+        excludeValueIfReadonly: child.excludeValueIfReadonly ?? container.excludeValueIfReadonly,
+    };
+}
+function flattenFields(fields, registry, options = {}) {
+    const result = [];
+    let autoKeyCounter = 0;
+        for (const field of fields) {
+                        const valueHandling = getFieldValueHandling(field.type, registry);
+                                if (options.preserveRows && (isRowField(field) || isGenericContainerField(field))) {
+            if (field.fields) {
+                                const flattenedChildren = flattenFields(normalizeFieldsArray(field.fields), registry, options);
+                                                const autoPrefix = isRowField(field) ? 'auto_row' : 'auto_container';
+                result.push({
+                    ...field,
+                    fields: flattenedChildren,
+                    key: field.key || `${autoPrefix}_${autoKeyCounter++}`,
+                });
             }
         }
-    });
-    applyEach(fieldPath, itemSchema);
-}
-function collectFieldsFromObjectItem(itemFields, allFields) {
-    const seenKeys = new Set(allFields.map((f) => f.key).filter(Boolean));
-    for (const field of itemFields) {
-                if (isRowField(field) || isPageField(field) || isGenericContainerField(field)) {
-                        const containerKey = `__container_${field.type}_${JSON.stringify(field.fields?.map((f) => f.key))}`;
-            if (!seenKeys.has(containerKey)) {
-                seenKeys.add(containerKey);
-                allFields.push(field);
+        else if (valueHandling === 'flatten' && 'fields' in field) {
+                                    if (field.fields) {
+                const fields = field.fields;
+                const flattenedChildren = flattenFields(normalizeFieldsArray(fields), registry, options);
+                                                                                                                result.push(...flattenedChildren.map((child) => inheritContainerExclusion(field, child)));
             }
         }
+        else if (isGroupField(field)) {
+                                    const childFieldsArray = Object.values(field.fields);
+            const flattenedChildren = flattenFields(childFieldsArray, registry, options);
+                        result.push({
+                ...field,
+                fields: flattenedChildren,
+                key: field.key || `auto_group_${autoKeyCounter++}`,
+            });
+        }
+        else if (isArrayField(field)) {
+                                                                                                            const flattenedItemTemplates = field.fields.map((itemDef) => {
+                if (!Array.isArray(itemDef)) {
+                                        const flattened = flattenFields([itemDef], registry, options);
+                    return flattened[0];
+                }
+                                return flattenFields([...itemDef], registry, options);
+            });
+                        result.push({
+                ...field,
+                fields: flattenedItemTemplates,
+                key: field.key || `auto_array_${autoKeyCounter++}`,
+            });
+        }
         else {
-            const key = field.key;
-            if (key && !seenKeys.has(key)) {
-                seenKeys.add(key);
-                allFields.push(field);
-            }
+                                    const key = field.key || `auto_field_${autoKeyCounter++}`;
+            result.push({
+                ...field,
+                key,
+            });
         }
     }
+    return result;
 }
 
 function getFieldDefaultValue(field, registry) {
@@ -1680,160 +1024,6 @@ function getFieldDefaultValue(field, registry) {
     return '';
 }
 
-function applyFormLevelSchema(path, formLevelSchema) {
-    if (isStandardSchemaMarker(formLevelSchema)) {
-                                validateStandardSchema(path, formLevelSchema.schema);
-    }
-    else if (typeof formLevelSchema === 'function') {
-                                formLevelSchema(path);
-    }
-}
-function createFormLevelSchema(formLevelSchema) {
-    return schema((path) => {
-        applyFormLevelSchema(path, formLevelSchema);
-    });
-}
-
-const VALIDATION_EXECUTION_DEFAULTS = new InjectionToken('VALIDATION_EXECUTION_DEFAULTS', {
-    providedIn: 'root',
-    factory: () => ({
-        validateWhenHidden: false,
-    }),
-});
-
-function createSchemaFromFields(fields, registry, options = {}) {
-            const validationExecutionDefaults = inject(VALIDATION_EXECUTION_DEFAULTS);
-    const { formLevelSchema } = options;
-    const rootContext = {
-        validateWhenHidden: options.validateWhenHidden ?? validationExecutionDefaults.validateWhenHidden,
-        ancestorAlwaysHidden: false,
-        ancestorHiddenLogics: [],
-    };
-    return schema((path) => {
-        for (const fieldDef of fields) {
-            const valueHandling = getFieldValueHandling(fieldDef.type, registry);
-                        if (valueHandling === 'exclude') {
-                                continue;
-            }
-            if (valueHandling === 'flatten' && hasChildFields(fieldDef)) {
-                                                                const flattenedOwn = resolveFieldOwnContext(fieldDef, rootContext);
-                const flattenedContext = resolveDescendantContext(fieldDef, flattenedOwn);
-                for (const childField of normalizeFieldsArray(fieldDef.fields)) {
-                    if (!childField.key)
-                        continue;
-                    const childPath = path[childField.key];
-                    if (childPath) {
-                        mapFieldToForm(childField, childPath, flattenedContext);
-                    }
-                }
-                continue;
-            }
-                        const fieldPath = path[fieldDef.key];
-            if (!fieldPath) {
-                continue;
-            }
-                                                mapFieldToForm(fieldDef, fieldPath, rootContext);
-        }
-                if (formLevelSchema) {
-            applyFormLevelSchema(path, formLevelSchema);
-        }
-    });
-}
-function fieldsToDefaultValues(fields, registry) {
-    const defaultValues = {};
-    for (const field of fields) {
-        if (!field.key)
-            continue;
-                const valueHandling = getFieldValueHandling(field.type, registry);
-        if (valueHandling === 'flatten') {
-            continue;
-        }
-        const value = getFieldDefaultValue(field, registry);
-        if (value !== undefined) {
-            defaultValues[field.key] = value;
-        }
-    }
-    return defaultValues;
-}
-
-function inheritContainerExclusion(container, child) {
-    const inheritedHidden = container.hidden === true || child.inheritedExclusionState?.hidden === true;
-    const inheritedDisabled = container.disabled === true || child.inheritedExclusionState?.disabled === true;
-    const inheritedReadonly = container.readonly === true || child.inheritedExclusionState?.readonly === true;
-    const hasInheritedState = inheritedHidden || inheritedDisabled || inheritedReadonly;
-    const containerExcludeConfig = container.excludeValueIfHidden !== undefined ||
-        container.excludeValueIfDisabled !== undefined ||
-        container.excludeValueIfReadonly !== undefined;
-    if (!hasInheritedState && !containerExcludeConfig) {
-        return child;
-    }
-    return {
-        ...child,
-        ...(hasInheritedState
-            ? { inheritedExclusionState: { hidden: inheritedHidden, disabled: inheritedDisabled, readonly: inheritedReadonly } }
-            : {}),
-                excludeValueIfHidden: child.excludeValueIfHidden ?? container.excludeValueIfHidden,
-        excludeValueIfDisabled: child.excludeValueIfDisabled ?? container.excludeValueIfDisabled,
-        excludeValueIfReadonly: child.excludeValueIfReadonly ?? container.excludeValueIfReadonly,
-    };
-}
-function flattenFields(fields, registry, options = {}) {
-    const result = [];
-    let autoKeyCounter = 0;
-        for (const field of fields) {
-                        const valueHandling = getFieldValueHandling(field.type, registry);
-                                if (options.preserveRows && (isRowField(field) || isGenericContainerField(field))) {
-            if (field.fields) {
-                                const flattenedChildren = flattenFields(normalizeFieldsArray(field.fields), registry, options);
-                                                const autoPrefix = isRowField(field) ? 'auto_row' : 'auto_container';
-                result.push({
-                    ...field,
-                    fields: flattenedChildren,
-                    key: field.key || `${autoPrefix}_${autoKeyCounter++}`,
-                });
-            }
-        }
-        else if (valueHandling === 'flatten' && 'fields' in field) {
-                                    if (field.fields) {
-                const fields = field.fields;
-                const flattenedChildren = flattenFields(normalizeFieldsArray(fields), registry, options);
-                                                                                                                result.push(...flattenedChildren.map((child) => inheritContainerExclusion(field, child)));
-            }
-        }
-        else if (isGroupField(field)) {
-                                    const childFieldsArray = Object.values(field.fields);
-            const flattenedChildren = flattenFields(childFieldsArray, registry, options);
-                        result.push({
-                ...field,
-                fields: flattenedChildren,
-                key: field.key || `auto_group_${autoKeyCounter++}`,
-            });
-        }
-        else if (isArrayField(field)) {
-                                                                                                            const flattenedItemTemplates = field.fields.map((itemDef) => {
-                if (!Array.isArray(itemDef)) {
-                                        const flattened = flattenFields([itemDef], registry, options);
-                    return flattened[0];
-                }
-                                return flattenFields([...itemDef], registry, options);
-            });
-                        result.push({
-                ...field,
-                fields: flattenedItemTemplates,
-                key: field.key || `auto_array_${autoKeyCounter++}`,
-            });
-        }
-        else {
-                                    const key = field.key || `auto_field_${autoKeyCounter++}`;
-            result.push({
-                ...field,
-                key,
-            });
-        }
-    }
-    return result;
-}
-
 function createContainerFieldProcessors() {
     const flattenCache = new WeakMap();
     const memoizedFlattenFields = (fields, registry) => {
@@ -2272,9 +1462,14 @@ const COMPONENT_CACHE = new InjectionToken('COMPONENT_CACHE', {
     providedIn: 'root',
     factory: () => new Map(),
 });
+const COMPONENT_LOAD_CACHE = new InjectionToken('COMPONENT_LOAD_CACHE', {
+    providedIn: 'root',
+    factory: () => new Map(),
+});
 function injectFieldRegistry() {
     const registry = inject(FIELD_REGISTRY);
     const componentCache = inject(COMPONENT_CACHE);
+    const componentLoadCache = inject(COMPONENT_LOAD_CACHE);
     return {
                 getType(name) {
             return registry.get(name);
@@ -2294,12 +1489,26 @@ function injectFieldRegistry() {
             if (cached) {
                 return cached;
             }
+            const pending = componentLoadCache.get(name);
+            if (pending) {
+                return pending;
+            }
             try {
-                const component = resolveDefaultExport(await fieldType.loadComponent());
-                if (component) {
-                    componentCache.set(name, component);
-                }
-                return component;
+                const load = fieldType
+                    .loadComponent()
+                    .then(resolveDefaultExport)
+                    .then((component) => {
+                    if (component) {
+                        componentCache.set(name, component);
+                    }
+                    return component;
+                })
+                    .catch((error) => {
+                    throw new DynamicFormError(`Failed to load component for field type "${name}": ${error}`);
+                })
+                    .finally(() => componentLoadCache.delete(name));
+                componentLoadCache.set(name, load);
+                return load;
             }
             catch (error) {
                 throw new DynamicFormError(`Failed to load component for field type "${name}": ${error}`);
@@ -2368,7 +1577,9 @@ function validateRegexPattern(pattern, fieldKey, errors) {
         new RegExp(pattern);
     }
     catch (e) {
-        errors.push(`Invalid regex pattern in validator for field '${fieldKey}': '${pattern}' — ${e instanceof Error ? e.message : String(e)}`);
+                errors.push(DEV_MODE
+            ? `Invalid regex pattern in validator for field '${fieldKey}': '${pattern}' — ${e instanceof Error ? e.message : String(e)}`
+            : `Invalid regex pattern: '${pattern}'`);
     }
 }
 function validateNoDuplicateKeys(allKeys) {
@@ -2384,7 +1595,9 @@ function validateNoDuplicateKeys(allKeys) {
         const duplicateList = Array.from(duplicates)
             .map((k) => `'${k}'`)
             .join(', ');
-        throw new DynamicFormError(`Duplicate field keys detected: ${duplicateList}. Field keys must be unique within their group scope (the same key may appear inside different groups).`);
+                throw new DynamicFormError(DEV_MODE
+            ? `Duplicate field keys detected: ${duplicateList}. Field keys must be unique within their group scope (the same key may appear inside different groups).`
+            : `Duplicate field keys detected: ${duplicateList}.`);
     }
 }
 function validateNoDomIdCollisions(domIds) {
@@ -2400,9 +1613,11 @@ function validateNoDomIdCollisions(domIds) {
         const duplicateList = Array.from(duplicates)
             .map((k) => `'${k}'`)
             .join(', ');
-        throw new DynamicFormError(`DOM id collision detected for: ${duplicateList}. Group-nested keys are joined with '_' to form DOM ids ` +
-            `(e.g. group 'foo' + leaf 'bar' renders as id='foo_bar'). A separate top-level key like 'foo_bar' or a different ` +
-            `group/leaf pair that underscores to the same string will produce duplicate ids. Rename one of the colliding keys.`);
+                throw new DynamicFormError(DEV_MODE
+            ? `DOM id collision detected for: ${duplicateList}. Group-nested keys are joined with '_' to form DOM ids ` +
+                `(e.g. group 'foo' + leaf 'bar' renders as id='foo_bar'). A separate top-level key like 'foo_bar' or a different ` +
+                `group/leaf pair that underscores to the same string will produce duplicate ids. Rename one of the colliding keys.`
+            : `DOM id collision detected for: ${duplicateList}.`);
     }
 }
 function validateFieldTypesRegistered(allTypes, registry, logger) {
@@ -2432,12 +1647,15 @@ function validateFormConfig(fields, registry, logger) {
         const list = Array.from(new Set(data.dottedKeys))
             .map((k) => `'${k}'`)
             .join(', ');
-        throw new DynamicFormError(`Field key(s) contain a dot: ${list}. Dotted keys are not supported — express nesting with 'group' fields ` +
-            `(e.g. { type: 'group', key: 'address', fields: [{ type: 'input', key: 'city' }] }).`);
+                throw new DynamicFormError(DEV_MODE
+            ? `Field key(s) contain a dot: ${list}. Dotted keys are not supported — express nesting with 'group' fields ` +
+                `(e.g. { type: 'group', key: 'address', fields: [{ type: 'input', key: 'city' }] }).`
+            : `Field key(s) contain a dot: ${list}.`);
     }
     validateNoDuplicateKeys(data.keys);
     validateNoDomIdCollisions(data.domIds);
-    validateFieldTypesRegistered(data.types, registry, logger);
+        if (DEV_MODE)
+        validateFieldTypesRegistered(data.types, registry, logger);
     if (data.regexErrors.length > 0) {
         throw new DynamicFormError(data.regexErrors.length === 1
             ? data.regexErrors[0]
@@ -2652,6 +1870,33 @@ function resolveExclusionConfig(global, form, field) {
         excludeValueIfReadonly: field?.excludeValueIfReadonly ?? form?.excludeValueIfReadonly ?? global.excludeValueIfReadonly,
     };
 }
+function hasEnabledValueExclusion(fields, global, form) {
+    return fields.some((field) => {
+        const resolved = resolveExclusionConfig(global, form, field);
+        if (resolved.excludeValueIfHidden || resolved.excludeValueIfDisabled || resolved.excludeValueIfReadonly) {
+            return true;
+        }
+        return (isGroupField(field) && !!field.fields && hasEnabledValueExclusion(Object.values(field.fields), global, form));
+    });
+}
+function filterDeclaredValueShape(rawValue, fields, registry) {
+    const kept = {};
+    for (const field of fields) {
+        const key = field.key;
+        if (!key || !(key in rawValue))
+            continue;
+        const valueHandling = getFieldValueHandling(field.type, registry);
+        if (valueHandling === 'exclude' || valueHandling === 'flatten')
+            continue;
+        const value = rawValue[key];
+        if (isGroupField(field) && field.fields && value !== null && typeof value === 'object' && !Array.isArray(value)) {
+            kept[key] = filterDeclaredValueShape(value, Object.values(field.fields), registry);
+            continue;
+        }
+        kept[key] = value;
+    }
+    return kept;
+}
 function shouldExcludeField(field, fieldState, config) {
     const state = fieldState();
     const inherited = field.inheritedExclusionState;
@@ -2669,7 +1914,10 @@ function shouldExcludeField(field, fieldState, config) {
     }
     return false;
 }
-function filterFormValue(rawValue, schemaFields, formTree, registry, globalDefaults, formOptions) {
+function filterFormValue(rawValue, schemaFields, formTree, registry, globalDefaults, formOptions, exclusionEnabled = hasEnabledValueExclusion(schemaFields, globalDefaults, formOptions)) {
+            if (!exclusionEnabled) {
+        return filterDeclaredValueShape(rawValue, schemaFields, registry);
+    }
     const result = {};
     for (const field of schemaFields) {
         const key = field.key;
@@ -2705,7 +1953,7 @@ function filterFormValue(rawValue, schemaFields, formTree, registry, globalDefau
             if (groupValue && typeof groupValue === 'object') {
                 const childFields = Object.values(field.fields);
                 const nestedTree = fieldState;
-                result[key] = filterFormValue(groupValue, childFields, nestedTree, registry, globalDefaults, formOptions);
+                result[key] = filterFormValue(groupValue, childFields, nestedTree, registry, globalDefaults, formOptions, true);
             }
             else {
                 result[key] = groupValue;
@@ -3018,7 +2266,7 @@ class FormStateMachine {
         if (!isTransitioningState(state) || state.phase !== Phase.Restoring) {
             return { state, sideEffects: [] };
         }
-        if (!state.pendingFormSetup) {
+                if (DEV_MODE && !state.pendingFormSetup) {
             this.config.logger.warn('handleRestoreComplete: pendingFormSetup was not set — falling back to recomputing. ' +
                 'This indicates a bug in the transition flow.');
         }
@@ -3081,7 +2329,7 @@ class FormStateMachine {
                     const state = untracked(() => this._state());
                     if (!isTransitioningState(state) || state.phase !== Phase.Restoring)
                         return;
-                    if (!state.pendingFormSetup) {
+                                        if (DEV_MODE && !state.pendingFormSetup) {
                         this.config.logger.warn('RestoreValues effect: pendingFormSetup was not set — falling back to recomputing.');
                     }
                     const formSetup = state.pendingFormSetup ?? this.config.createFormSetup(state.pendingConfig);
@@ -3223,13 +2471,6 @@ class FormStateManager {
         return detectFormMode(config.fields || []);
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "formModeDetection" }] : /* istanbul ignore next */ []));
-        formConfigValidation = computed(() => {
-        const config = this.activeConfig();
-        if (!config)
-            return { isValid: true, errors: [], warnings: [] };
-        return FormModeValidator.validateFormConfiguration(config.fields || []);
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "formConfigValidation" }] : /* istanbul ignore next */ []));
         effectiveFormOptions = computed(() => {
         const config = this.activeConfig();
         const configOptions = config?.options || {};
@@ -3237,6 +2478,8 @@ class FormStateManager {
         return { ...configOptions, ...inputOptions };
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "effectiveFormOptions" }] : /* istanbul ignore next */ []));
+        pendingPageRequest = signal(null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "pendingPageRequest" }] : /* istanbul ignore next */ []));
         pageFieldDefinitions = computed(() => {
         const config = this.activeConfig();
         const mode = this.formModeDetection().mode;
@@ -3273,22 +2516,71 @@ class FormStateManager {
         }
         return this.createEmptyFormSetup(registry);
     }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "formSetup" }] : /* istanbul ignore next */ []));
+    ...(ngDevMode ? [{ debugName: "formSetup" }] : /* istanbul ignore next */ []));
+        formSetupConfig = computed(() => {
+        const state = this.machine.state();
+        if (isReadyState(state))
+            return state.config;
+        if (isTransitioningState(state)) {
+            if (state.phase === Phase.Restoring && state.pendingFormSetup) {
+                return state.pendingConfig;
+            }
+            return state.currentConfig;
+        }
+        if (state.type === LifecycleState.Initializing)
+            return state.config;
+        if (state.type === LifecycleState.Uninitialized)
+            return this.activeConfig();
+        return undefined;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formSetupConfig" }] : /* istanbul ignore next */ []));
+        activePageState = linkedSignal({ ...(ngDevMode ? { debugName: "activePageState" } : /* istanbul ignore next */ {}), source: this.activeConfig,
+        computation: (config) => ({ config, initialized: false, index: 0 }) });
         defaultValues = linkedSignal(() => this.formSetup().defaultValues, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "defaultValues" }] : /* istanbul ignore next */ []));
         validKeys = computed(() => {
         const schemaFields = this.formSetup().schemaFields;
         if (!schemaFields || schemaFields.length === 0)
             return undefined;
-        return new Set(schemaFields.map((f) => f.key).filter((key) => key !== undefined));
+        const keys = new Set();
+        for (const field of schemaFields) {
+            if (field.key === undefined)
+                continue;
+            keys.add(field.key);
+        }
+        return keys;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "validKeys" }] : /* istanbul ignore next */ []));
-        fieldStateSnapshot = computed(() => {
+        boundValueExclusionEnabled = computed(() => {
+        const setup = this.formSetup();
+        if (!setup.schemaFields || setup.schemaFields.length === 0)
+            return false;
+        const options = this.effectiveFormOptions();
+        return hasEnabledValueExclusion(setup.schemaFields, BOUND_VALUE_EXCLUSION_BASELINE, {
+            excludeValueIfHidden: options.excludeValueIfHidden,
+            excludeValueIfDisabled: options.excludeValueIfDisabled,
+            excludeValueIfReadonly: options.excludeValueIfReadonly,
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "boundValueExclusionEnabled" }] : /* istanbul ignore next */ []));
+        valueExclusionEnabled = computed(() => {
         const setup = this.formSetup();
         if (!setup.schemaFields || setup.schemaFields.length === 0)
+            return false;
+        const options = this.effectiveFormOptions();
+        return hasEnabledValueExclusion(setup.schemaFields, this.valueExclusionDefaults, {
+            excludeValueIfHidden: options.excludeValueIfHidden,
+            excludeValueIfDisabled: options.excludeValueIfDisabled,
+            excludeValueIfReadonly: options.excludeValueIfReadonly,
+        });
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "valueExclusionEnabled" }] : /* istanbul ignore next */ []));
+        fieldStateSnapshot = computed(() => {
+        const schemaFields = this.formSetup().schemaFields;
+        if (!this.formSchemaReady() || !this.boundValueExclusionEnabled() || !schemaFields || schemaFields.length === 0)
             return {};
         const snapshot = {};
-        collectFieldStateSnapshot(setup.schemaFields, asFieldTreeRecord(this.form()), [], snapshot);
+        collectFieldStateSnapshot(schemaFields, asFieldTreeRecord(this.form()), [], snapshot);
         return snapshot;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fieldStateSnapshot" }] : /* istanbul ignore next */ []));
@@ -3296,8 +2588,22 @@ class FormStateManager {
     ...(ngDevMode ? [{ debugName: "excludedValueStore" }] : /* istanbul ignore next */ []));
         prevFieldStateSnapshot = signal({}, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "prevFieldStateSnapshot" }] : /* istanbul ignore next */ []));
+        lastOutwardValue = { current: undefined, pending: false };
+        lastExternalValue = { current: undefined };
+        externalValue = computed(() => {
+        const incoming = this.deps.value();
+        if (this.lastOutwardValue.pending && incoming === this.lastOutwardValue.current) {
+            this.lastOutwardValue.pending = false;
+            return this.lastExternalValue.current;
+        }
+        this.lastOutwardValue.pending = false;
+        this.lastExternalValue.current = incoming;
+        return incoming;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "externalValue" }] : /* istanbul ignore next */ []));
                     entity = linkedSignal(() => {
-        const inputValue = this.deps.value();
+                                                                this.externalValue();
+        const inputValue = untracked(() => this.deps.value());
         const defaults = this.defaultValues();
         const keys = this.validKeys();
         const saved = this.excludedValueStore();
@@ -3317,22 +2623,62 @@ class FormStateManager {
         debugName: 'FormStateManager.entity',
         equal: isEqual,
     });
-        formSchema = computed(() => runInInjectionContext(this.injector, () => {
+        loadFormSchemaService = injectAsync(() => import('./ng-forge-dynamic-forms-form-schema.service-C3cVSmft.mjs'));
+        formSchemaRequest = computed(() => {
         const setup = this.formSetup();
         const config = this.activeConfig();
-        if (!config)
+        if (!config || (!(setup.schemaFields?.length > 0) && !config.schema))
+            return undefined;
+        return {
+            fields: setup.schemaFields ?? [],
+            registry: setup.registry,
+            formLevelSchema: config.schema,
+            validateWhenHidden: this.effectiveFormOptions().validateWhenHidden,
+        };
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formSchemaRequest" }] : /* istanbul ignore next */ []));
+        formSchemaResource = resource({ ...(ngDevMode ? { debugName: "formSchemaResource" } : /* istanbul ignore next */ {}), params: () => this.formSchemaRequest(),
+        loader: async ({ params }) => {
+            const schemaService = await this.loadFormSchemaService();
+                                                return runInInjectionContext(this.injector, () => schemaService.create(params));
+        } });
+        schemaCache = { current: undefined };
+        trackSchemaCache = computed(() => {
+        const request = this.formSchemaRequest();
+        if (!request) {
+            this.schemaCache.current = undefined;
             return undefined;
-        if (setup.schemaFields?.length) {
-            return createSchemaFromFields(setup.schemaFields, setup.registry, {
-                formLevelSchema: config.schema,
-                validateWhenHidden: this.effectiveFormOptions().validateWhenHidden,
-            });
         }
-        if (config.schema) {
-            return createFormLevelSchema(config.schema);
+        if (this.formSchemaResource.status() === 'error') {
+            this.schemaCache.current = undefined;
+            return undefined;
         }
-        return undefined;
-    }), /* @ts-ignore */
+        if (this.formSchemaResource.hasValue()) {
+            this.schemaCache.current = { schema: this.formSchemaResource.value(), request };
+        }
+        return this.schemaCache.current;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "trackSchemaCache" }] : /* istanbul ignore next */ []));
+        isSchemaCurrent = computed(() => {
+        if (this.formSetupConfig() !== this.activeConfig())
+            return false;
+        const request = this.formSchemaRequest();
+        if (!request)
+            return true;
+        return this.trackSchemaCache()?.request === request;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isSchemaCurrent" }] : /* istanbul ignore next */ []));
+        formSchemaReady = computed(() => {
+        if (this.formSetupConfig() !== this.activeConfig())
+            return false;
+        if (!this.formSchemaRequest())
+            return true;
+        if (this.formSchemaResource.status() === 'error')
+            return true;
+        return this.trackSchemaCache() !== undefined;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "formSchemaReady" }] : /* istanbul ignore next */ []));
+        formSchema = computed(() => this.trackSchemaCache()?.schema, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "formSchema" }] : /* istanbul ignore next */ []));
         form = computed(() => {
         const schema = this.formSchema();
@@ -3363,13 +2709,16 @@ class FormStateManager {
     ...(ngDevMode ? [{ debugName: "fieldSignalContext" }] : /* istanbul ignore next */ []));
                     formInstance = computed(() => this.form()(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "formInstance" }] : /* istanbul ignore next */ []));
-        formValue = computed(() => this.formInstance().value(), /* @ts-ignore */
+        modelValue = computed(() => this.formInstance().value(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "modelValue" }] : /* istanbul ignore next */ []));
+        formValue = computed(() => this.modelValue(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "formValue" }] : /* istanbul ignore next */ []));
         filteredFormValue = computed(() => {
-        const rawValue = this.formValue();
+        const rawValue = this.modelValue();
         const setup = this.formSetup();
+        const schemaFields = setup.schemaFields;
         const options = this.effectiveFormOptions();
-        if (!setup.schemaFields || setup.schemaFields.length === 0) {
+        if (!this.formSchemaReady() || !schemaFields || schemaFields.length === 0) {
             return rawValue;
         }
                                 const formTree = this.form();
@@ -3379,14 +2728,15 @@ class FormStateManager {
             excludeValueIfReadonly: options.excludeValueIfReadonly,
         };
                                 const fieldTreeRecord = asFieldTreeRecord(formTree);
-        return filterFormValue(rawValue, setup.schemaFields, fieldTreeRecord, setup.registry, this.valueExclusionDefaults, formOptions);
+        return filterFormValue(rawValue, schemaFields, fieldTreeRecord, setup.registry, this.valueExclusionDefaults, formOptions, this.valueExclusionEnabled());
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "filteredFormValue" }] : /* istanbul ignore next */ []));
         boundFormValue = computed(() => {
-        const rawValue = this.formValue();
+        const rawValue = this.modelValue();
         const setup = this.formSetup();
+        const schemaFields = setup.schemaFields;
         const options = this.effectiveFormOptions();
-        if (!setup.schemaFields || setup.schemaFields.length === 0) {
+        if (!this.formSchemaReady() || !schemaFields || schemaFields.length === 0) {
             return rawValue;
         }
         const formTree = this.form();
@@ -3396,26 +2746,26 @@ class FormStateManager {
             excludeValueIfReadonly: options.excludeValueIfReadonly,
         };
         const fieldTreeRecord = asFieldTreeRecord(formTree);
-        return filterFormValue(rawValue, setup.schemaFields, fieldTreeRecord, setup.registry, BOUND_VALUE_EXCLUSION_BASELINE, formOptions);
+        return filterFormValue(rawValue, schemaFields, fieldTreeRecord, setup.registry, BOUND_VALUE_EXCLUSION_BASELINE, formOptions, this.boundValueExclusionEnabled());
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "boundFormValue" }] : /* istanbul ignore next */ []));
-        valid = computed(() => this.formInstance().valid(), /* @ts-ignore */
+            valid = computed(() => this.formSchemaReady() && this.formSchemaResource.status() !== 'error' && this.formInstance().valid(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "valid" }] : /* istanbul ignore next */ []));
-        invalid = computed(() => this.formInstance().invalid(), /* @ts-ignore */
+        invalid = computed(() => !this.formSchemaReady() || this.formSchemaResource.status() === 'error' || this.formInstance().invalid(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "invalid" }] : /* istanbul ignore next */ []));
-        dirty = computed(() => this.formInstance().dirty(), /* @ts-ignore */
+        dirty = computed(() => this.formSchemaReady() && this.formInstance().dirty(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "dirty" }] : /* istanbul ignore next */ []));
-        touched = computed(() => this.formInstance().touched(), /* @ts-ignore */
+        touched = computed(() => this.formSchemaReady() && this.formInstance().touched(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
-        errors = computed(() => this.formInstance().errors(), /* @ts-ignore */
+        errors = computed(() => (this.formSchemaReady() ? this.formInstance().errors() : []), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
         disabled = computed(() => {
         const optionsDisabled = this.effectiveFormOptions().disabled;
-        const formDisabled = this.formInstance().disabled();
+        const formDisabled = this.formSchemaReady() && this.formInstance().disabled();
         return optionsDisabled ?? formDisabled;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-        submitting = computed(() => this.formInstance().submitting(), /* @ts-ignore */
+        submitting = computed(() => this.formSchemaReady() && this.formInstance().submitting(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "submitting" }] : /* istanbul ignore next */ []));
                     fieldsSource = computed(() => {
         const state = this.machine.state();
@@ -3530,6 +2880,10 @@ class FormStateManager {
         }), takeUntilDestroyed(this.destroyRef));
         this.reset$ = this.eventBus.on('form-reset').pipe(map(() => undefined), takeUntilDestroyed(this.destroyRef));
         this.cleared$ = this.eventBus.on('form-clear').pipe(map(() => undefined), takeUntilDestroyed(this.destroyRef));
+                        this.eventBus
+            .on('go-to-page')
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((event) => this.pendingPageRequest.set({ index: event.pageIndex, options: event.options }));
                 this.machine = createFormStateMachine({
             injector: this.injector,
             destroyRef: this.destroyRef,
@@ -3593,6 +2947,11 @@ class FormStateManager {
         this.eventBus.dispatch(FormSubmitEvent);
     }
                 setupEffects() {
+        explicitEffect([this.formSchemaResource.error], ([error]) => {
+            if (error) {
+                this.logger.error('[Dynamic Forms] Failed to compile the form schema; rendering without validation and blocking submission.', error);
+            }
+        });
         explicitEffect([this.deps.config], ([config]) => {
             this.fieldLoadingErrors.set([]);
             const state = this.machine.currentState;
@@ -3644,17 +3003,24 @@ class FormStateManager {
                         explicitEffect([this.boundFormValue], ([currentBound]) => {
             const currentValue = this.deps.value();
             if (!isEqual(currentBound, currentValue)) {
+                                                                                this.lastOutwardValue.current = currentBound;
+                this.lastOutwardValue.pending = true;
                 this.deps.value.set(currentBound);
             }
         });
-        explicitEffect([this.formConfigValidation], ([validation]) => {
-            if (!validation.isValid) {
-                this.logger.error('Invalid form configuration:', validation.errors);
-            }
-            if (validation.warnings.length > 0) {
-                this.logger.warn('Form configuration warnings:', validation.warnings);
-            }
-        });
+                        if (DEV_MODE) {
+            explicitEffect([this.activeConfig], ([config]) => {
+                if (!config)
+                    return;
+                const validation = FormModeValidator.validateFormConfiguration(config.fields || []);
+                if (!validation.isValid) {
+                    this.logger.error('Invalid form configuration:', validation.errors);
+                }
+                if (validation.warnings.length > 0) {
+                    this.logger.warn('Form configuration warnings:', validation.warnings);
+                }
+            });
+        }
     }
     setupEventHandlers() {
         this.eventBus
@@ -3672,74 +3038,479 @@ class FormStateManager {
                 this.schemaRegistry.registerSchema(schema);
             });
         }
-        if (!customFnConfig) {
-            return;
+        if (!customFnConfig) {
+            return;
+        }
+        if (customFnConfig.customFunctions) {
+            Object.entries(customFnConfig.customFunctions).forEach(([name, fn]) => {
+                this.functionRegistry.registerCustomFunction(name, fn);
+            });
+        }
+        if (customFnConfig.derivations) {
+            this.functionRegistry.setDerivationFunctions(customFnConfig.derivations);
+        }
+        if (customFnConfig.asyncDerivations) {
+            this.functionRegistry.setAsyncDerivationFunctions(customFnConfig.asyncDerivations);
+        }
+        if (customFnConfig.asyncConditions) {
+            this.functionRegistry.setAsyncConditionFunctions(customFnConfig.asyncConditions);
+        }
+        this.functionRegistry.setValidators(customFnConfig.validators);
+        this.functionRegistry.setAsyncValidators(customFnConfig.asyncValidators);
+        this.functionRegistry.setHttpValidators(customFnConfig.httpValidators);
+    }
+    createFormSetupFromConfig(fields, mode, registry) {
+        const normalizedFields = normalizeSimplifiedArrays(fields);
+                                        validateFormConfig(normalizedFields, registry, this.logger);
+                                                                const source = this.deps.source?.() ?? 'inline';
+        const { fields: sanitizedFields, warnings: addonWarnings } = walkAndValidateAddons(normalizedFields, registry, this.addonKindRegistry, source);
+                        if (DEV_MODE) {
+            const nextKeys = new Set();
+            for (const w of addonWarnings) {
+                                                                const key = addonWarningKey(w);
+                nextKeys.add(key);
+                if (!this.lastAddonWarningKeys.has(key)) {
+                    this.logger.warn(formatAddonWarning(w));
+                }
+            }
+            this.lastAddonWarningKeys = nextKeys;
+        }
+        const validatedFields = sanitizedFields;
+        const flattenedFields = this.fieldProcessors.memoizedFlattenFields(validatedFields, registry);
+        const flattenedFieldsForRendering = this.fieldProcessors.memoizedFlattenFieldsForRendering(validatedFields, registry);
+        const fieldsById = this.fieldProcessors.memoizedKeyBy(flattenedFields);
+        const defaultValues = this.fieldProcessors.memoizedDefaultValues(fieldsById, registry);
+        const fieldsToRender = mode === 'paged' ? [] : flattenedFieldsForRendering;
+        return {
+            fields: fieldsToRender,
+            schemaFields: flattenedFields,
+            originalFields: fields,
+            defaultValues,
+            mode,
+            registry,
+        };
+    }
+    createEmptyFormSetup(registry) {
+        return {
+            fields: [],
+            schemaFields: [],
+            defaultValues: {},
+            mode: 'non-paged',
+            registry,
+        };
+    }
+                ngOnDestroy() {
+        this.machine.dispatch({ type: Action.Destroy });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormStateManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormStateManager });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormStateManager, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+
+class PageOrchestratorComponent {
+    eventBus = inject(EventBus);
+    fieldContextRegistry = inject(FieldContextRegistryService);
+    functionRegistry = inject(FunctionRegistryService);
+    formOptions = inject(FORM_OPTIONS, { optional: true });
+    globalPreloadWindow = inject(PAGE_PRELOAD_WINDOW);
+    stateManager = inject(FormStateManager, { optional: true });
+        pendingPageRequest = computed(() => this.stateManager?.pendingPageRequest() ?? null, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "pendingPageRequest" }] : /* istanbul ignore next */ []));
+        schemaCurrent = computed(() => this.stateManager?.isSchemaCurrent() ?? true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "schemaCurrent" }] : /* istanbul ignore next */ []));
+        configScope = computed(() => this.stateManager?.activeConfig(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "configScope" }] : /* istanbul ignore next */ []));
+        pageFields = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "pageFields" }] : /* istanbul ignore next */ []));
+        form = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
+            fieldSignalContext = input.required(/* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "fieldSignalContext" }] : /* istanbul ignore next */ []));
+        pageHiddenStates = computed(() => {
+        const pages = this.pageFields();
+        return pages.map((page) => this.evaluatePageHidden(page));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "pageHiddenStates" }] : /* istanbul ignore next */ []));
+        visiblePageIndices = computed(() => {
+        const hiddenStates = this.pageHiddenStates();
+        return hiddenStates
+            .map((hidden, index) => ({ index, hidden }))
+            .filter((item) => !item.hidden)
+            .map((item) => item.index);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "visiblePageIndices" }] : /* istanbul ignore next */ []));
+        activePageOwnership = linkedSignal({ ...(ngDevMode ? { debugName: "activePageOwnership" } : /* istanbul ignore next */ {}), source: this.configScope,
+        computation: (config, previous) => {
+            const totalPages = this.pageFields().length;
+            if (totalPages === 0)
+                return { config, initialized: true, index: 0 };
+                        return untracked(() => {
+                                                                const owned = this.stateManager?.activePageState();
+                const mayRestore = previous === undefined || previous.source === config;
+                if (mayRestore &&
+                    owned !== undefined &&
+                    owned.config === config &&
+                    owned.initialized &&
+                    owned.index >= 0 &&
+                    owned.index < totalPages) {
+                    return { config, initialized: true, index: owned.index };
+                }
+                if (this.initialPage().validate && !this.schemaCurrent()) {
+                    return { config, initialized: false, index: 0 };
+                }
+                return { config, initialized: true, index: this.resolveInitialLanding() };
+            });
+        } });
+        currentPageIndex = computed(() => this.activePageOwnership().index, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "currentPageIndex" }] : /* istanbul ignore next */ []));
+    setCurrentPageIndex(index) {
+        this.activePageOwnership.update((ownership) => ({ ...ownership, initialized: true, index }));
+    }
+        resolveInitialLanding() {
+        const { index, validate } = this.initialPage();
+        const visible = this.visiblePageIndices();
+        if (index === 0 || visible.length === 0)
+            return 0;
+        const target = visible.includes(index) ? index : this.findNearestVisiblePage(index, visible);
+        if (target <= 0)
+            return Math.max(target, 0);
+        if (!validate)
+            return target;
+        const firstInvalid = visible.filter((i) => i < target).find((i) => !this.isPageValid(i));
+        return firstInvalid ?? target;
+    }
+        initialPage = computed(() => {
+        const raw = this.formOptions?.()?.initialPage;
+        const totalPages = this.pageFields().length;
+        const requested = typeof raw === 'number' ? raw : raw?.index;
+        const validate = typeof raw === 'number' ? false : (raw?.validate ?? false);
+        if (typeof requested !== 'number' || !Number.isFinite(requested) || requested < 0 || totalPages === 0) {
+            return { index: 0, validate: false };
+        }
+        return { index: Math.min(Math.trunc(requested), totalPages - 1), validate };
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initialPage" }] : /* istanbul ignore next */ []));
+        state = computed(() => {
+        const currentIndex = this.currentPageIndex();
+        const totalPages = this.pageFields().length;
+        const visibleIndices = this.visiblePageIndices();
+                const currentVisiblePosition = visibleIndices.indexOf(currentIndex);
+        const isFirstVisiblePage = currentVisiblePosition === 0 || currentVisiblePosition === -1;
+        const isLastVisiblePage = currentVisiblePosition >= visibleIndices.length - 1;
+        return {
+            currentPageIndex: currentIndex,
+            totalPages,
+            isFirstPage: isFirstVisiblePage,
+            isLastPage: isLastVisiblePage,
+        };
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
+                currentPageValid = computed(() => (this.stateManager?.isSchemaCurrent() ?? true) && this.isPageValid(this.currentPageIndex()), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "currentPageValid" }] : /* istanbul ignore next */ []));
+        isPageValid(pageIndex) {
+        const pages = this.pageFields();
+        const form = this.form();
+        if (pageIndex < 0 || pageIndex >= pages.length) {
+            return true;
+        }
+                const leafKeys = collectLeafFieldKeys(pages[pageIndex].fields || []);
+                        for (const fieldKey of leafKeys) {
+            const field = form[fieldKey];
+            if (field && typeof field === 'function') {
+                const fieldState = field();
+                if (fieldState && typeof fieldState.valid === 'function' && !fieldState.valid()) {
+                    return false;
+                }
+            }
+        }
+        return true;
+    }
+        extendedFieldSignalContext = computed(() => ({
+        ...this.fieldSignalContext(),
+        currentPageValid: this.currentPageValid,
+    }), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "extendedFieldSignalContext" }] : /* istanbul ignore next */ []));
+        preloadWindow = computed(() => {
+        const perForm = this.formOptions?.()?.pagePreloadWindow;
+                return clampWindowSize(perForm, this.globalPreloadWindow);
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "preloadWindow" }] : /* istanbul ignore next */ []));
+        pageRenderStates = computed(() => {
+        const activeIndex = this.currentPageIndex();
+        const hiddenStates = this.pageHiddenStates();
+        const preloadWindow = this.preloadWindow();
+        return this.pageFields().map((field, index) => ({
+            field,
+            index,
+            hidden: hiddenStates[index],
+            active: index === activeIndex,
+            preload: index !== activeIndex && Math.abs(index - activeIndex) <= preloadWindow,
+        }));
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "pageRenderStates" }] : /* istanbul ignore next */ []));
+    constructor() {
+                this.setupEventListeners();
+                        explicitEffect([this.schemaCurrent, this.pageFields], ([schemaCurrent]) => {
+            const ownership = this.activePageOwnership();
+            if (!schemaCurrent || ownership.initialized)
+                return;
+            this.activePageOwnership.set({ ...ownership, initialized: true, index: this.resolveInitialLanding() });
+        });
+                explicitEffect([this.state, this.visiblePageIndices], ([state, visibleIndices]) => {
+            const currentVisiblePosition = visibleIndices.indexOf(state.currentPageIndex);
+            if (currentVisiblePosition === -1 && visibleIndices.length > 0) {
+                                const nearest = this.findNearestVisiblePage(state.currentPageIndex, visibleIndices);
+                if (nearest !== -1) {
+                    this.executePageChange(nearest);
+                }
+            }
+        });
+    }
+        navigateToNextPage() {
+                        const disableWhenPageInvalid = this.formOptions?.()?.nextButton?.disableWhenPageInvalid ?? true;
+        if (disableWhenPageInvalid && !this.currentPageValid()) {
+            return {
+                success: false,
+                newPageIndex: this.state().currentPageIndex,
+                error: 'Current page has invalid fields',
+            };
+        }
+        const currentState = this.state();
+        const visibleIndices = this.visiblePageIndices();
+        if (currentState.isLastPage) {
+            return {
+                success: false,
+                newPageIndex: currentState.currentPageIndex,
+                error: 'Already on the last visible page',
+            };
+        }
+                const currentVisiblePosition = visibleIndices.indexOf(currentState.currentPageIndex);
+        if (currentVisiblePosition === -1 || currentVisiblePosition >= visibleIndices.length - 1) {
+            return {
+                success: false,
+                newPageIndex: currentState.currentPageIndex,
+                error: 'No next visible page available',
+            };
+        }
+        const nextVisiblePageIndex = visibleIndices[currentVisiblePosition + 1];
+        return this.executePageChange(nextVisiblePageIndex);
+    }
+        navigateToPreviousPage() {
+        const currentState = this.state();
+        const visibleIndices = this.visiblePageIndices();
+        if (currentState.isFirstPage) {
+            return {
+                success: false,
+                newPageIndex: currentState.currentPageIndex,
+                error: 'Already on the first visible page',
+            };
         }
-        if (customFnConfig.customFunctions) {
-            Object.entries(customFnConfig.customFunctions).forEach(([name, fn]) => {
-                this.functionRegistry.registerCustomFunction(name, fn);
-            });
+                const currentVisiblePosition = visibleIndices.indexOf(currentState.currentPageIndex);
+        if (currentVisiblePosition <= 0) {
+            return {
+                success: false,
+                newPageIndex: currentState.currentPageIndex,
+                error: 'No previous visible page available',
+            };
         }
-        if (customFnConfig.derivations) {
-            this.functionRegistry.setDerivationFunctions(customFnConfig.derivations);
+        const prevVisiblePageIndex = visibleIndices[currentVisiblePosition - 1];
+        return this.executePageChange(prevVisiblePageIndex);
+    }
+        navigateToPage(pageIndex, options) {
+        const currentIndex = this.state().currentPageIndex;
+        const visibleIndices = this.visiblePageIndices();
+                        if (pageIndex <= currentIndex || !visibleIndices.includes(pageIndex)) {
+            return this.executePageChange(pageIndex);
         }
-        if (customFnConfig.asyncDerivations) {
-            this.functionRegistry.setAsyncDerivationFunctions(customFnConfig.asyncDerivations);
+                if (options?.validate === false) {
+            return this.executePageChange(pageIndex);
         }
-        if (customFnConfig.asyncConditions) {
-            this.functionRegistry.setAsyncConditionFunctions(customFnConfig.asyncConditions);
+        const disableWhenPageInvalid = this.formOptions?.()?.nextButton?.disableWhenPageInvalid ?? true;
+        if (!disableWhenPageInvalid) {
+            return this.executePageChange(pageIndex);
         }
-        this.functionRegistry.setValidators(customFnConfig.validators);
-        this.functionRegistry.setAsyncValidators(customFnConfig.asyncValidators);
-        this.functionRegistry.setHttpValidators(customFnConfig.httpValidators);
-    }
-    createFormSetupFromConfig(fields, mode, registry) {
-        const normalizedFields = normalizeSimplifiedArrays(fields);
-                                        validateFormConfig(normalizedFields, registry, this.logger);
-                                                                const source = this.deps.source?.() ?? 'inline';
-        const { fields: sanitizedFields, warnings: addonWarnings } = walkAndValidateAddons(normalizedFields, registry, this.addonKindRegistry, source);
-        const nextKeys = new Set();
-        for (const w of addonWarnings) {
-                                                const key = addonWarningKey(w);
-            nextKeys.add(key);
-            if (!this.lastAddonWarningKeys.has(key)) {
-                this.logger.warn(formatAddonWarning(w));
-            }
+        const crossedPages = visibleIndices.filter((index) => index >= currentIndex && index < pageIndex);
+        const firstInvalidPage = crossedPages.find((index) => !this.isPageValid(index));
+        if (firstInvalidPage === undefined) {
+            return this.executePageChange(pageIndex);
         }
-        this.lastAddonWarningKeys = nextKeys;
-        const validatedFields = sanitizedFields;
-        const flattenedFields = this.fieldProcessors.memoizedFlattenFields(validatedFields, registry);
-        const flattenedFieldsForRendering = this.fieldProcessors.memoizedFlattenFieldsForRendering(validatedFields, registry);
-        const fieldsById = this.fieldProcessors.memoizedKeyBy(flattenedFields);
-        const defaultValues = this.fieldProcessors.memoizedDefaultValues(fieldsById, registry);
-        const fieldsToRender = mode === 'paged' ? [] : flattenedFieldsForRendering;
+                this.executePageChange(firstInvalidPage);
         return {
-            fields: fieldsToRender,
-            schemaFields: flattenedFields,
-            originalFields: fields,
-            defaultValues,
-            mode,
-            registry,
+            success: false,
+            newPageIndex: firstInvalidPage,
+            error: `Cannot navigate to page ${pageIndex}: page ${firstInvalidPage} has invalid fields`,
         };
     }
-    createEmptyFormSetup(registry) {
+        executePageChange(pageIndex) {
+        const currentState = this.state();
+        const totalPages = currentState.totalPages;
+                if (pageIndex < 0 || pageIndex >= totalPages) {
+            return {
+                success: false,
+                newPageIndex: currentState.currentPageIndex,
+                error: `Invalid page index: ${pageIndex}. Valid range is 0 to ${totalPages - 1}`,
+            };
+        }
+                const visibleIndices = this.visiblePageIndices();
+        if (!visibleIndices.includes(pageIndex)) {
+            return {
+                success: false,
+                newPageIndex: currentState.currentPageIndex,
+                error: `Cannot navigate to hidden page at index ${pageIndex}. Visible pages: [${visibleIndices.join(', ')}]`,
+            };
+        }
+                if (pageIndex === currentState.currentPageIndex) {
+            return {
+                success: true,
+                newPageIndex: pageIndex,
+            };
+        }
+                const previousIndex = currentState.currentPageIndex;
+        this.setCurrentPageIndex(pageIndex);
+                this.eventBus.dispatch(PageChangeEvent, pageIndex, totalPages, previousIndex);
         return {
-            fields: [],
-            schemaFields: [],
-            defaultValues: {},
-            mode: 'non-paged',
-            registry,
+            success: true,
+            newPageIndex: pageIndex,
         };
     }
-                ngOnDestroy() {
-        this.machine.dispatch({ type: Action.Destroy });
+        findNearestVisiblePage(currentIndex, visibleIndices) {
+        let nearest = -1;
+        let minDistance = Infinity;
+        for (const idx of visibleIndices) {
+            const distance = Math.abs(idx - currentIndex);
+                        if (distance < minDistance || (distance === minDistance && idx > nearest)) {
+                minDistance = distance;
+                nearest = idx;
+            }
+        }
+        return nearest;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormStateManager, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormStateManager });
+        setupEventListeners() {
+                this.eventBus
+            .on('next-page')
+            .pipe(takeUntilDestroyed())
+            .subscribe(() => {
+            this.navigateToNextPage();
+        });
+                this.eventBus
+            .on('previous-page')
+            .pipe(takeUntilDestroyed())
+            .subscribe(() => {
+            this.navigateToPreviousPage();
+        });
+                                        explicitEffect([this.pendingPageRequest], ([request]) => {
+            if (!request)
+                return;
+            this.stateManager?.pendingPageRequest.set(null);
+            this.navigateToPage(request.index, request.options);
+        });
+        explicitEffect([this.state], ([state]) => this.eventBus.dispatch(PagerStateEvent, state));
+                explicitEffect([this.activePageOwnership], ([ownership]) => this.stateManager?.activePageState.set(ownership));
+    }
+        evaluatePageHidden(page) {
+                if (!page.logic || page.logic.length === 0) {
+            return false;
+        }
+                const hiddenLogic = page.logic.filter((l) => l.type === 'hidden');
+                if (hiddenLogic.length === 0) {
+            return false;
+        }
+                for (const logic of hiddenLogic) {
+                        if (typeof logic.condition === 'boolean') {
+                if (logic.condition) {
+                    return true;
+                }
+                continue;
+            }
+                        const condition = logic.condition;
+            const context = this.fieldContextRegistry.createDisplayOnlyContext(page.key || '', this.functionRegistry.getCustomFunctions());
+            if (evaluateCondition(condition, context)) {
+                return true;
+            }
+        }
+        return false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: PageOrchestratorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: PageOrchestratorComponent, isStandalone: true, selector: "div[page-orchestrator]", inputs: { pageFields: { classPropertyName: "pageFields", publicName: "pageFields", isSignal: true, isRequired: true, transformFunction: null }, form: { classPropertyName: "form", publicName: "form", isSignal: true, isRequired: true, transformFunction: null }, fieldSignalContext: { classPropertyName: "fieldSignalContext", publicName: "fieldSignalContext", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.data-current-page": "state().currentPageIndex", "attr.data-total-pages": "state().totalPages" }, classAttribute: "df-page-orchestrator" }, providers: [
+            {
+                provide: FIELD_SIGNAL_CONTEXT,
+                useFactory: (orchestrator) => orchestrator.extendedFieldSignalContext(),
+                deps: [PageOrchestratorComponent],
+            },
+        ], ngImport: i0, template: `
+    @for (page of pageRenderStates(); track page.field.key) {
+      <!--
+        Skip pages hidden by 'hidden' logic conditions entirely. FormStateManager
+        derives schema/value/validators from config (not from mounted components),
+        so unmounting a hidden page has no effect on form state — only on render +
+        CD cost. This is the page-level equivalent of the existing field-level
+        \`@if (!field.hidden())\` gate in page-field.component.ts.
+      -->
+      @if (!page.hidden) {
+        @if (page.active || page.preload) {
+          @defer (when page.active; on idle) {
+            <section page-field [field]="page.field" [key]="page.field.key" [pageIndex]="page.index" [isVisible]="page.active"></section>
+          } @placeholder {
+            <div class="df-page-placeholder" [attr.data-page-index]="page.index" [attr.data-page-key]="page.field.key"></div>
+          }
+        } @else {
+          <!--
+            Pages outside the preload window remain lightweight placeholders.
+            Form state derives from config, so leaving their components unmounted
+            does not affect validity, derivations, or navigation. The active page
+            renders directly; configured neighbours preload declaratively on idle.
+          -->
+          <div class="df-page-placeholder" [attr.data-page-index]="page.index" [attr.data-page-key]="page.field.key"></div>
+        }
+      }
+    }
+  `, isInline: true, styles: [":host{display:block;position:relative;width:100%}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, deferBlockDependencies: [() => [/* @ts-ignore */
+                import('./ng-forge-dynamic-forms-page-field.component-D16ey8r-.mjs').then(m => m.default)]] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FormStateManager, decorators: [{
-            type: Injectable
-        }], ctorParameters: () => [] });
+i0.ɵɵngDeclareClassMetadataAsync({ minVersion: "18.0.0", version: "22.0.1", ngImport: i0, type: PageOrchestratorComponent, resolveDeferredDeps: () => [/* @ts-ignore */
+        import('./ng-forge-dynamic-forms-page-field.component-D16ey8r-.mjs').then(m => m.default)], resolveMetadata: PageFieldComponent => ({ decorators: [{
+                type: Component,
+                args: [{ selector: 'div[page-orchestrator]', imports: [PageFieldComponent], template: `
+    @for (page of pageRenderStates(); track page.field.key) {
+      <!--
+        Skip pages hidden by 'hidden' logic conditions entirely. FormStateManager
+        derives schema/value/validators from config (not from mounted components),
+        so unmounting a hidden page has no effect on form state — only on render +
+        CD cost. This is the page-level equivalent of the existing field-level
+        \`@if (!field.hidden())\` gate in page-field.component.ts.
+      -->
+      @if (!page.hidden) {
+        @if (page.active || page.preload) {
+          @defer (when page.active; on idle) {
+            <section page-field [field]="page.field" [key]="page.field.key" [pageIndex]="page.index" [isVisible]="page.active"></section>
+          } @placeholder {
+            <div class="df-page-placeholder" [attr.data-page-index]="page.index" [attr.data-page-key]="page.field.key"></div>
+          }
+        } @else {
+          <!--
+            Pages outside the preload window remain lightweight placeholders.
+            Form state derives from config, so leaving their components unmounted
+            does not affect validity, derivations, or navigation. The active page
+            renders directly; configured neighbours preload declaratively on idle.
+          -->
+          <div class="df-page-placeholder" [attr.data-page-index]="page.index" [attr.data-page-key]="page.field.key"></div>
+        }
+      }
+    }
+  `, host: {
+                            class: 'df-page-orchestrator',
+                            '[attr.data-current-page]': 'state().currentPageIndex',
+                            '[attr.data-total-pages]': 'state().totalPages',
+                        }, providers: [
+                            {
+                                provide: FIELD_SIGNAL_CONTEXT,
+                                useFactory: (orchestrator) => orchestrator.extendedFieldSignalContext(),
+                                deps: [PageOrchestratorComponent],
+                            },
+                        ], changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;width:100%}\n"] }]
+            }], ctorParameters: () => [], propDecorators: { pageFields: [{ type: i0.Input, args: [{ isSignal: true, alias: "pageFields", required: true }] }], form: [{ type: i0.Input, args: [{ isSignal: true, alias: "form", required: true }] }], fieldSignalContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldSignalContext", required: true }] }] } }) });
 
 function traverseFieldsWithContext(fields, context, visitor, hooks) {
     for (const field of fields) {
@@ -3818,7 +3589,7 @@ function createDerivationRenderGate() {
         if (!has || engine() !== 'idle')
             return;
         engine.set('loading');
-                pendingTasks.run(() => import('./ng-forge-dynamic-forms-bootstrap-derivation-orchestrator-OBDy6qd9.mjs')
+                pendingTasks.run(() => import('./ng-forge-dynamic-forms-bootstrap-derivation-orchestrator-BfxYqAQA.mjs')
             .then(({ bootstrapDerivationOrchestrator }) => {
             runInInjectionContext(injector, () => bootstrapDerivationOrchestrator());
             engine.set('wired');
@@ -4125,22 +3896,30 @@ class DynamicForm {
         submitting = this.stateManager.submitting;
         fieldLoadingErrors = this.stateManager.fieldLoadingErrors;
                 derivationReady = inject(DERIVATION_RENDER_GATE);
-    shouldRender = computed(() => this.stateManager.shouldRender() && this.derivationReady(), /* @ts-ignore */
+    shouldRender = computed(() => this.stateManager.shouldRender() && this.stateManager.formSchemaReady() && this.derivationReady(), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "shouldRender" }] : /* istanbul ignore next */ []));
         resolvedFields = this.stateManager.resolvedFields;
         fieldWindowing = computed(() => resolveFieldWindowing(this.globalFieldWindowing, this.effectiveFormOptions()?.fieldWindowing), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fieldWindowing" }] : /* istanbul ignore next */ []));
-                    totalComponentsCount = computed(() => {
-        const fields = this.stateManager.formSetup()?.fields ?? [];
-        return countContainersRecursive(fields) + 1;
+                initializedComponents = signal(new Set(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initializedComponents" }] : /* istanbul ignore next */ []));
+    initialPageReady = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "initialPageReady" }] : /* istanbul ignore next */ []));
+    initializationReady = computed(() => {
+        const config = this.activeConfig();
+        if (!config)
+            return false;
+        if (this.formModeDetection().mode === 'paged')
+            return this.initialPageReady();
+        const initialized = this.initializedComponents();
+        const expected = [
+            initializationComponentKey('dynamic-form', this.componentId),
+            ...collectInitializingContainerKeys(config.fields ?? []),
+        ];
+        return expected.every((key) => initialized.has(key));
     }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "totalComponentsCount" }] : /* istanbul ignore next */ []));
-                initialized$ = setupInitializationTracking({
-        eventBus: this.eventBus,
-        totalComponentsCount: this.totalComponentsCount,
-        injector: this.injector,
-        componentId: this.componentId,
-    });
+    ...(ngDevMode ? [{ debugName: "initializationReady" }] : /* istanbul ignore next */ []));
+                    initialized$ = toObservable(this.initializationReady, { injector: this.injector }).pipe(filter((ready) => ready), take(1), shareReplay({ bufferSize: 1, refCount: false }));
                     validityChange = outputFromObservable(toObservable(this.valid));
         dirtyChange = outputFromObservable(toObservable(this.dirty));
         submitted = outputFromObservable(this.stateManager.submitted$);
@@ -4148,9 +3927,27 @@ class DynamicForm {
         cleared = outputFromObservable(this.eventBus.on('form-clear'));
         events = outputFromObservable(this.eventBus.events$);
         initialized = outputFromObservable(this.initialized$);
+        activePageInitialized = outputFromObservable(this.eventBus.on('active-page-initialized'));
         onPageChange = outputFromObservable(this.eventBus.on('page-change'));
         onPageNavigationStateChange = outputFromObservable(this.eventBus.on('pager-state'));
                 constructor() {
+        this.eventBus
+            .on('component-initialized')
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe((event) => {
+            const key = initializationComponentKey(event.componentType, event.componentId);
+            this.initializedComponents.update((current) => {
+                if (current.has(key))
+                    return current;
+                const next = new Set(current);
+                next.add(key);
+                return next;
+            });
+        });
+        this.eventBus
+            .on('active-page-initialized')
+            .pipe(takeUntilDestroyed(this.destroyRef), take(1))
+            .subscribe(() => this.initialPageReady.set(true));
         this.dispatcher?.connect(this.eventBus);
         this.destroyRef.onDestroy(() => this.dispatcher?.disconnect());
                                                         inject(FORM_INITIALIZER, { optional: true });
@@ -4175,8 +3972,8 @@ class DynamicForm {
                 this.eventBus.dispatch(ComponentInitializedEvent, 'dynamic-form', this.componentId);
             }
         });
-                explicitEffect([this.resolvedFields, this.formModeDetection], ([fields, { mode }]) => {
-            if (mode === 'non-paged' && fields.length > 0) {
+                explicitEffect([this.resolvedFields, this.formModeDetection, this.activeConfig], ([, { mode }, config]) => {
+            if (config && mode === 'non-paged') {
                 afterNextRender(() => {
                     this.eventBus.dispatch(ComponentInitializedEvent, 'dynamic-form', this.componentId);
                 }, { injector: this.injector });
@@ -4212,7 +4009,7 @@ class DynamicForm {
         });
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DynamicForm, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DynamicForm, isStandalone: true, selector: "form[dynamic-form]", inputs: { config: { classPropertyName: "config", publicName: "dynamic-form", isSignal: true, isRequired: true, transformFunction: null }, formOptions: { classPropertyName: "formOptions", publicName: "formOptions", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", validityChange: "validityChange", dirtyChange: "dirtyChange", submitted: "submitted", reset: "reset", cleared: "cleared", events: "events", initialized: "initialized", onPageChange: "onPageChange", onPageNavigationStateChange: "onPageNavigationStateChange" }, host: { attributes: { "novalidate": "" }, listeners: { "submit": "onNativeSubmit($event)" }, properties: { "class.disabled": "disabled()", "class.df-form-paged": "formModeDetection().mode === \"paged\"", "class.df-form-non-paged": "formModeDetection().mode === \"non-paged\"", "attr.data-form-mode": "formModeDetection().mode", "attr.id": "idPrefix() || null" }, classAttribute: "df-dynamic-form df-form" }, providers: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DynamicForm, isStandalone: true, selector: "form[dynamic-form]", inputs: { config: { classPropertyName: "config", publicName: "dynamic-form", isSignal: true, isRequired: true, transformFunction: null }, formOptions: { classPropertyName: "formOptions", publicName: "formOptions", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, source: { classPropertyName: "source", publicName: "source", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", validityChange: "validityChange", dirtyChange: "dirtyChange", submitted: "submitted", reset: "reset", cleared: "cleared", events: "events", initialized: "initialized", activePageInitialized: "activePageInitialized", onPageChange: "onPageChange", onPageNavigationStateChange: "onPageNavigationStateChange" }, host: { attributes: { "novalidate": "" }, listeners: { "submit": "onNativeSubmit($event)" }, properties: { "class.disabled": "disabled()", "class.df-form-paged": "formModeDetection().mode === \"paged\"", "class.df-form-non-paged": "formModeDetection().mode === \"non-paged\"", "attr.data-form-mode": "formModeDetection().mode", "attr.id": "idPrefix() || null" }, classAttribute: "df-dynamic-form df-form" }, providers: [
             provideDynamicFormDI(),
             DfFieldTemplateRegistry,
             { provide: DF_FIELD_TEMPLATES, useFactory: () => inject(DfFieldTemplateRegistry).map },
@@ -4224,12 +4021,8 @@ class DynamicForm {
         }
         @case ('non-paged') {
           @for (field of resolvedFields(); track field.key; let i = $index) {
-            <!-- @if + DfFieldOutlet's own renderReady-&-!hidden gate together silence NG01916:
-                 the template @if removes the host from the DOM (Angular's prescribed pattern), and
-                 the directive's gate stops a same-CD-pass mount before [formField] can warn.
-                 Don't dedupe one without the other — see DfFieldOutlet.renderReady. -->
-            @if (!field.hidden()) {
-              @if (windowsField(field, i)) {
+            @if (windowsField(field, i)) {
+              @if (!field.hidden()) {
                 @defer (on viewport) {
                   <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
                 } @placeholder {
@@ -4240,9 +4033,11 @@ class DynamicForm {
                     aria-hidden="true"
                   ></div>
                 }
-              } @else {
-                <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
               }
+            } @else {
+              <!-- DfFieldOutlet owns the hidden gate so an already-mounted field can be detached
+                   and restored without recreating its component and wrapper chain. -->
+              <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
             }
           }
         }
@@ -4263,12 +4058,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
         }
         @case ('non-paged') {
           @for (field of resolvedFields(); track field.key; let i = $index) {
-            <!-- @if + DfFieldOutlet's own renderReady-&-!hidden gate together silence NG01916:
-                 the template @if removes the host from the DOM (Angular's prescribed pattern), and
-                 the directive's gate stops a same-CD-pass mount before [formField] can warn.
-                 Don't dedupe one without the other — see DfFieldOutlet.renderReady. -->
-            @if (!field.hidden()) {
-              @if (windowsField(field, i)) {
+            @if (windowsField(field, i)) {
+              @if (!field.hidden()) {
                 @defer (on viewport) {
                   <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
                 } @placeholder {
@@ -4279,9 +4070,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
                     aria-hidden="true"
                   ></div>
                 }
-              } @else {
-                <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
               }
+            } @else {
+              <!-- DfFieldOutlet owns the hidden gate so an already-mounted field can be detached
+                   and restored without recreating its component and wrapper chain. -->
+              <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
             }
           }
         }
@@ -4303,29 +4096,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
                         '[attr.id]': 'idPrefix() || null',
                         '(submit)': 'onNativeSubmit($event)',
                     }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".df-form{display:grid;grid-template-columns:1fr;gap:var(--df-grid-row-gap, .5rem);width:100%}.df-form>*{grid-column:1/-1}.df-row{display:grid;grid-template-columns:repeat(var(--df-grid-columns, 12),1fr);gap:var(--df-grid-gap, .5rem);align-items:start;width:100%}.df-row>*:not([class*=df-col-]){grid-column:1/-1}.df-col-1{grid-column:span 1}.df-col-2{grid-column:span 2}.df-col-3{grid-column:span 3}.df-col-4{grid-column:span 4}.df-col-5{grid-column:span 5}.df-col-6{grid-column:span 6}.df-col-7{grid-column:span 7}.df-col-8{grid-column:span 8}.df-col-9{grid-column:span 9}.df-col-10{grid-column:span 10}.df-col-11{grid-column:span 11}.df-col-12{grid-column:span 12}.df-col-auto{grid-column:span auto;width:auto}.df-col-full{grid-column:1/-1}.df-col-start-1{grid-column-start:1}.df-col-start-2{grid-column-start:2}.df-col-start-3{grid-column-start:3}.df-col-start-4{grid-column-start:4}.df-col-start-5{grid-column-start:5}.df-col-start-6{grid-column-start:6}.df-col-start-7{grid-column-start:7}.df-col-start-8{grid-column-start:8}.df-col-start-9{grid-column-start:9}.df-col-start-10{grid-column-start:10}.df-col-start-11{grid-column-start:11}.df-col-start-12{grid-column-start:12}.df-col-end-1{grid-column-end:1}.df-col-end-2{grid-column-end:2}.df-col-end-3{grid-column-end:3}.df-col-end-4{grid-column-end:4}.df-col-end-5{grid-column-end:5}.df-col-end-6{grid-column-end:6}.df-col-end-7{grid-column-end:7}.df-col-end-8{grid-column-end:8}.df-col-end-9{grid-column-end:9}.df-col-end-10{grid-column-end:10}.df-col-end-11{grid-column-end:11}.df-col-end-12{grid-column-end:12}.df-col-end-13{grid-column-end:13}@media(max-width:576px){.df-form{--df-grid-gap: var(--df-grid-gap-sm, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-sm, .5rem)}.df-row{grid-template-columns:1fr}.df-row>*{grid-column:1/-1!important}.df-row.df-row-mobile-keep-cols{grid-template-columns:repeat(var(--df-grid-columns, 12),1fr)}.df-row.df-row-mobile-keep-cols>*{grid-column:revert!important}}@media(min-width:577px)and (max-width:768px){.df-form{--df-grid-gap: var(--df-grid-gap-md, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-md, .5rem)}.df-row{--df-grid-columns: 6}.df-col-sm-1{grid-column:span 1}.df-col-sm-2{grid-column:span 2}.df-col-sm-3{grid-column:span 3}.df-col-sm-4{grid-column:span 4}.df-col-sm-5{grid-column:span 5}.df-col-sm-6{grid-column:span 6}.df-col-sm-full{grid-column:1/-1}}@media(min-width:769px)and (max-width:992px){.df-form{--df-grid-gap: var(--df-grid-gap-lg, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-lg, .5rem)}.df-col-md-1{grid-column:span 1}.df-col-md-2{grid-column:span 2}.df-col-md-3{grid-column:span 3}.df-col-md-4{grid-column:span 4}.df-col-md-5{grid-column:span 5}.df-col-md-6{grid-column:span 6}.df-col-md-7{grid-column:span 7}.df-col-md-8{grid-column:span 8}.df-col-md-9{grid-column:span 9}.df-col-md-10{grid-column:span 10}.df-col-md-11{grid-column:span 11}.df-col-md-12{grid-column:span 12}.df-col-md-full{grid-column:1/-1}}@media(min-width:993px){.df-form{--df-grid-gap: var(--df-grid-gap-xl, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-xl, .5rem)}.df-col-lg-1{grid-column:span 1}.df-col-lg-2{grid-column:span 2}.df-col-lg-3{grid-column:span 3}.df-col-lg-4{grid-column:span 4}.df-col-lg-5{grid-column:span 5}.df-col-lg-6{grid-column:span 6}.df-col-lg-7{grid-column:span 7}.df-col-lg-8{grid-column:span 8}.df-col-lg-9{grid-column:span 9}.df-col-lg-10{grid-column:span 10}.df-col-lg-11{grid-column:span 11}.df-col-lg-12{grid-column:span 12}.df-col-lg-full{grid-column:1/-1}}.df-gap-none{--df-grid-gap: 0}.df-gap-xs{--df-grid-gap: .25rem}.df-gap-sm{--df-grid-gap: .5rem}.df-gap-md{--df-grid-gap: 1rem}.df-gap-lg{--df-grid-gap: 1.5rem}.df-gap-xl{--df-grid-gap: 2rem}.df-row-gap-none{--df-grid-row-gap: 0}.df-row-gap-xs{--df-grid-row-gap: .25rem}.df-row-gap-sm{--df-grid-row-gap: .5rem}.df-row-gap-md{--df-grid-row-gap: 1rem}.df-row-gap-lg{--df-grid-row-gap: 1.5rem}.df-row-gap-xl{--df-grid-row-gap: 2rem}.df-field{display:block;width:100%;min-width:0;overflow:hidden;margin:0}.df-group,.df-page{display:block;width:100%}.df-form.disabled,.df-row.disabled,.df-field.disabled{opacity:.6;pointer-events:none}.df-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-sr-only-focusable:focus,.df-sr-only-focusable:active{position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal}.df-live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-form :focus-visible{outline:2px solid var(--df-focus-color, #005fcc);outline-offset:2px}.df-group:focus-within{outline:1px dashed var(--df-focus-color, #005fcc);outline-offset:4px}:host{display:grid;grid-template-columns:1fr;gap:var(--df-grid-row-gap, .5rem);width:100%}:host>*{grid-column:1/-1}:host.df-form-spacing-custom{--df-grid-row-gap: var(--df-form-custom-spacing, 1.5rem)}:host.df-form-gap-none{--df-grid-row-gap: 0}:host.df-form-gap-xs{--df-grid-row-gap: .25rem}:host.df-form-gap-sm{--df-grid-row-gap: .5rem}:host.df-form-gap-md{--df-grid-row-gap: 1rem}:host.df-form-gap-lg{--df-grid-row-gap: 1.5rem}:host.df-form-gap-xl{--df-grid-row-gap: 2rem}:host.df-form-paged{gap:0}.df-field-placeholder{display:block}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "dynamic-form", required: true }] }], formOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "formOptions", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: false }] }], _projectedTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => DfTemplate), { isSignal: true }] }], validityChange: [{ type: i0.Output, args: ["validityChange"] }], dirtyChange: [{ type: i0.Output, args: ["dirtyChange"] }], submitted: [{ type: i0.Output, args: ["submitted"] }], reset: [{ type: i0.Output, args: ["reset"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], events: [{ type: i0.Output, args: ["events"] }], initialized: [{ type: i0.Output, args: ["initialized"] }], onPageChange: [{ type: i0.Output, args: ["onPageChange"] }], onPageNavigationStateChange: [{ type: i0.Output, args: ["onPageNavigationStateChange"] }] } });
-function countContainersRecursive(fields) {
-    let count = 0;
-    for (const field of fields) {
-        if (isContainerField(field)) {
-            count += 1;
-            if (hasChildFields(field)) {
-                const children = field.fields;
-                if (Array.isArray(children)) {
-                    for (const child of children) {
-                        if (Array.isArray(child)) {
-                                                        count += countContainersRecursive(child);
-                        }
-                        else if (child != null && isContainerField(child)) {
-                            count += countContainersRecursive([child]);
-                        }
-                    }
-                }
-            }
-        }
-    }
-    return count;
-}
+        }], ctorParameters: () => [], propDecorators: { config: [{ type: i0.Input, args: [{ isSignal: true, alias: "dynamic-form", required: true }] }], formOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "formOptions", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], source: [{ type: i0.Input, args: [{ isSignal: true, alias: "source", required: false }] }], _projectedTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => DfTemplate), { isSignal: true }] }], validityChange: [{ type: i0.Output, args: ["validityChange"] }], dirtyChange: [{ type: i0.Output, args: ["dirtyChange"] }], submitted: [{ type: i0.Output, args: ["submitted"] }], reset: [{ type: i0.Output, args: ["reset"] }], cleared: [{ type: i0.Output, args: ["cleared"] }], events: [{ type: i0.Output, args: ["events"] }], initialized: [{ type: i0.Output, args: ["initialized"] }], activePageInitialized: [{ type: i0.Output, args: ["activePageInitialized"] }], onPageChange: [{ type: i0.Output, args: ["onPageChange"] }], onPageNavigationStateChange: [{ type: i0.Output, args: ["onPageNavigationStateChange"] }] } });
 
 const BUILT_IN_ADDON_TYPES = [
     {
@@ -4373,28 +4144,28 @@ const DISPLAY_FIELD_TYPES_BASE = {
 const BUILT_IN_FIELDS = [
     {
         name: 'row',
-                                loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-BpeFyhAt.mjs'),
+                                loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-Cj2msZp_.mjs'),
         mapper: rowFieldMapper,
         valueHandling: 'flatten',
         ...CONTAINER_FIELD_TYPES_BASE,
     },
     {
         name: 'group',
-        loadComponent: () => import('./ng-forge-dynamic-forms-group-field.component-BNjYMTqT.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-group-field.component-DN6X506r.mjs'),
         mapper: groupFieldMapper,
         valueHandling: 'include',
         ...CONTAINER_FIELD_TYPES_BASE,
     },
     {
         name: 'array',
-        loadComponent: () => import('./ng-forge-dynamic-forms-array-field.component-D-VWBM-t.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-array-field.component-DK7dAQv7.mjs'),
         mapper: arrayFieldMapper,
         valueHandling: 'include',
         ...CONTAINER_FIELD_TYPES_BASE,
     },
     {
         name: 'page',
-        loadComponent: () => import('./ng-forge-dynamic-forms-page-field.component-B92kLZkH.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-page-field.component-D16ey8r-.mjs'),
         mapper: pageFieldMapper,
         valueHandling: 'flatten',
         ...CONTAINER_FIELD_TYPES_BASE,
@@ -4412,7 +4183,7 @@ const BUILT_IN_FIELDS = [
     },
     {
         name: 'container',
-        loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-BpeFyhAt.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-Cj2msZp_.mjs'),
         mapper: containerFieldMapper,
         valueHandling: 'flatten',
         ...CONTAINER_FIELD_TYPES_BASE,
@@ -4427,6 +4198,11 @@ const BUILT_IN_WRAPPERS = [
         wrapperName: 'row',
         loadComponent: () => import('./ng-forge-dynamic-forms-row-wrapper.component-BBWmqQA_.mjs'),
     },
+    {
+        wrapperName: 'field-errors',
+        loadComponent: () => import('./ng-forge-dynamic-forms-field-errors-wrapper.component-ZdaC4Bit.mjs'),
+        rendersFieldErrors: true,
+    },
 ];
 
 function isDynamicFormFeature(value) {
@@ -4486,7 +4262,8 @@ function provideDynamicForm(...items) {
     const wrapperBundles = items.filter(isWrappersBundle);
     const features = items.filter(isDynamicFormFeature);
     const fields = [...BUILT_IN_FIELDS, ...fieldTypes];
-    const wrappers = [...BUILT_IN_WRAPPERS, ...wrapperTypes, ...wrapperBundles.flatMap((bundle) => bundle.ɵdefinitions)];
+    const customWrappers = [...wrapperTypes, ...wrapperBundles.flatMap((bundle) => bundle.ɵdefinitions)];
+    const wrappers = [...BUILT_IN_WRAPPERS, ...customWrappers];
         const featureProviders = [];
     const hasLoggerFeature = features.some((feature) => feature.ɵkind === 'logger');
     features.forEach((feature) => {
@@ -4501,7 +4278,7 @@ function provideDynamicForm(...items) {
                 const logger = inject(DynamicFormLogger);
                 const registry = new Map();
                                 fields.forEach((fieldType) => {
-                    if (registry.has(fieldType.name)) {
+                                        if (DEV_MODE && registry.has(fieldType.name)) {
                         logger.warn(`Field type "${fieldType.name}" is already registered. Overwriting.`);
                     }
                     registry.set(fieldType.name, fieldType);
@@ -4527,11 +4304,18 @@ function provideDynamicForm(...items) {
             useFactory: () => {
                 const logger = inject(DynamicFormLogger);
                 const registry = new Map();
-                                wrappers.forEach((wrapperType) => {
-                    if (registry.has(wrapperType.wrapperName)) {
-                        logger.warn(`Wrapper type "${wrapperType.wrapperName}" is already registered. Overwriting.`);
+                                                                                const builtInNames = new Set(BUILT_IN_WRAPPERS.map((w) => w.wrapperName));
+                BUILT_IN_WRAPPERS.forEach((wrapperType) => registry.set(wrapperType.wrapperName, wrapperType));
+                                const seenCustom = DEV_MODE ? new Set() : null;
+                customWrappers.forEach((wrapperType) => {
+                    const name = wrapperType.wrapperName;
+                    if (seenCustom) {
+                        if (seenCustom.has(name) && !builtInNames.has(name)) {
+                            logger.warn(`Wrapper type "${name}" is already registered. Overwriting.`);
+                        }
+                        seenCustom.add(name);
                     }
-                    registry.set(wrapperType.wrapperName, wrapperType);
+                    registry.set(name, wrapperType);
                 });
                 return registry;
             },
@@ -4562,7 +4346,7 @@ function provideDynamicForm(...items) {
                     registry.set(def.type, def);
                 }
                 for (const def of contributed) {
-                    if (registry.has(def.type)) {
+                                        if (DEV_MODE && registry.has(def.type)) {
                         logger.warn(`Addon type "${def.type}" is already registered. Overwriting.`);
                     }
                     registry.set(def.type, def);
@@ -4624,6 +4408,13 @@ function withFieldWindowing(config) {
     return createFeature('field-windowing', [{ provide: FIELD_WINDOWING, useValue: resolved }]);
 }
 
+const VALIDATION_EXECUTION_DEFAULTS = new InjectionToken('VALIDATION_EXECUTION_DEFAULTS', {
+    providedIn: 'root',
+    factory: () => ({
+        validateWhenHidden: false,
+    }),
+});
+
 function withValidationExecutionDefaults(config) {
     const resolved = {
         validateWhenHidden: config?.validateWhenHidden ?? false,
@@ -4814,6 +4605,16 @@ function sanitizeFormConfigPure(config, fieldRegistry, typeRegistry, options = {
     return { sanitized: { ...config, fields: fields }, warnings };
 }
 
+class ActivePageInitializedEvent {
+    pageIndex;
+    pageKey;
+    type = 'active-page-initialized';
+    constructor(pageIndex, pageKey) {
+        this.pageIndex = pageIndex;
+        this.pageKey = pageKey;
+    }
+}
+
 class GoToPageEvent {
     pageIndex;
     options;
@@ -4941,5 +4742,5 @@ function arrayEvent(arrayKey) {
 
 
 
-export { withEventFormValue as $, ArrayItemRegistryService as A, BUILT_IN_FIELDS as B, CONTAINER_FIELD_PROCESSORS as C, DfFieldOutlet as D, EventDispatcher as E, FIELD_WINDOWING as F, GoToPageEvent as G, PageChangeEvent as H, InsertArrayItemEvent as I, PagerStateEvent as J, PopArrayItemEvent as K, PrependArrayItemEvent as L, MoveArrayItemEvent as M, NextPageEvent as N, PreviousPageEvent as O, PROPERTY_OVERRIDE_STORE as P, TextAddonComponent as Q, RemoveAtIndexEvent as R, ShiftArrayItemEvent as S, TemplateAddonComponent as T, arrayEvent as U, createWrappers as V, isWrappersBundle as W, provideDynamicForm as X, sanitizeFormConfig as Y, withAddonActions as Z, withCustomAddon as _, isSameWrapperChain as a, withFieldWindowing as a0, withLegacyStatusClasses as a1, withLoggerConfig as a2, withPagePreload as a3, withValidationExecutionDefaults as a4, withValueExclusionDefaults as a5, wrapperProps as a6, createWrapperChainController as b, createFieldResolutionPipe as c, createSchemaFromFields as d, createHiddenSignal as e, createRenderReadySignal as f, getNormalizedArrayMetadata as g, getFieldDefaultValue as h, injectFieldRegistry as i, resolveFieldWindowing as j, DEV_MODE as k, DEFAULT_DEBOUNCE_MS as l, mapFieldToInputs as m, DERIVATION_WARNING_TRACKER as n, FormStateManager as o, DERIVATION_LOG_CONFIG as p, AppendArrayItemEvent as q, resolveWrappers as r, ComponentAddonComponent as s, traverseFieldsWithContext as t, ConsoleLogger as u, DfTemplate as v, DynamicForm as w, FormClearEvent as x, FormResetEvent as y, FormSubmitEvent as z };
-//# sourceMappingURL=ng-forge-dynamic-forms-ng-forge-dynamic-forms-DSXZJHcu.mjs.map
+export { arrayEvent as $, ArrayItemRegistryService as A, BUILT_IN_FIELDS as B, CONTAINER_FIELD_PROCESSORS as C, DfFieldOutlet as D, DfTemplate as E, FIELD_WINDOWING as F, DynamicForm as G, EventDispatcher as H, FormClearEvent as I, FormResetEvent as J, FormSubmitEvent as K, GoToPageEvent as L, InsertArrayItemEvent as M, MoveArrayItemEvent as N, NextPageEvent as O, PROPERTY_OVERRIDE_STORE as P, PageChangeEvent as Q, PagerStateEvent as R, SchemaRegistryService as S, PopArrayItemEvent as T, PrependArrayItemEvent as U, VALIDATION_EXECUTION_DEFAULTS as V, PreviousPageEvent as W, RemoveAtIndexEvent as X, ShiftArrayItemEvent as Y, TemplateAddonComponent as Z, TextAddonComponent as _, createFieldResolutionPipe as a, createWrappers as a0, isWrappersBundle as a1, provideDynamicForm as a2, sanitizeFormConfig as a3, withAddonActions as a4, withCustomAddon as a5, withEventFormValue as a6, withFieldWindowing as a7, withLegacyStatusClasses as a8, withLoggerConfig as a9, withPagePreload as aa, withValidationExecutionDefaults as ab, withValueExclusionDefaults as ac, wrapperProps as ad, isSameWrapperChain as b, computeContainerHostClasses as c, initializationComponentPath as d, createWrapperChainController as e, createHiddenSignal as f, createRenderReadySignal as g, getNormalizedArrayMetadata as h, injectFieldRegistry as i, emitComponentInitialized as j, getFieldDefaultValue as k, resolveFieldWindowing as l, mapFieldToInputs as m, collectInitializingContainerKeys as n, ActivePageInitializedEvent as o, initializationComponentKey as p, DEV_MODE as q, resolveWrappers as r, setupContainerInitEffect as s, traverseFieldsWithContext as t, DERIVATION_WARNING_TRACKER as u, FormStateManager as v, DERIVATION_LOG_CONFIG as w, AppendArrayItemEvent as x, ComponentAddonComponent as y, ConsoleLogger as z };
+//# sourceMappingURL=ng-forge-dynamic-forms-ng-forge-dynamic-forms-DCX7tvaB.mjs.map