@ng-forge/dynamic-forms 1.2.0-next.6 → 1.2.0-next.8

package/fesm2022/{ng-forge-dynamic-forms-ng-forge-dynamic-forms-B2C_WAMP.mjs → ng-forge-dynamic-forms-ng-forge-dynamic-forms-tA8ZkP8i.mjs}

@@ -1,14 +1,132 @@
 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 { InjectionToken, inject, PLATFORM_ID, DestroyRef, Injectable, reflectComponentType, Injector, EnvironmentInjector, computed, signal, afterNextRender, input, ViewContainerRef, Directive, isSignal, runInInjectionContext, untracked, linkedSignal, injectAsync, resource, ChangeDetectionStrategy, Component, PendingTasks, ElementRef, 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 { derivedFrom } from 'ngxtension/derived-from';
+import { of, Observable, distinctUntilChanged, forkJoin, from, catchError, map, switchMap, pipe, isObservable, firstValueFrom, exhaustMap, EMPTY, scan, Subject, concatMap, filter, take, shareReplay } from 'rxjs';
+import { DynamicFormLogger, WRAPPER_COMPONENT_LOAD_CACHE, 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, FORM_OPTIONS, GROUP_CONTEXT, FIELD_REGISTRY, DynamicFormError, isContainerField, isSimplifiedArrayField, getFieldValueHandling, keyBy, mapValues, isEqual, isDerivationLogicConfig, hasTargetProperty, ARRAY_CONTEXT, FORM_ID_PREFIX, baseFieldMapper, detectFormMode, validatePageNesting, assertNever, FunctionRegistryService, ADDON_TYPE_REGISTRY, deepMergeDefaults, FIELD_SIGNAL_CONTEXT, derivedFromDeferred, FieldContextRegistryService, 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 { isPlatformBrowser, AsyncPipe, NgTemplateOutlet, NgComponentOutlet } from '@angular/common';
+import { takeUntilDestroyed, toObservable, outputFromObservable } from '@angular/core/rxjs-interop';
+import { submit, form, provideSignalFormsConfig } from '@angular/forms/signals';
 import { NG_STATUS_CLASSES } from '@angular/forms/signals/compat';
 
+const FIELD_WINDOWING = new InjectionToken('FIELD_WINDOWING', {
+    providedIn: 'root',
+    factory: () => ({ enabled: false, eager: 12, placeholderHeight: '4rem', park: { enabled: false, margin: '100%' } }),
+});
+
+function clampWindowSize(value, fallback) {
+    if (value === undefined || !Number.isFinite(value))
+        return fallback;
+    return Math.max(0, Math.floor(value));
+}
+
+const DEFAULT_MARGIN = '100%';
+const ROOT_MARGIN_PART = /^[+-]?(?:\d+(?:\.\d*)?|\.\d+)(?:e[+-]?\d+)?(?:px|%)$/i;
+function normalizeFieldParkingMargin(value, fallback = DEFAULT_MARGIN) {
+    const normalizedFallback = isValidRootMargin(fallback) ? fallback.trim() : DEFAULT_MARGIN;
+    if (!value || !isValidRootMargin(value))
+        return normalizedFallback;
+    return value.trim().split(/\s+/).join(' ');
+}
+function isValidRootMargin(value) {
+    const parts = value.trim().split(/\s+/);
+    return parts.length >= 1 && parts.length <= 4 && parts.every((part) => ROOT_MARGIN_PART.test(part));
+}
+
+function resolveFieldWindowing(global, perForm) {
+    if (perForm === undefined) {
+        return global;
+    }
+    if (typeof perForm === 'boolean') {
+        return { ...global, enabled: perForm };
+    }
+    const configuresMounting = 'eager' in perForm || 'placeholderHeight' in perForm || Object.keys(perForm).length === 0;
+    return {
+        enabled: configuresMounting ? true : global.enabled,
+        eager: clampWindowSize(perForm.eager, global.eager),
+        placeholderHeight: perForm.placeholderHeight ?? global.placeholderHeight,
+        park: resolveFieldParking(global.park, perForm.park),
+    };
+}
+function resolveFieldParking(global, perForm) {
+    if (perForm === undefined)
+        return global;
+    if (typeof perForm === 'boolean')
+        return { ...global, enabled: perForm };
+    return { enabled: true, margin: normalizeFieldParkingMargin(perForm.margin, global.margin) };
+}
+
+const ALWAYS_VISIBLE = of(true);
+class FieldViewportObserver {
+    isBrowser = isPlatformBrowser(inject(PLATFORM_ID)) && typeof IntersectionObserver !== 'undefined';
+    observers = new Map();
+    constructor() {
+        inject(DestroyRef).onDestroy(() => {
+            for (const { observer } of this.observers.values())
+                observer.disconnect();
+            this.observers.clear();
+        });
+    }
+    observe(el, rootMargin) {
+        if (!this.isBrowser)
+            return ALWAYS_VISIBLE;
+        rootMargin = normalizeFieldParkingMargin(rootMargin);
+        return new Observable((subscriber) => {
+            const listener = (visible) => subscriber.next(visible);
+            this.startObserving(el, rootMargin, listener);
+                        subscriber.next(true);
+            return () => this.stopObserving(el, rootMargin, listener);
+        }).pipe(distinctUntilChanged());
+    }
+    startObserving(el, rootMargin, listener) {
+        const entry = this.observerFor(rootMargin);
+        const listeners = entry.listeners.get(el);
+        if (listeners) {
+            listeners.add(listener);
+            return;
+        }
+        entry.listeners.set(el, new Set([listener]));
+        entry.observer.observe(el);
+    }
+    stopObserving(el, rootMargin, listener) {
+        const entry = this.observers.get(rootMargin);
+        if (!entry)
+            return;
+        const listeners = entry.listeners.get(el);
+        if (!listeners)
+            return;
+        listeners.delete(listener);
+        if (listeners.size > 0)
+            return;
+        entry.observer.unobserve(el);
+        entry.listeners.delete(el);
+        if (entry.listeners.size > 0)
+            return;
+        entry.observer.disconnect();
+        this.observers.delete(rootMargin);
+    }
+    observerFor(rootMargin) {
+        const existing = this.observers.get(rootMargin);
+        if (existing)
+            return existing;
+        const listeners = new Map();
+        const observer = new IntersectionObserver((entries) => {
+            for (const entry of entries) {
+                for (const listener of listeners.get(entry.target) ?? [])
+                    listener(entry.isIntersecting);
+            }
+        }, { rootMargin });
+        const entry = { observer, listeners };
+        this.observers.set(rootMargin, entry);
+        return entry;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FieldViewportObserver, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FieldViewportObserver });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FieldViewportObserver, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+
 const EMPTY_WRAPPERS = Object.freeze([]);
 const FIELD_ERRORS_WRAPPER = 'field-errors';
 const FIELD_ERRORS_CONFIG = Object.freeze({ type: FIELD_ERRORS_WRAPPER });
@@ -45,6 +163,8 @@ function needsErrorWrapper(field, composed, wrapperRegistry) {
     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);
@@ -66,24 +186,33 @@ function hasDefaultExport(value) {
 function resolveDefaultExport(result) {
     return hasDefaultExport(result) ? result.default : result;
 }
-async function loadWrapperComponent(type, registry, cache) {
+async function loadWrapperComponent(type, registry, cache, loadCache) {
     const cached = cache.get(type);
     if (cached)
         return cached;
+    const pending = loadCache?.get(type);
+    if (pending)
+        return pending;
     const definition = registry.get(type);
     if (!definition)
         return undefined;
-    const component = resolveDefaultExport(await definition.loadComponent());
-    if (component)
-        cache.set(type, component);
-    return component;
-}
-function loadWrapperComponents(configs, registry, cache, logger) {
+    const load = (async () => {
+        const component = resolveDefaultExport(await definition.loadComponent());
+        if (component)
+            cache.set(type, component);
+        return component;
+    })().finally(() => loadCache?.delete(type));
+    loadCache?.set(type, load);
+    return load;
+}
+function loadWrapperComponents(configs, registry, cache, logger, loadCache) {
     if (configs.length === 0)
         return of([]);
-    return forkJoin(configs.map((config) => from(loadWrapperComponent(config.type, registry, cache)).pipe(catchError(() => of(undefined)), map((component) => {
+    return forkJoin(configs.map((config) => from(loadWrapperComponent(config.type, registry, cache, loadCache)).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 };
@@ -123,9 +252,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;
@@ -167,27 +298,34 @@ 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 {
         registry: inject(WRAPPER_REGISTRY),
         cache: inject(WRAPPER_COMPONENT_CACHE),
+        loadCache: inject(WRAPPER_COMPONENT_LOAD_CACHE),
         logger: inject(DynamicFormLogger),
         destroyRef: inject(DestroyRef),
         environmentInjector: inject(EnvironmentInjector),
@@ -211,16 +349,27 @@ function resolveLoadedWrappers(state, deps) {
                         const loaded = state.wrappers.map((config) => ({ config, component: deps.cache.get(config.type) }));
         return of({ state, loaded });
     }
-    return loadWrapperComponents(state.wrappers, deps.registry, deps.cache, deps.logger).pipe(map((loaded) => ({ state, loaded })));
+    return loadWrapperComponents(state.wrappers, deps.registry, deps.cache, deps.logger, deps.loadCache).pipe(map((loaded) => ({ state, loaded })));
 }
 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;
     }
@@ -278,14 +427,19 @@ class FieldComponentSlot {
     state = signal(EMPTY_STATE, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
         lastInputs = null;
+        _parked = signal(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "_parked" }] : /* istanbul ignore next */ []));
         phase = () => this.state().phase;
         snapshot = () => this.state();
+        parked = this._parked.asReadonly();
         mountOrReuse(slot, component, fieldInjector, environmentInjector, rawInputs, fieldInputs) {
         const current = this.state();
         if (current.phase !== 'empty' && current.ref.componentType === component) {
             slot.insert(current.ref.hostView);
             this.lastInputs = null;
             this.state.set(Object.freeze({ phase: 'mounted', ref: current.ref, slot }));
+                                    if (this._parked())
+                current.ref.changeDetectorRef.detach();
             this.pushInputs(rawInputs, fieldInputs);
             if (current.phase === 'detached')
                 this.replayFocus(current.focusSnapshot);
@@ -294,6 +448,7 @@ class FieldComponentSlot {
                                         if (current.phase !== 'empty')
             current.ref.destroy();
         this.lastInputs = null;
+                        this._parked.set(false);
         this.state.set(EMPTY_STATE);
         const ref = slot.createComponent(component, {
             environmentInjector,
@@ -322,19 +477,42 @@ 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;
+    }
+        park() {
+        const current = this.state();
+        if (current.phase === 'empty' || this._parked())
+            return;
+        current.ref.changeDetectorRef.detach();
+        this._parked.set(true);
+    }
+        refresh() {
+        const current = this.state();
+        if (current.phase === 'empty' || !this._parked())
+            return;
+        current.ref.changeDetectorRef.detectChanges();
+    }
+        unpark() {
+        const current = this.state();
+        if (current.phase === 'empty' || !this._parked())
+            return;
+        current.ref.changeDetectorRef.reattach();
+        current.ref.changeDetectorRef.markForCheck();
+        this._parked.set(false);
     }
         destroyOnTeardown() {
         const current = this.state();
         if (current.phase === 'detached')
             current.ref.destroy();
         this.lastInputs = null;
+        this._parked.set(false);
         this.state.set(EMPTY_STATE);
     }
     captureFocus(ref) {
@@ -359,6 +537,100 @@ 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);
+        }
+    });
+}
+
+const EMPTY_ERRORS = Object.freeze([]);
+function snapshotParkedDomState(fieldTree) {
+    const state = fieldTree?.();
+    if (!state)
+        return null;
+    return {
+        disabled: state.disabled?.() ?? false,
+        readonly: state.readonly?.() ?? false,
+        required: state.required?.() ?? false,
+        touched: state.touched?.() ?? false,
+        dirty: state.dirty?.() ?? false,
+        errors: state.errors?.() ?? EMPTY_ERRORS,
+    };
+}
+function isSameParkedDomState(a, b) {
+    return (a === b ||
+        (a !== null &&
+            b !== null &&
+            a.disabled === b.disabled &&
+            a.readonly === b.readonly &&
+            a.required === b.required &&
+            a.touched === b.touched &&
+            a.dirty === b.dirty &&
+            a.errors === b.errors));
+}
+
 class DfFieldOutlet {
             dfFieldOutlet = input.required(/* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "dfFieldOutlet" }] : /* istanbul ignore next */ []));
@@ -371,23 +643,50 @@ class DfFieldOutlet {
     wrapperRegistry = inject(WRAPPER_REGISTRY);
     defaultWrappersSignal = inject(DEFAULT_WRAPPERS, { optional: true });
     readonlyFieldCache = inject(READONLY_FIELD_TREE_CACHE);
-        fieldComponent = new FieldComponentSlot();
+    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, 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 */
+    fieldEnvInjector = computed(() => this.dfFieldOutletEnvironmentInjector() ?? this.defaultEnvInjector, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fieldEnvInjector" }] : /* istanbul ignore next */ []));
-        fieldInjector = computed(() => this.dfFieldOutlet().injector, /* @ts-ignore */
+    fieldInjector = computed(() => this.dfFieldOutlet().injector, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "fieldInjector" }] : /* istanbul ignore next */ []));
         outermostHostClasses = computed(() => getGridClassString(this.dfFieldOutlet().fieldDef) || undefined, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "outermostHostClasses" }] : /* istanbul ignore next */ []));
+    formOptions = inject(FORM_OPTIONS, { optional: true });
+    globalFieldWindowing = inject(FIELD_WINDOWING);
+    viewportObserver = inject(FieldViewportObserver, { optional: true });
+    parking = computed(() => resolveFieldWindowing(this.globalFieldWindowing, this.formOptions?.()?.fieldWindowing).park, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "parking" }] : /* istanbul ignore next */ []));
+        observedElement = computed(() => {
+        const state = this.fieldComponent.snapshot();
+        return state.phase === 'empty' ? null : state.ref.location.nativeElement;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "observedElement" }] : /* istanbul ignore next */ []));
+    visibility = derivedFrom([this.observedElement, this.parking], pipe(switchMap(([element, parking]) => {
+        const observer = this.viewportObserver;
+        return parking.enabled && element && observer ? observer.observe(element, parking.margin) : of(true);
+    })), { initialValue: true });
+    focusEpoch = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "focusEpoch" }] : /* istanbul ignore next */ []));
+    parked = computed(() => this.parking().enabled && !this.visibility(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "parked" }] : /* istanbul ignore next */ []));
+    fieldTree = computed(() => {
+        const candidate = this.rawInputs()['field'];
+        return typeof candidate === 'function' ? candidate : undefined;
+    }, { ...(ngDevMode ? { debugName: "fieldTree" } : /* istanbul ignore next */ {}), equal: Object.is });
+        parkedDomState = computed(() => (this.parked() ? snapshotParkedDomState(this.fieldTree()) : null), { ...(ngDevMode ? { debugName: "parkedDomState" } : /* istanbul ignore next */ {}), equal: isSameParkedDomState });
     constructor() {
         createWrapperChainController({
             vcr: this.vcr,
@@ -403,8 +702,50 @@ class DfFieldOutlet {
                 this.fieldComponent.mountOrReuse(slot, resolved.component, resolved.injector, this.fieldEnvInjector(), this.rawInputs(), this.fieldInputs());
             },
         });
-                                        explicitEffect([this.rawInputs, this.fieldInputs], ([rawInputs, fieldInputs]) => this.fieldComponent.pushInputs(rawInputs, fieldInputs));
+                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);
+            }
+        });
+                explicitEffect([this.observedElement, this.parking], ([element, parking], onCleanup) => {
+            if (!parking.enabled || !element)
+                return;
+                        const bumpEpoch = () => queueMicrotask(() => {
+                if (!this.destroyRef.destroyed)
+                    this.focusEpoch.update((n) => n + 1);
+            });
+            element.addEventListener('focusin', bumpEpoch);
+            element.addEventListener('focusout', bumpEpoch);
+            onCleanup(() => {
+                element.removeEventListener('focusin', bumpEpoch);
+                element.removeEventListener('focusout', bumpEpoch);
+            });
+        });
+                explicitEffect([this.parked, this.focusEpoch, this.parkedDomState], ([parked, , domState]) => {
+            if (parked && this.canPark(domState)) {
+                const alreadyParked = this.fieldComponent.parked();
+                this.fieldComponent.park();
+                if (alreadyParked)
+                    this.fieldComponent.refresh();
+            }
+            else {
+                this.fieldComponent.unpark();
+            }
+        });
         this.destroyRef.onDestroy(() => this.fieldComponent.destroyOnTeardown());
