@ngx-formbar/core 1.0.0 → 2.0.0-next.1

package/fesm2022/ngx-formbar-core.mjs

@@ -1,244 +1,56 @@
 import * as i0 from '@angular/core';
-import { inject, Injectable, InjectionToken, ViewContainerRef, input, computed, effect, Directive, Component, signal, makeEnvironmentProviders, untracked } from '@angular/core';
-import { ControlContainer, Validators, FormGroup, FormControl } from '@angular/forms';
-import { toSignal } from '@angular/core/rxjs-interop';
+import { InjectionToken, inject, Injectable, signal, computed, effect, untracked } from '@angular/core';
 import * as acorn from 'acorn';
 
-class FormService {
-    controlContainer = inject(ControlContainer);
-    formGroup = this.controlContainer.control;
-    formValue = toSignal(this.formGroup.valueChanges);
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: FormService, decorators: [{
-            type: Injectable
-        }] });
-
-/**
- * Provides the parent ControlContainer to child components
- *
- * This provider configuration allows child form components to access their parent's
- * ControlContainer through dependency injection. This is particularly useful for
- * creating nested form components that inherit the parent form context without
- * explicitly passing FormGroup instances.
- *
- * @remarks
- * The `skipSelf` option ensures the provider looks for the ControlContainer in parent
- * components rather than trying to resolve it from the component where this is used.
- *
- * @example
- * ```typescript
- * @Component({
- *   selector: 'app-child-form',
- *   template: '...',
- *   viewProviders: [controlContainerViewProviders]
- * })
- * export class ChildFormComponent {
- *   // Now this component can access the parent form
- *   private controlContainer = inject(ControlContainer);
- *
- *   get parentFormGroup() {
- *     return this.parentContainer.control as FormGroup | null;
- *   }
- * }
- */
-const controlContainerViewProviders = [
-    {
-        provide: ControlContainer,
-        useFactory: () => inject(ControlContainer, { skipSelf: true }),
-    },
-];
-
-const NGX_FW_COMPONENT_RESOLVER = new InjectionToken('NGX_FW_COMPONENT_RESOLVER');
-
-/**
- * Structural directive that renders the appropriate component based on the control's type.
- *
- * This directive acts as a dynamic renderer for form controls, blocks, and groups.
- * It works by:
- * 1. Receiving a content configuration and name
- * 2. Looking up the registered component for the content's type
- * 3. Creating an instance of that component and binding the content and name to it
- *
- * This allows forms to be composed declaratively through configuration objects
- * rather than explicit templates.
- *
- * @example
- * ```html
- * <!-- Used with ngFor to render a list of controls -->
- * @for (control of controls(); track control[0]) {
- *   <ng-template *ngxfbAbstractControl="control" />
- * }
- *
- * <!-- Used directly with a specific control -->
- * <ng-template *ngxfbAbstractControl="['name', nameControlConfig]" />
- * ```
- */
-class NgxfbAbstractControlDirective {
-    viewContainerRef = inject(ViewContainerRef);
-    /**
-     * Service for component registration
-     * Provides access to component type mappings
-     */
-    contentRegistrationService = inject(NGX_FW_COMPONENT_RESOLVER);
-    /**
-     * Required input for control configuration
-     * Defines properties like type, validation, and other control-specific settings
-     */
-    content = input.required({
-        alias: 'ngxfbAbstractControl',
-    });
-    controlName = computed(() => this.content()[0]);
-    controlConfig = computed(() => this.content()[1]);
-    /**
-     * Registration map of component types
-     * Maps control types to component implementations
-     */
-    registrations = this.contentRegistrationService.registrations;
-    /**
-     * Computed component type based on content.type
-     * Looks up the component implementation from registrations map
-     */
-    component = computed(() => {
-        const registrations = this.registrations();
-        const content = this.controlConfig();
-        const component = registrations.get(content.type);
-        return component ?? null;
-    });
-    constructor() {
-        effect(() => {
-            const component = this.component();
-            this.viewContainerRef.clear();
-            if (component) {
-                const componentRef = this.viewContainerRef.createComponent(component);
-                componentRef.setInput('content', this.controlConfig());
-                componentRef.setInput('name', this.controlName());
-            }
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbAbstractControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: NgxfbAbstractControlDirective, isStandalone: true, selector: "[ngxfbAbstractControl]", inputs: { content: { classPropertyName: "content", publicName: "ngxfbAbstractControl", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbAbstractControlDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ngxfbAbstractControl]',
-                }]
-        }], ctorParameters: () => [] });
-
-/**
- * Ngx Formbar Form Component
- *
- * This component serves as the main container for Ngx Formbar forms:
- * - Takes a form configuration
- * - Establishes the form context through FormService provider
- * - Renders each content item using NgxfbAbstractControlDirective
- * - Handles component registration and dependency injection
- *
- * The component acts as the root element for declarative form creation,
- * processing the form content configuration and rendering the appropriate
- * components for each control defined in the configuration.
- */
-class NgxfbFormComponent {
-    /**
-     * Required input containing form configuration
-     */
-    formConfig = input.required();
-    /**
-     * Computed value containing form content
-     */
-    formContent = computed(() => Object.entries(this.formConfig().content));
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: NgxfbFormComponent, isStandalone: true, selector: "ngxfb-form", inputs: { formConfig: { classPropertyName: "formConfig", publicName: "formConfig", isSignal: true, isRequired: true, transformFunction: null } }, providers: [FormService], ngImport: i0, template: "@for (content of formContent(); track content[0]) {\n  <ng-template *ngxfbAbstractControl=\"content\" />\n}\n", dependencies: [{ kind: "directive", type: NgxfbAbstractControlDirective, selector: "[ngxfbAbstractControl]", inputs: ["ngxfbAbstractControl"] }], viewProviders: [controlContainerViewProviders] });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbFormComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ngxfb-form', imports: [NgxfbAbstractControlDirective], providers: [FormService], viewProviders: [controlContainerViewProviders], template: "@for (content of formContent(); track content[0]) {\n  <ng-template *ngxfbAbstractControl=\"content\" />\n}\n" }]
-        }] });
-
-/**
- * Type helper to make it easier to use formbar.config.ts
- * accepts a direct {@link FormbarConfig} object
- */
-function defineFormbarConfig(config) {
-    return config;
-}
-
 const NGX_FW_COMPONENT_REGISTRATIONS = new InjectionToken('NGX_FW_COMPONENT_REGISTRATIONS', {
     providedIn: 'root',
     factory: () => new Map(),
 });
 
