@stemy/ngx-dynamic-form 19.9.13 → 19.9.15

package/fesm2022/stemy-ngx-dynamic-form.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, inject, Inject, Injectable, untracked, input, Renderer2, ElementRef, computed, signal, effect, HostBinding, Directive, Input, Pipe, Type, Component, output, Injector, ChangeDetectionStrategy, ViewEncapsulation, viewChild, makeEnvironmentProviders, NgModule } from '@angular/core';
+import { InjectionToken, inject, Inject, Injectable, untracked, input, Renderer2, ElementRef, computed, signal, effect, HostBinding, Directive, Input, Pipe, Type, Component, Injector, output, ChangeDetectionStrategy, ViewEncapsulation, viewChild, makeEnvironmentProviders, NgModule } from '@angular/core';
 import * as i2 from '@stemy/ngx-utils';
 import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, ForbiddenZone, ArrayUtils, API_SERVICE, StringUtils, AsyncMethodBase, EventsService, NgxUtilsModule } from '@stemy/ngx-utils';
-import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject, filter } from 'rxjs';
+import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject, map, filter } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
 import { __decorate } from 'tslib';
 import * as i1 from '@angular/forms';
@@ -743,6 +743,10 @@ class DynamicFormBuilderService {
             },
         };
         switch (type) {
+            case "checkbox":
+                data.defaultValue = data.defaultValue ?? true;
+                console.log("Helo", key, data);
+                break;
             case "number":
             case "integer":
                 props.min = convertToNumber(data.min, MIN_INPUT_NUM);
@@ -818,11 +822,11 @@ class DynamicFormBuilderService {
     }
     createFormGroup(key, fields, data, parent, options) {
         data = data || {};
+        data.defaultValue = data.defaultValue ?? {};
         const group = this.createFormField(key, undefined, data, {
             useTabs: data.useTabs === true,
         }, parent, options);
         group.asFieldSet = data.asFieldSet === true;
-        group.defaultValue = {};
         const result = fields(group.asFieldSet ? parent : group);
         const handleGroup = (fieldGroup) => {
             group.fieldGroup = fieldGroup;
@@ -834,10 +838,8 @@ class DynamicFormBuilderService {
     }
     createFormArray(key, fields, data, parent, options) {
         data = data || {};
+        data.defaultValue = data.defaultValue ?? [];
         const array = this.createFormField(key, "array", data, {
-            // initialCount: data.initialCount || 0,
-            // sortable: data.sortable || false,
-            defaultValue: [],
             useTabs: data.useTabs === true,
             tabsLabel: `${data.tabsLabel || "label"}`,
             insertItem: data.insertItem,
@@ -970,6 +972,7 @@ class DynamicFormBuilderService {
         const prefix = data.labelPrefix ?? parent?.labelPrefix;
         const field = {
             ...this.createFormSerializer(key, data),
+            defaultValue: data.defaultValue ?? null,
             fieldSet: String(data.fieldSet || ""),
             labelPrefix: prefix,
             controlTemplateKey: String(data.controlTemplateKey || ""),
@@ -1190,6 +1193,7 @@ class DynamicFormSchemaService {
             classes: property.classes,
             layout: property.layout,
             serialize: property.serialize,
+            defaultValue: property.default,
             fieldSet: property.fieldSet,
             labelPrefix: property.labelPrefix,
             purposes: property.purposes || property.purpose,
@@ -2027,9 +2031,21 @@ class DynamicFormComponent {
     legacyLabels = input(false);
     data = input({});
     fields = input(null);
-    fieldChanges = new Subject();
+    options = {
+        fieldChanges: new Subject(),
+        formState: {
+            injector: inject(Injector)
+        }
+    };
+    fieldChanges = this.options.fieldChanges.pipe(map(changes => ({
+        ...changes,
+        form: this
+    })));
     init = this.fieldChanges.pipe(first());
-    valueChanges = this.fieldChanges.pipe(filter(c => c.type === "valueChanges"));
+    valueChanges = this.fieldChanges
+        .pipe(filter(c => c.type === "valueChanges"));
+    expressionChanges = this.fieldChanges
+        .pipe(filter(c => c.type === "expressionChanges"));
     language = toSignal(this.events.languageChanged, {
         initialValue: this.languages.currentLanguage
     });
@@ -2067,13 +2083,8 @@ class DynamicFormComponent {
     onSubmit = output();
     onFieldChanges = outputFromObservable(this.fieldChanges);
     onValueChanges = outputFromObservable(this.valueChanges);
+    onExpressionChanges = outputFromObservable(this.expressionChanges);
     onInit = outputFromObservable(this.init);
-    options = {
-        fieldChanges: this.fieldChanges,
-        formState: {
-            injector: inject(Injector)
-        }
-    };
     constructor(forms, templates) {
         this.forms = forms;
         this.templates = templates;
@@ -2108,7 +2119,7 @@ class DynamicFormComponent {
         return field?.formControl ?? null;
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, deps: [{ token: DynamicFormService }, { token: DynamicFormTemplateService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { globalTemplatePrefix: { classPropertyName: "globalTemplatePrefix", publicName: "globalTemplatePrefix", isSignal: true, isRequired: false, transformFunction: null }, labelPrefix: { classPropertyName: "labelPrefix", publicName: "labelPrefix", isSignal: true, isRequired: false, transformFunction: null }, labelCustomizer: { classPropertyName: "labelCustomizer", publicName: "labelCustomizer", isSignal: true, isRequired: false, transformFunction: null }, testId: { classPropertyName: "testId", publicName: "testId", isSignal: true, isRequired: false, transformFunction: null }, useTabs: { classPropertyName: "useTabs", publicName: "useTabs", isSignal: true, isRequired: false, transformFunction: null }, legacyLabels: { classPropertyName: "legacyLabels", publicName: "legacyLabels", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onFieldChanges: "onFieldChanges", onValueChanges: "onValueChanges", onInit: "onInit" }, providers: [DynamicFormTemplateService], ngImport: i0, template: "@if (config() && group()) {\n    <form [formGroup]=\"group()\" (ngSubmit)=\"submit()\" autocomplete=\"off\" role=\"presentation\">\n        <input type=\"submit\" [hidden]=\"true\" />\n        <formly-form [model]=\"data()\"\n                     [fields]=\"config()\"\n                     [form]=\"group()\"\n                     [options]=\"options\"></formly-form>\n        <ng-content></ng-content>\n    </form>\n}\n", styles: [".dynamic-form-field.dynamic-form-hidden{display:none}.dynamic-form-field>.field-label{position:relative}.dynamic-form-field>.field-label>.field-description{font-size:.95em;font-weight:400;color:#777;margin:0}\n"], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.LegacyFormlyForm, selector: "formly-form" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { globalTemplatePrefix: { classPropertyName: "globalTemplatePrefix", publicName: "globalTemplatePrefix", isSignal: true, isRequired: false, transformFunction: null }, labelPrefix: { classPropertyName: "labelPrefix", publicName: "labelPrefix", isSignal: true, isRequired: false, transformFunction: null }, labelCustomizer: { classPropertyName: "labelCustomizer", publicName: "labelCustomizer", isSignal: true, isRequired: false, transformFunction: null }, testId: { classPropertyName: "testId", publicName: "testId", isSignal: true, isRequired: false, transformFunction: null }, useTabs: { classPropertyName: "useTabs", publicName: "useTabs", isSignal: true, isRequired: false, transformFunction: null }, legacyLabels: { classPropertyName: "legacyLabels", publicName: "legacyLabels", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onSubmit: "onSubmit", onFieldChanges: "onFieldChanges", onValueChanges: "onValueChanges", onExpressionChanges: "onExpressionChanges", onInit: "onInit" }, providers: [DynamicFormTemplateService], ngImport: i0, template: "@if (config() && group()) {\n    <form [formGroup]=\"group()\" (ngSubmit)=\"submit()\" autocomplete=\"off\" role=\"presentation\">\n        <input type=\"submit\" [hidden]=\"true\" />\n        <formly-form [model]=\"data()\"\n                     [fields]=\"config()\"\n                     [form]=\"group()\"\n                     [options]=\"options\"></formly-form>\n        <ng-content></ng-content>\n    </form>\n}\n", styles: [".dynamic-form-field.dynamic-form-hidden{display:none}.dynamic-form-field>.field-label{position:relative}.dynamic-form-field>.field-label>.field-description{font-size:.95em;font-weight:400;color:#777;margin:0}\n"], dependencies: [{ kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i3.LegacyFormlyForm, selector: "formly-form" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DynamicFormComponent, decorators: [{
             type: Component,