+    }
+        canPark(domState) {
+        const element = this.observedElement();
+        if (!element)
+            return false;
+        if (element.contains(document.activeElement))
+            return false;
+        return (domState?.errors.length ?? 0) === 0;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DfFieldOutlet, deps: [], target: i0.ɵɵFactoryTarget.Directive });
     static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.1", type: DfFieldOutlet, isStandalone: true, selector: "[dfFieldOutlet]", inputs: { dfFieldOutlet: { classPropertyName: "dfFieldOutlet", publicName: "dfFieldOutlet", isSignal: true, isRequired: true, transformFunction: null }, dfFieldOutletEnvironmentInjector: { classPropertyName: "dfFieldOutletEnvironmentInjector", publicName: "dfFieldOutletEnvironmentInjector", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 });
@@ -450,455 +791,91 @@ class FormSubmitEvent {
     type = 'submit';
 }
 
-class PageChangeEvent {
-    currentPageIndex;
-    totalPages;
-    previousPageIndex;
-    type = 'page-change';
-    constructor(
-        currentPageIndex, 
-        totalPages, 
-        previousPageIndex) {
-        this.currentPageIndex = currentPageIndex;
-        this.totalPages = totalPages;
-        this.previousPageIndex = previousPageIndex;
-    }
-}
-
-class PagerStateEvent {
-    state;
-    type = 'pager-state';
-    constructor(state) {
-        this.state = state;
-    }
-}
-
-const PAGE_PRELOAD_WINDOW = new InjectionToken('PAGE_PRELOAD_WINDOW', {
+const COMPONENT_CACHE = new InjectionToken('COMPONENT_CACHE', {
     providedIn: 'root',
-    factory: () => 1,
+    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);
+        },
+                hasType(name) {
+            return registry.has(name);
+        },
+                async loadTypeComponent(name) {
+            const fieldType = registry.get(name);
+            if (!fieldType) {
+                throw new DynamicFormError(`Field type "${name}" is not registered`);
+            }
+                        if (!fieldType.loadComponent) {
+                return undefined;
+            }
+                        const cached = componentCache.get(name);
+            if (cached) {
+                return cached;
+            }
+            const pending = componentLoadCache.get(name);
+            if (pending) {
+                return pending;
+            }
+            try {
+                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}`);
+            }
+        },
+                getLoadedComponent(name) {
+            return componentCache.get(name);
+        },
+                getTypes() {
+            return Array.from(registry.values());
+        },
+                registerTypes(types) {
+            types.forEach((type) => {
+                registry.set(type.name, type);
+            });
+        },
+                get raw() {
+            return registry;
+        },
+    };
+}
 
-function clampWindowSize(value, fallback) {
-    if (value === undefined || !Number.isFinite(value))
-        return fallback;
-    return Math.max(0, Math.floor(value));
+const NORMALIZED_ARRAY_METADATA = Symbol('normalizedArrayMetadata');
+function setNormalizedArrayMetadata(arrayField, metadata) {
+    arrayField[NORMALIZED_ARRAY_METADATA] = metadata;
+}
+function getNormalizedArrayMetadata(arrayField) {
+    return arrayField[NORMALIZED_ARRAY_METADATA];
 }
 
-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;
-        }
-                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 */ []));
-        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',
-            };
-        }
-                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',
-            };
-        }
-                const currentVisiblePosition = visibleIndices.indexOf(currentState.currentPageIndex);
-        if (currentVisiblePosition <= 0) {
-            return {
-                success: false,
-                newPageIndex: currentState.currentPageIndex,
-                error: 'No previous visible page available',
-            };
-        }
-        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 (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-CwH22lRl.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-CwH22lRl.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) }];
+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);
@@ -1034,6 +1011,128 @@ function buildRemoveButton(config) {
     };
 }
 
+function collectFieldDefs(fields, out = []) {
+    for (const field of fields ?? []) {
+        out.push(field);
+        const children = field.fields;
+        if (Array.isArray(children)) {
+                        for (const child of children) {
+                if (Array.isArray(child))
+                    collectFieldDefs(child, out);
+                else
+                    collectFieldDefs([child], out);
+            }
+        }
+        const metadata = getNormalizedArrayMetadata(field);
+        const template = metadata?.template;
+        if (Array.isArray(template))
+            collectFieldDefs(template, out);
+        else if (template)
+            collectFieldDefs([template], out);
+        if (metadata?.autoRemoveButton)
+            collectFieldDefs([metadata.autoRemoveButton], out);
+    }
+    return out;
+}
+function injectFormComponentPreloader() {
+    const fieldRegistry = injectFieldRegistry();
+    const wrapperRegistry = inject(WRAPPER_REGISTRY);
+    const wrapperCache = inject(WRAPPER_COMPONENT_CACHE);
+    const wrapperLoadCache = inject(WRAPPER_COMPONENT_LOAD_CACHE);
+    const autoAssociations = inject(WRAPPER_AUTO_ASSOCIATIONS);
+    const defaultWrappers = inject(DEFAULT_WRAPPERS, { optional: true });
+    const preloadedConfigs = new WeakSet();
+    const preloadedFieldRoots = new WeakSet();
+    const preloadFields = (fields) => {
+        const unseenFields = fields.filter((field) => {
+            if (preloadedFieldRoots.has(field))
+                return false;
+            preloadedFieldRoots.add(field);
+            return true;
+        });
+        if (unseenFields.length === 0)
+            return;
+        const normalizedFields = normalizeSimplifiedArrays(unseenFields);
+        const defs = collectFieldDefs(normalizedFields);
+        if (defs.length === 0)
+            return;
+        const fieldTypes = new Set();
+        const wrapperTypes = new Set();
+        for (const def of defs) {
+            if (def.type)
+                fieldTypes.add(def.type);
+                                                for (const wrapper of resolveWrappers(def, defaultWrappers?.(), autoAssociations, wrapperRegistry)) {
+                wrapperTypes.add(wrapper.type);
+            }
+        }
+        const started = [];
+        for (const type of fieldTypes) {
+            if (fieldRegistry.getLoadedComponent(type))
+                continue;
+            started.push(Promise.resolve(fieldRegistry.loadTypeComponent(type)).catch(() => undefined));
+        }
+        for (const type of wrapperTypes) {
+            if (wrapperCache.has(type))
+                continue;
+            started.push(loadWrapperComponent(type, wrapperRegistry, wrapperCache, wrapperLoadCache).catch(() => undefined));
+        }
+                void Promise.allSettled(started);
+    };
+    return {
+        preloadConfig: (config) => {
+            if (preloadedConfigs.has(config))
+                return;
+            preloadedConfigs.add(config);
+            const fields = config.fields;
+                                                if (fields.length > 0 && fields.every(isPageField))
+                return;
+            preloadFields(fields);
+        },
+        preloadFields,
+    };
+}
+
+class PageChangeEvent {
+    currentPageIndex;
+    totalPages;
+    previousPageIndex;
+    type = 'page-change';
+    constructor(
+        currentPageIndex, 
+        totalPages, 
+        previousPageIndex) {
+        this.currentPageIndex = currentPageIndex;
+        this.totalPages = totalPages;
+        this.previousPageIndex = previousPageIndex;
+    }
+}
+
+class PagerStateEvent {
+    state;
+    type = 'pager-state';
+    constructor(state) {
+        this.state = state;
+    }
+}
+
+const PAGE_PRELOAD_WINDOW = new InjectionToken('PAGE_PRELOAD_WINDOW', {
+    providedIn: 'root',
+    factory: () => 1,
+});
+
+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;
+}
+
 function createSlot() {
     let counter = 0;
     const templates = new Map();
@@ -1129,498 +1228,82 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
             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;
-                let ancestorRequired = ownContext.ancestorRequired;
-    if (fieldDef.required !== undefined && fieldDef.required !== ancestorRequired) {
-        ancestorRequired = fieldDef.required;
-        mutated = true;
-    }
-    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,
-        ancestorRequired,
-    };
-}
-
-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;
+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 {
-        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);
-        applyContainerValidators(fieldDef, fieldPath, descendantContext);
-        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, context);
-        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);
-                }
-            }
-        }
+        ...child,
+        ...(hasInheritedState
+            ? { inheritedExclusionState: { hidden: inheritedHidden, disabled: inheritedDisabled, readonly: inheritedReadonly } }
+            : {}),
+                excludeValueIfHidden: child.excludeValueIfHidden ?? container.excludeValueIfHidden,
+        excludeValueIfDisabled: child.excludeValueIfDisabled ?? container.excludeValueIfDisabled,
+        excludeValueIfReadonly: child.excludeValueIfReadonly ?? container.excludeValueIfReadonly,
     };
-    applyHiddenGatedValidation(path, context, applyValidation);
-}
-function applyHiddenGatedValidation(path, context, apply) {
-    if (context.validateWhenHidden) {
-        apply(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) => apply(subPath)));
-}
-function applyContainerValidators(fieldDef, fieldPath, context) {
-    const validators = fieldDef.validators;
-    if (!validators || validators.length === 0)
-        return;
-    applyHiddenGatedValidation(fieldPath, context, (validationPath) => {
-        for (const config of validators) {
-            applyValidator(config, validationPath, 'tree');
-        }
-    });
-}
-function applySimpleValidationRules(fieldDef, path, context) {
-                const declaresRequiredLogic = fieldDef.logic?.some(isValidationStateLogic) ?? false;
-    if (fieldDef.required ?? (declaresRequiredLogic ? false : context.ancestorRequired)) {
-        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);
-    }
-    applyContainerValidators(arrayField, fieldPath, context);
-        let itemDefinitions = arrayField.fields;
-                    if (!itemDefinitions || itemDefinitions.length === 0) {
-        const metadataTemplate = getNormalizedArrayMetadata(arrayField)?.template;
-        if (metadataTemplate) {
-            itemDefinitions = [
-                Array.isArray(metadataTemplate) ? [...metadataTemplate] : metadataTemplate,
-            ];
-        }
-    }
-            if (!itemDefinitions || itemDefinitions.length === 0) {
-        const emptyItemSchema = schema(() => {
-                    });
-        applyEach(fieldPath, emptyItemSchema);
-        return;
-    }
-        let hasPrimitiveItems = false;
-    const allObjectFields = [];
-    for (const itemDef of itemDefinitions) {
-        if (Array.isArray(itemDef)) {
-                        collectFieldsFromObjectItem(itemDef, allObjectFields);
+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 (isPageField(itemDef) ||
-            isRowField(itemDef) ||
-            isGenericContainerField(itemDef)) {
-                                                collectFieldsFromObjectItem([itemDef], allObjectFields);
+        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 {
-                        hasPrimitiveItems = true;
+        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++}`,
+            });
         }
