@stemy/ngx-dynamic-form 19.8.12 → 19.8.14

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

@@ -1,6 +1,6 @@
 import * as i2 from '@stemy/ngx-utils';
 import { cachedFactory, ReflectUtils, ObjectUtils, LANGUAGE_SERVICE, FactoryDependencies, ForbiddenZone, ArrayUtils, API_SERVICE, StringUtils, AsyncMethodBase, EventsService, NgxUtilsModule } from '@stemy/ngx-utils';
-import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject } from 'rxjs';
+import { of, merge, Observable, firstValueFrom, BehaviorSubject, combineLatestWith, switchMap, distinctUntilChanged, first, Subject, filter } from 'rxjs';
 import { debounceTime } from 'rxjs/operators';
 import { __decorate } from 'tslib';
 import * as i0 from '@angular/core';
@@ -256,6 +256,9 @@ function setFieldProps(field, values) {
 function setFieldProp(field, prop, value) {
     return setFieldProps(field, { [prop]: value });
 }
+function setFieldSerialize(field, serialize = true) {
+    field.serialize = ObjectUtils.isFunction(serialize) ? serialize : () => serialize;
+}
 function setFieldHidden(field, hidden = true) {
     setFieldProp(field, "__hidden", ObjectUtils.isFunction(hidden) ? hidden : () => hidden);
 }
@@ -541,6 +544,7 @@ async function toWrapOptions(customizeOrOptions, injector, schema, errorMsg) {
     let schemaOptions = customizeOrOptions;
     if (!ObjectUtils.isObject(schemaOptions)) {
         schemaOptions = {
+            context: {},
             fieldCustomizer: customizeOrOptions
         };
     }
@@ -838,8 +842,8 @@ class DynamicFormBuilderService {
                 if (lang && translation) {
                     // Use translation component if the sub items are correct
                     array.type = "translation";
-                    lang.serialize = () => true;
                     setFieldHidden(lang);
+                    setFieldSerialize(lang);
                     setFieldProp(translation, "label", "");
                 }
                 this.setExpressions(array.fieldArray, options);
@@ -912,7 +916,9 @@ class DynamicFormBuilderService {
         options = options || { labelPrefix: "" };
         const labelPrefix = !ObjectUtils.isString(options.labelPrefix) ? `` : options.labelPrefix;
         if (ObjectUtils.isFunction(options.labelCustomizer)) {
-            return options.labelCustomizer(key, label, parent, labelPrefix) || "";
+            const customLabel = options.labelCustomizer(key, label, parent, labelPrefix);
+            if (ObjectUtils.isString(customLabel))
+                return customLabel;
         }
         // Exceptional case, to be able to have an "empty" label element in the HTML just to fill the space.
         if (label === " ")
@@ -1776,6 +1782,8 @@ class DynamicFormComponent {
     data = input({});
     fields = input(null);
     fieldChanges = new Subject();
+    init = this.fieldChanges.pipe(first());
+    valueChanges = this.fieldChanges.pipe(filter(c => c.type === "valueChanges"));
     language = toSignal(this.events.languageChanged, {
         initialValue: this.languages.currentLanguage
     });
@@ -1812,7 +1820,9 @@ class DynamicFormComponent {
     });
     status = computed(() => this.status$.value());
     onSubmit = output();
-    onChanges = outputFromObservable(this.fieldChanges);
+    onFieldChanges = outputFromObservable(this.fieldChanges);
+    onValueChanges = outputFromObservable(this.valueChanges);
+    onInit = outputFromObservable(this.init);
     options = {
         fieldChanges: this.fieldChanges,
         formState: {
@@ -1849,7 +1859,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 }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DynamicFormComponent, isStandalone: false, selector: "dynamic-form", inputs: { 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", onChanges: "onChanges" }, 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}\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: { 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" }, 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}\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,
@@ -2119,5 +2129,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AsyncSubmitDirective, DynamicFieldType, DynamicFormAlertComponent, DynamicFormArrayComponent, DynamicFormBuilderService, DynamicFormChipsComponent, DynamicFormComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormSchemaService, DynamicFormService, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, EDITOR_FORMATS, FORM_ROOT_ID, FormArray, FormFieldSet, FormGroup, FormInput, FormSelect, FormSerializable, FormStatic, FormUpload, MAX_INPUT_NUM, MIN_INPUT_NUM, NgxDynamicFormModule, RichTranslationModel, TranslationModel, addFieldValidators, arrayLengthValidation, clearFieldArray, controlStatus, controlValues, convertToDate, convertToDateFormat, convertToNumber, customizeFormField, emailValidation, getFieldByPath, getFieldsByKey, getFieldsByPredicate, getSelectOptions, insertToFieldArray, isFieldHidden, isFieldVisible, jsonValidation, maxLengthValidation, maxValueValidation, minLengthValidation, minValueValidation, phoneValidation, removeFieldValidators, removeFromFieldArray, replaceFieldArray, replaceSpecialChars, requiredValidation, setFieldDefault, setFieldDisabled, setFieldHidden, setFieldHooks, setFieldProp, setFieldProps, setFieldValue, translationValidation };
+export { AsyncSubmitDirective, DynamicFieldType, DynamicFormAlertComponent, DynamicFormArrayComponent, DynamicFormBuilderService, DynamicFormChipsComponent, DynamicFormComponent, DynamicFormFieldComponent, DynamicFormFieldsetComponent, DynamicFormGroupComponent, DynamicFormSchemaService, DynamicFormService, DynamicFormStaticComponent, DynamicFormTranslationComponent, DynamicFormUploadComponent, DynamicFormWysiwygComponent, EDITOR_FORMATS, FORM_ROOT_ID, FormArray, FormFieldSet, FormGroup, FormInput, FormSelect, FormSerializable, FormStatic, FormUpload, MAX_INPUT_NUM, MIN_INPUT_NUM, NgxDynamicFormModule, RichTranslationModel, TranslationModel, addFieldValidators, arrayLengthValidation, clearFieldArray, controlStatus, controlValues, convertToDate, convertToDateFormat, convertToNumber, customizeFormField, emailValidation, getFieldByPath, getFieldsByKey, getFieldsByPredicate, getSelectOptions, insertToFieldArray, isFieldHidden, isFieldVisible, jsonValidation, maxLengthValidation, maxValueValidation, minLengthValidation, minValueValidation, phoneValidation, removeFieldValidators, removeFromFieldArray, replaceFieldArray, replaceSpecialChars, requiredValidation, setFieldDefault, setFieldDisabled, setFieldHidden, setFieldHooks, setFieldProp, setFieldProps, setFieldSerialize, setFieldValue, translationValidation };
 //# sourceMappingURL=stemy-ngx-dynamic-form.mjs.map