@ng-forge/dynamic-forms 1.1.0 → 1.2.0-next.10

package/fesm2022/ng-forge-dynamic-forms-internal.mjs

@@ -1,12 +1,12 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, computed, isSignal, inject, Injector, input, signal, ChangeDetectionStrategy, Component, untracked, Injectable, linkedSignal, resourceFromSnapshots, Pipe } from '@angular/core';
+import { InjectionToken, computed, isSignal, inject, Injector, input, signal, ChangeDetectionStrategy, Component, untracked, Injectable, linkedSignal, resourceFromSnapshots, Pipe, viewChild, ViewContainerRef, Directive, forwardRef } from '@angular/core';
 import { NgComponentOutlet } from '@angular/common';
 import { explicitEffect } from 'ngxtension/explicit-effect';
 import { toSignal, toObservable, rxResource } from '@angular/core/rxjs-interop';
 import { isObservable, defer, combineLatest, pipe, debounceTime, distinctUntilChanged, map, tap, catchError, of, from, startWith, Subject, filter, TimeoutError, throwError } from 'rxjs';
 import { HttpClient } from '@angular/common/http';
-import { email, min, max, minLength, maxLength, pattern, required, validate, validateAsync, validateHttp } from '@angular/forms/signals';
-import { scan, map as map$1, filter as filter$1, take, switchMap, timeout, catchError as catchError$1, shareReplay } from 'rxjs/operators';
+import { switchMap, map as map$1, scan, filter as filter$1, take, timeout, catchError as catchError$1, shareReplay } from 'rxjs/operators';
+import { email, min, max, minLength, maxLength, pattern, required, validateTree, validate, validateAsync, validateHttp } from '@angular/forms/signals';
 
 const ADDON_TYPE_DEFINITIONS = new InjectionToken('ADDON_TYPE_DEFINITIONS');
 
