@datarailsshared/datarailsshared 1.6.21 → 1.6.23

package/esm2022/lib/dr-dialog/components/dialog-modal-wrapper/dialog-modal-wrapper.component.mjs

@@ -324,11 +324,11 @@ export class DialogModalWrapperComponent {
             i0.ɵɵproperty("ngIf", ctx.dialogData.fields);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.dialogData.cancelButton || ctx.dialogData.acceptButton);
-        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i2.NgStyle, i3.DrButtonComponent, i4.CheckboxComponent, i5.DrInputComponent, i6.DrSelectComponent, i7.DrDatePickerComponent, i8.ɵNgNoValidate, i8.NgControlStatus, i8.NgControlStatusGroup, i8.RequiredValidator, i8.FormGroupDirective, i8.FormControlName, i2.AsyncPipe], styles: ["[_nghost-%COMP%]{display:flex;justify-content:space-between;flex-direction:column}.small-modal[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:400px;max-width:400px}.medium-modal[_nghost-%COMP%], .medium-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:632px;max-width:632px}.medium-small-modal[_nghost-%COMP%]{min-height:188px;max-height:345px;min-width:460px;max-width:460px}.medium-modal-max-height[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{max-height:80vh}.header-dialog[_ngcontent-%COMP%]{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog[_ngcontent-%COMP%] > .icon-close[_ngcontent-%COMP%]{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog[_ngcontent-%COMP%]{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon[_ngcontent-%COMP%]{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog[_ngcontent-%COMP%]{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line}.icon-close[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.dr-smart-from[_ngcontent-%COMP%]{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from[_ngcontent-%COMP%]   dr-checkbox[_ngcontent-%COMP%]{font-weight:400}.content-dialog[_ngcontent-%COMP%]{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor[_ngcontent-%COMP%]{display:none}.footer-dialog[_ngcontent-%COMP%]{border-top:1px solid #dfe0e3}.buttons-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper[_ngcontent-%COMP%]   dr-button[_ngcontent-%COMP%]:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn[_ngcontent-%COMP%]{margin-right:auto}.form-field-error-alert[_ngcontent-%COMP%]{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert[_ngcontent-%COMP%]{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn[_ngcontent-%COMP%]{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}"] }); }
+        } }, dependencies: [i2.NgClass, i2.NgForOf, i2.NgIf, i2.NgStyle, i3.DrButtonComponent, i4.CheckboxComponent, i5.DrInputComponent, i6.DrSelectComponent, i7.DrDatePickerComponent, i8.ɵNgNoValidate, i8.NgControlStatus, i8.NgControlStatusGroup, i8.RequiredValidator, i8.FormGroupDirective, i8.FormControlName, i2.AsyncPipe], styles: ["[_nghost-%COMP%]{display:flex;justify-content:space-between;flex-direction:column}.small-modal[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:400px;max-width:400px}.medium-modal[_nghost-%COMP%], .medium-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:632px;max-width:632px}.medium-small-modal[_nghost-%COMP%]{min-height:188px;max-height:345px;min-width:460px;max-width:460px}.medium-modal-max-height[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{max-height:80vh}.header-dialog[_ngcontent-%COMP%]{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog[_ngcontent-%COMP%] > .icon-close[_ngcontent-%COMP%]{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog[_ngcontent-%COMP%]{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon[_ngcontent-%COMP%]{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog[_ngcontent-%COMP%]{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line;overflow:auto}.icon-close[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.dr-smart-from[_ngcontent-%COMP%]{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from[_ngcontent-%COMP%]   dr-checkbox[_ngcontent-%COMP%]{font-weight:400}.content-dialog[_ngcontent-%COMP%]{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor[_ngcontent-%COMP%]{display:none}.footer-dialog[_ngcontent-%COMP%]{border-top:1px solid #dfe0e3}.buttons-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper[_ngcontent-%COMP%]   dr-button[_ngcontent-%COMP%]:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn[_ngcontent-%COMP%]{margin-right:auto}.form-field-error-alert[_ngcontent-%COMP%]{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert[_ngcontent-%COMP%]{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn[_ngcontent-%COMP%]{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DialogModalWrapperComponent, [{
         type: Component,
-        args: [{ selector: 'dr-dialog-modal-wrapper', template: "<div header class=\"header-dialog\">\n    <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n        <i\n            *ngIf=\"dialogData.headerIconClass\"\n            (click)=\"closeDialog()\"\n            class=\"title-dialog__icon\"\n            [class]=\"dialogData.headerIconClass\"\n            data-test=\"dialogTitleIcon\"></i>\n        <span class=\"title-dialog__text\">{{ dialogData.title }}</span>\n    </h1>\n    <i *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\" data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\" [innerHTML]=\"dialogData.content\">\n    <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n    <div [class]=\"dialogData.formWrapperClass || 'dr-smart-form_wrapper'\">\n        <div\n            *ngFor=\"let field of dialogData.fields\"\n            class=\"dr-smart-form_group\"\n            [class]=\"field.formGroupClass\"\n            [ngStyle]=\"{ display: field.isLabelFullWidth ? 'block' : 'flex' }\">\n            <label\n                *ngIf=\"field.label && field.type !== dialogFieldType.CHECKBOX\"\n                [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n                class=\"label p-0 d-flex align-items-center\"\n                >{{ field.label }}</label\n            >\n            <div\n                class=\"input-group p-0\"\n                [ngClass]=\"{\n                    'col-md-10': field.label && !field.isLabelFullWidth,\n                    'col-md-12': !field.label || field.isLabelFullWidth,\n                }\">\n                <dr-select\n                    *ngIf=\"field.type === dialogFieldType.SELECT\"\n                    [searchable]=\"dialogData.searchable\"\n                    [clearable]=\"dialogData.clearable\"\n                    [formControlName]=\"field.name\"\n                    [bindLabel]=\"field.bindLabel || null\"\n                    [bindValue]=\"field.bindValue || null\"\n                    [selectedItem]=\"field.default\"\n                    [items]=\"field.items || (field.items$ | async)\"\n                    [loading]=\"fieldsItemsLoading[field.name] | async\"\n                    [required]=\"true\"\n                    [placeholder]=\"field.placeholder\">\n                    <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate let-item=\"item\" let-close=\"close\">\n                        <button (click)=\"footerAction(); close()\" class=\"dr-select-footer__btn\">\n                            <i *ngIf=\"dialogData.footerTemplateData.icon\" class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n                            {{ dialogData.footerTemplateData.label }}\n                        </button>\n                    </ng-template>\n                </dr-select>\n                <dr-input\n                    *ngIf=\"field.type === dialogFieldType.INPUT\"\n                    data-test=\"modalInput\"\n                    class=\"form-control\"\n                    [formControlName]=\"field.name\"\n                    [placeholder]=\"field.placeholder\"></dr-input>\n                <dr-date-picker\n                    *ngIf=\"field.type === dialogFieldType.DATE_PICKER\"\n                    [formControlName]=\"field.name\"\n                    [format]=\"field.datePickerFormat\"\n                    [placeholder]=\"field.placeholder\"></dr-date-picker>\n                <dr-checkbox *ngIf=\"field.type === dialogFieldType.CHECKBOX\" [formControlName]=\"field.name\">\n                    {{ field.label }}\n                </dr-checkbox>\n                <label\n                    class=\"form-field-error-alert\"\n                    *ngIf=\"form.invalid && form.controls[field.name]?.dirty && form.controls[field.name]?.errors\">\n                    {{ form.controls[field.name].errors.errorString }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n                    {{ dialogData.errorMessage }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n                    {{ dialogData.serverErrorMessage }}\n                </label>\n            </div>\n        </div>\n    </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n    <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n        <dr-button\n            (click)=\"onDecline()\"\n            *ngIf=\"dialogData.customButton\"\n            [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n            class=\"buttons-wrapper--custom-btn\"\n            data-test=\"declineBtn\"\n            >{{ dialogData.customButton.label }}</dr-button\n        >\n        <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\" [theme]=\"'secondary'\">{{\n            dialogData.cancelButton.label\n        }}</dr-button>\n        <dr-button\n            *ngIf=\"dialogData.acceptButton\"\n            data-test=\"modalAddBtn\"\n            (click)=\"onAccept()\"\n            [theme]=\"'primary'\"\n            [isLoading]=\"isLoading\"\n            [disabled]=\"form.invalid\"\n            >{{ dialogData.acceptButton.label }}</dr-button\n        >\n    </div>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:80vh}.header-dialog{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog>.icon-close{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line}.icon-close{color:#6d6e6f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from dr-checkbox{font-weight:400}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #dfe0e3}.buttons-wrapper{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper dr-button:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn{margin-right:auto}.form-field-error-alert{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}\n"] }]
+        args: [{ selector: 'dr-dialog-modal-wrapper', template: "<div header class=\"header-dialog\">\n    <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n        <i\n            *ngIf=\"dialogData.headerIconClass\"\n            (click)=\"closeDialog()\"\n            class=\"title-dialog__icon\"\n            [class]=\"dialogData.headerIconClass\"\n            data-test=\"dialogTitleIcon\"></i>\n        <span class=\"title-dialog__text\">{{ dialogData.title }}</span>\n    </h1>\n    <i *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\" data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\" [innerHTML]=\"dialogData.content\">\n    <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n    <div [class]=\"dialogData.formWrapperClass || 'dr-smart-form_wrapper'\">\n        <div\n            *ngFor=\"let field of dialogData.fields\"\n            class=\"dr-smart-form_group\"\n            [class]=\"field.formGroupClass\"\n            [ngStyle]=\"{ display: field.isLabelFullWidth ? 'block' : 'flex' }\">\n            <label\n                *ngIf=\"field.label && field.type !== dialogFieldType.CHECKBOX\"\n                [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n                class=\"label p-0 d-flex align-items-center\"\n                >{{ field.label }}</label\n            >\n            <div\n                class=\"input-group p-0\"\n                [ngClass]=\"{\n                    'col-md-10': field.label && !field.isLabelFullWidth,\n                    'col-md-12': !field.label || field.isLabelFullWidth,\n                }\">\n                <dr-select\n                    *ngIf=\"field.type === dialogFieldType.SELECT\"\n                    [searchable]=\"dialogData.searchable\"\n                    [clearable]=\"dialogData.clearable\"\n                    [formControlName]=\"field.name\"\n                    [bindLabel]=\"field.bindLabel || null\"\n                    [bindValue]=\"field.bindValue || null\"\n                    [selectedItem]=\"field.default\"\n                    [items]=\"field.items || (field.items$ | async)\"\n                    [loading]=\"fieldsItemsLoading[field.name] | async\"\n                    [required]=\"true\"\n                    [placeholder]=\"field.placeholder\">\n                    <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate let-item=\"item\" let-close=\"close\">\n                        <button (click)=\"footerAction(); close()\" class=\"dr-select-footer__btn\">\n                            <i *ngIf=\"dialogData.footerTemplateData.icon\" class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n                            {{ dialogData.footerTemplateData.label }}\n                        </button>\n                    </ng-template>\n                </dr-select>\n                <dr-input\n                    *ngIf=\"field.type === dialogFieldType.INPUT\"\n                    data-test=\"modalInput\"\n                    class=\"form-control\"\n                    [formControlName]=\"field.name\"\n                    [placeholder]=\"field.placeholder\"></dr-input>\n                <dr-date-picker\n                    *ngIf=\"field.type === dialogFieldType.DATE_PICKER\"\n                    [formControlName]=\"field.name\"\n                    [format]=\"field.datePickerFormat\"\n                    [placeholder]=\"field.placeholder\"></dr-date-picker>\n                <dr-checkbox *ngIf=\"field.type === dialogFieldType.CHECKBOX\" [formControlName]=\"field.name\">\n                    {{ field.label }}\n                </dr-checkbox>\n                <label\n                    class=\"form-field-error-alert\"\n                    *ngIf=\"form.invalid && form.controls[field.name]?.dirty && form.controls[field.name]?.errors\">\n                    {{ form.controls[field.name].errors.errorString }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n                    {{ dialogData.errorMessage }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n                    {{ dialogData.serverErrorMessage }}\n                </label>\n            </div>\n        </div>\n    </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n    <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n        <dr-button\n            (click)=\"onDecline()\"\n            *ngIf=\"dialogData.customButton\"\n            [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n            class=\"buttons-wrapper--custom-btn\"\n            data-test=\"declineBtn\"\n            >{{ dialogData.customButton.label }}</dr-button\n        >\n        <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\" [theme]=\"'secondary'\">{{\n            dialogData.cancelButton.label\n        }}</dr-button>\n        <dr-button\n            *ngIf=\"dialogData.acceptButton\"\n            data-test=\"modalAddBtn\"\n            (click)=\"onAccept()\"\n            [theme]=\"'primary'\"\n            [isLoading]=\"isLoading\"\n            [disabled]=\"form.invalid\"\n            >{{ dialogData.acceptButton.label }}</dr-button\n        >\n    </div>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:80vh}.header-dialog{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog>.icon-close{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line;overflow:auto}.icon-close{color:#6d6e6f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from dr-checkbox{font-weight:400}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #dfe0e3}.buttons-wrapper{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper dr-button:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn{margin-right:auto}.form-field-error-alert{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}\n"] }]
     }], function () { return [{ type: i1.MatLegacyDialogRef }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_DIALOG_DATA]

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -10566,11 +10566,11 @@ class DialogModalWrapperComponent {
             i0.ɵɵproperty("ngIf", ctx.dialogData.fields);
             i0.ɵɵadvance(2);
             i0.ɵɵproperty("ngIf", ctx.dialogData.cancelButton || ctx.dialogData.acceptButton);
-        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, DrButtonComponent, CheckboxComponent, DrInputComponent, DrSelectComponent, DrDatePickerComponent, i1$2.ɵNgNoValidate, i1$2.NgControlStatus, i1$2.NgControlStatusGroup, i1$2.RequiredValidator, i1$2.FormGroupDirective, i1$2.FormControlName, i1.AsyncPipe], styles: ["[_nghost-%COMP%]{display:flex;justify-content:space-between;flex-direction:column}.small-modal[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:400px;max-width:400px}.medium-modal[_nghost-%COMP%], .medium-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:632px;max-width:632px}.medium-small-modal[_nghost-%COMP%]{min-height:188px;max-height:345px;min-width:460px;max-width:460px}.medium-modal-max-height[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{max-height:80vh}.header-dialog[_ngcontent-%COMP%]{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog[_ngcontent-%COMP%] > .icon-close[_ngcontent-%COMP%]{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog[_ngcontent-%COMP%]{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon[_ngcontent-%COMP%]{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog[_ngcontent-%COMP%]{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line}.icon-close[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.dr-smart-from[_ngcontent-%COMP%]{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from[_ngcontent-%COMP%]   dr-checkbox[_ngcontent-%COMP%]{font-weight:400}.content-dialog[_ngcontent-%COMP%]{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor[_ngcontent-%COMP%]{display:none}.footer-dialog[_ngcontent-%COMP%]{border-top:1px solid #dfe0e3}.buttons-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper[_ngcontent-%COMP%]   dr-button[_ngcontent-%COMP%]:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn[_ngcontent-%COMP%]{margin-right:auto}.form-field-error-alert[_ngcontent-%COMP%]{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert[_ngcontent-%COMP%]{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn[_ngcontent-%COMP%]{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}"] }); }
+        } }, dependencies: [i1.NgClass, i1.NgForOf, i1.NgIf, i1.NgStyle, DrButtonComponent, CheckboxComponent, DrInputComponent, DrSelectComponent, DrDatePickerComponent, i1$2.ɵNgNoValidate, i1$2.NgControlStatus, i1$2.NgControlStatusGroup, i1$2.RequiredValidator, i1$2.FormGroupDirective, i1$2.FormControlName, i1.AsyncPipe], styles: ["[_nghost-%COMP%]{display:flex;justify-content:space-between;flex-direction:column}.small-modal[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:400px;max-width:400px}.medium-modal[_nghost-%COMP%], .medium-modal-max-height[_nghost-%COMP%]{min-height:188px;max-height:467px;min-width:632px;max-width:632px}.medium-small-modal[_nghost-%COMP%]{min-height:188px;max-height:345px;min-width:460px;max-width:460px}.medium-modal-max-height[_nghost-%COMP%], .small-modal-max-height[_nghost-%COMP%]{max-height:80vh}.header-dialog[_ngcontent-%COMP%]{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog[_ngcontent-%COMP%] > .icon-close[_ngcontent-%COMP%]{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog[_ngcontent-%COMP%]{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon[_ngcontent-%COMP%]{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog[_ngcontent-%COMP%]{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line;overflow:auto}.icon-close[_ngcontent-%COMP%]{color:#6d6e6f;cursor:pointer}.dr-smart-from[_ngcontent-%COMP%]{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from[_ngcontent-%COMP%]   dr-checkbox[_ngcontent-%COMP%]{font-weight:400}.content-dialog[_ngcontent-%COMP%]{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor[_ngcontent-%COMP%]{display:none}.footer-dialog[_ngcontent-%COMP%]{border-top:1px solid #dfe0e3}.buttons-wrapper[_ngcontent-%COMP%]{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper[_ngcontent-%COMP%]   dr-button[_ngcontent-%COMP%]:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn[_ngcontent-%COMP%]{margin-right:auto}.form-field-error-alert[_ngcontent-%COMP%]{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert[_ngcontent-%COMP%]{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn[_ngcontent-%COMP%]{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}"] }); }
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(DialogModalWrapperComponent, [{
         type: Component,
-        args: [{ selector: 'dr-dialog-modal-wrapper', template: "<div header class=\"header-dialog\">\n    <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n        <i\n            *ngIf=\"dialogData.headerIconClass\"\n            (click)=\"closeDialog()\"\n            class=\"title-dialog__icon\"\n            [class]=\"dialogData.headerIconClass\"\n            data-test=\"dialogTitleIcon\"></i>\n        <span class=\"title-dialog__text\">{{ dialogData.title }}</span>\n    </h1>\n    <i *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\" data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\" [innerHTML]=\"dialogData.content\">\n    <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n    <div [class]=\"dialogData.formWrapperClass || 'dr-smart-form_wrapper'\">\n        <div\n            *ngFor=\"let field of dialogData.fields\"\n            class=\"dr-smart-form_group\"\n            [class]=\"field.formGroupClass\"\n            [ngStyle]=\"{ display: field.isLabelFullWidth ? 'block' : 'flex' }\">\n            <label\n                *ngIf=\"field.label && field.type !== dialogFieldType.CHECKBOX\"\n                [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n                class=\"label p-0 d-flex align-items-center\"\n                >{{ field.label }}</label\n            >\n            <div\n                class=\"input-group p-0\"\n                [ngClass]=\"{\n                    'col-md-10': field.label && !field.isLabelFullWidth,\n                    'col-md-12': !field.label || field.isLabelFullWidth,\n                }\">\n                <dr-select\n                    *ngIf=\"field.type === dialogFieldType.SELECT\"\n                    [searchable]=\"dialogData.searchable\"\n                    [clearable]=\"dialogData.clearable\"\n                    [formControlName]=\"field.name\"\n                    [bindLabel]=\"field.bindLabel || null\"\n                    [bindValue]=\"field.bindValue || null\"\n                    [selectedItem]=\"field.default\"\n                    [items]=\"field.items || (field.items$ | async)\"\n                    [loading]=\"fieldsItemsLoading[field.name] | async\"\n                    [required]=\"true\"\n                    [placeholder]=\"field.placeholder\">\n                    <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate let-item=\"item\" let-close=\"close\">\n                        <button (click)=\"footerAction(); close()\" class=\"dr-select-footer__btn\">\n                            <i *ngIf=\"dialogData.footerTemplateData.icon\" class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n                            {{ dialogData.footerTemplateData.label }}\n                        </button>\n                    </ng-template>\n                </dr-select>\n                <dr-input\n                    *ngIf=\"field.type === dialogFieldType.INPUT\"\n                    data-test=\"modalInput\"\n                    class=\"form-control\"\n                    [formControlName]=\"field.name\"\n                    [placeholder]=\"field.placeholder\"></dr-input>\n                <dr-date-picker\n                    *ngIf=\"field.type === dialogFieldType.DATE_PICKER\"\n                    [formControlName]=\"field.name\"\n                    [format]=\"field.datePickerFormat\"\n                    [placeholder]=\"field.placeholder\"></dr-date-picker>\n                <dr-checkbox *ngIf=\"field.type === dialogFieldType.CHECKBOX\" [formControlName]=\"field.name\">\n                    {{ field.label }}\n                </dr-checkbox>\n                <label\n                    class=\"form-field-error-alert\"\n                    *ngIf=\"form.invalid && form.controls[field.name]?.dirty && form.controls[field.name]?.errors\">\n                    {{ form.controls[field.name].errors.errorString }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n                    {{ dialogData.errorMessage }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n                    {{ dialogData.serverErrorMessage }}\n                </label>\n            </div>\n        </div>\n    </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n    <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n        <dr-button\n            (click)=\"onDecline()\"\n            *ngIf=\"dialogData.customButton\"\n            [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n            class=\"buttons-wrapper--custom-btn\"\n            data-test=\"declineBtn\"\n            >{{ dialogData.customButton.label }}</dr-button\n        >\n        <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\" [theme]=\"'secondary'\">{{\n            dialogData.cancelButton.label\n        }}</dr-button>\n        <dr-button\n            *ngIf=\"dialogData.acceptButton\"\n            data-test=\"modalAddBtn\"\n            (click)=\"onAccept()\"\n            [theme]=\"'primary'\"\n            [isLoading]=\"isLoading\"\n            [disabled]=\"form.invalid\"\n            >{{ dialogData.acceptButton.label }}</dr-button\n        >\n    </div>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:80vh}.header-dialog{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog>.icon-close{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line}.icon-close{color:#6d6e6f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from dr-checkbox{font-weight:400}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #dfe0e3}.buttons-wrapper{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper dr-button:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn{margin-right:auto}.form-field-error-alert{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}\n"] }]
+        args: [{ selector: 'dr-dialog-modal-wrapper', template: "<div header class=\"header-dialog\">\n    <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n        <i\n            *ngIf=\"dialogData.headerIconClass\"\n            (click)=\"closeDialog()\"\n            class=\"title-dialog__icon\"\n            [class]=\"dialogData.headerIconClass\"\n            data-test=\"dialogTitleIcon\"></i>\n        <span class=\"title-dialog__text\">{{ dialogData.title }}</span>\n    </h1>\n    <i *ngIf=\"!dialogData.hideCloseBtn\" (click)=\"closeDialog()\" class=\"dr-icon-exit icon-close\" data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\" [innerHTML]=\"dialogData.content\">\n    <span #content class=\"content-anchor\"></span>\n</div>\n<form *ngIf=\"dialogData.fields\" [formGroup]=\"form\" class=\"dr-smart-from\">\n    <div [class]=\"dialogData.formWrapperClass || 'dr-smart-form_wrapper'\">\n        <div\n            *ngFor=\"let field of dialogData.fields\"\n            class=\"dr-smart-form_group\"\n            [class]=\"field.formGroupClass\"\n            [ngStyle]=\"{ display: field.isLabelFullWidth ? 'block' : 'flex' }\">\n            <label\n                *ngIf=\"field.label && field.type !== dialogFieldType.CHECKBOX\"\n                [ngClass]=\"field.isLabelFullWidth ? 'col-md-12 mb-2' : 'col-md-2'\"\n                class=\"label p-0 d-flex align-items-center\"\n                >{{ field.label }}</label\n            >\n            <div\n                class=\"input-group p-0\"\n                [ngClass]=\"{\n                    'col-md-10': field.label && !field.isLabelFullWidth,\n                    'col-md-12': !field.label || field.isLabelFullWidth,\n                }\">\n                <dr-select\n                    *ngIf=\"field.type === dialogFieldType.SELECT\"\n                    [searchable]=\"dialogData.searchable\"\n                    [clearable]=\"dialogData.clearable\"\n                    [formControlName]=\"field.name\"\n                    [bindLabel]=\"field.bindLabel || null\"\n                    [bindValue]=\"field.bindValue || null\"\n                    [selectedItem]=\"field.default\"\n                    [items]=\"field.items || (field.items$ | async)\"\n                    [loading]=\"fieldsItemsLoading[field.name] | async\"\n                    [required]=\"true\"\n                    [placeholder]=\"field.placeholder\">\n                    <ng-template *ngIf=\"dialogData?.footerTemplateData\" #optionFooterTemplate let-item=\"item\" let-close=\"close\">\n                        <button (click)=\"footerAction(); close()\" class=\"dr-select-footer__btn\">\n                            <i *ngIf=\"dialogData.footerTemplateData.icon\" class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n                            {{ dialogData.footerTemplateData.label }}\n                        </button>\n                    </ng-template>\n                </dr-select>\n                <dr-input\n                    *ngIf=\"field.type === dialogFieldType.INPUT\"\n                    data-test=\"modalInput\"\n                    class=\"form-control\"\n                    [formControlName]=\"field.name\"\n                    [placeholder]=\"field.placeholder\"></dr-input>\n                <dr-date-picker\n                    *ngIf=\"field.type === dialogFieldType.DATE_PICKER\"\n                    [formControlName]=\"field.name\"\n                    [format]=\"field.datePickerFormat\"\n                    [placeholder]=\"field.placeholder\"></dr-date-picker>\n                <dr-checkbox *ngIf=\"field.type === dialogFieldType.CHECKBOX\" [formControlName]=\"field.name\">\n                    {{ field.label }}\n                </dr-checkbox>\n                <label\n                    class=\"form-field-error-alert\"\n                    *ngIf=\"form.invalid && form.controls[field.name]?.dirty && form.controls[field.name]?.errors\">\n                    {{ form.controls[field.name].errors.errorString }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"dialogData.errorMessage && !form.pristine && form.invalid\">\n                    {{ dialogData.errorMessage }}\n                </label>\n                <label class=\"form-error-alert\" *ngIf=\"form.valid && showServerErrorMessage && dialogData.serverErrorMessage\">\n                    {{ dialogData.serverErrorMessage }}\n                </label>\n            </div>\n        </div>\n    </div>\n</form>\n\n<div footer class=\"footer-dialog\">\n    <div class=\"buttons-wrapper\" *ngIf=\"dialogData.cancelButton || dialogData.acceptButton\">\n        <dr-button\n            (click)=\"onDecline()\"\n            *ngIf=\"dialogData.customButton\"\n            [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n            class=\"buttons-wrapper--custom-btn\"\n            data-test=\"declineBtn\"\n            >{{ dialogData.customButton.label }}</dr-button\n        >\n        <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\" [theme]=\"'secondary'\">{{\n            dialogData.cancelButton.label\n        }}</dr-button>\n        <dr-button\n            *ngIf=\"dialogData.acceptButton\"\n            data-test=\"modalAddBtn\"\n            (click)=\"onAccept()\"\n            [theme]=\"'primary'\"\n            [isLoading]=\"isLoading\"\n            [disabled]=\"form.invalid\"\n            >{{ dialogData.acceptButton.label }}</dr-button\n        >\n    </div>\n</div>\n", styles: [":host{display:flex;justify-content:space-between;flex-direction:column}:host.small-modal,:host.small-modal-max-height{min-height:188px;max-height:467px;min-width:400px;max-width:400px}:host.medium-modal,:host.medium-modal-max-height{min-height:188px;max-height:467px;min-width:632px;max-width:632px}:host.medium-small-modal{min-height:188px;max-height:345px;min-width:460px;max-width:460px}:host.medium-modal-max-height,:host.small-modal-max-height{max-height:80vh}.header-dialog{position:relative;display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px 56px 16px 32px;border-bottom:1px solid #dfe0e3}.header-dialog>.icon-close{position:absolute;right:32px;top:16px;cursor:pointer}.title-dialog{display:flex;color:#333;position:static;font-weight:600;font-size:16px;line-height:24px;margin-top:0;margin-bottom:0}.title-dialog__icon{font-size:32px;margin-right:8px;line-height:24px;color:#6d6e6f}.content-dialog{font-weight:400;font-size:14px;padding:16px 32px 5px;white-space:pre-line;overflow:auto}.icon-close{color:#6d6e6f;cursor:pointer}.dr-smart-from{font-size:14px;font-weight:400;line-height:22px;padding:8px 32px 24px}.dr-smart-from dr-checkbox{font-weight:400}.content-dialog{padding:16px 32px 0;font-weight:400;font-size:14px;line-height:22px}.content-anchor{display:none}.footer-dialog{border-top:1px solid #dfe0e3}.buttons-wrapper{display:flex;justify-content:flex-end;padding:10px 32px 11px}.buttons-wrapper dr-button:nth-of-type(n+2){margin-left:12px}.buttons-wrapper--custom-btn{margin-right:auto}.form-field-error-alert{font-size:12px;color:#bf1d30;line-height:20px}.form-error-alert{position:absolute;margin-top:5px;font-size:12px;color:#bf1d30}.dr-select-footer__btn{background-color:transparent;display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}\n"] }]
     }], function () { return [{ type: i1$6.MatLegacyDialogRef }, { type: undefined, decorators: [{
                 type: Inject,
                 args: [MAT_LEGACY_DIALOG_DATA]