-    }
-        if (hasPrimitiveItems && allObjectFields.length === 0) {
-        const primitiveItemSchema = schema(() => {
-                    });
-        applyEach(fieldPath, primitiveItemSchema);
-        return;
-    }
-            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;
-                if (groupKey) {
-                                        const groupPath = pathRecord[groupKey];
-                    if (groupPath) {
-                        mapFieldToForm(templateField, groupPath, context);
-                    }
-                }
-                else {
-                                        const groupOwn = resolveFieldOwnContext(templateField, context);
-                    mapContainerChildren(templateField.fields, itemPath, resolveDescendantContext(templateField, groupOwn));
-                }
-            }
-            else {
-                                const fieldKey = templateField.key;
-                if (fieldKey) {
-                    const fieldPathForKey = pathRecord[fieldKey];
-                    if (fieldPathForKey) {
-                        mapFieldToForm(templateField, fieldPathForKey, context);
-                    }
+        else if (isArrayField(field)) {
+                                                                                                            const flattenedItemTemplates = field.fields.map((itemDef) => {
+                if (!Array.isArray(itemDef)) {
+                                        const flattened = flattenFields([itemDef], registry, options);
+                    return flattened[0];
                 }
-            }
-        }
-    });
-    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);
-            }
+                                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) {
@@ -1726,160 +1409,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) => {
@@ -2314,60 +1843,6 @@ function isValidFormConfiguration(fields) {
     return FormModeValidator.validateFormConfiguration(fields).isValid;
 }
 
-const COMPONENT_CACHE = new InjectionToken('COMPONENT_CACHE', {
-    providedIn: 'root',
-    factory: () => new Map(),
-});
-function injectFieldRegistry() {
-    const registry = inject(FIELD_REGISTRY);
-    const componentCache = inject(COMPONENT_CACHE);
-    return {
-                getType(name) {
-            return registry.get(name);
-        },
-                hasType(name) {
-            return registry.has(name);
-        },
-                async loadTypeComponent(name) {
-            const fieldType = registry.get(name);
-            if (!fieldType) {
-                throw new DynamicFormError(`Field type "${name}" is not registered`);
-            }
-                        if (!fieldType.loadComponent) {
-                return undefined;
-            }
-                        const cached = componentCache.get(name);
-            if (cached) {
-                return cached;
-            }
-            try {
-                const component = resolveDefaultExport(await fieldType.loadComponent());
-                if (component) {
-                    componentCache.set(name, component);
-                }
-                return component;
-            }
-            catch (error) {
-                throw new DynamicFormError(`Failed to load component for field type "${name}": ${error}`);
-            }
-        },
-                getLoadedComponent(name) {
-            return componentCache.get(name);
-        },
-                getTypes() {
-            return Array.from(registry.values());
-        },
-                registerTypes(types) {
-            types.forEach((type) => {
-                registry.set(type.name, type);
-            });
-        },
-                get raw() {
-            return registry;
-        },
-    };
-}
-
 function collectFieldData(fields, data, registry, pathPrefix, collectKeys = true) {
     for (const field of fields) {
                                 const valueHandling = field.type ? getFieldValueHandling(field.type, registry) : 'include';
@@ -2414,7 +1889,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) {
@@ -2430,7 +1907,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) {
@@ -2446,9 +1925,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) {
@@ -2478,12 +1959,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]
@@ -2698,6 +2182,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;
@@ -2715,7 +2226,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;
@@ -2751,7 +2265,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;
@@ -3064,7 +2578,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.');
         }
@@ -3127,7 +2641,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);
@@ -3269,13 +2783,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 || {};
@@ -3283,6 +2790,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;
@@ -3320,21 +2829,70 @@ class FormStateManager {
         return this.createEmptyFormSetup(registry);
     }, /* @ts-ignore */
     ...(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 */ []));