-class ComponentRegistrationService {
-    _registrations = signal(inject(NGX_FW_COMPONENT_REGISTRATIONS));
-    registrations = this._registrations.asReadonly();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ComponentRegistrationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ComponentRegistrationService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ComponentRegistrationService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
+const NGX_FW_COMPONENT_RESOLVER = new InjectionToken('NGX_FW_COMPONENT_RESOLVER');
 
-const NGX_FW_DEFAULT_VALIDATOR_REGISTRATIONS = new InjectionToken('NgxFbDefaultValidatorRegistrations', {
-    providedIn: 'root',
-    factory: () => new Map([
-        ['required', [Validators.required]],
-        ['requiredTrue', [Validators.requiredTrue]],
-        ['email', [Validators.email]],
-        ['nullValidator', [Validators.nullValidator]],
-    ]),
-});
-const NGX_FW_DEFAULT_ASYNC_VALIDATOR_REGISTRATIONS = new InjectionToken('NGX_FW_DEFAULT_ASYNC_VALIDATOR_REGISTRATIONS', {
+const NGX_FW_DEFAULT_CONFIG = new InjectionToken('NGX_FW_DEFAULT_CONFIG', {
     providedIn: 'root',
-    factory: () => new Map(),
+    factory: () => ({}),
 });
-const NGX_FW_VALIDATOR_REGISTRATIONS = new InjectionToken('NGX_FW_VALIDATOR_REGISTRATIONS');
-const NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS = new InjectionToken('NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS');
-const NGX_FW_VALIDATOR_REGISTRATIONS_RESOLVED = new InjectionToken('NGX_FW_VALIDATOR_REGISTRATIONS_RESOLVED', {
+const NGX_FW_CONFIG = new InjectionToken('NGX_FW_CONFIG', {
     providedIn: 'root',
-    factory: () => {
-        const base = inject(NGX_FW_DEFAULT_VALIDATOR_REGISTRATIONS);
-        const extras = inject(NGX_FW_VALIDATOR_REGISTRATIONS, { optional: true }) ?? [];
-        return mergeMapsLastWins(base, ...extras);
-    },
+    factory: () => [],
 });
-const NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS_RESOLVED = new InjectionToken('NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS_RESOLVED', {
+const NGX_FW_CONFIG_RESOLVED = new InjectionToken('NGX_FW_CONFIG_RESOLVED', {
     providedIn: 'root',
     factory: () => {
-        const base = inject(NGX_FW_DEFAULT_ASYNC_VALIDATOR_REGISTRATIONS);
-        const extras = inject(NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS, { optional: true }) ?? [];
-        return mergeMapsLastWins(base, ...extras);
+        const base = inject(NGX_FW_DEFAULT_CONFIG);
+        const extras = inject(NGX_FW_CONFIG, { optional: true }) ?? [];
+        return mergeDeep(base, ...extras);
     },
 });
-/** Utility: merge maps left->right, later maps override earlier keys */
-function mergeMapsLastWins(...maps) {
-    const out = new Map();
-    for (const m of maps) {
-        for (const [k, v] of m) {
-            out.set(k, v);
+function mergeDeep(base, ...partials) {
+    const out = { ...base };
+    for (const p of partials) {
+        for (const k of Object.keys(p)) {
+            const src = p[k];
+            const dst = out[k];
+            const bothObjects = typeof dst === 'object' &&
+                dst !== null &&
+                typeof src === 'object' &&
+                src !== null &&
+                !Array.isArray(dst) &&
+                !Array.isArray(src);
+            if (bothObjects) {
+                out[k] = mergeDeep(dst, src);
+                continue;
+            }
+            out[k] = src;
         }
     }
     return out;
 }
 
-class ValidatorRegistrationService {
-    _registrations = signal(inject(NGX_FW_VALIDATOR_REGISTRATIONS_RESOLVED));
-    registrations = this._registrations.asReadonly();
-    _asyncRegistrations = signal(inject(NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS_RESOLVED));
-    asyncRegistrations = this._asyncRegistrations.asReadonly();
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ValidatorRegistrationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ValidatorRegistrationService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ValidatorRegistrationService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
+const NGX_FW_DEFAULT_UPDATE_STRATEGY = new InjectionToken('NGX_FW_DEFAULT_UPDATE_STRATEGY', {
+    providedIn: 'root',
+    factory: () => 'change',
+});
 
 /**
  * Set of node types that are not supported in expressions for security or complexity reasons
@@ -876,505 +688,249 @@ class ExpressionService {
             throw new TypeError('Block-bodied arrow functions are not supported');
         };
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ExpressionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ExpressionService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ExpressionService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ExpressionService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ExpressionService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ExpressionService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
         }] });
 
-const NGX_FW_DEFAULT_UPDATE_STRATEGY = new InjectionToken('NGX_FW_DEFAULT_UPDATE_STRATEGY', {
-    providedIn: 'root',
-    factory: () => 'change',
-});
-
-const NGX_VALIDATOR_RESOLVER = new InjectionToken('NGX_VALIDATOR_RESOLVER');
+class ComponentRegistrationService {
+    _registrations = signal(inject(NGX_FW_COMPONENT_REGISTRATIONS), ...(ngDevMode ? [{ debugName: "_registrations" }] : []));
+    registrations = this._registrations.asReadonly();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ComponentRegistrationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ComponentRegistrationService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: ComponentRegistrationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
 
-const NGX_FW_DEFAULT_CONFIG = new InjectionToken('NGX_FW_DEFAULT_CONFIG', {
-    providedIn: 'root',
-    factory: () => ({}),
-});
-const NGX_FW_CONFIG = new InjectionToken('NGX_FW_CONFIG', {
-    providedIn: 'root',
-    factory: () => [],
-});
-const NGX_FW_CONFIG_RESOLVED = new InjectionToken('NGX_FW_CONFIG_RESOLVED', {
-    providedIn: 'root',
-    factory: () => {
-        const base = inject(NGX_FW_DEFAULT_CONFIG);
-        const extras = inject(NGX_FW_CONFIG, { optional: true }) ?? [];
-        return mergeDeep(base, ...extras);
-    },
-});
-function mergeDeep(base, ...partials) {
-    const out = { ...base };
-    for (const p of partials) {
-        for (const k of Object.keys(p)) {
-            const src = p[k];
-            const dst = out[k];
-            const bothObjects = typeof dst === 'object' &&
-                dst !== null &&
-                typeof src === 'object' &&
-                src !== null &&
-                !Array.isArray(dst) &&
-                !Array.isArray(src);
-            if (bothObjects) {
-                out[k] = mergeDeep(dst, src);
-                continue;
-            }
-            out[k] = src;
-        }
+class NgxFbConfigurationService {
+    _config = inject(NGX_FW_CONFIG_RESOLVED);
+    get testIdBuilder() {
+        return this._config.testIdBuilderFn;
     }
-    return out;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: NgxFbConfigurationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: NgxFbConfigurationService, providedIn: 'root' });
 }
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.6", ngImport: i0, type: NgxFbConfigurationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }] });
 
 /**
- * Configures and provides ngx-formbar to your application.
- *
- * This function is used in app.config.ts to register form components, validators,
- * and set global configuration for the formbar library.
- *
- * @param config Configuration object for ngx-formbar:
- *   - componentRegistrations: Optional mapping of control types to component implementations
- *   - validatorRegistrations: Optional mapping of validator names to validator functions
- *     (Angular's required, requiredTrue, email, and nullValidator are registered by default)
- *   - asyncValidatorRegistrations: Optional mapping of async validator names to async validator functions
- *   - updateOn: Optional default update strategy for all form controls
- *   - globalConfig: Optional global configuration settings
- *
- * @returns Angular environment providers to be included in application configuration
+ * Creates a static component registration entry.
+ * Use for eagerly imported components that don't need lazy loading.
  *
  * @example
  * ```ts
- * // app.config.ts
- * export const appConfig: ApplicationConfig = {
- *   providers: [
- *     provideFormbar({
- *       componentRegistrations: {
- *         text: TextInputComponent,
- *         select: SelectComponent,
- *       },
- *       validatorRegistrations: {
- *         customValidator: [myCustomValidator]
- *       }
- *     })
- *   ]
+ * import { staticComponent } from '@ngx-formbar/core';
+ * import { TextComponent } from './text.component';
+ *
+ * const registrations = {
+ *   text: staticComponent(TextComponent),
  * };
  * ```
  */
-function provideFormbar(config) {
-    config ??= {};
-    const { componentRegistrations, validatorRegistrations, asyncValidatorRegistrations, updateOn, globalConfig, } = config;
-    const providers = [
-        {
-            provide: NGX_FW_COMPONENT_RESOLVER,
-            useClass: ComponentRegistrationService,
-        },
-        {
-            provide: NGX_VALIDATOR_RESOLVER,
-            useClass: ValidatorRegistrationService,
-        },
-        ExpressionService,
-    ];
-    if (componentRegistrations !== undefined) {
-        providers.push({
-            provide: NGX_FW_COMPONENT_REGISTRATIONS,
-            useValue: toComponentRegistrationMap(componentRegistrations),
-        });
-    }
-    if (validatorRegistrations !== undefined) {
-        providers.push({
-            provide: NGX_FW_VALIDATOR_REGISTRATIONS,
-            useFactory: () => toValidatorRegistrationMap(validatorRegistrations),
-            multi: true,
-        });
-    }
-    if (asyncValidatorRegistrations !== undefined) {
-        providers.push({
-            provide: NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS,
-            useFactory: () => toAsyncValidatorRegistrationMap(asyncValidatorRegistrations),
-            multi: true,
-        });
-    }
-    if (updateOn !== undefined) {
-        providers.push({
-            provide: NGX_FW_DEFAULT_UPDATE_STRATEGY,
-            useValue: updateOn,
-        });
-    }
-    if (globalConfig !== undefined) {
-        providers.push({
-            provide: NGX_FW_CONFIG,
-            useValue: globalConfig,
-            multi: true,
-        });
-    }
-    return makeEnvironmentProviders(providers);
-}
-/**
- * Converts component registration array to a lookup map
- *
- * @param componentRegistrations Array of component registration configurations
- * @returns Map of component types to component implementations
- */
-function toComponentRegistrationMap(componentRegistrations) {
-    return new Map(Object.entries(componentRegistrations));
-}
-/**
- * Converts validator configuration to a map of validator functions
- * Resolves validator keys to actual validator functions
- *
- * @param config Configuration object for validators
- * @returns Map of validator keys to validator function arrays
- */
-function toValidatorRegistrationMap(config) {
-    return toValidatorMap(config);
+function staticComponent(type) {
+    return { component: type };
 }
 /**
- * Converts async validator configuration to a map of async validator functions
+ * Creates a lazy component registration entry.
+ * Use for components that should be loaded on demand.
  *
- * @param config Configuration object for async validators
- * @returns Map of validator keys to async validator function arrays
- */
-function toAsyncValidatorRegistrationMap(config) {
-    return toValidatorMap(config);
-}
-/**
- * Resolves validator references to actual validator functions
- * Supports recursive validator references and memoization
+ * @example
+ * ```ts
+ * import { loadComponent } from '@ngx-formbar/core';
  *
- * @param validators Array of validator functions or validator keys
- * @param registrations Map of all registered validators
- * @param memo Memoization cache to avoid circular references
- * @param visiting
- * @returns Flattened array of validator functions
+ * const registrations = {
+ *   text: loadComponent(() => import('./text.component').then(m => m.TextComponent)),
+ * };
+ * ```
  */
-function toValidatorFn(validators, registrations, memo = new Map(), visiting = new Set()) {
-    return validators.flatMap((v) => {
-        switch (typeof v) {
-            case 'string': {
-                const cached = memo.get(v);
-                if (cached)
-                    return cached;
-                if (visiting.has(v))
-                    throw new Error(`Cyclic validator reference: ${[...visiting, v].join(' -> ')}`);
-                if (!Object.prototype.hasOwnProperty.call(registrations, v))
-                    throw new Error(`Unknown validator key: "${v}"`);
-                const spec = registrations[v];
-                visiting.add(v);
-                const resolved = toValidatorFn(spec, registrations, memo, visiting);
-                visiting.delete(v);
-                memo.set(v, resolved);
-                return resolved;
-            }
-            default:
-                return v;
-        }
-    });
+function loadComponent(load) {
+    return { loadComponent: load };
 }
-function toValidatorMap(source) {
-    const out = new Map();
-    const memo = new Map();
-    for (const key in source) {
-        if (!Object.prototype.hasOwnProperty.call(source, key)) {
-            continue;
-        }
-        const spec = source[key];
-        const cached = memo.get(key);
-        if (cached) {
-            out.set(key, cached);
-            continue;
-        }
-        const resolved = toValidatorFn(spec, source, memo);
-        memo.set(key, resolved);
-        out.set(key, resolved);
+
+function toSafeString(value) {
+    if (value === null) {
+        return 'null';
+    }
+    switch (typeof value) {
+        case 'undefined':
+            return 'undefined';
+        case 'string':
+            return value;
+        case 'boolean':
+            return value ? 'true' : 'false';
+        case 'number':
+        case 'symbol':
+        case 'bigint':
+        case 'function':
+            return value.toString();
+        default:
+            return JSON.stringify(value);
     }
-    return out;
 }
 
+function isExpressionFn(value) {
+    return typeof value === 'function';
+}
 /**
- * Computes a reactive readonly state based on control content
+ * Resolves an expression option into a computed signal value
  *
- * The readonly state is determined using the following priority:
- * 1. If content.readonly is a boolean, that value is used directly
- * 2. If content.readonly is an expression string, it's parsed to AST and evaluated
- *    against the current form values
- * 3. If no readonly property is defined, the control inherits the readonly state
- *    from its parent group
+ * Handles three expression types:
+ * - **string**: Parsed to AST and evaluated against the form context
+ * - **function**: Called with the form context as argument
+ * - **static value / undefined**: Returned as-is
  *
- * This hierarchical inheritance ensures that child controls are automatically
- * set to readonly when their parent group is readonly, unless explicitly overridden.
+ * Internally caches the parsed AST in a separate computed signal
+ * so it is only recalculated when the option itself changes.
  *
- * @param content Signal containing control configuration with potential readonly property
- * @returns Computed signal that resolves to boolean readonly state
+ * @param option Signal containing the expression option (string, function, static value, or undefined)
+ * @param formContext Signal providing the current form context for expression evaluation
+ * @param expressionService Service used to parse and evaluate string expressions
+ * @returns Computed signal that resolves to the evaluated value or undefined
  */
-function withReadonlyState(content) {
-    const formService = inject(FormService);
-    const expressionService = inject(ExpressionService);
-    const parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-        skipSelf: true,
-    });
-    const parentGroupIsReadonly = computed(() => {
-        const parentGroup = parentGroupDirective;
-        if (!parentGroup) {
-            return false;
-        }
-        return parentGroup.readonly();
-    });
-    const readonlyAst = computed(() => {
-        const readonlyOption = content().readonly;
-        if (typeof readonlyOption === 'boolean' ||
-            typeof readonlyOption === 'function') {
-            return null;
-        }
-        return expressionService.parseExpressionToAst(readonlyOption);
-    });
-    const readonlyBool = computed(() => {
-        const readonlyOption = content().readonly;
-        if (typeof readonlyOption !== 'boolean') {
-            return null;
-        }
-        return readonlyOption;
-    });
-    const readonlyFunction = computed(() => {
-        const readonlyOption = content().readonly;
-        if (typeof readonlyOption !== 'function') {
+function resolveExpression(option, formContext, expressionService) {
+    const ast = computed(() => {
+        const value = option();
+        if (typeof value !== 'string') {
             return null;
         }
-        return readonlyOption;
-    });
+        return expressionService.parseExpressionToAst(value);
+    }, ...(ngDevMode ? [{ debugName: "ast" }] : []));
     return computed(() => {
-        const readonlyStatic = readonlyBool();
-        if (readonlyStatic !== null) {
-            return readonlyStatic;
+        const value = option();
+        if (value === undefined) {
+            return undefined;
+        }
+        if (isExpressionFn(value)) {
+            return value(formContext());
         }
-        const reactiveFormValues = formService.formValue();
-        const currentSynchronousFormValues = formService.formGroup
-            .value;
-        const evaluationContext = reactiveFormValues ?? currentSynchronousFormValues;
-        const readonlyFn = readonlyFunction();
-        if (readonlyFn) {
-            return readonlyFn(evaluationContext);
+        if (typeof value !== 'string') {
+            return value;
         }
-        const ast = readonlyAst();
-        if (!ast) {
-            return parentGroupIsReadonly();
+        const parsedAst = ast();
+        if (!parsedAst) {
+            return undefined;
         }
-        const readonly = expressionService.evaluateExpression(ast, evaluationContext) ?? false;
-        return readonly;
+        return expressionService.evaluateExpression(parsedAst, formContext());
     });
 }
 
 /**
- * Computes a reactive hidden state based on control content
+ * Resolves an inheritable boolean expression with parent state fallback
  *
- * The hidden state is determined using the following priority:
- * 1. If content.hidden is an expression string, it's parsed to AST and evaluated
- *    against the current form values
- * 2. If no hidden expression is defined, the control inherits the hidden state
- *    from its parent group
- * 3. Both conditions can be combined - a control is hidden if either its own
- *    condition evaluates to true OR its parent group is hidden
+ * Used for states like disabled and readonly that follow a common pattern:
+ * 1. If the option is undefined, inherit the parent state
+ * 2. Otherwise, resolve the expression and default to false
  *
- * @param content Signal containing control configuration with potential hidden expression
- * @returns Computed signal that resolves to boolean hidden state
+ * @param option Signal containing the expression option (boolean, string expression, function, or undefined)
+ * @param formContext Signal providing the current form context for expression evaluation
+ * @param expressionService Service used to parse and evaluate string expressions
+ * @param parentState Signal providing the parent group's state to inherit from
+ * @returns Computed signal that resolves to a boolean state
  */
-function withHiddenState(content) {
-    const formService = inject(FormService);
-    const expressionService = inject(ExpressionService);
-    const parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-        skipSelf: true,
-    });
-    const parentGroupIsHidden = computed(() => {
-        const parentGroup = parentGroupDirective;
-        if (!parentGroup) {
-            return false;
-        }
-        return parentGroup.isHidden();
-    });
-    const visibilityAst = computed(() => {
-        const hiddenOption = content().hidden;
-        if (typeof hiddenOption !== 'string') {
-            return null;
-        }
-        return expressionService.parseExpressionToAst(hiddenOption);
-    });
-    const visibilityFunction = computed(() => {
-        const visibilityOption = content().hidden;
-        if (typeof visibilityOption !== 'function') {
-            return null;
-        }
-        return visibilityOption;
-    });
+function resolveInheritableExpression(option, formContext, expressionService, parentState) {
+    const resolved = resolveExpression(option, formContext, expressionService);
     return computed(() => {
-        const reactiveFormValues = formService.formValue();
-        const currentSynchronousFormValues = formService.formGroup
-            .value;
-        const evaluationContext = reactiveFormValues ?? currentSynchronousFormValues;
-        const visibilityFn = visibilityFunction();
-        if (visibilityFn) {
-            return visibilityFn(evaluationContext);
-        }
-        const ast = visibilityAst();
-        if (!ast) {
-            return parentGroupIsHidden();
+        if (option() === undefined) {
+            return parentState();
         }
-        const isHidden = expressionService.evaluateExpression(ast, evaluationContext) ?? false;
-        return isHidden || parentGroupIsHidden();
+        return resolved() ?? false;
     });
 }
+
 /**
- * Creates a computed attribute value for hidden DOM elements
- *
- * When visibilityHandling is set to 'auto', this returns a boolean attribute value
- * that can be used with Angular's [attr.hidden] binding. When set to 'manual',
- * it returns null so the attribute is not applied.
- *
- * @param options Configuration object for hidden attribute
- * @param options.hiddenSignal Signal that indicates if the control should be hidden
- * @param options.hiddenHandlingSignal Signal that determines how visibility is managed
- * @returns Computed signal that resolves to attribute value (true or null)
+ * Resolves the hidden state with parent combination logic
+ *
+ * The hidden state differs from disabled/readonly inheritance:
+ * 1. If the option is undefined, inherit the parent hidden state
+ * 2. If the option is a function expression, use only the resolved value
+ * 3. If the option is a string expression, OR with the parent hidden state
+ *    (a child is hidden if either its own condition or its parent is hidden)
+ *
+ * @param option Signal containing the hidden expression option
+ * @param formContext Signal providing the current form context for expression evaluation
+ * @param expressionService Service used to parse and evaluate string expressions
+ * @param parentHiddenState Signal providing the parent group's hidden state
+ * @returns Computed signal that resolves to a boolean hidden state
  */
-function withHiddenAttribute(options) {
+function resolveHiddenState(option, formContext, expressionService, parentHiddenState) {
+    const resolved = resolveExpression(option, formContext, expressionService);
     return computed(() => {
-        const isHidden = options.hiddenSignal();
-        const visibilityHandling = options.hiddenHandlingSignal();
-        if (visibilityHandling !== 'auto') {
-            return null;
+        const hiddenOption = option();
+        if (hiddenOption === undefined) {
+            return parentHiddenState();
         }
-        return isHidden ? true : null;
+        const isHidden = resolved() ?? false;
+        if (typeof hiddenOption === 'function') {
+            return isHidden;
+        }
+        return isHidden || parentHiddenState();
     });
 }
+
 /**
- * Creates an effect that manages control visibility in forms
+ * Creates an effect that manages disabled state transitions
  *
- * Based on visibility state and hide strategy, this effect:
- * 1. Attaches the control to the form when visible
- * 2. Detaches the control from the form when hidden and strategy is 'remove'
- * 3. Manages control values based on the specified valueStrategy when visibility changes
+ * When disabledHandling is 'auto', calls the appropriate enable/disable
+ * function based on the disabled signal. When 'manual', does nothing.
  *
- * @param options Configuration object for hidden effect
- * @param options.content Signal containing control configuration
- * @param options.name Signal containing the name of the control
- * @param options.controlInstance Signal with the form control instance
- * @param options.hiddenSignal Signal that indicates if the control should be hidden
- * @param options.hideStrategySignal Signal with the strategy for handling hidden controls
- * @param options.valueStrategySignal Signal with the strategy for handling control values
- * @param options.parentValueStrategySignal Signal with the parent's value strategy
- * @param options.attachFunction Function to call when control should be attached
- * @param options.detachFunction Function to call when control should be detached
- * @param options.valueHandleFunction Function to handle control value based on strategy
+ * @param options Configuration object for disabled effect
+ * @param options.disabledSignal Signal that indicates if the component should be disabled
+ * @param options.disabledHandlingSignal Signal that determines how disabled state changes should be handled
+ * @param options.enableFunction Function to call when component should be enabled
+ * @param options.disableFunction Function to call when component should be disabled
  */
-function hiddenEffect(options) {
-    const parentContainer = inject(ControlContainer);
-    const parentFormGroup = parentContainer.control;
+function resolveDisabledEffect(options) {
     effect(() => {
-        options.controlInstance();
-        const isHidden = options.hiddenSignal();
-        const hideStrategy = options.hideStrategySignal();
-        const valueStrategy = options.valueStrategySignal() ?? options.parentValueStrategySignal();
-        const formControl = untracked(() => parentFormGroup?.get(options.name()));
-        // Re-attach control
-        // On initial render the form control will not be attached, but we need it for the hide strategy "keep"
-        if (!formControl && (!isHidden || hideStrategy === 'keep')) {
-            untracked(() => {
-                options.attachFunction();
-            });
-            return;
-        }
-        // Control is already detached
-        if (hideStrategy === 'remove' && !formControl) {
+        const disabled = options.disabledSignal();
+        const disabledHandling = options.disabledHandlingSignal();
+        if (disabledHandling === 'manual') {
             return;
         }
-        // Remove control
-        if (hideStrategy === 'remove' && isHidden) {
+        if (!disabled) {
             untracked(() => {
-                options.detachFunction();
+                options.enableFunction();
             });
+            return;
         }
-        // Only thing left to check is value strategy
         untracked(() => {
-            options.valueHandleFunction(valueStrategy);
+            options.disableFunction();
         });
     });
 }
 
 /**
- * Computes a reactive array of validators based on control content
- *
- * Extracts validator keys from content and maps them to actual validator functions
- * by looking them up in the validator registration service.
- *
- * @param content Signal containing control configuration with validator keys
- * @returns Computed signal that resolves to an array of validator functions
+ * Resolves a test ID for a form element
+ *
+ * The test ID is determined using the following priority:
+ * 1. A local testIdBuilder function if provided
+ * 2. A global testIdBuilder function if provided
+ * 3. Default: joins parentTestId and name with '-', or just name if no parent
+ *
+ * @param content Signal containing the base content configuration
+ * @param name Signal containing the control/group name
+ * @param testIdBuilder Signal holding an optional local testIdBuilder function
+ * @param globalTestIdBuilder Optional global testIdBuilder function from configuration
+ * @param parentTestId Signal providing the parent group's test ID
+ * @returns Computed signal that resolves to the test ID string
  */
-function withValidators(content) {
-    const validatorRegistrations = inject(NGX_VALIDATOR_RESOLVER).registrations;
-    return computed(() => {
-        const validatorKeys = content().validators ?? [];
-        return validatorKeys.flatMap((key) => validatorRegistrations().get(key) ?? []);
-    });
-}
-/**
- * Computes a reactive array of async validators based on control content
- *
- * Extracts async validator keys from content and maps them to actual async validator
- * functions by looking them up in the validator registration service.
- *
- * @param content Signal containing control configuration with async validator keys
- * @returns Computed signal that resolves to an array of async validator functions
- */
-function withAsyncValidators(content) {
-    const asyncValidatorRegistrations = inject(NGX_VALIDATOR_RESOLVER).asyncRegistrations;
-    return computed(() => {
-        const validatorKeys = content().asyncValidators ?? [];
-        return validatorKeys.flatMap((key) => asyncValidatorRegistrations().get(key) ?? []);
-    });
-}
-
-class NgxFbConfigurationService {
-    _config = inject(NGX_FW_CONFIG_RESOLVED);
-    get testIdBuilder() {
-        return this._config.testIdBuilderFn;
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxFbConfigurationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxFbConfigurationService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxFbConfigurationService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }] });
-
-/**
- * Creates a computed signal that extracts the ID for testing purposes
- *
- * This utility function derives a test identifier from a form control's content,
- * which can be used for targeting elements in automated tests.
- *
- * @template T - Type extending NgxFbBaseContent
- * @param content - Signal containing the control or group content configuration
- * @param name - Signal containing the name of the control
- * @param testIdBuilder - Signal holding a testIdBuilder function
- * @returns Computed signal that resolves to the element's ID for testing
- */
-function withTestId(content, name, testIdBuilder) {
-    const parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-        skipSelf: true,
-    });
-    const globalConfig = inject(NgxFbConfigurationService);
-    const globalTestIdBuilder = globalConfig.testIdBuilder;
+function resolveTestId(content, name, testIdBuilder, globalTestIdBuilder, parentTestId) {
     return computed(() => {
         const contentValue = content();
         const id = name();
-        const parentGroupTestId = parentGroupDirective?.testId();
+        const parentGroupTestId = parentTestId();
         const builderFn = testIdBuilder();
         if (builderFn) {
             return builderFn(contentValue, id, parentGroupTestId);
@@ -1390,1040 +946,51 @@ function withTestId(content, name, testIdBuilder) {
 }
 
 /**
- * Creates a computed signal for the control's update strategy
+ * Resolves the hidden attribute value for DOM binding
  *
- * This function determines when form controls should update:
- * - Uses the control's specified updateOn strategy if defined
- * - Falls back to parent group's strategy when not defined in the control
- * - Handles inheritance of update strategies through the form hierarchy
- * - Uses the application's default strategy as final fallback
+ * When visibilityHandling is 'auto', returns `true` (attribute present)
+ * or `null` (attribute absent) based on the hidden state.
+ * When visibilityHandling is 'manual', always returns `null` so the
+ * component can handle visibility itself.
  *
- * Update strategies control when form values and validation happen:
- * - 'change': Update on every change event (default Angular behavior)
- * - 'blur': Update when the control loses focus
- * - 'submit': Update only when the form is submitted
- *
- * @param content Signal containing the NgxFbAbstractControl with possible updateOn configuration
- * @returns Computed signal providing the resolved update strategy
+ * @param options Configuration object
+ * @param options.hiddenSignal Signal indicating whether the element should be hidden
+ * @param options.hiddenHandlingSignal Signal for the visibility handling strategy
+ * @returns Computed signal resolving to `true` (hidden) or `null` (visible)
  */
-function withUpdateStrategy(content) {
-    const parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-        skipSelf: true,
-    });
-    const defaultUpdateStrategy = inject(NGX_FW_DEFAULT_UPDATE_STRATEGY);
-    const parentGroupUpdateStrategy = computed(() => {
-        return parentGroupDirective?.updateStrategy();
-    });
+function resolveHiddenAttribute(options) {
     return computed(() => {
-        return (content().updateOn ?? parentGroupUpdateStrategy() ?? defaultUpdateStrategy);
-    });
-}
-
-/**
- * Computes a dynamic title for a form control based on expression evaluation
- *
- * @param content Signal containing control configuration with dynamicTitle property
- * @returns Computed signal that resolves to the evaluated dynamic title string or undefined
- */
-function withDynamicTitle(content) {
-    const formService = inject(FormService);
-    const expressionService = inject(ExpressionService);
-    const dynamicTitleAst = computed(() => {
-        const dynamicTitleOption = content().dynamicTitle;
-        if (typeof dynamicTitleOption !== 'string') {
-            return null;
-        }
-        return expressionService.parseExpressionToAst(dynamicTitleOption);
-    });
-    const dynamicTitleFunction = computed(() => {
-        const dynamicTitleOption = content().dynamicTitle;
-        if (typeof dynamicTitleOption !== 'function') {
+        const isHidden = options.hiddenSignal();
+        const visibilityHandling = options.hiddenHandlingSignal();
+        if (visibilityHandling !== 'auto') {
             return null;
         }
-        return dynamicTitleOption;
-    });
-    return computed(() => {
-        const reactiveFormValues = formService.formValue();
-        const currentSynchronousFormValues = formService.formGroup
-            .value;
-        const evaluationContext = reactiveFormValues ?? currentSynchronousFormValues;
-        const dynamicTitleFn = dynamicTitleFunction();
-        if (dynamicTitleFn) {
-            return dynamicTitleFn(evaluationContext);
-        }
-        const ast = dynamicTitleAst();
-        if (!ast) {
-            return undefined;
-        }
-        const title = expressionService.evaluateExpression(ast, evaluationContext);
-        return title;
-    });
-}
-
-/**
- * Core directive for creating form groups in ngx-formbar.
- *
- * This directive handles the integration between Angular's reactive forms and
- * ngx-formbar's declarative configuration for FormGroups. It manages:
- *
- * - Group registration and lifecycle within parent forms
- * - State management (hidden, disabled, readonly)
- * - Validation setup
- * - Test ID generation
- * - Dynamic title support
- * - Child control management
- *
- * Use this directive with hostDirectives in your custom group components:
- *
- * ```typescript
- * @Component({
- *   hostDirectives: [
- *     {
- *       directive: NgxfbGroupDirective,
- *       inputs: ['content', 'name'],
- *     }
- *   ],
- * })
- * export class GroupComponent {
- *   private readonly control = inject(NgxfbGroupDirective<Group>);
- *   readonly content = this.control.content;
- *   readonly controls = this.control.controls;
- * }
- * ```
- *
- * @template T Type of the group configuration, must extend NgxFbFormGroup
- */
-class NgxfbGroupDirective {
-    parentContainer = inject(ControlContainer);
-    parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-        skipSelf: true,
-    });
-    /**
-     * Required input containing the group configuration
-     * Defines properties like type, controls, validation, and state expressions
-     */
-    content = input.required();
-    /**
-     * Required input for the group's name
-     * Used as the key in the parent FormGroup
-     */
-    name = input.required();
-    /**
-     * Signal for managing the visibility handling strategy ('auto' or 'manual')
-     * - 'auto': directive handles visibility via hidden attribute
-     * - 'manual': component handles visibility in its own template
-     */
-    visibilityHandling = signal('auto');
-    /**
-     * Signal for managing the disabled state handling strategy ('auto' or 'manual')
-     * - 'auto': directive handles disabled state via FormGroup methods
-     * - 'manual': component handles disabled state in its own template
-     */
-    disabledHandling = signal('auto');
-    /**
-     * Signal for the test ID builder function
-     * Used to customize how test IDs are generated
-     */
-    testIdBuilder = signal(undefined);
-    /**
-     * Computed test ID derived from the group's name
-     * Used for automated testing identification
-     *
-     * Access this in your component template:
-     * ```html
-     * <div [attr.data-testid]="testId()">...</div>
-     * ```
-     */
-    testId = withTestId(this.content, this.name, this.testIdBuilder);
-    /**
-     * Computed signal for the group's hide strategy
-     * Determines how the group behaves when hidden (keep or remove from form)
-     */
-    hideStrategy = computed(() => this.content().hideStrategy);
-    /**
-     * Computed signal for the group's value strategy
-     * Determines how the group's values are managed when visibility changes:
-     * - 'last': preserves last values
-     * - 'default': reverts to default values
-     * - 'reset': clears values
-     */
-    valueStrategy = computed(() => this.content().valueStrategy ?? this.parentValueStrategy());
-    /**
-     * Computed signal for the parent's value strategy
-     * Used when group doesn't define its own strategy
-     */
-    parentValueStrategy = computed(() => this.parentGroupDirective?.valueStrategy());
-    /**
-     * Computed signal for the hidden state
-     * True when the group should be hidden based on 'hidden' expression
-     *
-     * Use this in your component when implementing custom visibility handling:
-     * ```typescript
-     * readonly isHidden = this.control.isHidden;
-     * ```
-     */
-    isHidden = withHiddenState(this.content);
-    /**
-     * Computed signal for the hidden attribute
-     * Used in DOM binding to show/hide the group element
-     */
-    hiddenAttribute = withHiddenAttribute({
-        hiddenSignal: this.isHidden,
-        hiddenHandlingSignal: this.visibilityHandling,
-    });
-    /**
-     * Computed signal for the disabled state
-     * True when the group should be disabled based on 'disabled' expression
-     *
-     * Use this in your component for custom disabled state handling:
-     * ```typescript
-     * readonly disabled = this.control.disabled;
-     * ```
-     */
-    disabled = withDisabledState(this.content);
-    /**
-     * Computed signal for the readonly state
-     * True when the group should be readonly based on 'readonly' expression
-     *
-     * Use this in your component to implement readonly behavior:
-     * ```typescript
-     * readonly readonly = this.control.readonly;
-     * ```
-     */
-    readonly = withReadonlyState(this.content);
-    /**
-     * Computed signal for the update strategy
-     * Determines when form values are updated ('change', 'blur', or 'submit')
-     */
-    updateStrategy = withUpdateStrategy(this.content);
-    /**
-     * Computed signal for the dynamic title
-     * Contains the evaluated result of the dynamicTitle expression
-     *
-     * Use this in your component to display dynamic titles:
-     * ```typescript
-     * readonly displayTitle = computed(() => {
-     *   const dynamic = this.control.dynamicTitle();
-     *   return dynamic || this.content().title || '';
-     * });
-     * ```
-     */
-    dynamicTitle = withDynamicTitle(this.content);
-    /**
-     * Computed signal for the validators
-     * Contains validator functions derived from configuration keys
-     */
-    validators = withValidators(this.content);
-    /**
-     * Computed signal for the async validators
-     * Contains async validator functions derived from configuration keys
-     */
-    asyncValidators = withAsyncValidators(this.content);
-    /**
-     * Computed signal for the form group instance
-     * Creates a new FormGroup with appropriate validators and configuration
-     */
-    groupInstance = computed(() => {
-        const validators = this.validators();
-        const asyncValidators = this.asyncValidators();
-        const updateOn = this.updateStrategy();
-        return new FormGroup({}, {
-            validators,
-            asyncValidators,
-            updateOn,
-        });
+        return isHidden ? true : null;
     });
-    /**
-     * Computed signal for the title of the group
-     * Returns the static title from the configuration
-     */
-    title = computed(() => this.content().title);
-    /**
-     * Computed signal for the child controls of the group
-     * Returns an array of [name, control] pairs for rendering
-     */
-    controls = computed(() => Object.entries(this.content().controls));
-    /**
-     * Access to the parent FormGroup containing this group
-     */
-    get parentFormGroup() {
-        return this.parentContainer.control;
-    }
-    /**
-     * Access to this group's FormGroup instance
-     * Use this to access validation state, errors, and other FormGroup methods
-     */
-    get formGroup() {
-        return this.parentFormGroup?.get(this.name());
-    }
-    constructor() {
-        hiddenEffect({
-            content: this.content,
-            name: this.name,
-            controlInstance: this.groupInstance,
-            hiddenSignal: this.isHidden,
-            hideStrategySignal: this.hideStrategy,
-            valueStrategySignal: this.valueStrategy,
-            parentValueStrategySignal: this.parentValueStrategy,
-            attachFunction: this.setGroup.bind(this),
-            detachFunction: this.removeGroup.bind(this),
-            valueHandleFunction: this.handleValue.bind(this),
-        });
-        disabledEffect({
-            disabledSignal: this.disabled,
-            disabledHandlingSignal: this.disabledHandling,
-            enableFunction: this.enableGroup.bind(this),
-            disableFunction: this.disableGroup.bind(this),
-        });
-    }
-    /**
-     * Sets the visibility handling strategy
-     * Determines if visibility should be managed by the component (manual) or by Formbar (auto)
-     *
-     * Use 'manual' when implementing custom visibility handling in your component:
-     * ```typescript
-     * constructor() {
-     *   this.control.setVisibilityHandling('manual');
-     * }
-     * ```
-     *
-     * @param visibilityHandling Strategy for handling visibility ('auto' or 'manual')
-     */
-    setVisibilityHandling(visibilityHandling) {
-        this.visibilityHandling.set(visibilityHandling);
-    }
-    /**
-     * Sets the disabled handling strategy
-     * Determines if disabled state should be managed by the component (manual) or by Formbar (auto)
-     *
-     * Use 'manual' when implementing custom disabled state handling in your component:
-     * ```typescript
-     * constructor() {
-     *   this.control.setDisabledHandling('manual');
-     * }
-     * ```
-     *
-     * @param disabledHandling Strategy for handling disabled state ('auto' or 'manual')
-     */
-    setDisabledHandling(disabledHandling) {
-        this.disabledHandling.set(disabledHandling);
-    }
-    /**
-     * Sets the function to use for building a test id.
-     * This allows custom test ID generation strategies to be used.
-     *
-     * @param builderFn Function that returns the test id
-     */
-    setTestIdBuilderFn(builderFn) {
-        this.testIdBuilder.set(builderFn);
-    }
-    /**
-     * Registers this group with the parent FormGroup
-     * @private
-     */
-    setGroup() {
-        this.parentFormGroup?.setControl(this.name(), this.groupInstance(), {
-            emitEvent: false,
-        });
-    }
-    /**
-     * Removes this group from the parent FormGroup
-     * @private
-     */
-    removeGroup() {
-        const id = this.name();
-        const formGroup = this.formGroup;
-        // Check if control exists immediately before attempting removal
-        if (formGroup) {
-            this.parentFormGroup?.removeControl(id, { emitEvent: false });
-        }
-    }
-    /**
-     * Enables the form group
-     * @private
-     */
-    enableGroup() {
-        const formGroup = this.groupInstance();
-        formGroup.enable({ emitEvent: false });
-    }
-    /**
-     * Disables the form group
-     * @private
-     */
-    disableGroup() {
-        const formGroup = this.groupInstance();
-        formGroup.disable({ emitEvent: false });
-    }
-    /**
-     * Handles value changes when visibility changes
-     * @param valueStrategy Strategy for handling values
-     * @private
-     */
-    handleValue(valueStrategy) {
-        switch (valueStrategy) {
-            case 'last':
-                break;
-            case 'default':
-                break;
-            default:
-                // Instead of resetting  the group, we need to reset the controls individually
-                // to allow them to overwrite the value strategy
-                // If a control doesn't have a value strategy, we reset it
-                Object.entries(this.content().controls).forEach(([name, control]) => {
-                    if (!('valueStrategy' in control)) {
-                        return;
-                    }
-                    if (control.valueStrategy) {
-                        return;
-                    }
-                    const formControl = this.formGroup?.get(name);
-                    if (formControl) {
-                        formControl.reset(undefined, { emitEvent: false });
-                    }
-                });
-                break;
-        }
-    }
-    /**
-     * Removes the group when the directive is destroyed
-     */
-    ngOnDestroy() {
-        this.removeGroup();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbGroupDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: NgxfbGroupDirective, isStandalone: true, selector: "[ngxfbGroup]", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.hidden": "hiddenAttribute()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbGroupDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ngxfbGroup]',
-                    host: {
-                        '[attr.hidden]': 'hiddenAttribute()',
-                    },
-                }]
-        }], ctorParameters: () => [] });
 
 /**
- * Computes a reactive disabled state based on control content
+ * Resolves the update strategy for a form control or group
  *
- * The disabled state is determined using the following priority:
- * 1. If content.disabled is a boolean, that value is used directly
- * 2. If content.disabled is an expression string, it's parsed to AST and evaluated
- *    against the current form values
- * 3. If no disabled property is defined, the control inherits the disabled state
- *    from its parent group
+ * The strategy is determined using the following priority:
+ * 1. The control's own updateOn value if defined
+ * 2. The parent group's strategy if defined
+ * 3. The application-wide default strategy
  *
- * This hierarchical inheritance ensures that child controls are automatically
- * disabled when their parent group is disabled, unless explicitly overridden.
- *
- * @param content Signal containing control configuration with potential disabled property
- * @returns Computed signal that resolves to boolean disabled state
- */
-function withDisabledState(content) {
-    const formService = inject(FormService);
-    const expressionService = inject(ExpressionService);
-    const parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-        skipSelf: true,
-    });
-    const parentGroupIsDisabled = computed(() => {
-        const parentGroup = parentGroupDirective;
-        if (!parentGroup) {
-            return false;
-        }
-        return parentGroup.disabled();
-    });
-    const disabledAst = computed(() => {
-        const disabledOption = content().disabled;
-        if (typeof disabledOption !== 'string') {
-            return null;
-        }
-        return expressionService.parseExpressionToAst(disabledOption);
-    });
-    const disabledBool = computed(() => {
-        const disabledOption = content().disabled;
-        if (typeof disabledOption !== 'boolean') {
-            return null;
-        }
-        return disabledOption;
-    });
-    const disabledFunction = computed(() => {
-        const disabledOption = content().disabled;
-        if (typeof disabledOption !== 'function') {
-            return null;
-        }
-        return disabledOption;
-    });
-    return computed(() => {
-        const disabledStatic = disabledBool();
-        if (disabledStatic !== null) {
-            return disabledStatic;
-        }
-        const reactiveFormValues = formService.formValue();
-        const currentSynchronousFormValues = formService.formGroup
-            .value;
-        const evaluationContext = reactiveFormValues ?? currentSynchronousFormValues;
-        const disableFn = disabledFunction();
-        if (disableFn) {
-            return disableFn(evaluationContext);
-        }
-        const ast = disabledAst();
-        if (!ast) {
-            return parentGroupIsDisabled();
-        }
-        const disabled = expressionService.evaluateExpression(ast, evaluationContext) ?? false;
-        return disabled;
-    });
-}
-/**
- * Creates an effect that manages control/group disabled state
- *
- * @param options Configuration object for disabled effect
- * @param options.disabledSignal Signal that indicates if the component should be disabled
- * @param options.disabledHandlingSignal Signal that determines how disabled state changes should be handled
- * @param options.enableFunction Function to call when component should be enabled
- * @param options.disableFunction Function to call when component should be disabled
- */
-function disabledEffect(options) {
-    effect(() => {
-        const disabled = options.disabledSignal();
-        const disabledHandling = options.disabledHandlingSignal();
-        if (disabledHandling === 'manual') {
-            return;
-        }
-        if (!disabled) {
-            untracked(() => {
-                options.enableFunction();
-            });
-            return;
-        }
-        untracked(() => {
-            options.disableFunction();
-        });
-    });
-}
-
-function withComputedValue(content) {
-    const formService = inject(FormService);
-    const expressionService = inject(ExpressionService);
-    const parentContainer = inject(ControlContainer);
-    const computedValueAst = computed(() => {
-        const computedValueOption = content().computedValue;
-        if (typeof computedValueOption !== 'string') {
-            return null;
-        }
-        return expressionService.parseExpressionToAst(computedValueOption);
-    });
-    const computedValueFunction = computed(() => {
-        const computedValueOption = content().computedValue;
-        if (typeof computedValueOption !== 'function') {
-            return null;
-        }
-        return computedValueOption;
-    });
-    return computed(() => {
-        const value = formService.formValue() ?? parentContainer.value;
-        const computedValueFn = computedValueFunction();
-        if (computedValueFn) {
-            return computedValueFn(value);
-        }
-        const ast = computedValueAst();
-        if (!ast) {
-            return undefined;
-        }
-        return expressionService.evaluateExpression(ast, value);
-    });
-}
-function setComputedValueEffect(options) {
-    const parentContainer = inject(ControlContainer);
-    effect(() => {
-        const control = options.controlInstance();
-        const value = options.computeValueSignal();
-        if (!value && parentContainer.pristine) {
-            return;
-        }
-        control.setValue(value);
-    });
-}
-
-/**
- * Computes a dynamic label for a form control based on expression evaluation
- *
- * @param content Signal containing control configuration with dynamicLabel property
- * @returns Computed signal that resolves to the evaluated dynamic label string or undefined
+ * @param controlUpdateOn Signal containing the control's updateOn configuration
+ * @param parentStrategy Signal providing the parent group's update strategy
+ * @param defaultStrategy The application-wide default update strategy
+ * @returns Computed signal providing the resolved update strategy
  */
-function withDynamicLabel(content) {
-    const formService = inject(FormService);
-    const expressionService = inject(ExpressionService);
-    const dynamicLabelAst = computed(() => {
-        const dynamicLabelOption = content().dynamicLabel;
-        if (typeof dynamicLabelOption !== 'string') {
-            return null;
-        }
-        return expressionService.parseExpressionToAst(dynamicLabelOption);
-    });
-    const dynamicLabelFunction = computed(() => {
-        const dynamicLabelOption = content().dynamicLabel;
-        if (typeof dynamicLabelOption !== 'function') {
-            return null;
-        }
-        return dynamicLabelOption;
-    });
+function resolveUpdateStrategy(controlUpdateOn, parentStrategy, defaultStrategy) {
     return computed(() => {
-        const reactiveFormValues = formService.formValue();
-        const currentSynchronousFormValues = formService.formGroup
-            .value;
-        const evaluationContext = reactiveFormValues ?? currentSynchronousFormValues;
-        const dynamicLabelFn = dynamicLabelFunction();
-        if (dynamicLabelFn) {
-            return dynamicLabelFn(evaluationContext);
-        }
-        const ast = dynamicLabelAst();
-        if (!ast) {
-            return undefined;
-        }
-        const label = expressionService.evaluateExpression(ast, evaluationContext);
-        return label;
+        return controlUpdateOn() ?? parentStrategy() ?? defaultStrategy;
     });
 }
 
-/**
- * Core directive for creating form controls in ngx-formbar.
- *
- * This directive handles the integration between Angular's reactive forms and
- * ngx-formbar's declarative configuration. It manages:
- *
- * - Control registration and lifecycle within parent form groups
- * - State management (hidden, disabled, readonly)
- * - Validation setup
- * - Dynamic value computation
- * - Test ID generation
- * - Dynamic label support
- *
- * Use this directive with hostDirectives in your custom control components:
- *
- * ```typescript
- * @Component({
- *   hostDirectives: [
- *     {
- *       directive: NgxfbControlDirective,
- *       inputs: ['content', 'name'],
- *     }
- *   ],
- * })
- * export class TextControlComponent {
- *   private readonly control = inject(NgxfbControlDirective<TextControl>);
- *   readonly content = this.control.content;
- *   readonly name = this.control.name;
- * }
- * ```
- *
- * @template T Type of the control configuration, must extend NgxFbControl
- */
-class NgxfbControlDirective {
-    parentContainer = inject(ControlContainer);
-    parentGroupDirective = inject((NgxfbGroupDirective), {
-        optional: true,
-    });
-    /**
-     * Required input containing the control configuration
-     * Defines properties like ID, default value, validation, and state expressions
-     */
-    content = input.required();
-    /**
-     * Required input for the controls name
-     */
-    name = input.required();
-    visibilityHandling = signal('auto');
-    disabledHandling = signal('auto');
-    testIdBuilder = signal(undefined);
-    /**
-     * Computed test ID derived from the control's ID
-     * Used for automated testing identification
-     *
-     * Access this in your component template:
-     * ```html
-     * <input [attr.data-testid]="testId()" ... />
-     * ```
-     */
-    testId = withTestId(this.content, this.name, this.testIdBuilder);
-    /**
-     * Computed signal for the control's hide strategy
-     * Determines how the control behaves when hidden (keep or remove from form)
-     */
-    hideStrategy = computed(() => this.content().hideStrategy);
-    /**
-     * Computed signal for the control's value strategy
-     * Determines how the control's value is managed when visibility changes
-     */
-    valueStrategy = computed(() => this.content().valueStrategy ?? this.parentValueStrategy());
-    /**
-     * Computed signal for the parent's value strategy
-     * Used when control doesn't define its own strategy
-     */
-    parentValueStrategy = computed(() => this.parentGroupDirective?.valueStrategy());
-    /**
-     * Computed signal for the hidden state
-     * True when the control should be hidden based on 'hidden' expression
-     *
-     * Use this in your component when implementing custom visibility handling:
-     * ```typescript
-     * readonly isHidden = this.control.isHidden;
-     * ```
-     */
-    isHidden = withHiddenState(this.content);
-    /**
-     * Computed signal for the hidden attribute
-     * Used in DOM binding to show/hide the control element
-     */
-    hiddenAttribute = withHiddenAttribute({
-        hiddenSignal: this.isHidden,
-        hiddenHandlingSignal: this.visibilityHandling,
-    });
-    /**
-     * Computed signal for the disabled state
-     * True when the control should be disabled based on 'disabled' expression
-     *
-     * Use this in your component for custom disabled state handling:
-     * ```typescript
-     * readonly disabled = this.control.disabled;
-     * ```
-     */
-    disabled = withDisabledState(this.content);
-    /**
-     * Computed signal for the readonly state
-     * True when the control should be readonly based on 'readonly' expression
-     *
-     * Use this in your component to implement readonly behavior:
-     * ```html
-     * <input [attr.readonly]="readonly() || null" ... />
-     * ```
-     */
-    readonly = withReadonlyState(this.content);
-    /**
-     * Computed signal for the update strategy
-     * Determines when form values are updated ('change', 'blur', or 'submit')
-     */
-    updateStrategy = withUpdateStrategy(this.content);
-    /**
-     * Computed signal for the dynamic label
-     * Contains the evaluated result of the dynamicLabel expression
-     *
-     * Use this in your component to display dynamic labels:
-     * ```typescript
-     * readonly displayLabel = computed(() => {
-     *   const dynamic = this.control.dynamicLabel();
-     *   return dynamic || this.content().label;
-     * });
-     * ```
-     */
-    dynamicLabel = withDynamicLabel(this.content);
-    /**
-     * Computed signal for the validators
-     * Contains validator functions derived from configuration keys
-     */
-    validators = withValidators(this.content);
-    /**
-     * Computed signal for the async validators
-     * Contains async validator functions derived from configuration keys
-     */
-    asyncValidators = withAsyncValidators(this.content);
-    /**
-     * Computed signal for the computed value
-     * Contains the evaluated result of computedValue expressions
-     */
-    computedValue = withComputedValue(this.content);
-    /**
-     * Computed signal for the form control instance
-     * Creates a new FormControl with appropriate validators and configuration
-     */
-    controlInstance = computed(() => {
-        const content = this.content();
-        const validators = this.validators();
-        const asyncValidators = this.asyncValidators();
-        const updateOn = this.updateStrategy();
-        return new FormControl(content.defaultValue, {
-            nonNullable: content.nonNullable,
-            validators,
-            asyncValidators,
-            updateOn,
-        });
-    });
-    /**
-     * Access to the parent FormGroup containing this control
-     */
-    get parentFormGroup() {
-        return this.parentContainer.control;
-    }
-    /**
-     * Access to this control's FormControl instance
-     * Use this to access validation state, errors, and other FormControl methods
-     *
-     * Example:
-     * ```typescript
-     * get hasError() {
-     *   return this.control.formControl?.hasError('required');
-     * }
-     * ```
-     */
-    get formControl() {
-        const id = this.name();
-        if (!this.parentFormGroup?.contains(id)) {
-            return null;
-        }
-        return this.parentFormGroup.get(id);
-    }
-    constructor() {
-        hiddenEffect({
-            content: this.content,
-            name: this.name,
-            controlInstance: this.controlInstance,
-            hiddenSignal: this.isHidden,
-            hideStrategySignal: this.hideStrategy,
-            valueStrategySignal: this.valueStrategy,
-            parentValueStrategySignal: this.parentValueStrategy,
-            attachFunction: this.setControl.bind(this),
-            detachFunction: this.removeControl.bind(this),
-            valueHandleFunction: this.handleValue.bind(this),
-        });
-        disabledEffect({
-            disabledSignal: this.disabled,
-            disabledHandlingSignal: this.disabledHandling,
-            enableFunction: this.enableControl.bind(this),
-            disableFunction: this.disableControl.bind(this),
-        });
-        setComputedValueEffect({
-            controlInstance: this.controlInstance,
-            computeValueSignal: this.computedValue,
-        });
-    }
-    /**
-     * Sets the visibility handling strategy
-     * Determines if visibility should be managed by the component (manual) or by Formbar (auto)
-     *
-     * Use 'manual' when implementing custom visibility handling in your component:
-     * ```typescript
-     * constructor() {
-     *   this.control.setVisibilityHandling('manual');
-     * }
-     * @param visibilityHandling Strategy for handling visibility ('auto' or 'manual')
-     */
-    setVisibilityHandling(visibilityHandling) {
-        this.visibilityHandling.set(visibilityHandling);
-    }
-    /**
-     * Sets the disabled handling strategy
-     * Determines if disabled state should be managed by the component (manual) or by Formbar (auto)
-     *
-     * @param disabledHandling Strategy for handling disabled state ('auto' or 'manual')
-     */
-    setDisabledHandling(disabledHandling) {
-        this.disabledHandling.set(disabledHandling);
-    }
-    /**
-     * Sets the function to use for building a test id.
-     *
-     * @param builderFn Function that returns the test id
-     */
-    setTestIdBuilderFn(builderFn) {
-        this.testIdBuilder.set(builderFn);
-    }
-    setControl() {
-        this.parentFormGroup?.setControl(this.name(), this.controlInstance(), {
-            emitEvent: false,
-        });
-    }
-    removeControl() {
-        const id = this.name();
-        const formControl = this.formControl;
-        // Check if control exists immediately before attempting removal
-        if (formControl) {
-            this.parentFormGroup?.removeControl(id, { emitEvent: false });
-        }
-    }
-    enableControl() {
-        const formControl = this.controlInstance();
-        formControl.enable({ emitEvent: false });
-    }
-    disableControl() {
-        const formControl = this.controlInstance();
-        formControl.disable({ emitEvent: false });
-    }
-    handleValue(valueStrategy) {
-        switch (valueStrategy) {
-            case 'last':
-                break;
-            case 'reset':
-                this.controlInstance().reset(undefined, { emitEvent: false });
-                break;
-            default:
-                this.controlInstance().setValue(this.content().defaultValue);
-                break;
-        }
-    }
-    ngOnDestroy() {
-        this.removeControl();
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbControlDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: NgxfbControlDirective, isStandalone: true, selector: "[ngxfbControl]", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.hidden": "hiddenAttribute()" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbControlDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ngxfbControl]',
-                    host: {
-                        '[attr.hidden]': 'hiddenAttribute()',
-                    },
-                }]
-        }], ctorParameters: () => [] });
-
-/**
- * Core directive for non-form elements that appear in forms.
- *
- * Block elements represent UI components that don't contribute to the form's value
- * but provide information or functionality within forms, such as:
- * - Information blocks
- * - Images
- * - Dividers
- * - Help text
- * - Custom UI elements
- *
- * This directive handles visibility conditions and test ID generation for block elements.
- *
- * Use this directive with hostDirectives in your custom block components:
- *
- * ```typescript
- * @Component({
- *   hostDirectives: [
- *     {
- *       directive: NgxfbBlockDirective,
- *       inputs: ['content', 'name'],
- *     }
- *   ],
- * })
- * export class InfoBlockComponent {
- *   private readonly blockDirective = inject(NgxfbBlockDirective<InfoBlock>);
- *   readonly content = this.blockDirective.content;
- *   readonly message = computed(() => this.content().message);
- * }
- * ```
- *
- * @template T Type of the block configuration, must extend NgxFbBaseContent
- */
-class NgxfbBlockDirective {
-    /**
-     * Reference to the parent form container.
-     * Provides access to the form that contains this block.
-     */
-    parentContainer = inject(ControlContainer);
-    /**
-     * Required input containing the block configuration.
-     * Defines properties like type, hidden condition, and custom properties.
-     */
-    content = input.required();
-    /**
-     * Required input for the block's name.
-     * Used as an identifier within the form.
-     */
-    name = input.required();
-    /**
-     * Signal for managing the visibility handling strategy ('auto' or 'manual').
-     * - 'auto': directive handles visibility via hidden attribute
-     * - 'manual': component handles visibility in its own template
-     */
-    visibilityHandling = signal('auto');
-    /**
-     * Signal for the test ID builder function.
-     * Used to customize how test IDs are generated.
-     */
-    testIdBuilder = signal(undefined);
-    /**
-     * Computed test ID derived from the block's name.
-     * Used for automated testing identification.
-     *
-     * Access this in your component template:
-     * ```html
-     * <div [attr.data-testid]="testId()">...</div>
-     * ```
-     */
-    testId = withTestId(this.content, this.name, this.testIdBuilder);
-    /**
-     * Computed signal for the hidden state.
-     * True when the block should be hidden based on 'hidden' expression.
-     *
-     * Use this in your component when implementing custom visibility handling:
-     * ```typescript
-     * readonly isHidden = this.blockDirective.isHidden;
-     * ```
-     */
-    isHidden = withHiddenState(this.content);
-    /**
-     * Computed signal for the hidden attribute.
-     * Used in DOM binding to show/hide the block element.
-     */
-    hiddenAttribute = withHiddenAttribute({
-        hiddenSignal: this.isHidden,
-        hiddenHandlingSignal: this.visibilityHandling,
-    });
-    /**
-     * Returns the parent form container.
-     * Provides access to the form instance that contains this block.
-     *
-     * Use this to access form data or methods:
-     * ```typescript
-     * const formData = this.blockDirective.rootForm.control.value;
-     * ```
-     */
-    get rootForm() {
-        return this.parentContainer;
-    }
-    /**
-     * Sets the visibility handling strategy.
-     * Determines if visibility should be managed by the component (manual) or by Formbar (auto).
-     *
-     * Use 'manual' when implementing custom visibility handling in your component:
-     * ```typescript
-     * constructor() {
-     *   this.blockDirective.setVisibilityHandling('manual');
-     * }
-     * ```
-     *
-     * @param visibilityHandling Strategy for handling visibility ('auto' or 'manual')
-     */
-    setVisibilityHandling(visibilityHandling) {
-        this.visibilityHandling.set(visibilityHandling);
-    }
-    /**
-     * Sets the function to use for building a test id.
-     * This allows custom test ID generation strategies to be used.
-     *
-     * @param builderFn Function that returns the test id
-     */
-    setTestIdBuilderFn(builderFn) {
-        this.testIdBuilder.set(builderFn);
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbBlockDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.15", type: NgxfbBlockDirective, isStandalone: true, selector: "[ngxfbBlock]", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: true, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "attr.hidden": "hiddenAttribute()" } }, ngImport: i0 });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: NgxfbBlockDirective, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[ngxfbBlock]',
-                    host: {
-                        '[attr.hidden]': 'hiddenAttribute()',
-                    },
-                }]
-        }] });
-
-/*
- * Public API Surface of core
- */
-
 /**
  * Generated bundle index. Do not edit.
  */
 
-export { NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS, NGX_FW_ASYNC_VALIDATOR_REGISTRATIONS_RESOLVED, NGX_FW_COMPONENT_REGISTRATIONS, NGX_FW_COMPONENT_RESOLVER, NGX_FW_CONFIG, NGX_FW_CONFIG_RESOLVED, NGX_FW_DEFAULT_ASYNC_VALIDATOR_REGISTRATIONS, NGX_FW_DEFAULT_CONFIG, NGX_FW_DEFAULT_UPDATE_STRATEGY, NGX_FW_DEFAULT_VALIDATOR_REGISTRATIONS, NGX_FW_VALIDATOR_REGISTRATIONS, NGX_FW_VALIDATOR_REGISTRATIONS_RESOLVED, NGX_VALIDATOR_RESOLVER, NgxfbAbstractControlDirective, NgxfbBlockDirective, NgxfbControlDirective, NgxfbFormComponent, NgxfbGroupDirective, defineFormbarConfig, provideFormbar };
+export { ComponentRegistrationService, ExpressionService, NGX_FW_COMPONENT_REGISTRATIONS, NGX_FW_COMPONENT_RESOLVER, NGX_FW_CONFIG, NGX_FW_CONFIG_RESOLVED, NGX_FW_DEFAULT_CONFIG, NGX_FW_DEFAULT_UPDATE_STRATEGY, NgxFbConfigurationService, loadComponent, resolveDisabledEffect, resolveExpression, resolveHiddenAttribute, resolveHiddenState, resolveInheritableExpression, resolveTestId, resolveUpdateStrategy, staticComponent, toSafeString };
 //# sourceMappingURL=ngx-formbar-core.mjs.map