@@ -155,14 +155,14 @@ class DfAddonSlot {
             });
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DfAddonSlot, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: DfAddonSlot, isStandalone: true, selector: "df-addon-slot", inputs: { addon: { classPropertyName: "addon", publicName: "addon", isSignal: true, isRequired: true, transformFunction: null }, fieldInputs: { classPropertyName: "fieldInputs", publicName: "fieldInputs", isSignal: true, isRequired: false, transformFunction: null }, hidden: { classPropertyName: "hidden", publicName: "hidden", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.slot": "slotAttr()", "class": "className()", "style.display": "isHidden() ? \"none\" : null" } }, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: DfAddonSlot, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: DfAddonSlot, isStandalone: true, selector: "df-addon-slot", inputs: { addon: { classPropertyName: "addon", publicName: "addon", isSignal: true, isRequired: true, transformFunction: null }, fieldInputs: { classPropertyName: "fieldInputs", publicName: "fieldInputs", isSignal: true, isRequired: false, transformFunction: null }, hidden: { classPropertyName: "hidden", publicName: "hidden", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.slot": "slotAttr()", "class": "className()", "style.display": "isHidden() ? \"none\" : null" } }, ngImport: i0, template: `
     @if (resolvedComponent(); as cmp) {
       <ng-container *ngComponentOutlet="cmp; inputs: typeInputs()" />
     }
   `, isInline: true, dependencies: [{ kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DfAddonSlot, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: DfAddonSlot, decorators: [{
             type: Component,
             args: [{
                     selector: 'df-addon-slot',
@@ -295,7 +295,11 @@ function hasTargetProperty(config) {
 }
 
 const FORM_VALUE_ACCESS_PATTERN = /\bformValue\s*(?:\.|\[)/;
-const FORM_VALUE_PATTERN = /\bformValue\s*(?:\.([\w.]+)|\[\s*'([\w.-]+)'\s*\]|\[\s*"([\w.-]+)"\s*\])/g;
+const ID_START = String.raw `[\p{ID_Start}$_]`;
+const ID_PART = String.raw `[\p{ID_Continue}$]`;
+const DOTTED_PATH = String.raw `${ID_START}${ID_PART}*(?:\.${ID_START}${ID_PART}*)*`;
+const BRACKET_KEY = String.raw `[\p{ID_Continue}$.\-]+`;
+const FORM_VALUE_PATTERN = new RegExp(String.raw `\bformValue\s*(?:\.(${DOTTED_PATH})|\[\s*'(${BRACKET_KEY})'\s*\]|\[\s*"(${BRACKET_KEY})"\s*\])`, 'gu');
 function isCrossFieldExpression(expr, context) {
         if (expr === undefined || typeof expr === 'boolean' || isFormStateCondition(expr)) {
         return false;
@@ -392,15 +396,6 @@ function hasCrossFieldWhenCondition(config, context) {
     }
     return isCrossFieldExpression(config.when, context);
 }
-function requiresTreeValidation(config) {
-    if (isResourceBasedValidator(config)) {
-        return false;
-    }
-    if (config.type === 'custom') {
-        return isCrossFieldValidator(config);
-    }
-    return isCrossFieldBuiltInValidator(config);
-}
 function isCrossFieldStateLogic(config, context) {
     return isCrossFieldExpression(config.condition, context);
 }
@@ -585,6 +580,8 @@ class ExpressionParserError extends DynamicFormError {
     }
 }
 
+const IDENTIFIER_START = /[\p{ID_Start}$_]/u;
+const IDENTIFIER_PART = /[\p{ID_Continue}$]/u;
 class Tokenizer {
     position = 0;
     expression;
@@ -617,7 +614,7 @@ class Tokenizer {
                 if (/[0-9]/.test(char)) {
             return this.readNumber();
         }
-                if (/[a-zA-Z_$]/.test(char)) {
+                if (IDENTIFIER_START.test(this.codePointAt(this.position))) {
             return this.readIdentifierOrKeyword();
         }
                 return this.readOperatorOrPunctuation();
@@ -676,12 +673,20 @@ class Tokenizer {
     readIdentifierOrKeyword() {
         const start = this.position;
         let value = '';
-        while (this.position < this.expression.length && /[a-zA-Z0-9_$]/.test(this.expression[this.position])) {
-            value += this.expression[this.position];
-            this.position++;
+        while (this.position < this.expression.length) {
+            const char = this.codePointAt(this.position);
+            if (!IDENTIFIER_PART.test(char)) {
+                break;
+            }
+            value += char;
+            this.position += char.length;
         }
                 const type = this.getKeywordType(value);
         return { type, value, position: start };
+    }
+        codePointAt(position) {
+        const codePoint = this.expression.codePointAt(position);
+        return codePoint === undefined ? '' : String.fromCodePoint(codePoint);
     }
     getKeywordType(value) {
         switch (value) {
@@ -1570,6 +1575,54 @@ function safeReadPathKeys(fieldContext) {
     return untracked(() => fieldContext.pathKeys());
 }
 
+function createFieldValueProxy(getRootForm, getRootFormValue) {
+        const resolveAccessor = (key) => {
+        const root = getRootForm();
+        const accessor = root?.[key];
+        return typeof accessor === 'function' ? accessor : undefined;
+    };
+        const readField = (key) => {
+        const accessor = resolveAccessor(key);
+        if (accessor) {
+                        const state = untracked(() => accessor());
+            const valueSig = state && state.value;
+            if (typeof valueSig === 'function') {
+                return { hit: true, value: valueSig() };
+            }
+        }
+        return { hit: false, value: undefined };
+    };
+    return new Proxy({}, {
+        get(_target, prop) {
+            if (typeof prop === 'symbol')
+                return undefined;
+            const { hit, value } = readField(prop);
+            return hit ? value : getRootFormValue()[prop];
+        },
+        has(_target, prop) {
+            if (typeof prop === 'symbol')
+                return false;
+                                                if (resolveAccessor(prop))
+                return true;
+            return prop in getRootFormValue();
+        },
+                ownKeys() {
+            return Reflect.ownKeys(getRootFormValue());
+        },
+        getOwnPropertyDescriptor(_target, prop) {
+            if (typeof prop === 'symbol')
+                return undefined;
+            const whole = getRootFormValue();
+            if (!(prop in whole))
+                return undefined;
+            const { hit, value } = readField(prop);
+            return { value: hit ? value : whole[prop], enumerable: true, configurable: true, writable: false };
+        },
+        set() {
+            return false;         },
+    });
+}
+
 function isChildFieldContext(context) {
     return 'key' in context && isSignal(context.key);
 }
@@ -1580,6 +1633,17 @@ function extractFieldState(fieldContext) {
         return fieldContext.state;
     });
 }
+function navigateArrayItemTree(root, arrayKey, index) {
+    let node = root;
+    for (const segment of arrayKey.split('.')) {
+        if (node == null)
+            return undefined;
+        node = node[segment];
+    }
+    if (node == null)
+        return undefined;
+        return node[index];
+}
 function detectArrayScope(pathKeys) {
         if (pathKeys.length < 3)
         return undefined;
@@ -1693,6 +1757,65 @@ class FieldContextRegistryService {
                 return formFieldStateGetter();
             },
         };
+    }
+        buildReactiveArrayScopedContext(arrayScope, fieldValue, customFunctions, fieldContext) {
+        const { arrayKey, index, localKey } = arrayScope;
+        const rootFormSignal = this.rootFormRegistry.rootForm;
+        const resolveExternalData = () => this.resolveExternalData();
+        const fieldStateGetter = fieldContext ? () => readFieldStateInfo(extractFieldState(fieldContext), true) : () => undefined;
+        const formFieldStateGetter = () => createFormFieldStateMap(rootFormSignal(), true);
+                const hasValidItem = untracked(() => {
+            const arrayData = getNestedValue(this.rootFormRegistry.formValue(), arrayKey);
+            if (!Array.isArray(arrayData) || index < 0 || index >= arrayData.length)
+                return false;
+            const item = arrayData[index];
+            return item != null && typeof item === 'object';
+        });
+        const rootFormValueProxy = createFieldValueProxy(() => rootFormSignal(), () => this.rootFormRegistry.formValue());
+        if (!hasValidItem) {
+            return {
+                fieldValue,
+                formValue: rootFormValueProxy,
+                fieldPath: localKey,
+                customFunctions: customFunctions || {},
+                logger: this.logger,
+                deprecationTracker: this.deprecationTracker ?? undefined,
+                get externalData() {
+                    return resolveExternalData();
+                },
+                get fieldState() {
+                    return fieldStateGetter();
+                },
+                get formFieldState() {
+                    return formFieldStateGetter();
+                },
+            };
+        }
+        const itemFormValueProxy = createFieldValueProxy(() => navigateArrayItemTree(rootFormSignal(), arrayKey, index), () => {
+            const arrayData = getNestedValue(this.rootFormRegistry.formValue(), arrayKey);
+            const item = Array.isArray(arrayData) ? arrayData[index] : undefined;
+            return item != null && typeof item === 'object' ? item : {};
+        });
+        return {
+            fieldValue,
+            formValue: itemFormValueProxy,
+            rootFormValue: rootFormValueProxy,
+            arrayIndex: index,
+            arrayPath: arrayKey,
+            fieldPath: `${arrayKey}.${index}.${localKey}`,
+            customFunctions: customFunctions || {},
+            logger: this.logger,
+            deprecationTracker: this.deprecationTracker ?? undefined,
+            get externalData() {
+                return resolveExternalData();
+            },
+            get fieldState() {
+                return fieldStateGetter();
+            },
+            get formFieldState() {
+                return formFieldStateGetter();
+            },
+        };
     }
         resolveExternalData() {
         const externalDataSignal = this.externalDataSignal;
@@ -1702,29 +1825,48 @@ class FieldContextRegistryService {
         if (!externalDataRecord) {
             return undefined;
         }
-        const resolved = {};
-        for (const [key, value] of Object.entries(externalDataRecord)) {
+        const readKey = (key) => {
+            const value = externalDataRecord[key];
             if (!isSignal(value)) {
                 throw new DynamicFormError(`externalData["${key}"] must be a Signal. Got: ${typeof value}. Wrap it with signal(yourValue).`);
             }
-            resolved[key] = value();
-        }
-        return resolved;
+            return value();
+        };
+        return new Proxy({}, {
+            get(_target, prop) {
+                if (typeof prop === 'symbol' || !(prop in externalDataRecord))
+                    return undefined;
+                return readKey(prop);
+            },
+            has(_target, prop) {
+                return typeof prop === 'string' && prop in externalDataRecord;
+            },
+            ownKeys() {
+                return Reflect.ownKeys(externalDataRecord);
+            },
+            getOwnPropertyDescriptor(_target, prop) {
+                if (typeof prop !== 'string' || !(prop in externalDataRecord))
+                    return undefined;
+                return { value: readKey(prop), enumerable: true, configurable: true, writable: false };
+            },
+            set() {
+                return false;             },
+        });
     }
         createReactiveEvaluationContext(fieldContext, customFunctions) {
         const fieldValue = fieldContext.value();
-        const rootFormValue = this.rootFormRegistry.formValue();
         const pathKeys = safeReadPathKeys(fieldContext);
         const arrayScope = detectArrayScope(pathKeys);
         if (arrayScope) {
-            return this.buildArrayScopedContext(rootFormValue, arrayScope, fieldValue, customFunctions, true, fieldContext);
+            return this.buildReactiveArrayScopedContext(arrayScope, fieldValue, customFunctions, fieldContext);
         }
         const localKey = this.extractFieldPath(fieldContext);
         const rootFormSignal = this.rootFormRegistry.rootForm;
         const resolveExternalData = () => this.resolveExternalData();
+                        const formValueProxy = createFieldValueProxy(() => rootFormSignal(), () => this.rootFormRegistry.formValue());
         return {
             fieldValue,
-            formValue: rootFormValue,
+            formValue: formValueProxy,
             fieldPath: localKey,
             customFunctions: customFunctions || {},
             logger: this.logger,
@@ -1741,15 +1883,15 @@ class FieldContextRegistryService {
         };
     }
         createDisplayOnlyContext(fieldPath, customFunctions, arrayScope) {
-        const rootFormValue = this.rootFormRegistry.formValue();
         if (arrayScope) {
-            return this.buildArrayScopedContext(rootFormValue, arrayScope, undefined, customFunctions, true);
+            return this.buildReactiveArrayScopedContext(arrayScope, undefined, customFunctions);
         }
         const rootFormSignal = this.rootFormRegistry.rootForm;
         const resolveExternalData = () => this.resolveExternalData();
+                        const formValueProxy = createFieldValueProxy(() => rootFormSignal(), () => this.rootFormRegistry.formValue());
         return {
             fieldValue: undefined,
-            formValue: rootFormValue,
+            formValue: formValueProxy,
             fieldPath,
             customFunctions: customFunctions || {},
             logger: this.logger,
@@ -1762,10 +1904,10 @@ class FieldContextRegistryService {
             },
         };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FieldContextRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FieldContextRegistryService });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FieldContextRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FieldContextRegistryService });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FieldContextRegistryService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FieldContextRegistryService, decorators: [{
             type: Injectable
         }] });
 
@@ -1894,10 +2036,10 @@ class FunctionRegistryService {
         this.clearAsyncValidators();
         this.clearHttpValidators();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FunctionRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FunctionRegistryService });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FunctionRegistryService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FunctionRegistryService });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: FunctionRegistryService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FunctionRegistryService, decorators: [{
             type: Injectable
         }] });
 
@@ -2523,6 +2665,187 @@ function injectNonFieldEvaluationContext(fieldDef, options = {}) {
     };
 }
 
+function dynamicTextToObservable(value, injector) {
+    if (value === undefined) {
+        return of('');
+    }
+    if (isObservable(value)) {
+        return value;
+    }
+    if (isSignal(value)) {
+                return untracked(() => toObservable(value, { injector }));
+    }
+    return of(String(value));
+}
+
+const PLACEHOLDER_PATTERN = /\{\{([^{}]*)\}\}/g;
+function interpolateParams(message, error) {
+    const params = extractErrorParams(error);
+                return message.replace(PLACEHOLDER_PATTERN, (placeholder, rawKey) => {
+        const key = rawKey.trim();
+        return Object.hasOwn(params, key) ? safeToString(params[key]) : placeholder;
+    });
+}
+function safeToString(value) {
+    if (value === null || value === undefined) {
+        return '';
+    }
+        if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') {
+        return String(value);
+    }
+        if (value instanceof RegExp) {
+        return value.toString();
+    }
+        if (value instanceof Date) {
+        return value.toISOString();
+    }
+        if (Array.isArray(value)) {
+        return value.join(', ');
+    }
+        try {
+                if (typeof value === 'object' && value.toString !== Object.prototype.toString) {
+            return value.toString();
+        }
+                return JSON.stringify(value);
+    }
+    catch {
+                return '[object]';
+    }
+}
+function extractErrorParams(error) {
+    const params = {};
+        if ('min' in error)
+        params.min = error.min;
+    if ('max' in error)
+        params.max = error.max;
+    if ('pattern' in error)
+        params.pattern = error.pattern;
+    if ('actual' in error)
+        params.actual = error.actual;
+    if ('expected' in error)
+        params.expected = error.expected;
+                    if ('requiredLength' in error) {
+        params.requiredLength = error.requiredLength;
+    }
+    else if ('minLength' in error) {
+                params.requiredLength = error.minLength;
+        params.minLength = error.minLength;
+    }
+    else if ('maxLength' in error) {
+                params.requiredLength = error.maxLength;
+        params.maxLength = error.maxLength;
+    }
+    if ('actualLength' in error)
+        params.actualLength = error.actualLength;
+            Object.keys(error).forEach((key) => {
+        if (key !== 'kind' && !(key in params)) {
+            params[key] = error[key];
+        }
+    });
+    return params;
+}
+
+function createResolvedErrorsSignal(field, validationMessages, defaultValidationMessages = signal(undefined), injector = inject(Injector)) {
+        const logger = injector.get(DynamicFormLogger);
+        const messages = computed(() => validationMessages() ?? {}, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    const defaultMessages = computed(() => defaultValidationMessages() ?? {}, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultMessages" }] : /* istanbul ignore next */ []));
+            const errors = computed(() => field()?.().errors() ?? [], /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
+        const errors$ = toObservable(errors, { injector });
+    const messages$ = toObservable(messages, { injector });
+    const defaultMessages$ = toObservable(defaultMessages, { injector });
+        const resolvedErrors$ = combineLatest([errors$, messages$, defaultMessages$]).pipe(switchMap(([currentErrors, msgs, defaultMsgs]) => {
+                if (!currentErrors || currentErrors.length === 0) {
+            return of([]);
+        }
+                const errorResolvers = currentErrors.map((error) => resolveErrorMessage(error, msgs, defaultMsgs, injector, logger));
+                return errorResolvers.length > 0
+            ? combineLatest(errorResolvers).pipe(map$1((errors) => errors.filter((e) => e !== null)))
+            : of([]);
+    }));
+            return toSignal(resolvedErrors$, { initialValue: [], injector });
+}
+function isMessageResolver(message) {
+    return typeof message === 'function' && !isSignal(message);
+}
+function resolveMessageFunction(resolver, error, logger) {
+    try {
+        return resolver(error) ?? error.message ?? '';
+    }
+    catch (err) {
+        logger.error(`Validation message resolver for error kind "${error.kind}" threw; falling back to error.message.`, err);
+        return error.message ?? '';
+    }
+}
+function resolveErrorMessage(error, fieldMessages, defaultMessages, injector, logger) {
+        const fieldMessage = fieldMessages[error.kind];
+        const defaultMessage = defaultMessages[error.kind];
+        const messageToUse = fieldMessage ?? defaultMessage ?? error.message;
+        if (!messageToUse) {
+        logger.warn(`No validation message found for error kind "${error.kind}". ` +
+            `Please provide a message via field-level validationMessages or form-level defaultValidationMessages.`);
+        return of(null);
+    }
+            const isSchemaMessage = fieldMessage === undefined && defaultMessage === undefined;
+        const messageText = isMessageResolver(messageToUse) ? resolveMessageFunction(messageToUse, error, logger) : messageToUse;
+    const messageObservable = isSchemaMessage
+        ? of(messageToUse)         : dynamicTextToObservable(messageText, injector);
+        return messageObservable.pipe(map$1((msg) => ({
+        kind: error.kind,
+        message: interpolateParams(msg, error),
+    })));
+}
+
+function shouldShowErrors(field) {
+    return computed(() => {
+        const control = field()?.();
+        if (!control)
+            return false;
+        return control.invalid() && control.touched() && control.errors().length > 0;
+    });
+}
+
+const FIELD_ERROR_DISPLAY = new InjectionToken('FIELD_ERROR_DISPLAY');
+function injectFieldErrors(options) {
+    const injector = options.injector ?? inject(Injector);
+    const defaultValidationMessages = inject(DEFAULT_VALIDATION_MESSAGES, { optional: true });
+    const fieldSignalContext = inject(FIELD_SIGNAL_CONTEXT, { optional: true });
+                const fieldState = computed(() => {
+        const inputs = options.fieldInputs();
+        if (!inputs)
+            return undefined;
+        if (inputs.field)
+            return inputs.field;
+        const parentTree = fieldSignalContext?.form;
+        const node = inputs.key ? parentTree?.[inputs.key] : undefined;
+        return node ? node() : undefined;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "fieldState" }] : /* istanbul ignore next */ []));
+            const fieldTree = computed(() => {
+        const state = fieldState();
+        return state ? (() => state) : undefined;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "fieldTree" }] : /* istanbul ignore next */ []));
+    const messages = computed(() => options.validationMessages?.() ?? options.fieldInputs()?.validationMessages, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "messages" }] : /* istanbul ignore next */ []));
+    const errors = createResolvedErrorsSignal(fieldTree, messages, computed(() => defaultValidationMessages?.()), injector);
+    const showErrors = shouldShowErrors(fieldTree);
+    return {
+        errors,
+        showErrors,
+        errorsToDisplay: computed(() => (showErrors() ? errors() : [])),
+        errorId: computed(() => `${options.fieldInputs()?.key ?? ''}-error`),
+    };
+}
+
+function rowError(ctx, index, key, error) {
+                const rows = ctx.fieldTree;
+    const fieldTree = rows?.[index]?.[key];
+    return fieldTree ? { ...error, fieldTree } : error;
+}
+
 function isFunctionHttpValidator(config) {
     const c = config;
     return typeof c.functionName === 'string' || (c.fn !== null && typeof c.fn === 'object');
@@ -2570,9 +2893,9 @@ function createDynamicValueFunction(expression) {
         return cached;
     }
     const fn = (ctx) => {
-                const evaluationContext = fieldContextRegistry.createEvaluationContext(ctx);
+                        const evaluationContext = fieldContextRegistry.createReactiveEvaluationContext(ctx);
         try {
-                        return ExpressionParser.evaluate(expression, evaluationContext);
+                                    return (ExpressionParser.evaluate(expression, evaluationContext) ?? undefined);
         }
         catch (error) {
             logger.error('Error evaluating dynamic expression:', expression, error);
@@ -2634,11 +2957,9 @@ function applyPatternValidator(path, value, expression, when) {
 function createConditionalLogic(when) {
     return when ? createLogicFunction(when) : undefined;
 }
-function applyValidator(config, fieldPath) {
+function applyValidator(config, 
+fieldPath, attachment = 'field') {
     const path = fieldPath;
-    if (requiresTreeValidation(config)) {
-        return;
-    }
     switch (config.type) {
         case 'required':
             required(path, config.when ? { when: createConditionalLogic(config.when) } : undefined);
@@ -2684,7 +3005,7 @@ function applyValidator(config, fieldPath) {
             }
             break;
         case 'custom':
-            applyCustomValidator(config, path);
+            applyCustomValidator(config, path, attachment);
             break;
         case 'async':
             applyAsyncValidator(config, path);
@@ -2694,7 +3015,7 @@ function applyValidator(config, fieldPath) {
             break;
     }
 }
-function applyCustomValidator(config, fieldPath) {
+function applyCustomValidator(config, fieldPath, attachment = 'field') {
     let validatorFn;
     if (config.expression) {
         validatorFn = createExpressionValidator(config);
@@ -2706,11 +3027,16 @@ function applyCustomValidator(config, fieldPath) {
         throw new DynamicFormError('Custom validator requires one of "expression", "functionName", or "fn".');
     }
     const whenLogic = createConditionalLogic(config.when);
-    validate(fieldPath, (ctx) => {
+    const run = (ctx) => {
         if (whenLogic && !whenLogic(ctx))
             return null;
         return validatorFn(ctx);
-    });
+    };
+    if (attachment === 'tree') {
+        validateTree(fieldPath, run);
+        return;
+    }
+    validate(fieldPath, run);
 }
 function createFunctionValidator(config) {
     const logger = inject(DynamicFormLogger);
@@ -2742,7 +3068,7 @@ function createExpressionValidator(config) {
     const functionRegistry = inject(FunctionRegistryService);
     return (ctx) => {
         try {
-            const evaluationContext = fieldContextRegistry.createEvaluationContext(ctx, functionRegistry.getCustomFunctions());
+                                    const evaluationContext = fieldContextRegistry.createReactiveEvaluationContext(ctx, functionRegistry.getCustomFunctions());
             const result = ExpressionParser.evaluate(expression, evaluationContext);
             if (result) {
                 return null;
@@ -2862,8 +3188,9 @@ function applyDeclarativeHttpValidator(config, fieldPath) {
         },
     });
 }
-function applyValidators(configs, fieldPath) {
-    configs.forEach((config) => applyValidator(config, fieldPath));
+function applyValidators(configs, 
+fieldPath, attachment = 'field') {
+    configs.forEach((config) => applyValidator(config, fieldPath, attachment));
 }
 
 function isCheckedField(field) {
@@ -3019,10 +3346,10 @@ class EventBus {
         }
         return this.pipeline$.pipe(filter((event) => event.type === eventType));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: EventBus, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: EventBus });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EventBus, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EventBus });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: EventBus, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: EventBus, decorators: [{
             type: Injectable
         }] });
 
@@ -3079,7 +3406,6 @@ function applyHiddenLogic(inputs, fieldDef, rootFormRegistry, evaluationContext)
             form: rootForm,
             fieldLogic: fieldDef.logic,
             explicitValue: fieldDef.hidden,
-            formValue: rootFormRegistry.formValue(),
             evaluationContext,
         });
     }
@@ -3237,6 +3563,10 @@ const WRAPPER_COMPONENT_CACHE = new InjectionToken('WRAPPER_COMPONENT_CACHE', {
     providedIn: 'root',
     factory: () => new Map(),
 });
+const WRAPPER_COMPONENT_LOAD_CACHE = new InjectionToken('WRAPPER_COMPONENT_LOAD_CACHE', {
+    providedIn: 'root',
+    factory: () => new Map(),
+});
 const WRAPPER_AUTO_ASSOCIATIONS = new InjectionToken('WRAPPER_AUTO_ASSOCIATIONS', {
     providedIn: 'root',
     factory: () => new Map(),
@@ -3350,28 +3680,15 @@ function isDisplayOnlyField(field) {
 }
 
 
-function dynamicTextToObservable(value, injector) {
-    if (value === undefined) {
-        return of('');
-    }
-    if (isObservable(value)) {
-        return value;
-    }
-    if (isSignal(value)) {
-                return untracked(() => toObservable(value, { injector }));
-    }
-    return of(String(value));
-}
-
 class DynamicTextPipe {
     injector = inject(Injector);
         transform(value) {
                 return dynamicTextToObservable(value ?? undefined, this.injector);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DynamicTextPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: DynamicTextPipe, isStandalone: true, name: "dynamicText" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: DynamicTextPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.1.5", ngImport: i0, type: DynamicTextPipe, isStandalone: true, name: "dynamicText" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: DynamicTextPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: DynamicTextPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'dynamicText',
@@ -3424,75 +3741,15 @@ function setupInitializationTracking(options) {
     }), shareReplay({ bufferSize: 1, refCount: false }));
 }
 
-function interpolateParams(message, error) {
-    let result = message;
-    const params = extractErrorParams(error);
-    Object.entries(params).forEach(([key, value]) => {
-        const placeholder = new RegExp(`{{\\s*${key}\\s*}}`, 'g');
-        result = result.replace(placeholder, safeToString(value));
-    });
-    return result;
-}
-function safeToString(value) {
-    if (value === null || value === undefined) {
-        return '';
-    }
-        if (typeof value === 'string' || typeof value === 'number' || typeof value === 'boolean') {
-        return String(value);
-    }
-        if (value instanceof RegExp) {
-        return value.toString();
-    }
-        if (value instanceof Date) {
-        return value.toISOString();
-    }
-        if (Array.isArray(value)) {
-        return value.join(', ');
-    }
-        try {
-                if (typeof value === 'object' && value.toString !== Object.prototype.toString) {
-            return value.toString();
-        }
-                return JSON.stringify(value);
-    }
-    catch {
-                return '[object]';
-    }
-}
-function extractErrorParams(error) {
-    const params = {};
-        if ('min' in error)
-        params.min = error.min;
-    if ('max' in error)
-        params.max = error.max;
-    if ('pattern' in error)
-        params.pattern = error.pattern;
-    if ('actual' in error)
-        params.actual = error.actual;
-    if ('expected' in error)
-        params.expected = error.expected;
-                    if ('requiredLength' in error) {
-        params.requiredLength = error.requiredLength;
-    }
-    else if ('minLength' in error) {
-                params.requiredLength = error.minLength;
-        params.minLength = error.minLength;
-    }
-    else if ('maxLength' in error) {
-                params.requiredLength = error.maxLength;
-        params.maxLength = error.maxLength;
-    }
-    if ('actualLength' in error)
-        params.actualLength = error.actualLength;
-            Object.keys(error).forEach((key) => {
-        if (key !== 'kind' && !(key in params)) {
-            params[key] = error[key];
-        }
-    });
-    return params;
-}
-
 function isEqual(a, b) {
+        if (a === b)
+        return true;
+    if (typeof a === 'number' && typeof b === 'number')
+        return Object.is(a, b);
+    if (a == null || b == null)
+        return false;
+    if (typeof a !== 'object' || typeof b !== 'object')
+        return Object.is(a, b);
     return isEqualInternal(a, b, new WeakMap(), new WeakMap());
 }
 function isEqualInternal(a, b, seenA, seenB) {
@@ -3654,6 +3911,22 @@ function memoize(fn, resolverOrOptions) {
 function normalizeFieldsArray(fields) {
     return Array.isArray(fields) ? [...fields] : Object.values(fields);
 }
+function getChangedKeysWithin(previous, current, keys) {
+    const changed = new Set();
+    if (keys.size === 0)
+        return changed;
+    const before = previous ?? {};
+    const after = current ?? {};
+    for (const key of keys) {
+        const inBefore = key in before;
+        const inAfter = key in after;
+        if (!inBefore && !inAfter)
+            continue;
+        if (inBefore !== inAfter || !isEqual(before[key], after[key]))
+            changed.add(key);
+    }
+    return changed;
+}
 function getChangedKeys(previous, current) {
     const changedKeys = new Set();
         if (!previous && !current)
@@ -3686,7 +3959,29 @@ function createWarningTracker() {
     return { warnedKeys: new Set() };
 }
 
+class FieldErrorsWrapperBase {
+    fieldComponent = viewChild.required('fieldComponent', { ...(ngDevMode ? { debugName: "fieldComponent" } : /* istanbul ignore next */ {}), read: ViewContainerRef });
+        validationMessages = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "validationMessages" }] : /* istanbul ignore next */ []));
+    fieldInputs = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "fieldInputs" }] : /* istanbul ignore next */ []));
+        claimedKey = computed(() => this.fieldInputs()?.key, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "claimedKey" }] : /* istanbul ignore next */ []));
+        ngf = injectFieldErrors({
+        fieldInputs: this.fieldInputs,
+        validationMessages: this.validationMessages,
+    });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FieldErrorsWrapperBase, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "22.1.5", type: FieldErrorsWrapperBase, isStandalone: true, inputs: { validationMessages: { classPropertyName: "validationMessages", publicName: "validationMessages", isSignal: true, isRequired: false, transformFunction: null }, fieldInputs: { classPropertyName: "fieldInputs", publicName: "fieldInputs", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "fieldComponent", first: true, predicate: ["fieldComponent"], descendants: true, read: ViewContainerRef, isSignal: true }], ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: FieldErrorsWrapperBase, decorators: [{
+            type: Directive
+        }], propDecorators: { fieldComponent: [{ type: i0.ViewChild, args: ['fieldComponent', { ...{ read: ViewContainerRef }, isSignal: true }] }], validationMessages: [{ type: i0.Input, args: [{ isSignal: true, alias: "validationMessages", required: false }] }], fieldInputs: [{ type: i0.Input, args: [{ isSignal: true, alias: "fieldInputs", required: false }] }] } });
+function provideFieldErrorDisplay(wrapper) {
+    return { provide: FIELD_ERROR_DISPLAY, useExisting: forwardRef(wrapper) };
+}
+
 
 
-export { ADDON_ACTION_HANDLERS, ADDON_ACTION_REGISTRY, ADDON_TYPE_COMPONENT_CACHE, ADDON_TYPE_DEFINITIONS, ADDON_TYPE_REGISTRY, ARRAY_CONTEXT, AsyncConditionFunctionCacheService, ComponentInitializedEvent, DEFAULT_PROPS, DEFAULT_VALIDATION_MESSAGES, DEFAULT_WRAPPERS, DEPRECATION_WARNING_TRACKER, DF_FIELD_TEMPLATES, DfAddonSlot, DynamicFormError, DynamicFormLogger, DynamicTextPipe, DynamicValueFunctionCacheService, EMIT_FORM_VALUE_ON_EVENTS, EXTERNAL_DATA, EventBus, ExpressionParser, ExpressionParserError, FIELD_REGISTRY, FIELD_SIGNAL_CONTEXT, FORM_ID_PREFIX, FORM_OPTIONS, FieldContextRegistryService, FunctionRegistryService, GROUP_CONTEXT, HTTP_CONDITION_CACHE, HttpConditionCache, HttpConditionFunctionCacheService, INITIALIZATION_TIMEOUT_MS, LogicFunctionCacheService, NoopLogger, READONLY_FIELD_TREE_CACHE, RootFormRegistryService, TokenType, WRAPPER_AUTO_ASSOCIATIONS, WRAPPER_COMPONENT_CACHE, WRAPPER_REGISTRY, applyMetaToElement, applyValidator, applyValidators, arrayFieldMapper, assertNever, baseFieldMapper, buildBaseInputs, buildClassName, compareValues, containerFieldMapper, createAddonActionRegistry, createDebouncedLogicFunction, createDefaultDerivationLogConfig, createDynamicValueFunction, createFormFieldStateMap, createFormStateLogicFunction, createInitializationTracker, createLogicFunction, createWarningTracker, deepMergeDefaults, derivedFromDeferred, detectFormMode, dynamicTextToObservable, evaluateCondition, evaluateNonFieldDisabled, evaluateNonFieldHidden, extractExpressionDependencies, extractStringDependencies, getArrayLength, getChangedKeys, getFieldValueHandling, getGridClassString, getNestedValue, groupFieldMapper, hasChildFields, hasCrossFieldWhenCondition, hasFormValue, hasNestedProperty, hasTargetProperty, injectAddonTypeRegistry, injectFieldSignalContext, injectFieldsSupportingAddons, injectNonFieldEvaluationContext, interpolateParams, isArrayField, isCheckedField, isContainerField, isCrossFieldBuiltInValidator, isCrossFieldExpression, isCrossFieldSchema, isCrossFieldStateLogic, isCrossFieldValidator, isDerivationLogicConfig, isDisplayOnlyField, isEqual, isFieldBoundContext, isFormStateCondition, isFunctionHttpValidator, isGenericContainerField, isGroupField, isHiddenField, isLeafField, isNonPagedForm, isPageField, isPagedForm, isResourceBasedValidator, isRowField, isSimplifiedArrayField, isStateLogicConfig, isValidNonPagedForm, isValidPagedForm, isValueBearingField, isValueField, isWrapperTypeDefinition, keyBy, mapValues, memoize, normalizeFieldsArray, omit, pageFieldMapper, readFieldStateInfo, requiresTreeValidation, resolveDynamicValue, resolveHttpRequest, resolveNextButtonDisabled, resolveNonFieldDisabled, resolveNonFieldHidden, resolveSubmitButtonDisabled, resolveTokens, rowFieldMapper, runPresetAction, setupInitializationTracking, shouldLog, textFieldMapper, toReadonlyFieldTree, toReadonlyFieldTreeCached, validatePageNesting, withPreviousValue, writeToFieldValue };
+export { ADDON_ACTION_HANDLERS, ADDON_ACTION_REGISTRY, ADDON_TYPE_COMPONENT_CACHE, ADDON_TYPE_DEFINITIONS, ADDON_TYPE_REGISTRY, ARRAY_CONTEXT, AsyncConditionFunctionCacheService, ComponentInitializedEvent, DEFAULT_PROPS, DEFAULT_VALIDATION_MESSAGES, DEFAULT_WRAPPERS, DEPRECATION_WARNING_TRACKER, DF_FIELD_TEMPLATES, DfAddonSlot, DynamicFormError, DynamicFormLogger, DynamicTextPipe, DynamicValueFunctionCacheService, EMIT_FORM_VALUE_ON_EVENTS, EXTERNAL_DATA, EventBus, ExpressionParser, ExpressionParserError, FIELD_ERROR_DISPLAY, FIELD_REGISTRY, FIELD_SIGNAL_CONTEXT, FORM_ID_PREFIX, FORM_OPTIONS, FieldContextRegistryService, FieldErrorsWrapperBase, FunctionRegistryService, GROUP_CONTEXT, HTTP_CONDITION_CACHE, HttpConditionCache, HttpConditionFunctionCacheService, INITIALIZATION_TIMEOUT_MS, LogicFunctionCacheService, NoopLogger, READONLY_FIELD_TREE_CACHE, RootFormRegistryService, TokenType, WRAPPER_AUTO_ASSOCIATIONS, WRAPPER_COMPONENT_CACHE, WRAPPER_COMPONENT_LOAD_CACHE, WRAPPER_REGISTRY, applyMetaToElement, applyValidator, applyValidators, arrayFieldMapper, assertNever, baseFieldMapper, buildBaseInputs, buildClassName, compareValues, containerFieldMapper, createAddonActionRegistry, createDebouncedLogicFunction, createDefaultDerivationLogConfig, createDynamicValueFunction, createFieldValueProxy, createFormFieldStateMap, createFormStateLogicFunction, createInitializationTracker, createLogicFunction, createResolvedErrorsSignal, createWarningTracker, deepMergeDefaults, derivedFromDeferred, detectFormMode, dynamicTextToObservable, evaluateCondition, evaluateNonFieldDisabled, evaluateNonFieldHidden, extractExpressionDependencies, extractStringDependencies, getArrayLength, getChangedKeys, getChangedKeysWithin, getFieldValueHandling, getGridClassString, getNestedValue, groupFieldMapper, hasChildFields, hasCrossFieldWhenCondition, hasFormValue, hasNestedProperty, hasTargetProperty, injectAddonTypeRegistry, injectFieldErrors, injectFieldSignalContext, injectFieldsSupportingAddons, injectNonFieldEvaluationContext, interpolateParams, isArrayField, isCheckedField, isContainerField, isCrossFieldBuiltInValidator, isCrossFieldExpression, isCrossFieldSchema, isCrossFieldStateLogic, isCrossFieldValidator, isDerivationLogicConfig, isDisplayOnlyField, isEqual, isFieldBoundContext, isFormStateCondition, isFunctionHttpValidator, isGenericContainerField, isGroupField, isHiddenField, isLeafField, isNonPagedForm, isPageField, isPagedForm, isResourceBasedValidator, isRowField, isSimplifiedArrayField, isStateLogicConfig, isValidNonPagedForm, isValidPagedForm, isValueBearingField, isValueField, isWrapperTypeDefinition, keyBy, mapValues, memoize, normalizeFieldsArray, omit, pageFieldMapper, provideFieldErrorDisplay, readFieldStateInfo, resolveDynamicValue, resolveHttpRequest, resolveNextButtonDisabled, resolveNonFieldDisabled, resolveNonFieldHidden, resolveSubmitButtonDisabled, resolveTokens, rowError, rowFieldMapper, runPresetAction, setupInitializationTracking, shouldLog, shouldShowErrors, textFieldMapper, toReadonlyFieldTree, toReadonlyFieldTreeCached, validatePageNesting, withPreviousValue, writeToFieldValue };
 //# sourceMappingURL=ng-forge-dynamic-forms-internal.mjs.map