@@ -3342,8 +2900,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();
@@ -3363,22 +2935,62 @@ class FormStateManager {
         debugName: 'FormStateManager.entity',
         equal: isEqual,
     });
-        formSchema = computed(() => runInInjectionContext(this.injector, () => {
+        loadFormSchemaService = injectAsync(() => import('./ng-forge-dynamic-forms-form-schema.service-BzbBv-r0.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();
@@ -3409,13 +3021,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();
@@ -3425,14 +3040,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();
@@ -3442,26 +3058,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();
@@ -3576,6 +3192,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,
@@ -3639,6 +3259,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;
@@ -3690,17 +3315,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
@@ -3721,71 +3353,480 @@ class FormStateManager {
         if (!customFnConfig) {
             return;
         }
-        if (customFnConfig.customFunctions) {
-            Object.entries(customFnConfig.customFunctions).forEach(([name, fn]) => {
-                this.functionRegistry.registerCustomFunction(name, fn);
-            });
+        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();
+                                const preloader = injectFormComponentPreloader();
+        explicitEffect([this.pageRenderStates], ([states]) => {
+            preloader.preloadFields(states.filter((page) => !page.hidden && (page.active || page.preload)).map((page) => page.field));
+        });
+                        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',
+            };
+        }
+                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-DCdBvJ-h.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-DCdBvJ-h.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) {
@@ -3864,7 +3905,7 @@ function createDerivationRenderGate() {
         if (!has || engine() !== 'idle')
             return;
         engine.set('loading');
-                pendingTasks.run(() => import('./ng-forge-dynamic-forms-bootstrap-derivation-orchestrator-CNCeWAeJ.mjs')
+                pendingTasks.run(() => import('./ng-forge-dynamic-forms-bootstrap-derivation-orchestrator-BB8jAcY4.mjs')
             .then(({ bootstrapDerivationOrchestrator }) => {
             runInInjectionContext(injector, () => bootstrapDerivationOrchestrator());
             engine.set('wired');
@@ -4024,6 +4065,7 @@ function coreProviders() {
             deps: [FormStateManager],
         },
                         FormIdPrefixService,
+                        FieldViewportObserver,
         {
             provide: FORM_ID_PREFIX,
             useFactory: (svc) => svc.prefix,
@@ -4112,25 +4154,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImpor
             type: Injectable
         }] });
 
-const FIELD_WINDOWING = new InjectionToken('FIELD_WINDOWING', {
-    providedIn: 'root',
-    factory: () => ({ enabled: false, eager: 12, placeholderHeight: '4rem' }),
-});
-
-function resolveFieldWindowing(global, perForm) {
-    if (perForm === undefined) {
-        return global;
-    }
-    if (typeof perForm === 'boolean') {
-        return { ...global, enabled: perForm };
-    }
-    return {
-        enabled: true,
-        eager: clampWindowSize(perForm.eager, global.eager),
-        placeholderHeight: perForm.placeholderHeight ?? global.placeholderHeight,
-    };
-}
-
 class DynamicForm {
                     config = input.required({ ...(ngDevMode ? { debugName: "config" } : /* istanbul ignore next */ {}), alias: 'dynamic-form' });
         formOptions = input(undefined, /* @ts-ignore */
@@ -4171,22 +4194,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$);
@@ -4194,12 +4225,32 @@ 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 });
+                                                const preload = injectFormComponentPreloader();
+        explicitEffect([this.config], ([config]) => preload.preloadConfig(config));
         this.setupEffects();
         this.setupEventHandlers();
     }
@@ -4221,8 +4272,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 });
@@ -4258,7 +4309,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 },
@@ -4270,12 +4321,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 {
@@ -4286,9 +4333,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" />
             }
           }
         }
