@ngx-smz/core 21.1.17 → 21.1.18

package/fesm2022/ngx-smz-core.mjs

@@ -6235,11 +6235,11 @@ class FormGroupComponent {
         this.repository.remove(this.config);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: FormGroupComponent, deps: [{ token: i1$3.UntypedFormBuilder }, { token: i0.ChangeDetectorRef }, { token: SmzFormsManagerService }, { token: SmzFormsRepositoryService }, { token: SmzFormValidationMessagesService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: FormGroupComponent, isStandalone: false, selector: "smz-form-group", inputs: { config: "config" }, outputs: { statusChanges: "statusChanges", initialStateChanged: "initialStateChanged", previousStateChanged: "previousStateChanged", submit: "submit" }, providers: [SmzFormValidationMessagesService], usesOnChanges: true, ngImport: i0, template: "@if (config != null) {\r\n  <div class=\"smz_form_grid_container\">\r\n    @if (viewdata?.form != null && !configHasErrors) {\r\n      <form focusFirstInput [focus]=\"!config.behaviors.avoidFocusOnLoad\" [formGroup]=\"viewdata.form\" class=\"smz_form__wrapper\" (submit)=\"$event.preventDefault()\" (keydown.enter)=\"onEnter($event)\">\r\n        <ng-container *ngTemplateOutlet=\"groupTemplate\"></ng-container>\r\n      </form>\r\n    }\r\n    @if (configHasErrors) {\r\n      <div>Error</div>\r\n    }\r\n  </div>\r\n}\r\n\r\n<ng-template #groupTemplate>\r\n\r\n  <div class=\"w-full px-0 mx-auto\">\r\n    <div class=\"grid grid-nogutter flex-wrap items-start justify-start flex-gap-2\" [ngClass]=\"config.template | setTemplateClasses : ['horizontalAlignment', 'verticalAlignment']\">\r\n      @for (group of config.groups; track group) {\r\n        @if (!group.isHide) {\r\n          <div class=\"col\" [ngClass]=\"group.template | setTemplateClasses : ['row']\">\r\n            @if (group.showName) {\r\n              <div class=\"smz__group_name\">{{ group.name }}</div>\r\n            }\r\n            <div [ngClass]=\"group.styleClass ?? 'grid grid-nogutter flex-wrap items-start justify-start flex-gap-2'\">\r\n              @for (input of group.children; track input) {\r\n                @if (input.isVisible) {\r\n                  <div class=\"input__control__wrapper col relative\" [ngClass]=\"input.template | setTemplateClasses : ['row'] : [input.styleClass, group.inputStyleClass]\">\r\n                    <ng-container *ngTemplateOutlet=\"inputTemplate; context: { $implicit: input }\"></ng-container>\r\n                  </div>\r\n                }\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n</ng-template>\r\n\r\n<ng-template #inputTemplate let-input>\r\n\r\n  @if (input.type == controlTypes.PASSWORD) {\r\n    <smz-input-password [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-password>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_MASK) {\r\n    <smz-input-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT) {\r\n    <smz-input-text [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LIST) {\r\n    <smz-input-list [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-list>\r\n  }\r\n\r\n  @if (input.type == controlTypes.NUMBER) {\r\n    <smz-input-number [input]=\"input\" [form]=\"viewdata.form\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-number>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_AREA) {\r\n    <smz-input-text-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CONTENT_MASK) {\r\n    <smz-input-content-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-content-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TAG_AREA) {\r\n    <input-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></input-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.AUTOCOMPLETE_TAG_AREA) {\r\n    <smz-input-autocomplete-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-autocomplete-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.RADIO) {\r\n    <smz-radio-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-radio-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.SWITCH) {\r\n    <smz-input-switch [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-switch>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX) {\r\n    <smz-checkbox [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-checkbox>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX_GROUP) {\r\n    <smz-checkbox-group [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-checkbox-group>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CALENDAR) {\r\n    <smz-calendar [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-calendar>\r\n  }\r\n\r\n  @if (input.type == controlTypes.DROPDOWN) {\r\n    <smz-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_DROPDOWN) {\r\n    <smz-linked-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.FILE) {\r\n    <smz-file-upload [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [form]=\"viewdata.form\" [behaviors]=\"config.behaviors\"></smz-file-upload>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CURRENCY) {\r\n    <smz-input-currency [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-currency>\r\n  }\r\n\r\n  @if (input.type == controlTypes.MULTI_SELECT) {\r\n    <smz-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_MULTISELECT) {\r\n    <smz-linked-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.COLOR_PICKER) {\r\n    <smz-color-picker [input]=\"input\" [control]=\"$any(viewdata.form.controls[input.propertyName])\" [behaviors]=\"config.behaviors\"></smz-color-picker>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_BUTTON) {\r\n    <smz-input-text-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [viewdata]=\"viewdata\" [behaviors]=\"config.behaviors\"></smz-input-text-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TREE) {\r\n    <smz-input-tree [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-input-tree>\r\n  }\r\n\r\n</ng-template>\r\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: CalendarComponent, selector: "smz-calendar", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: CheckBoxComponent, selector: "smz-checkbox", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: CheckBoxGroupComponent, selector: "smz-checkbox-group", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: ColorPickerComponent, selector: "smz-color-picker", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: DropdownComponent, selector: "smz-dropdown", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: FileUploadComponent, selector: "smz-file-upload", inputs: ["input", "form", "control", "behaviors"], outputs: ["selectChange"] }, { kind: "directive", type: FormFocusFirstInputDirective, selector: "[focusFirstInput]", inputs: ["focus"] }, { kind: "component", type: InputCurrencyComponent, selector: "smz-input-currency", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputListComponent, selector: "smz-input-list", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputMaskComponent, selector: "smz-input-mask", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputNumberComponent, selector: "smz-input-number", inputs: ["input", "control", "behaviors", "form"] }, { kind: "component", type: InputPasswordComponent, selector: "smz-input-password", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputSwitchComponent, selector: "smz-input-switch", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTextAreaComponent, selector: "smz-input-text-area", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: SmzInputAutocompleteTagArea, selector: "smz-input-autocomplete-tag-area", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTextComponent, selector: "smz-input-text", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTreeComponent, selector: "smz-input-tree", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: LinkedDropdownComponent, selector: "smz-linked-dropdown", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: LinkedMultiSelectComponent, selector: "smz-linked-multi-select", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: MultiSelectComponent, selector: "smz-multi-select", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: RadioButtonComponent, selector: "smz-radio-button", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: InputTagAreaComponent, selector: "input-tag-area", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputContentMaskComponent, selector: "smz-input-content-mask", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTextButtonComponent, selector: "smz-input-text-button", inputs: ["input", "control", "viewdata", "behaviors"] }, { kind: "pipe", type: SetTemplateClassesPipe, name: "setTemplateClasses" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.5", type: FormGroupComponent, isStandalone: false, selector: "smz-form-group", inputs: { config: "config" }, outputs: { statusChanges: "statusChanges", initialStateChanged: "initialStateChanged", previousStateChanged: "previousStateChanged", submit: "submit" }, providers: [SmzFormValidationMessagesService], usesOnChanges: true, ngImport: i0, template: "@if (config != null) {\r\n  <div class=\"smz_form_grid_container\">\r\n    @if (viewdata?.form != null && !configHasErrors) {\r\n      <form focusFirstInput [focus]=\"!config.behaviors.avoidFocusOnLoad\" [formGroup]=\"viewdata.form\" class=\"smz_form__wrapper\" [attr.data-testid]=\"config.formTestId ?? null\" (submit)=\"$event.preventDefault()\" (keydown.enter)=\"onEnter($event)\">\r\n        <ng-container *ngTemplateOutlet=\"groupTemplate\"></ng-container>\r\n      </form>\r\n    }\r\n    @if (configHasErrors) {\r\n      <div>Error</div>\r\n    }\r\n  </div>\r\n}\r\n\r\n<ng-template #groupTemplate>\r\n\r\n  <div class=\"w-full px-0 mx-auto\">\r\n    <div class=\"grid grid-nogutter flex-wrap items-start justify-start flex-gap-2\" [ngClass]=\"config.template | setTemplateClasses : ['horizontalAlignment', 'verticalAlignment']\">\r\n      @for (group of config.groups; track group) {\r\n        @if (!group.isHide) {\r\n          <div class=\"col\" [ngClass]=\"group.template | setTemplateClasses : ['row']\">\r\n            @if (group.showName) {\r\n              <div class=\"smz__group_name\">{{ group.name }}</div>\r\n            }\r\n            <div [ngClass]=\"group.styleClass ?? 'grid grid-nogutter flex-wrap items-start justify-start flex-gap-2'\">\r\n              @for (input of group.children; track input) {\r\n                @if (input.isVisible) {\r\n                  <div class=\"input__control__wrapper col relative\" [ngClass]=\"input.template | setTemplateClasses : ['row'] : [input.styleClass, group.inputStyleClass]\">\r\n                    <ng-container *ngTemplateOutlet=\"inputTemplate; context: { $implicit: input }\"></ng-container>\r\n                  </div>\r\n                }\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n</ng-template>\r\n\r\n<ng-template #inputTemplate let-input>\r\n\r\n  @if (input.type == controlTypes.PASSWORD) {\r\n    <smz-input-password [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-password>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_MASK) {\r\n    <smz-input-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT) {\r\n    <smz-input-text [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LIST) {\r\n    <smz-input-list [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-list>\r\n  }\r\n\r\n  @if (input.type == controlTypes.NUMBER) {\r\n    <smz-input-number [input]=\"input\" [form]=\"viewdata.form\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-number>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_AREA) {\r\n    <smz-input-text-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CONTENT_MASK) {\r\n    <smz-input-content-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-content-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TAG_AREA) {\r\n    <input-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></input-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.AUTOCOMPLETE_TAG_AREA) {\r\n    <smz-input-autocomplete-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-autocomplete-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.RADIO) {\r\n    <smz-radio-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-radio-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.SWITCH) {\r\n    <smz-input-switch [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-switch>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX) {\r\n    <smz-checkbox [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-checkbox>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX_GROUP) {\r\n    <smz-checkbox-group [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-checkbox-group>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CALENDAR) {\r\n    <smz-calendar [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-calendar>\r\n  }\r\n\r\n  @if (input.type == controlTypes.DROPDOWN) {\r\n    <smz-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_DROPDOWN) {\r\n    <smz-linked-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.FILE) {\r\n    <smz-file-upload [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [form]=\"viewdata.form\" [behaviors]=\"config.behaviors\"></smz-file-upload>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CURRENCY) {\r\n    <smz-input-currency [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-currency>\r\n  }\r\n\r\n  @if (input.type == controlTypes.MULTI_SELECT) {\r\n    <smz-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_MULTISELECT) {\r\n    <smz-linked-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.COLOR_PICKER) {\r\n    <smz-color-picker [input]=\"input\" [control]=\"$any(viewdata.form.controls[input.propertyName])\" [behaviors]=\"config.behaviors\"></smz-color-picker>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_BUTTON) {\r\n    <smz-input-text-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [viewdata]=\"viewdata\" [behaviors]=\"config.behaviors\"></smz-input-text-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TREE) {\r\n    <smz-input-tree [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-input-tree>\r\n  }\r\n\r\n</ng-template>\r\n", dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: CalendarComponent, selector: "smz-calendar", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: CheckBoxComponent, selector: "smz-checkbox", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: CheckBoxGroupComponent, selector: "smz-checkbox-group", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: ColorPickerComponent, selector: "smz-color-picker", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: DropdownComponent, selector: "smz-dropdown", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: FileUploadComponent, selector: "smz-file-upload", inputs: ["input", "form", "control", "behaviors"], outputs: ["selectChange"] }, { kind: "directive", type: FormFocusFirstInputDirective, selector: "[focusFirstInput]", inputs: ["focus"] }, { kind: "component", type: InputCurrencyComponent, selector: "smz-input-currency", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputListComponent, selector: "smz-input-list", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputMaskComponent, selector: "smz-input-mask", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputNumberComponent, selector: "smz-input-number", inputs: ["input", "control", "behaviors", "form"] }, { kind: "component", type: InputPasswordComponent, selector: "smz-input-password", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputSwitchComponent, selector: "smz-input-switch", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTextAreaComponent, selector: "smz-input-text-area", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: SmzInputAutocompleteTagArea, selector: "smz-input-autocomplete-tag-area", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTextComponent, selector: "smz-input-text", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTreeComponent, selector: "smz-input-tree", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: LinkedDropdownComponent, selector: "smz-linked-dropdown", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: LinkedMultiSelectComponent, selector: "smz-linked-multi-select", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: MultiSelectComponent, selector: "smz-multi-select", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: RadioButtonComponent, selector: "smz-radio-button", inputs: ["input", "formId", "control", "behaviors"] }, { kind: "component", type: InputTagAreaComponent, selector: "input-tag-area", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputContentMaskComponent, selector: "smz-input-content-mask", inputs: ["input", "control", "behaviors"] }, { kind: "component", type: InputTextButtonComponent, selector: "smz-input-text-button", inputs: ["input", "control", "viewdata", "behaviors"] }, { kind: "pipe", type: SetTemplateClassesPipe, name: "setTemplateClasses" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.5", ngImport: i0, type: FormGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'smz-form-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [SmzFormValidationMessagesService], standalone: false, template: "@if (config != null) {\r\n  <div class=\"smz_form_grid_container\">\r\n    @if (viewdata?.form != null && !configHasErrors) {\r\n      <form focusFirstInput [focus]=\"!config.behaviors.avoidFocusOnLoad\" [formGroup]=\"viewdata.form\" class=\"smz_form__wrapper\" (submit)=\"$event.preventDefault()\" (keydown.enter)=\"onEnter($event)\">\r\n        <ng-container *ngTemplateOutlet=\"groupTemplate\"></ng-container>\r\n      </form>\r\n    }\r\n    @if (configHasErrors) {\r\n      <div>Error</div>\r\n    }\r\n  </div>\r\n}\r\n\r\n<ng-template #groupTemplate>\r\n\r\n  <div class=\"w-full px-0 mx-auto\">\r\n    <div class=\"grid grid-nogutter flex-wrap items-start justify-start flex-gap-2\" [ngClass]=\"config.template | setTemplateClasses : ['horizontalAlignment', 'verticalAlignment']\">\r\n      @for (group of config.groups; track group) {\r\n        @if (!group.isHide) {\r\n          <div class=\"col\" [ngClass]=\"group.template | setTemplateClasses : ['row']\">\r\n            @if (group.showName) {\r\n              <div class=\"smz__group_name\">{{ group.name }}</div>\r\n            }\r\n            <div [ngClass]=\"group.styleClass ?? 'grid grid-nogutter flex-wrap items-start justify-start flex-gap-2'\">\r\n              @for (input of group.children; track input) {\r\n                @if (input.isVisible) {\r\n                  <div class=\"input__control__wrapper col relative\" [ngClass]=\"input.template | setTemplateClasses : ['row'] : [input.styleClass, group.inputStyleClass]\">\r\n                    <ng-container *ngTemplateOutlet=\"inputTemplate; context: { $implicit: input }\"></ng-container>\r\n                  </div>\r\n                }\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n</ng-template>\r\n\r\n<ng-template #inputTemplate let-input>\r\n\r\n  @if (input.type == controlTypes.PASSWORD) {\r\n    <smz-input-password [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-password>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_MASK) {\r\n    <smz-input-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT) {\r\n    <smz-input-text [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LIST) {\r\n    <smz-input-list [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-list>\r\n  }\r\n\r\n  @if (input.type == controlTypes.NUMBER) {\r\n    <smz-input-number [input]=\"input\" [form]=\"viewdata.form\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-number>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_AREA) {\r\n    <smz-input-text-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CONTENT_MASK) {\r\n    <smz-input-content-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-content-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TAG_AREA) {\r\n    <input-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></input-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.AUTOCOMPLETE_TAG_AREA) {\r\n    <smz-input-autocomplete-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-autocomplete-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.RADIO) {\r\n    <smz-radio-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-radio-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.SWITCH) {\r\n    <smz-input-switch [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-switch>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX) {\r\n    <smz-checkbox [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-checkbox>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX_GROUP) {\r\n    <smz-checkbox-group [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-checkbox-group>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CALENDAR) {\r\n    <smz-calendar [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-calendar>\r\n  }\r\n\r\n  @if (input.type == controlTypes.DROPDOWN) {\r\n    <smz-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_DROPDOWN) {\r\n    <smz-linked-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.FILE) {\r\n    <smz-file-upload [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [form]=\"viewdata.form\" [behaviors]=\"config.behaviors\"></smz-file-upload>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CURRENCY) {\r\n    <smz-input-currency [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-currency>\r\n  }\r\n\r\n  @if (input.type == controlTypes.MULTI_SELECT) {\r\n    <smz-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_MULTISELECT) {\r\n    <smz-linked-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.COLOR_PICKER) {\r\n    <smz-color-picker [input]=\"input\" [control]=\"$any(viewdata.form.controls[input.propertyName])\" [behaviors]=\"config.behaviors\"></smz-color-picker>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_BUTTON) {\r\n    <smz-input-text-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [viewdata]=\"viewdata\" [behaviors]=\"config.behaviors\"></smz-input-text-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TREE) {\r\n    <smz-input-tree [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-input-tree>\r\n  }\r\n\r\n</ng-template>\r\n" }]
+            args: [{ selector: 'smz-form-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [SmzFormValidationMessagesService], standalone: false, template: "@if (config != null) {\r\n  <div class=\"smz_form_grid_container\">\r\n    @if (viewdata?.form != null && !configHasErrors) {\r\n      <form focusFirstInput [focus]=\"!config.behaviors.avoidFocusOnLoad\" [formGroup]=\"viewdata.form\" class=\"smz_form__wrapper\" [attr.data-testid]=\"config.formTestId ?? null\" (submit)=\"$event.preventDefault()\" (keydown.enter)=\"onEnter($event)\">\r\n        <ng-container *ngTemplateOutlet=\"groupTemplate\"></ng-container>\r\n      </form>\r\n    }\r\n    @if (configHasErrors) {\r\n      <div>Error</div>\r\n    }\r\n  </div>\r\n}\r\n\r\n<ng-template #groupTemplate>\r\n\r\n  <div class=\"w-full px-0 mx-auto\">\r\n    <div class=\"grid grid-nogutter flex-wrap items-start justify-start flex-gap-2\" [ngClass]=\"config.template | setTemplateClasses : ['horizontalAlignment', 'verticalAlignment']\">\r\n      @for (group of config.groups; track group) {\r\n        @if (!group.isHide) {\r\n          <div class=\"col\" [ngClass]=\"group.template | setTemplateClasses : ['row']\">\r\n            @if (group.showName) {\r\n              <div class=\"smz__group_name\">{{ group.name }}</div>\r\n            }\r\n            <div [ngClass]=\"group.styleClass ?? 'grid grid-nogutter flex-wrap items-start justify-start flex-gap-2'\">\r\n              @for (input of group.children; track input) {\r\n                @if (input.isVisible) {\r\n                  <div class=\"input__control__wrapper col relative\" [ngClass]=\"input.template | setTemplateClasses : ['row'] : [input.styleClass, group.inputStyleClass]\">\r\n                    <ng-container *ngTemplateOutlet=\"inputTemplate; context: { $implicit: input }\"></ng-container>\r\n                  </div>\r\n                }\r\n              }\r\n            </div>\r\n          </div>\r\n        }\r\n      }\r\n    </div>\r\n  </div>\r\n\r\n</ng-template>\r\n\r\n<ng-template #inputTemplate let-input>\r\n\r\n  @if (input.type == controlTypes.PASSWORD) {\r\n    <smz-input-password [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-password>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_MASK) {\r\n    <smz-input-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT) {\r\n    <smz-input-text [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LIST) {\r\n    <smz-input-list [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-list>\r\n  }\r\n\r\n  @if (input.type == controlTypes.NUMBER) {\r\n    <smz-input-number [input]=\"input\" [form]=\"viewdata.form\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-number>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_AREA) {\r\n    <smz-input-text-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-text-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CONTENT_MASK) {\r\n    <smz-input-content-mask [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-content-mask>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TAG_AREA) {\r\n    <input-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></input-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.AUTOCOMPLETE_TAG_AREA) {\r\n    <smz-input-autocomplete-tag-area [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-autocomplete-tag-area>\r\n  }\r\n\r\n  @if (input.type == controlTypes.RADIO) {\r\n    <smz-radio-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-radio-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.SWITCH) {\r\n    <smz-input-switch [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-switch>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX) {\r\n    <smz-checkbox [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-checkbox>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CHECKBOX_GROUP) {\r\n    <smz-checkbox-group [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-checkbox-group>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CALENDAR) {\r\n    <smz-calendar [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-calendar>\r\n  }\r\n\r\n  @if (input.type == controlTypes.DROPDOWN) {\r\n    <smz-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_DROPDOWN) {\r\n    <smz-linked-dropdown [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-dropdown>\r\n  }\r\n\r\n  @if (input.type == controlTypes.FILE) {\r\n    <smz-file-upload [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [form]=\"viewdata.form\" [behaviors]=\"config.behaviors\"></smz-file-upload>\r\n  }\r\n\r\n  @if (input.type == controlTypes.CURRENCY) {\r\n    <smz-input-currency [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [behaviors]=\"config.behaviors\"></smz-input-currency>\r\n  }\r\n\r\n  @if (input.type == controlTypes.MULTI_SELECT) {\r\n    <smz-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.LINKED_MULTISELECT) {\r\n    <smz-linked-multi-select [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-linked-multi-select>\r\n  }\r\n\r\n  @if (input.type == controlTypes.COLOR_PICKER) {\r\n    <smz-color-picker [input]=\"input\" [control]=\"$any(viewdata.form.controls[input.propertyName])\" [behaviors]=\"config.behaviors\"></smz-color-picker>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TEXT_BUTTON) {\r\n    <smz-input-text-button [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [viewdata]=\"viewdata\" [behaviors]=\"config.behaviors\"></smz-input-text-button>\r\n  }\r\n\r\n  @if (input.type == controlTypes.TREE) {\r\n    <smz-input-tree [input]=\"input\" [control]=\"getFormControl(input.propertyName)\" [formId]=\"config.formId\" [behaviors]=\"config.behaviors\"></smz-input-tree>\r\n  }\r\n\r\n</ng-template>\r\n" }]
         }], ctorParameters: () => [{ type: i1$3.UntypedFormBuilder }, { type: i0.ChangeDetectorRef }, { type: SmzFormsManagerService }, { type: SmzFormsRepositoryService }, { type: SmzFormValidationMessagesService }], propDecorators: { config: [{
                 type: Input
             }], statusChanges: [{
@@ -26834,6 +26834,20 @@ class SmzFormBuilder {
         this.formState.isDebug = true;
         return this;
     }
+    /**
+     * Sets {@link SmzForm.formTestId}: exposed on the root {@code <form>} as {@code data-testid}.
+     * Pass a blank string to clear a previously set id.
+     */
+    withFormTestId(testId) {
+        const trimmed = testId?.trim();
+        if (trimmed === '' || trimmed === undefined) {
+            this.formState.formTestId = undefined;
+        }
+        else {
+            this.formState.formTestId = trimmed;
+        }
+        return this;
+    }
     /**
      * Appends a new form group and returns a builder to add controls, layout, and validators.
      * @param name Optional group title; when set, the group can show a heading.