@ng-forge/dynamic-forms 1.3.0-next.2 → 1.3.0-next.3

package/fesm2022/ng-forge-dynamic-forms-group-field.component-DAC3P9DC.mjs

@@ -1,177 +0,0 @@
-import * as i0 from '@angular/core';
-import { inject, DestroyRef, Injector, EnvironmentInjector, input, computed, linkedSignal, runInInjectionContext, untracked, ChangeDetectionStrategy, Component } from '@angular/core';
-import { i as injectFieldRegistry, C as CONTAINER_FIELD_PROCESSORS, c as computeContainerHostClasses, a as createFieldResolutionPipe, s as setupContainerInitEffect, d as initializationComponentPath, D as DfFieldOutlet } from './ng-forge-dynamic-forms-ng-forge-dynamic-forms-CXQe_5td.mjs';
-import { outputFromObservable, toObservable } from '@angular/core/rxjs-interop';
-import { explicitEffect } from 'ngxtension/explicit-effect';
-import { injectFieldSignalContext, GROUP_CONTEXT, EventBus, DynamicFormLogger, isEqual, FIELD_SIGNAL_CONTEXT, derivedFromDeferred } from '@ng-forge/dynamic-forms/internal';
-import { form } from '@angular/forms/signals';
-import { c as createSchemaFromFields } from './ng-forge-dynamic-forms-schema-builder-BvDTzfdM.mjs';
-
-class GroupFieldComponent {
-                destroyRef = inject(DestroyRef);
-    fieldRegistry = injectFieldRegistry();
-    parentFieldSignalContext = injectFieldSignalContext();
-    parentGroupContext = inject(GROUP_CONTEXT, { optional: true });
-    injector = inject(Injector);
-    environmentInjector = inject(EnvironmentInjector);
-    eventBus = inject(EventBus);
-    logger = inject(DynamicFormLogger);
-                fieldProcessors = inject(CONTAINER_FIELD_PROCESSORS);
-                field = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "field" }] : /* istanbul ignore next */ []));
-    key = input.required(/* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "key" }] : /* istanbul ignore next */ []));
-    className = input(/* @ts-ignore */
-    ...(ngDevMode ? [undefined, { debugName: "className" }] : /* istanbul ignore next */ []));
-    hidden = input(false, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hidden" }] : /* istanbul ignore next */ []));
-                hostClasses = computed(() => computeContainerHostClasses('group', this.className()), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []));
-    rawFieldRegistry = computed(() => this.fieldRegistry.raw, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "rawFieldRegistry" }] : /* istanbul ignore next */ []));
-    formSetup = computed(() => {
-        const groupField = this.field();
-        const registry = this.rawFieldRegistry();
-        if (groupField.fields && groupField.fields.length > 0) {
-            const flattenedFields = this.fieldProcessors.memoizedFlattenFields(groupField.fields, registry);
-            const flattenedFieldsForRendering = this.fieldProcessors.memoizedFlattenFieldsForRendering(groupField.fields, registry);
-            const fieldsById = this.fieldProcessors.memoizedKeyBy(flattenedFields);
-            const defaultValues = this.fieldProcessors.memoizedDefaultValues(fieldsById, registry);
-            return {
-                fields: flattenedFieldsForRendering,
-                schemaFields: flattenedFields,
-                originalFields: groupField.fields,
-                defaultValues,
-                registry,
-            };
-        }
-        return {
-            fields: [],
-            schemaFields: [],
-            originalFields: [],
-            defaultValues: {},
-            registry,
-        };
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "formSetup" }] : /* istanbul ignore next */ []));
-    defaultValues = linkedSignal(() => this.formSetup().defaultValues, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "defaultValues" }] : /* istanbul ignore next */ []));
-        entity = linkedSignal(() => {
-        const parentValue = this.parentFieldSignalContext.value();
-        const groupKey = this.field().key;
-        const defaults = this.defaultValues();
-        const groupValue = parentValue?.[groupKey] || {};
-        return { ...defaults, ...groupValue };
-    }, {
-        debugName: 'GroupFieldComponent.entity',
-        equal: isEqual,
-    });
-    form = computed(() => {
-        return runInInjectionContext(this.injector, () => {
-            const setup = this.formSetup();
-            if (setup.schemaFields.length > 0) {
-                const schema = createSchemaFromFields(setup.schemaFields, setup.registry);
-                return untracked(() => form(this.entity, schema));
-            }
-            return untracked(() => form(this.entity));
-        });
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []));
-                formValue = computed(() => this.entity(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "formValue" }] : /* istanbul ignore next */ []));
-    valid = computed(() => this.form()().valid(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "valid" }] : /* istanbul ignore next */ []));
-    invalid = computed(() => this.form()().invalid(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "invalid" }] : /* istanbul ignore next */ []));
-    dirty = computed(() => this.form()().dirty(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "dirty" }] : /* istanbul ignore next */ []));
-    touched = computed(() => this.form()().touched(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "touched" }] : /* istanbul ignore next */ []));
-    errors = computed(() => this.form()().errors(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "errors" }] : /* istanbul ignore next */ []));
-    disabled = computed(() => this.form()().disabled(), /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
-    nestedFieldTree = computed(() => {
-        const parentForm = this.parentFieldSignalContext.form;
-        const groupKey = this.field().key;
-        return parentForm[groupKey];
-    }, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "nestedFieldTree" }] : /* istanbul ignore next */ []));
-    groupFieldSignalContext = (() => {
-        const nestedFieldTree = this.nestedFieldTree;
-        return {
-            injector: this.injector,
-            value: this.parentFieldSignalContext.value,
-            defaultValues: this.defaultValues,
-            get form() {
-                return nestedFieldTree() ?? {};
-            },
-        };
-    })();
-        groupContext = {
-        groupPath: computed(() => {
-            const ownKey = this.field().key;
-            const parentPath = this.parentGroupContext?.groupPath();
-            return parentPath ? `${parentPath}.${ownKey}` : ownKey;
-        }),
-    };
-    groupInjector = Injector.create({
-        parent: this.injector,
-        providers: [
-            { provide: FIELD_SIGNAL_CONTEXT, useValue: this.groupFieldSignalContext },
-            { provide: GROUP_CONTEXT, useValue: this.groupContext },
-        ],
-    });
-                validityChange = outputFromObservable(toObservable(this.valid));
-    dirtyChange = outputFromObservable(toObservable(this.dirty));
-    submitted = outputFromObservable(this.eventBus.on('submit'));
-                fieldsSource = computed(() => this.formSetup().fields, /* @ts-ignore */
-    ...(ngDevMode ? [{ debugName: "fieldsSource" }] : /* istanbul ignore next */ []));
-    resolvedFields = derivedFromDeferred(this.fieldsSource, createFieldResolutionPipe(() => ({
-        loadTypeComponent: (type) => this.fieldRegistry.loadTypeComponent(type),
-        registry: this.rawFieldRegistry(),
-        injector: this.groupInjector,
-        destroyRef: this.destroyRef,
-        onError: (fieldDef, error) => {
-            const fieldKey = fieldDef.key || '<no key>';
-            this.logger.error(`Failed to load component for field type '${fieldDef.type}' (key: ${fieldKey}) ` +
-                `within group '${this.field().key}'. Ensure the field type is registered in your field registry.`, error);
-        },
-    })), { initialValue: [], injector: this.injector });
-                constructor() {
-        this.setupEffects();
-    }
-                setupEffects() {
-        setupContainerInitEffect(this.resolvedFields, this.eventBus, 'group', () => initializationComponentPath(this.field().key, this.parentGroupContext?.groupPath()), this.injector);
-        explicitEffect([this.nestedFieldTree, this.field], ([tree, field]) => {
-            if (!tree) {
-                this.logger.warn(`Group field "${field.key}" not found in parent form. ` + `Ensure the parent form schema includes this group field.`);
-            }
-        }, { defer: true });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: GroupFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.5", type: GroupFieldComponent, isStandalone: true, selector: "fieldset[group-field]", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, key: { classPropertyName: "key", publicName: "key", isSignal: true, isRequired: true, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, hidden: { classPropertyName: "hidden", publicName: "hidden", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { validityChange: "validityChange", dirtyChange: "dirtyChange", submitted: "submitted" }, host: { attributes: { "role": "group" }, properties: { "class": "hostClasses()", "class.disabled": "disabled()", "class.df-container-hidden": "hidden()", "attr.aria-hidden": "hidden() || null", "id": "`${key()}`", "attr.data-testid": "key()" } }, ngImport: i0, template: `
-    @for (field of resolvedFields(); track field.key) {
-      <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
-    }
-  `, isInline: true, styles: [".df-form{display:grid;grid-template-columns:1fr;gap:var(--df-grid-row-gap, .5rem);width:100%}.df-form>*{grid-column:1/-1}.df-row{display:grid;grid-template-columns:repeat(var(--df-grid-columns, 12),1fr);gap:var(--df-grid-gap, .5rem);align-items:start;width:100%}.df-row>*:not([class*=df-col-]){grid-column:1/-1}.df-col-1{grid-column:span 1}.df-col-2{grid-column:span 2}.df-col-3{grid-column:span 3}.df-col-4{grid-column:span 4}.df-col-5{grid-column:span 5}.df-col-6{grid-column:span 6}.df-col-7{grid-column:span 7}.df-col-8{grid-column:span 8}.df-col-9{grid-column:span 9}.df-col-10{grid-column:span 10}.df-col-11{grid-column:span 11}.df-col-12{grid-column:span 12}.df-col-auto{grid-column:span auto;width:auto}.df-col-full{grid-column:1/-1}.df-col-start-1{grid-column-start:1}.df-col-start-2{grid-column-start:2}.df-col-start-3{grid-column-start:3}.df-col-start-4{grid-column-start:4}.df-col-start-5{grid-column-start:5}.df-col-start-6{grid-column-start:6}.df-col-start-7{grid-column-start:7}.df-col-start-8{grid-column-start:8}.df-col-start-9{grid-column-start:9}.df-col-start-10{grid-column-start:10}.df-col-start-11{grid-column-start:11}.df-col-start-12{grid-column-start:12}.df-col-end-1{grid-column-end:1}.df-col-end-2{grid-column-end:2}.df-col-end-3{grid-column-end:3}.df-col-end-4{grid-column-end:4}.df-col-end-5{grid-column-end:5}.df-col-end-6{grid-column-end:6}.df-col-end-7{grid-column-end:7}.df-col-end-8{grid-column-end:8}.df-col-end-9{grid-column-end:9}.df-col-end-10{grid-column-end:10}.df-col-end-11{grid-column-end:11}.df-col-end-12{grid-column-end:12}.df-col-end-13{grid-column-end:13}@media(max-width:576px){.df-form{--df-grid-gap: var(--df-grid-gap-sm, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-sm, .5rem)}.df-row{grid-template-columns:1fr}.df-row>*{grid-column:1/-1!important}.df-row.df-row-mobile-keep-cols{grid-template-columns:repeat(var(--df-grid-columns, 12),1fr)}.df-row.df-row-mobile-keep-cols>*{grid-column:revert!important}}@media(min-width:577px)and (max-width:768px){.df-form{--df-grid-gap: var(--df-grid-gap-md, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-md, .5rem)}.df-row{--df-grid-columns: 6}.df-col-sm-1{grid-column:span 1}.df-col-sm-2{grid-column:span 2}.df-col-sm-3{grid-column:span 3}.df-col-sm-4{grid-column:span 4}.df-col-sm-5{grid-column:span 5}.df-col-sm-6{grid-column:span 6}.df-col-sm-full{grid-column:1/-1}}@media(min-width:769px)and (max-width:992px){.df-form{--df-grid-gap: var(--df-grid-gap-lg, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-lg, .5rem)}.df-col-md-1{grid-column:span 1}.df-col-md-2{grid-column:span 2}.df-col-md-3{grid-column:span 3}.df-col-md-4{grid-column:span 4}.df-col-md-5{grid-column:span 5}.df-col-md-6{grid-column:span 6}.df-col-md-7{grid-column:span 7}.df-col-md-8{grid-column:span 8}.df-col-md-9{grid-column:span 9}.df-col-md-10{grid-column:span 10}.df-col-md-11{grid-column:span 11}.df-col-md-12{grid-column:span 12}.df-col-md-full{grid-column:1/-1}}@media(min-width:993px){.df-form{--df-grid-gap: var(--df-grid-gap-xl, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-xl, .5rem)}.df-col-lg-1{grid-column:span 1}.df-col-lg-2{grid-column:span 2}.df-col-lg-3{grid-column:span 3}.df-col-lg-4{grid-column:span 4}.df-col-lg-5{grid-column:span 5}.df-col-lg-6{grid-column:span 6}.df-col-lg-7{grid-column:span 7}.df-col-lg-8{grid-column:span 8}.df-col-lg-9{grid-column:span 9}.df-col-lg-10{grid-column:span 10}.df-col-lg-11{grid-column:span 11}.df-col-lg-12{grid-column:span 12}.df-col-lg-full{grid-column:1/-1}}.df-gap-none{--df-grid-gap: 0}.df-gap-xs{--df-grid-gap: .25rem}.df-gap-sm{--df-grid-gap: .5rem}.df-gap-md{--df-grid-gap: 1rem}.df-gap-lg{--df-grid-gap: 1.5rem}.df-gap-xl{--df-grid-gap: 2rem}.df-row-gap-none{--df-grid-row-gap: 0}.df-row-gap-xs{--df-grid-row-gap: .25rem}.df-row-gap-sm{--df-grid-row-gap: .5rem}.df-row-gap-md{--df-grid-row-gap: 1rem}.df-row-gap-lg{--df-grid-row-gap: 1.5rem}.df-row-gap-xl{--df-grid-row-gap: 2rem}.df-field{display:block;width:100%;min-width:0;overflow:hidden;margin:0}.df-group,.df-page{display:block;width:100%}.df-form.disabled,.df-row.disabled,.df-field.disabled{opacity:.6;pointer-events:none}.df-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-sr-only-focusable:focus,.df-sr-only-focusable:active{position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal}.df-live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-form :focus-visible{outline:2px solid var(--df-focus-color, #005fcc);outline-offset:2px}.df-group:focus-within{outline:1px dashed var(--df-focus-color, #005fcc);outline-offset:4px}:host{border:none;margin:0;padding:0;min-width:0;display:grid;grid-template-columns:1fr;gap:var(--df-grid-row-gap, .5rem);width:100%}:host>*{grid-column:1/-1}:host.df-container-hidden{display:none}\n"], dependencies: [{ kind: "directive", type: DfFieldOutlet, selector: "[dfFieldOutlet]", inputs: ["dfFieldOutlet", "dfFieldOutletEnvironmentInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.5", ngImport: i0, type: GroupFieldComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'fieldset[group-field]', imports: [DfFieldOutlet], template: `
-    @for (field of resolvedFields(); track field.key) {
-      <ng-container *dfFieldOutlet="field; environmentInjector: environmentInjector" />
-    }
-  `, host: {
-                        '[class]': 'hostClasses()',
-                        role: 'group',
-                        '[class.disabled]': 'disabled()',
-                        '[class.df-container-hidden]': 'hidden()',
-                        '[attr.aria-hidden]': 'hidden() || null',
-                                                                                                '[id]': '`${key()}`',
-                        '[attr.data-testid]': 'key()',
-                    }, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".df-form{display:grid;grid-template-columns:1fr;gap:var(--df-grid-row-gap, .5rem);width:100%}.df-form>*{grid-column:1/-1}.df-row{display:grid;grid-template-columns:repeat(var(--df-grid-columns, 12),1fr);gap:var(--df-grid-gap, .5rem);align-items:start;width:100%}.df-row>*:not([class*=df-col-]){grid-column:1/-1}.df-col-1{grid-column:span 1}.df-col-2{grid-column:span 2}.df-col-3{grid-column:span 3}.df-col-4{grid-column:span 4}.df-col-5{grid-column:span 5}.df-col-6{grid-column:span 6}.df-col-7{grid-column:span 7}.df-col-8{grid-column:span 8}.df-col-9{grid-column:span 9}.df-col-10{grid-column:span 10}.df-col-11{grid-column:span 11}.df-col-12{grid-column:span 12}.df-col-auto{grid-column:span auto;width:auto}.df-col-full{grid-column:1/-1}.df-col-start-1{grid-column-start:1}.df-col-start-2{grid-column-start:2}.df-col-start-3{grid-column-start:3}.df-col-start-4{grid-column-start:4}.df-col-start-5{grid-column-start:5}.df-col-start-6{grid-column-start:6}.df-col-start-7{grid-column-start:7}.df-col-start-8{grid-column-start:8}.df-col-start-9{grid-column-start:9}.df-col-start-10{grid-column-start:10}.df-col-start-11{grid-column-start:11}.df-col-start-12{grid-column-start:12}.df-col-end-1{grid-column-end:1}.df-col-end-2{grid-column-end:2}.df-col-end-3{grid-column-end:3}.df-col-end-4{grid-column-end:4}.df-col-end-5{grid-column-end:5}.df-col-end-6{grid-column-end:6}.df-col-end-7{grid-column-end:7}.df-col-end-8{grid-column-end:8}.df-col-end-9{grid-column-end:9}.df-col-end-10{grid-column-end:10}.df-col-end-11{grid-column-end:11}.df-col-end-12{grid-column-end:12}.df-col-end-13{grid-column-end:13}@media(max-width:576px){.df-form{--df-grid-gap: var(--df-grid-gap-sm, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-sm, .5rem)}.df-row{grid-template-columns:1fr}.df-row>*{grid-column:1/-1!important}.df-row.df-row-mobile-keep-cols{grid-template-columns:repeat(var(--df-grid-columns, 12),1fr)}.df-row.df-row-mobile-keep-cols>*{grid-column:revert!important}}@media(min-width:577px)and (max-width:768px){.df-form{--df-grid-gap: var(--df-grid-gap-md, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-md, .5rem)}.df-row{--df-grid-columns: 6}.df-col-sm-1{grid-column:span 1}.df-col-sm-2{grid-column:span 2}.df-col-sm-3{grid-column:span 3}.df-col-sm-4{grid-column:span 4}.df-col-sm-5{grid-column:span 5}.df-col-sm-6{grid-column:span 6}.df-col-sm-full{grid-column:1/-1}}@media(min-width:769px)and (max-width:992px){.df-form{--df-grid-gap: var(--df-grid-gap-lg, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-lg, .5rem)}.df-col-md-1{grid-column:span 1}.df-col-md-2{grid-column:span 2}.df-col-md-3{grid-column:span 3}.df-col-md-4{grid-column:span 4}.df-col-md-5{grid-column:span 5}.df-col-md-6{grid-column:span 6}.df-col-md-7{grid-column:span 7}.df-col-md-8{grid-column:span 8}.df-col-md-9{grid-column:span 9}.df-col-md-10{grid-column:span 10}.df-col-md-11{grid-column:span 11}.df-col-md-12{grid-column:span 12}.df-col-md-full{grid-column:1/-1}}@media(min-width:993px){.df-form{--df-grid-gap: var(--df-grid-gap-xl, .5rem);--df-grid-row-gap: var(--df-grid-row-gap-xl, .5rem)}.df-col-lg-1{grid-column:span 1}.df-col-lg-2{grid-column:span 2}.df-col-lg-3{grid-column:span 3}.df-col-lg-4{grid-column:span 4}.df-col-lg-5{grid-column:span 5}.df-col-lg-6{grid-column:span 6}.df-col-lg-7{grid-column:span 7}.df-col-lg-8{grid-column:span 8}.df-col-lg-9{grid-column:span 9}.df-col-lg-10{grid-column:span 10}.df-col-lg-11{grid-column:span 11}.df-col-lg-12{grid-column:span 12}.df-col-lg-full{grid-column:1/-1}}.df-gap-none{--df-grid-gap: 0}.df-gap-xs{--df-grid-gap: .25rem}.df-gap-sm{--df-grid-gap: .5rem}.df-gap-md{--df-grid-gap: 1rem}.df-gap-lg{--df-grid-gap: 1.5rem}.df-gap-xl{--df-grid-gap: 2rem}.df-row-gap-none{--df-grid-row-gap: 0}.df-row-gap-xs{--df-grid-row-gap: .25rem}.df-row-gap-sm{--df-grid-row-gap: .5rem}.df-row-gap-md{--df-grid-row-gap: 1rem}.df-row-gap-lg{--df-grid-row-gap: 1.5rem}.df-row-gap-xl{--df-grid-row-gap: 2rem}.df-field{display:block;width:100%;min-width:0;overflow:hidden;margin:0}.df-group,.df-page{display:block;width:100%}.df-form.disabled,.df-row.disabled,.df-field.disabled{opacity:.6;pointer-events:none}.df-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-sr-only-focusable:focus,.df-sr-only-focusable:active{position:static;width:auto;height:auto;padding:inherit;margin:inherit;overflow:visible;clip:auto;white-space:normal}.df-live-region{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.df-form :focus-visible{outline:2px solid var(--df-focus-color, #005fcc);outline-offset:2px}.df-group:focus-within{outline:1px dashed var(--df-focus-color, #005fcc);outline-offset:4px}:host{border:none;margin:0;padding:0;min-width:0;display:grid;grid-template-columns:1fr;gap:var(--df-grid-row-gap, .5rem);width:100%}:host>*{grid-column:1/-1}:host.df-container-hidden{display:none}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { field: [{ type: i0.Input, args: [{ isSignal: true, alias: "field", required: true }] }], key: [{ type: i0.Input, args: [{ isSignal: true, alias: "key", required: true }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], hidden: [{ type: i0.Input, args: [{ isSignal: true, alias: "hidden", required: false }] }], validityChange: [{ type: i0.Output, args: ["validityChange"] }], dirtyChange: [{ type: i0.Output, args: ["dirtyChange"] }], submitted: [{ type: i0.Output, args: ["submitted"] }] } });
-
-export { GroupFieldComponent, GroupFieldComponent as default };
-//# sourceMappingURL=ng-forge-dynamic-forms-group-field.component-DAC3P9DC.mjs.map

package/fesm2022/ng-forge-dynamic-forms-group-field.component-DAC3P9DC.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ng-forge-dynamic-forms-group-field.component-DAC3P9DC.mjs","mappings":";;;;;;;;;AA4Dc;YAKK;;;;AAIA;AACE;AACF;AACA;YAMA;;;;;AAQjB;;;;YAOS;;;;AAIQ;AACf;AACA;AAEA;AACE;AACA;;AAEA;;AAGE;AACA;;;;;;;AAQF;AACA;AACA;AACA;;;;;;;AAOJ,IAKiB;;;AAIb;;AAEA;AACF;AAEE;AACA;AACD;AAGc;AACf;AACE;;AAGE;AACA;;AAGF;AACF;;;;;AAQO;;AACA;;AACA;;AACA;;AACA;;AACA;;AAEQ;AACf;;AAEA;;;;AAIA;;;AAGE;;AAEA;AACE;;;;AAKN,IAMiB;AACf;;;AAGE;AACF;;AAGe;;AAEf;;;AAGC;AACF;;;AAQQ;;;AAQU;AAGf;AACA;;;AAGA;AACE;;;;AAOH;YAQH;;;;AASE;AAQA;;AAIM;;AAIJ;;;AArNe;;;;AAhBlB;;;;AANS;;;;;AASR;AACA;AACA;AACA;AACA;wEAIA;AACA","names":[],"ignoreList":[],"sources":["../../../../packages/dynamic-forms/src/lib/fields/group/group-field.component.ts"],"sourcesContent":["import {\n  ChangeDetectionStrategy,\n  Component,\n  computed,\n  DestroyRef,\n  EnvironmentInjector,\n  inject,\n  Injector,\n  input,\n  linkedSignal,\n  runInInjectionContext,\n  untracked,\n} from '@angular/core';\nimport { DfFieldOutlet } from '../../directives/df-field-outlet/df-field-outlet.directive';\nimport { outputFromObservable, toObservable } from '@angular/core/rxjs-interop';\nimport { explicitEffect } from 'ngxtension/explicit-effect';\nimport { derivedFromDeferred } from '@ng-forge/dynamic-forms/internal';\nimport { createFieldResolutionPipe, ResolvedField } from '../../utils/resolve-field/resolve-field';\nimport {\n  computeContainerHostClasses,\n  initializationComponentPath,\n  setupContainerInitEffect,\n} from '../../utils/container-utils/container-utils';\nimport { CONTAINER_FIELD_PROCESSORS } from '../../utils/container-utils/container-field-processors';\nimport { isEqual } from '@ng-forge/dynamic-forms/internal';\nimport { DynamicFormLogger } from '@ng-forge/dynamic-forms/internal';\nimport { GroupField } from '@ng-forge/dynamic-forms/internal';\nimport { injectFieldRegistry } from '../../utils/inject-field-registry/inject-field-registry';\nimport { FieldTree, form } from '@angular/forms/signals';\nimport { FieldDef } from '@ng-forge/dynamic-forms/internal';\nimport { FieldSignalContext, GroupContext } from '@ng-forge/dynamic-forms/internal';\nimport { FIELD_SIGNAL_CONTEXT, GROUP_CONTEXT, injectFieldSignalContext } from '@ng-forge/dynamic-forms/internal';\nimport { createSchemaFromFields } from '../../core/schema-builder';\nimport { EventBus } from '@ng-forge/dynamic-forms/internal';\nimport { FormSubmitEvent } from '../../events/constants/submit.event';\n\n/** Container component for rendering nested form groups. */\n@Component({\n  selector: 'fieldset[group-field]',\n  imports: [DfFieldOutlet],\n  template: `\n    @for (field of resolvedFields(); track field.key) {\n      <ng-container *dfFieldOutlet=\"field; environmentInjector: environmentInjector\" />\n    }\n  `,\n  styleUrl: './group-field.component.scss',\n  host: {\n    '[class]': 'hostClasses()',\n    role: 'group',\n    '[class.disabled]': 'disabled()',\n    '[class.df-container-hidden]': 'hidden()',\n    '[attr.aria-hidden]': 'hidden() || null',\n    // The group element's own id is the plain `key()` — only its DESCENDANTS\n    // compose scoped ids via GROUP_CONTEXT (e.g. children of an `address`\n    // group render as `address_street`). The group selector is `#address`.\n    '[id]': '`${key()}`',\n    '[attr.data-testid]': 'key()',\n  },\n  changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport default class GroupFieldComponent<TModel extends Record<string, unknown> = Record<string, unknown>> {\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Dependencies\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  private readonly destroyRef = inject(DestroyRef);\n  private readonly fieldRegistry = injectFieldRegistry();\n  private readonly parentFieldSignalContext = injectFieldSignalContext<TModel>();\n  private readonly parentGroupContext = inject(GROUP_CONTEXT, { optional: true });\n  private readonly injector = inject(Injector);\n  protected readonly environmentInjector = inject(EnvironmentInjector);\n  private readonly eventBus = inject(EventBus);\n  private readonly logger = inject(DynamicFormLogger);\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Memoized Functions\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  private readonly fieldProcessors = inject(CONTAINER_FIELD_PROCESSORS);\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Inputs\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  field = input.required<GroupField>();\n  key = input.required<string>();\n  className = input<string>();\n  hidden = input(false);\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Computed Signals\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  readonly hostClasses = computed(() => computeContainerHostClasses('group', this.className()));\n\n  private readonly rawFieldRegistry = computed(() => this.fieldRegistry.raw);\n\n  private readonly formSetup = computed(() => {\n    const groupField = this.field();\n    const registry = this.rawFieldRegistry();\n\n    if (groupField.fields && groupField.fields.length > 0) {\n      const flattenedFields = this.fieldProcessors.memoizedFlattenFields(groupField.fields, registry);\n      const flattenedFieldsForRendering = this.fieldProcessors.memoizedFlattenFieldsForRendering(groupField.fields, registry);\n      const fieldsById = this.fieldProcessors.memoizedKeyBy(flattenedFields);\n      const defaultValues = this.fieldProcessors.memoizedDefaultValues(fieldsById, registry);\n\n      return {\n        fields: flattenedFieldsForRendering,\n        schemaFields: flattenedFields,\n        originalFields: groupField.fields,\n        defaultValues,\n        registry,\n      };\n    }\n\n    return {\n      fields: [],\n      schemaFields: [],\n      originalFields: [],\n      defaultValues: {},\n      registry,\n    };\n  });\n\n  readonly defaultValues = linkedSignal(() => this.formSetup().defaultValues);\n\n  /**\n   * Entity computed from parent value, group key, and defaults.\n   * Uses deep equality check to prevent unnecessary updates when\n   * object spread creates new references with identical values.\n   */\n  private readonly entity = linkedSignal(\n    () => {\n      const parentValue = this.parentFieldSignalContext.value();\n      const groupKey = this.field().key;\n      const defaults = this.defaultValues();\n      const groupValue = (parentValue as Record<string, unknown>)?.[groupKey] || {};\n      return { ...defaults, ...groupValue };\n    },\n    {\n      debugName: 'GroupFieldComponent.entity',\n      equal: isEqual,\n    },\n  );\n\n  private readonly form = computed(() => {\n    return runInInjectionContext(this.injector, () => {\n      const setup = this.formSetup();\n\n      if (setup.schemaFields.length > 0) {\n        const schema = createSchemaFromFields(setup.schemaFields, setup.registry);\n        return untracked(() => form(this.entity, schema));\n      }\n\n      return untracked(() => form(this.entity));\n    });\n  });\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Public State Signals\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  readonly formValue = computed(() => this.entity());\n  readonly valid = computed(() => this.form()().valid());\n  readonly invalid = computed(() => this.form()().invalid());\n  readonly dirty = computed(() => this.form()().dirty());\n  readonly touched = computed(() => this.form()().touched());\n  readonly errors = computed(() => this.form()().errors());\n  readonly disabled = computed(() => this.form()().disabled());\n\n  private readonly nestedFieldTree = computed((): FieldTree<Record<string, unknown>> | undefined => {\n    const parentForm = this.parentFieldSignalContext.form as Record<string, FieldTree<Record<string, unknown>>>;\n    const groupKey = this.field().key;\n    return parentForm[groupKey];\n  });\n\n  private readonly groupFieldSignalContext: FieldSignalContext<Record<string, unknown>> = (() => {\n    const nestedFieldTree = this.nestedFieldTree;\n    return {\n      injector: this.injector,\n      value: this.parentFieldSignalContext.value,\n      defaultValues: this.defaultValues,\n      get form() {\n        return nestedFieldTree() ?? ({} as FieldTree<Record<string, unknown>>);\n      },\n    };\n  })();\n\n  /**\n   * Group context propagated to descendants — carries the dot-separated path of\n   * group ancestors so child fields can scope their DOM IDs (issue #401).\n   * Reactive via `computed()`: a nested group composes its path from the parent\n   * context signal + its own key, so the chain stays consistent if either changes.\n   */\n  private readonly groupContext: GroupContext = {\n    groupPath: computed(() => {\n      const ownKey = this.field().key;\n      const parentPath = this.parentGroupContext?.groupPath();\n      return parentPath ? `${parentPath}.${ownKey}` : ownKey;\n    }),\n  };\n\n  private readonly groupInjector = Injector.create({\n    parent: this.injector,\n    providers: [\n      { provide: FIELD_SIGNAL_CONTEXT, useValue: this.groupFieldSignalContext },\n      { provide: GROUP_CONTEXT, useValue: this.groupContext },\n    ],\n  });\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Outputs\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  readonly validityChange = outputFromObservable(toObservable(this.valid));\n  readonly dirtyChange = outputFromObservable(toObservable(this.dirty));\n  readonly submitted = outputFromObservable(this.eventBus.on<FormSubmitEvent>('submit'));\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Field Resolution\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  private readonly fieldsSource = computed(() => this.formSetup().fields);\n\n  protected readonly resolvedFields = derivedFromDeferred(\n    this.fieldsSource,\n    createFieldResolutionPipe(() => ({\n      loadTypeComponent: (type: string) => this.fieldRegistry.loadTypeComponent(type),\n      registry: this.rawFieldRegistry(),\n      injector: this.groupInjector,\n      destroyRef: this.destroyRef,\n      onError: (fieldDef: FieldDef<unknown>, error: unknown) => {\n        const fieldKey = fieldDef.key || '<no key>';\n        this.logger.error(\n          `Failed to load component for field type '${fieldDef.type}' (key: ${fieldKey}) ` +\n            `within group '${this.field().key}'. Ensure the field type is registered in your field registry.`,\n          error,\n        );\n      },\n    })),\n    { initialValue: [] as ResolvedField[], injector: this.injector },\n  );\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Constructor\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  constructor() {\n    this.setupEffects();\n  }\n\n  // ─────────────────────────────────────────────────────────────────────────────\n  // Private Methods\n  // ─────────────────────────────────────────────────────────────────────────────\n\n  private setupEffects(): void {\n    setupContainerInitEffect(\n      this.resolvedFields,\n      this.eventBus,\n      'group',\n      () => initializationComponentPath(this.field().key, this.parentGroupContext?.groupPath()),\n      this.injector,\n    );\n\n    explicitEffect(\n      [this.nestedFieldTree, this.field],\n      ([tree, field]) => {\n        if (!tree) {\n          this.logger.warn(\n            `Group field \"${field.key}\" not found in parent form. ` + `Ensure the parent form schema includes this group field.`,\n          );\n        }\n      },\n      { defer: true },\n    );\n  }\n}\n\nexport { GroupFieldComponent };\n"]}