@@ -4309,12 +4358,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 {
@@ -4325,9 +4370,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" />
             }
           }
         }
@@ -4349,29 +4396,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 = [
     {
@@ -4419,28 +4444,28 @@ const DISPLAY_FIELD_TYPES_BASE = {
 const BUILT_IN_FIELDS = [
     {
         name: 'row',
-                                loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-ByGdzAsk.mjs'),
+                                loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-DfQ0y-77.mjs'),
         mapper: rowFieldMapper,
         valueHandling: 'flatten',
         ...CONTAINER_FIELD_TYPES_BASE,
     },
     {
         name: 'group',
-        loadComponent: () => import('./ng-forge-dynamic-forms-group-field.component-DnLZdj8v.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-group-field.component-DxHD5I8E.mjs'),
         mapper: groupFieldMapper,
         valueHandling: 'include',
         ...CONTAINER_FIELD_TYPES_BASE,
     },
     {
         name: 'array',
-        loadComponent: () => import('./ng-forge-dynamic-forms-array-field.component-NTHLPjau.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-array-field.component-6yyDriVB.mjs'),
         mapper: arrayFieldMapper,
         valueHandling: 'include',
         ...CONTAINER_FIELD_TYPES_BASE,
     },
     {
         name: 'page',
-        loadComponent: () => import('./ng-forge-dynamic-forms-page-field.component-CwH22lRl.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-page-field.component-DCdBvJ-h.mjs'),
         mapper: pageFieldMapper,
         valueHandling: 'flatten',
         ...CONTAINER_FIELD_TYPES_BASE,
@@ -4458,7 +4483,7 @@ const BUILT_IN_FIELDS = [
     },
     {
         name: 'container',
-        loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-ByGdzAsk.mjs'),
+        loadComponent: () => import('./ng-forge-dynamic-forms-container-field.component-DfQ0y-77.mjs'),
         mapper: containerFieldMapper,
         valueHandling: 'flatten',
         ...CONTAINER_FIELD_TYPES_BASE,
@@ -4553,7 +4578,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);
@@ -4581,13 +4606,15 @@ function provideDynamicForm(...items) {
                 const registry = new Map();
                                                                                 const builtInNames = new Set(BUILT_IN_WRAPPERS.map((w) => w.wrapperName));
                 BUILT_IN_WRAPPERS.forEach((wrapperType) => registry.set(wrapperType.wrapperName, wrapperType));
-                const seenCustom = new Set();
+                                const seenCustom = DEV_MODE ? new Set() : null;
                 customWrappers.forEach((wrapperType) => {
                     const name = wrapperType.wrapperName;
-                    if (seenCustom.has(name) && !builtInNames.has(name)) {
-                        logger.warn(`Wrapper type "${name}" is already registered. Overwriting.`);
+                    if (seenCustom) {
+                        if (seenCustom.has(name) && !builtInNames.has(name)) {
+                            logger.warn(`Wrapper type "${name}" is already registered. Overwriting.`);
+                        }
+                        seenCustom.add(name);
                     }
-                    seenCustom.add(name);
                     registry.set(name, wrapperType);
                 });
                 return registry;
@@ -4619,7 +4646,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);
@@ -4677,10 +4704,18 @@ function withFieldWindowing(config) {
         enabled: true,
         eager: clampWindowSize(config?.eager, 12),
         placeholderHeight: config?.placeholderHeight ?? '4rem',
+        park: resolveFieldParking({ enabled: true, margin: '100%' }, config?.park),
     };
     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,
@@ -4871,6 +4906,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;
@@ -4998,5 +5043,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-B2C_WAMP.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-tA8ZkP8i.mjs.map