@datarailsshared/datarailsshared 1.5.261 → 1.5.264
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/datarailsshared-datarailsshared-1.5.264.tgz +0 -0
- package/esm2022/lib/dr-dialog/components/dialog-modal-wrapper/dialog-modal-wrapper.component.mjs +1 -1
- package/esm2022/lib/dr-inputs/checkbox/checkbox.component.mjs +23 -5
- package/fesm2022/datarailsshared-datarailsshared.mjs +21 -4
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/lib/dr-inputs/checkbox/checkbox.component.d.ts +7 -3
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.5.261.tgz +0 -0
|
Binary file
|
package/esm2022/lib/dr-dialog/components/dialog-modal-wrapper/dialog-modal-wrapper.component.mjs
CHANGED
|
@@ -75,7 +75,7 @@ export class DialogModalWrapperComponent {
|
|
|
75
75
|
this.destroy$.complete();
|
|
76
76
|
}
|
|
77
77
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogModalWrapperComponent, deps: [{ token: i1.MatLegacyDialogRef }, { token: i2.DialogService }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
78
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogModalWrapperComponent, selector: "dr-dialog-modal-wrapper", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<div header class=\"header-dialog\">\n <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n <i *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\"\n data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n <ng-container>{{ dialogData.content }}</ng-container>\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 *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 *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\">{{ field.label }}</label>\n <div class=\"input-group p-0\"\n [ngClass]=\"{ 'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth }\">\n <dr-select *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\"\n class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n {{ dialogData.footerTemplateData.label }}</button>\n </ng-template>\n </dr-select>\n <dr-input *ngIf=\"field.type === dialogFieldType.INPUT\" data-test=\"modalInput\" class=\"form-control\"\n [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n <dr-date-picker *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 class=\"form-field-error-alert\" *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\"\n *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 (click)=\"onDecline()\"\n *ngIf=\"dialogData.customButton\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n class=\"buttons-wrapper--custom-btn\"\n data-test=\"declineBtn\">{{ dialogData.customButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n [theme]=\"'secondary'\">{{ dialogData.cancelButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n [isLoading]=\"isLoading\" [disabled]=\"form.invalid\">{{ dialogData.acceptButton.label }}</dr-button>\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:16px 32px 22px}.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"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: i5.CheckboxComponent, selector: "dr-checkbox", inputs: ["checkedStatus", "disabled", "icon", "indeterminate"], outputs: ["checkedChange"] }, { kind: "component", type: i6.DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step", "searchMini"], outputs: ["blur", "modelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }, { kind: "component", type: i7.DrSelectComponent, selector: "dr-select", inputs: ["className", "items", "addTag", "appendTo", "bindLabel", "bindValue", "clearable", "searchable", "searchFn", "multiple", "hideSelected", "placeholder", "loading", "loadingText", "readonly", "disabled", "groupBy", "optionWithDescription", "id", "keyDownFn", "selectedItem", "dropdownClass", "closeOnSelect", "textView", "autofocus", "isOpen"], outputs: ["change", "open", "closeUp"] }, { kind: "component", type: i8.DrDatePickerComponent, selector: "dr-date-picker", inputs: ["format", "min", "max", "periodPosition", "placeholder", "disabled", "fiscalYearMonthsModifier", "datepickerFilter"] }, { kind: "directive", type: i9.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i9.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i9.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
|
|
78
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogModalWrapperComponent, selector: "dr-dialog-modal-wrapper", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<div header class=\"header-dialog\">\n <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n <i *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\"\n data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n <ng-container>{{ dialogData.content }}</ng-container>\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 *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 *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\">{{ field.label }}</label>\n <div class=\"input-group p-0\"\n [ngClass]=\"{ 'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth }\">\n <dr-select *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\"\n class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n {{ dialogData.footerTemplateData.label }}</button>\n </ng-template>\n </dr-select>\n <dr-input *ngIf=\"field.type === dialogFieldType.INPUT\" data-test=\"modalInput\" class=\"form-control\"\n [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n <dr-date-picker *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 class=\"form-field-error-alert\" *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\"\n *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 (click)=\"onDecline()\"\n *ngIf=\"dialogData.customButton\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n class=\"buttons-wrapper--custom-btn\"\n data-test=\"declineBtn\">{{ dialogData.customButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n [theme]=\"'secondary'\">{{ dialogData.cancelButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n [isLoading]=\"isLoading\" [disabled]=\"form.invalid\">{{ dialogData.acceptButton.label }}</dr-button>\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:16px 32px 22px}.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"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i4.DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: i5.CheckboxComponent, selector: "dr-checkbox", inputs: ["checkedStatus", "disabled", "icon", "indeterminate", "textNowrap"], outputs: ["checkedChange"] }, { kind: "component", type: i6.DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step", "searchMini"], outputs: ["blur", "modelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }, { kind: "component", type: i7.DrSelectComponent, selector: "dr-select", inputs: ["className", "items", "addTag", "appendTo", "bindLabel", "bindValue", "clearable", "searchable", "searchFn", "multiple", "hideSelected", "placeholder", "loading", "loadingText", "readonly", "disabled", "groupBy", "optionWithDescription", "id", "keyDownFn", "selectedItem", "dropdownClass", "closeOnSelect", "textView", "autofocus", "isOpen"], outputs: ["change", "open", "closeUp"] }, { kind: "component", type: i8.DrDatePickerComponent, selector: "dr-date-picker", inputs: ["format", "min", "max", "periodPosition", "placeholder", "disabled", "fiscalYearMonthsModifier", "datepickerFilter"] }, { kind: "directive", type: i9.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i9.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i9.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i9.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
|
|
79
79
|
}
|
|
80
80
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogModalWrapperComponent, decorators: [{
|
|
81
81
|
type: Component,
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, Output, } from '@angular/core';
|
|
1
|
+
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, Input, Output, ViewChild, } from '@angular/core';
|
|
2
2
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
|
+
import * as i1 from "../../dr-tooltip/dr-tooltip.directive";
|
|
4
5
|
export class CheckboxComponent {
|
|
5
6
|
get indeterminate() {
|
|
6
7
|
return this._indeterminate;
|
|
@@ -20,6 +21,12 @@ export class CheckboxComponent {
|
|
|
20
21
|
this.onTouched = () => {
|
|
21
22
|
};
|
|
22
23
|
}
|
|
24
|
+
ngAfterViewInit() {
|
|
25
|
+
const element = this.checkboxContent.nativeElement;
|
|
26
|
+
if (this.textNowrap && element.scrollWidth > element.clientWidth) {
|
|
27
|
+
this.tooltip = element.innerText;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
23
30
|
writeValue(value) {
|
|
24
31
|
this.checkedStatus = value;
|
|
25
32
|
this.cdr.markForCheck();
|
|
@@ -42,24 +49,35 @@ export class CheckboxComponent {
|
|
|
42
49
|
this.onTouched();
|
|
43
50
|
}
|
|
44
51
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
45
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxComponent, selector: "dr-checkbox", inputs: { checkedStatus: "checkedStatus", disabled: "disabled", icon: "icon", indeterminate: "indeterminate" }, outputs: { checkedChange: "checkedChange" }, providers: [
|
|
52
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxComponent, selector: "dr-checkbox", inputs: { checkedStatus: "checkedStatus", disabled: "disabled", icon: "icon", indeterminate: "indeterminate", textNowrap: "textNowrap" }, outputs: { checkedChange: "checkedChange" }, host: { properties: { "class.disabled": "this.disabled", "class.text-nowrap": "this.textNowrap" } }, providers: [
|
|
46
53
|
{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }
|
|
47
|
-
], ngImport: i0, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span [class]=\"icon\"
|
|
54
|
+
], viewQueries: [{ propertyName: "checkboxContent", first: true, predicate: ["checkboxContent"], descendants: true }], ngImport: i0, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span #checkboxContent\n [class]=\"icon\"\n [class.indeterminate]=\"indeterminate\"\n [drTooltip]=\"tooltip\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: ["input+span{vertical-align:middle;line-height:30px}input+span,input+span:before{box-sizing:content-box!important;-webkit-box-sizing:content-box!important;-moz-box-sizing:content-box!important}input{visibility:hidden;position:absolute;width:0}label input+span{position:relative;z-index:19;display:inline-block;margin:0 5px 0 0;line-height:17px;min-height:14px;min-width:14px}:host.text-nowrap label input+span{white-space:nowrap;overflow:hidden;max-width:100%;text-overflow:ellipsis;line-height:20px}label input+span:hover{cursor:pointer}label input+span:before{content:\"\";font-size:14px;border-radius:0;display:inline-block;text-align:center;vertical-align:middle;padding:1px;min-height:12px;line-height:12px;min-width:12px;margin-right:5px;border:1.5px solid #8f929e;background-color:#fff;font-weight:400;margin-top:-1px}label input+span:before,label:hover input+span:before{background-color:#fff;border-color:#8f929e;color:#4646ce;border-radius:2px}label input:checked+span:before,label:hover input:checked+span:before{content:url('data:image/svg+xml; utf8, <svg width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M1 5L4.5 8.5L11 1.5\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/> </svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:checked+span.cross:before,label:hover input:checked+span.cross:before{content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91786 4.99992L9.03356 1.88386C9.11927 1.79808 9.16654 1.68365 9.16668 1.56162C9.16668 1.43952 9.1194 1.32495 9.03356 1.23931L8.7605 0.966323C8.67466 0.880342 8.56026 0.833252 8.43811 0.833252C8.31615 0.833252 8.20169 0.880342 8.11585 0.966323L5.00016 4.08218L1.88431 0.966323C1.79861 0.880342 1.68407 0.833252 1.56199 0.833252C1.44004 0.833252 1.32559 0.880342 1.23988 0.966323L0.966677 1.23931C0.788899 1.4171 0.788899 1.70628 0.966677 1.88386L4.08245 4.99992L0.966677 8.11584C0.880904 8.20175 0.833707 8.31619 0.833707 8.43822C0.833707 8.56025 0.880904 8.67468 0.966677 8.76053L1.23981 9.03351C1.32551 9.11943 1.44003 9.16658 1.56191 9.16658C1.684 9.16658 1.79853 9.11943 1.88424 9.03351L5.00008 5.91759L8.11578 9.03351C8.20162 9.11943 8.31608 9.16658 8.43803 9.16658C8.56005 9.16658 8.67459 9.11943 8.76043 9.03351L9.03349 8.76053C9.11919 8.67475 9.16646 8.56025 9.16646 8.43822C9.16646 8.31619 9.11919 8.20175 9.03349 8.11591L5.91786 4.99992Z\" fill=\"white\"/></svg>')}label input+span.indeterminate:before,label:hover input+span.indeterminate:before{content:url('data:image/svg+xml; utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 2\" fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.25 1C0.25 0.585786 0.585786 0.25 1 0.25L11 0.250001C11.4142 0.250001 11.75 0.585787 11.75 1C11.75 1.41421 11.4142 1.75 11 1.75L1 1.75C0.585786 1.75 0.25 1.41421 0.25 1Z\" fill=\"white\"/></svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:disabled+span{color:#8f929e}label input:disabled+span:before{border-color:#dfe0e3;pointer-events:none}label input[disabled]:checked+span:before{background:#8f929e;border-color:#8f929e;pointer-events:none}:host label{position:relative}:host label:hover:after{content:\"\";width:24px;height:24px;background:#f2f2fb;border-radius:50%;position:absolute;left:-4px;top:.5px}:host.disabled label:hover:after{display:none}\n"], dependencies: [{ kind: "directive", type: i1.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
48
55
|
}
|
|
49
56
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
50
57
|
type: Component,
|
|
51
58
|
args: [{ selector: 'dr-checkbox', providers: [
|
|
52
59
|
{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }
|
|
53
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span [class]=\"icon\"
|
|
60
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span #checkboxContent\n [class]=\"icon\"\n [class.indeterminate]=\"indeterminate\"\n [drTooltip]=\"tooltip\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: ["input+span{vertical-align:middle;line-height:30px}input+span,input+span:before{box-sizing:content-box!important;-webkit-box-sizing:content-box!important;-moz-box-sizing:content-box!important}input{visibility:hidden;position:absolute;width:0}label input+span{position:relative;z-index:19;display:inline-block;margin:0 5px 0 0;line-height:17px;min-height:14px;min-width:14px}:host.text-nowrap label input+span{white-space:nowrap;overflow:hidden;max-width:100%;text-overflow:ellipsis;line-height:20px}label input+span:hover{cursor:pointer}label input+span:before{content:\"\";font-size:14px;border-radius:0;display:inline-block;text-align:center;vertical-align:middle;padding:1px;min-height:12px;line-height:12px;min-width:12px;margin-right:5px;border:1.5px solid #8f929e;background-color:#fff;font-weight:400;margin-top:-1px}label input+span:before,label:hover input+span:before{background-color:#fff;border-color:#8f929e;color:#4646ce;border-radius:2px}label input:checked+span:before,label:hover input:checked+span:before{content:url('data:image/svg+xml; utf8, <svg width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M1 5L4.5 8.5L11 1.5\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/> </svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:checked+span.cross:before,label:hover input:checked+span.cross:before{content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91786 4.99992L9.03356 1.88386C9.11927 1.79808 9.16654 1.68365 9.16668 1.56162C9.16668 1.43952 9.1194 1.32495 9.03356 1.23931L8.7605 0.966323C8.67466 0.880342 8.56026 0.833252 8.43811 0.833252C8.31615 0.833252 8.20169 0.880342 8.11585 0.966323L5.00016 4.08218L1.88431 0.966323C1.79861 0.880342 1.68407 0.833252 1.56199 0.833252C1.44004 0.833252 1.32559 0.880342 1.23988 0.966323L0.966677 1.23931C0.788899 1.4171 0.788899 1.70628 0.966677 1.88386L4.08245 4.99992L0.966677 8.11584C0.880904 8.20175 0.833707 8.31619 0.833707 8.43822C0.833707 8.56025 0.880904 8.67468 0.966677 8.76053L1.23981 9.03351C1.32551 9.11943 1.44003 9.16658 1.56191 9.16658C1.684 9.16658 1.79853 9.11943 1.88424 9.03351L5.00008 5.91759L8.11578 9.03351C8.20162 9.11943 8.31608 9.16658 8.43803 9.16658C8.56005 9.16658 8.67459 9.11943 8.76043 9.03351L9.03349 8.76053C9.11919 8.67475 9.16646 8.56025 9.16646 8.43822C9.16646 8.31619 9.11919 8.20175 9.03349 8.11591L5.91786 4.99992Z\" fill=\"white\"/></svg>')}label input+span.indeterminate:before,label:hover input+span.indeterminate:before{content:url('data:image/svg+xml; utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 2\" fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.25 1C0.25 0.585786 0.585786 0.25 1 0.25L11 0.250001C11.4142 0.250001 11.75 0.585787 11.75 1C11.75 1.41421 11.4142 1.75 11 1.75L1 1.75C0.585786 1.75 0.25 1.41421 0.25 1Z\" fill=\"white\"/></svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:disabled+span{color:#8f929e}label input:disabled+span:before{border-color:#dfe0e3;pointer-events:none}label input[disabled]:checked+span:before{background:#8f929e;border-color:#8f929e;pointer-events:none}:host label{position:relative}:host label:hover:after{content:\"\";width:24px;height:24px;background:#f2f2fb;border-radius:50%;position:absolute;left:-4px;top:.5px}:host.disabled label:hover:after{display:none}\n"] }]
|
|
54
61
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { checkedStatus: [{
|
|
55
62
|
type: Input
|
|
56
63
|
}], disabled: [{
|
|
57
64
|
type: Input
|
|
65
|
+
}, {
|
|
66
|
+
type: HostBinding,
|
|
67
|
+
args: ['class.disabled']
|
|
58
68
|
}], icon: [{
|
|
59
69
|
type: Input
|
|
60
70
|
}], indeterminate: [{
|
|
61
71
|
type: Input
|
|
72
|
+
}], textNowrap: [{
|
|
73
|
+
type: Input
|
|
74
|
+
}, {
|
|
75
|
+
type: HostBinding,
|
|
76
|
+
args: ['class.text-nowrap']
|
|
62
77
|
}], checkedChange: [{
|
|
63
78
|
type: Output
|
|
79
|
+
}], checkboxContent: [{
|
|
80
|
+
type: ViewChild,
|
|
81
|
+
args: ['checkboxContent']
|
|
64
82
|
}] } });
|
|
65
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
83
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY2hlY2tib3guY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGF0YXJhaWxzc2hhcmVkL3NyYy9saWIvZHItaW5wdXRzL2NoZWNrYm94L2NoZWNrYm94LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2RhdGFyYWlsc3NoYXJlZC9zcmMvbGliL2RyLWlucHV0cy9jaGVja2JveC9jaGVja2JveC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBRUgsdUJBQXVCLEVBQ3ZCLGlCQUFpQixFQUNqQixTQUFTLEVBQ1QsVUFBVSxFQUNWLFlBQVksRUFDWixXQUFXLEVBQ1gsS0FBSyxFQUNMLE1BQU0sRUFDTixTQUFTLEdBQ1osTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUF3QixpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7QUFXekUsTUFBTSxPQUFPLGlCQUFpQjtJQVExQixJQUNJLGFBQWE7UUFDYixPQUFPLElBQUksQ0FBQyxjQUFjLENBQUM7SUFDL0IsQ0FBQztJQU1ELElBQUksYUFBYSxDQUFDLEtBQWM7UUFDNUIsSUFBSSxDQUFDLGNBQWMsR0FBRyxDQUFDLENBQUMsS0FBSyxDQUFDO1FBQzlCLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLENBQUM7SUFDNUIsQ0FBQztJQVdELFlBQW9CLEdBQXNCO1FBQXRCLFFBQUcsR0FBSCxHQUFHLENBQW1CO1FBMUIxQyxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBQ1IsU0FBSSxHQUFpQixFQUFFLENBQUM7UUFnQnpCLG1CQUFjLEdBQUcsS0FBSyxDQUFDO1FBQ3JCLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUc3QyxhQUFRLEdBQTZCLEdBQUcsRUFBRTtRQUMxQyxDQUFDLENBQUM7UUFDRixjQUFTLEdBQWUsR0FBRyxFQUFFO1FBQzdCLENBQUMsQ0FBQztJQUdGLENBQUM7SUFFRCxlQUFlO1FBQ1gsTUFBTSxPQUFPLEdBQUcsSUFBSSxDQUFDLGVBQWUsQ0FBQyxhQUFhLENBQUM7UUFDbkQsSUFBSSxJQUFJLENBQUMsVUFBVSxJQUFJLE9BQU8sQ0FBQyxXQUFXLEdBQUcsT0FBTyxDQUFDLFdBQVcsRUFBRTtZQUM5RCxJQUFJLENBQUMsT0FBTyxHQUFHLE9BQU8sQ0FBQyxTQUFTLENBQUM7U0FDcEM7SUFDTCxDQUFDO0lBRUQsVUFBVSxDQUFDLEtBQWM7UUFDckIsSUFBSSxDQUFDLGFBQWEsR0FBRyxLQUFLLENBQUM7UUFDM0IsSUFBSSxDQUFDLEdBQUcsQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRUQsZ0JBQWdCLENBQUMsRUFBTztRQUNwQixJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsQ0FBQztJQUN2QixDQUFDO0lBRUQsaUJBQWlCLENBQUMsRUFBTztRQUNyQixJQUFJLENBQUMsU0FBUyxHQUFHLEVBQUUsQ0FBQztJQUN4QixDQUFDO0lBRUQsZ0JBQWdCLENBQUUsVUFBbUI7UUFDakMsSUFBSSxDQUFDLFFBQVEsR0FBRyxVQUFVLENBQUM7SUFDL0IsQ0FBQztJQUVELFFBQVEsQ0FBQyxLQUFLO1FBQ1YsTUFBTSxLQUFLLEdBQUksS0FBSyxDQUFDLE1BQTJCLENBQUM7UUFDakQsSUFBSSxDQUFDLGFBQWEsR0FBRyxLQUFLLENBQUMsT0FBTyxDQUFDO1FBQ25DLElBQUksQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQztRQUM1QyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQztRQUNsQyxJQUFJLENBQUMsYUFBYSxHQUFHLEtBQUssQ0FBQyxhQUFhLENBQUM7UUFDekMsSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQ3JCLENBQUM7a0lBakVRLGlCQUFpQjtzSEFBakIsaUJBQWlCLGtVQUxmO1lBQ1AsRUFBRSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsV0FBVyxFQUFFLGlCQUFpQixFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUU7U0FDOUUsOElDcEJMLCtkQWNBOzs0RkRTYSxpQkFBaUI7a0JBVDdCLFNBQVM7K0JBQ0ksYUFBYSxhQUdaO3dCQUNQLEVBQUUsT0FBTyxFQUFFLGlCQUFpQixFQUFFLFdBQVcsbUJBQW1CLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRTtxQkFDOUUsbUJBQ2dCLHVCQUF1QixDQUFDLE1BQU07d0dBSXRDLGFBQWE7c0JBQXJCLEtBQUs7Z0JBR04sUUFBUTtzQkFGUCxLQUFLOztzQkFDTCxXQUFXO3VCQUFDLGdCQUFnQjtnQkFFcEIsSUFBSTtzQkFBWixLQUFLO2dCQUdGLGFBQWE7c0JBRGhCLEtBQUs7Z0JBT04sVUFBVTtzQkFGVCxLQUFLOztzQkFDTCxXQUFXO3VCQUFDLG1CQUFtQjtnQkFTdEIsYUFBYTtzQkFBdEIsTUFBTTtnQkFDdUIsZUFBZTtzQkFBNUMsU0FBUzt1QkFBQyxpQkFBaUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIEFmdGVyVmlld0luaXQsXG4gICAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gICAgQ2hhbmdlRGV0ZWN0b3JSZWYsXG4gICAgQ29tcG9uZW50LFxuICAgIEVsZW1lbnRSZWYsXG4gICAgRXZlbnRFbWl0dGVyLFxuICAgIEhvc3RCaW5kaW5nLFxuICAgIElucHV0LFxuICAgIE91dHB1dCxcbiAgICBWaWV3Q2hpbGQsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29udHJvbFZhbHVlQWNjZXNzb3IsIE5HX1ZBTFVFX0FDQ0VTU09SIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgICBzZWxlY3RvcjogJ2RyLWNoZWNrYm94JyxcbiAgICB0ZW1wbGF0ZVVybDogJy4vY2hlY2tib3guY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL2NoZWNrYm94LmNvbXBvbmVudC5zY3NzJ10sXG4gICAgcHJvdmlkZXJzOiBbXG4gICAgICAgIHsgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsIHVzZUV4aXN0aW5nOiBDaGVja2JveENvbXBvbmVudCwgbXVsdGk6IHRydWUgfVxuICAgIF0sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIENoZWNrYm94Q29tcG9uZW50IGltcGxlbWVudHMgQ29udHJvbFZhbHVlQWNjZXNzb3IsIEFmdGVyVmlld0luaXQge1xuICAgIHB1YmxpYyB0b29sdGlwOiBzdHJpbmc7XG4gICAgQElucHV0KCkgY2hlY2tlZFN0YXR1czogYm9vbGVhbjtcbiAgICBASW5wdXQoKVxuICAgIEBIb3N0QmluZGluZygnY2xhc3MuZGlzYWJsZWQnKVxuICAgIGRpc2FibGVkID0gZmFsc2U7XG4gICAgQElucHV0KCkgaWNvbjogJ2Nyb3NzJyB8ICcnID0gJyc7XG5cbiAgICBASW5wdXQoKVxuICAgIGdldCBpbmRldGVybWluYXRlKCk6IGJvb2xlYW4ge1xuICAgICAgICByZXR1cm4gdGhpcy5faW5kZXRlcm1pbmF0ZTtcbiAgICB9XG5cbiAgICBASW5wdXQoKVxuICAgIEBIb3N0QmluZGluZygnY2xhc3MudGV4dC1ub3dyYXAnKVxuICAgIHRleHROb3dyYXA6IGJvb2xlYW47XG5cbiAgICBzZXQgaW5kZXRlcm1pbmF0ZSh2YWx1ZTogYm9vbGVhbikge1xuICAgICAgICB0aGlzLl9pbmRldGVybWluYXRlID0gISF2YWx1ZTtcbiAgICAgICAgdGhpcy5jZHIubWFya0ZvckNoZWNrKCk7XG4gICAgfVxuXG4gICAgcHJpdmF0ZSBfaW5kZXRlcm1pbmF0ZSA9IGZhbHNlO1xuICAgIEBPdXRwdXQoKSBjaGVja2VkQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuICAgIEBWaWV3Q2hpbGQoJ2NoZWNrYm94Q29udGVudCcpIGNoZWNrYm94Q29udGVudDogRWxlbWVudFJlZjtcblxuICAgIG9uQ2hhbmdlOiAodmFsdWU6IGJvb2xlYW4pID0+IHZvaWQgPSAoKSA9PiB7XG4gICAgfTtcbiAgICBvblRvdWNoZWQ6ICgpID0+IHZvaWQgPSAoKSA9PiB7XG4gICAgfTtcblxuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZikge1xuICAgIH1cblxuICAgIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICAgICAgY29uc3QgZWxlbWVudCA9IHRoaXMuY2hlY2tib3hDb250ZW50Lm5hdGl2ZUVsZW1lbnQ7XG4gICAgICAgIGlmICh0aGlzLnRleHROb3dyYXAgJiYgZWxlbWVudC5zY3JvbGxXaWR0aCA+IGVsZW1lbnQuY2xpZW50V2lkdGgpIHtcbiAgICAgICAgICAgIHRoaXMudG9vbHRpcCA9IGVsZW1lbnQuaW5uZXJUZXh0O1xuICAgICAgICB9XG4gICAgfVxuXG4gICAgd3JpdGVWYWx1ZSh2YWx1ZTogYm9vbGVhbikge1xuICAgICAgICB0aGlzLmNoZWNrZWRTdGF0dXMgPSB2YWx1ZTtcbiAgICAgICAgdGhpcy5jZHIubWFya0ZvckNoZWNrKCk7XG4gICAgfVxuXG4gICAgcmVnaXN0ZXJPbkNoYW5nZShmbjogYW55KSB7XG4gICAgICAgIHRoaXMub25DaGFuZ2UgPSBmbjtcbiAgICB9XG5cbiAgICByZWdpc3Rlck9uVG91Y2hlZChmbjogYW55KSB7XG4gICAgICAgIHRoaXMub25Ub3VjaGVkID0gZm47XG4gICAgfVxuXG4gICAgc2V0RGlzYWJsZWRTdGF0ZT8oaXNEaXNhYmxlZDogYm9vbGVhbik6IHZvaWQge1xuICAgICAgICB0aGlzLmRpc2FibGVkID0gaXNEaXNhYmxlZDtcbiAgICB9XG5cbiAgICBzZXRWYWx1ZShldmVudCkge1xuICAgICAgICBjb25zdCBpbnB1dCA9IChldmVudC50YXJnZXQgYXMgSFRNTElucHV0RWxlbWVudCk7XG4gICAgICAgIHRoaXMuY2hlY2tlZFN0YXR1cyA9IGlucHV0LmNoZWNrZWQ7XG4gICAgICAgIHRoaXMuY2hlY2tlZENoYW5nZS5lbWl0KHRoaXMuY2hlY2tlZFN0YXR1cyk7XG4gICAgICAgIHRoaXMub25DaGFuZ2UodGhpcy5jaGVja2VkU3RhdHVzKTtcbiAgICAgICAgdGhpcy5pbmRldGVybWluYXRlID0gaW5wdXQuaW5kZXRlcm1pbmF0ZTtcbiAgICAgICAgdGhpcy5vblRvdWNoZWQoKTtcbiAgICB9XG59XG4iLCI8bGFiZWw+XG4gICAgPGlucHV0IHR5cGU9XCJjaGVja2JveFwiXG4gICAgICAgICAgIFthdHRyLmRhdGEtdGVzdF09XCJjaGVja2VkU3RhdHVzID8gJ2NoZWNrZWQnIDogJ3VuY2hlY2tlZCdcIlxuICAgICAgICAgICBbY2hlY2tlZF09XCJjaGVja2VkU3RhdHVzXCJcbiAgICAgICAgICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICAgICAgICAgKGNoYW5nZSk9XCJzZXRWYWx1ZSgkZXZlbnQpXCJcbiAgICAgICAgICAgKGNsaWNrKT1cIiRldmVudC5zdG9wUHJvcGFnYXRpb24oKVwiPlxuICAgIDxzcGFuICNjaGVja2JveENvbnRlbnRcbiAgICAgICAgICBbY2xhc3NdPVwiaWNvblwiXG4gICAgICAgICAgW2NsYXNzLmluZGV0ZXJtaW5hdGVdPVwiaW5kZXRlcm1pbmF0ZVwiXG4gICAgICAgICAgW2RyVG9vbHRpcF09XCJ0b29sdGlwXCI+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDwvc3Bhbj5cbjwvbGFiZWw+XG4iXX0=
|
|
@@ -3012,6 +3012,12 @@ class CheckboxComponent {
|
|
|
3012
3012
|
this.onTouched = () => {
|
|
3013
3013
|
};
|
|
3014
3014
|
}
|
|
3015
|
+
ngAfterViewInit() {
|
|
3016
|
+
const element = this.checkboxContent.nativeElement;
|
|
3017
|
+
if (this.textNowrap && element.scrollWidth > element.clientWidth) {
|
|
3018
|
+
this.tooltip = element.innerText;
|
|
3019
|
+
}
|
|
3020
|
+
}
|
|
3015
3021
|
writeValue(value) {
|
|
3016
3022
|
this.checkedStatus = value;
|
|
3017
3023
|
this.cdr.markForCheck();
|
|
@@ -3034,25 +3040,36 @@ class CheckboxComponent {
|
|
|
3034
3040
|
this.onTouched();
|
|
3035
3041
|
}
|
|
3036
3042
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3037
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxComponent, selector: "dr-checkbox", inputs: { checkedStatus: "checkedStatus", disabled: "disabled", icon: "icon", indeterminate: "indeterminate" }, outputs: { checkedChange: "checkedChange" }, providers: [
|
|
3043
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CheckboxComponent, selector: "dr-checkbox", inputs: { checkedStatus: "checkedStatus", disabled: "disabled", icon: "icon", indeterminate: "indeterminate", textNowrap: "textNowrap" }, outputs: { checkedChange: "checkedChange" }, host: { properties: { "class.disabled": "this.disabled", "class.text-nowrap": "this.textNowrap" } }, providers: [
|
|
3038
3044
|
{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }
|
|
3039
|
-
], ngImport: i0, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span [class]=\"icon\"
|
|
3045
|
+
], viewQueries: [{ propertyName: "checkboxContent", first: true, predicate: ["checkboxContent"], descendants: true }], ngImport: i0, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span #checkboxContent\n [class]=\"icon\"\n [class.indeterminate]=\"indeterminate\"\n [drTooltip]=\"tooltip\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: ["input+span{vertical-align:middle;line-height:30px}input+span,input+span:before{box-sizing:content-box!important;-webkit-box-sizing:content-box!important;-moz-box-sizing:content-box!important}input{visibility:hidden;position:absolute;width:0}label input+span{position:relative;z-index:19;display:inline-block;margin:0 5px 0 0;line-height:17px;min-height:14px;min-width:14px}:host.text-nowrap label input+span{white-space:nowrap;overflow:hidden;max-width:100%;text-overflow:ellipsis;line-height:20px}label input+span:hover{cursor:pointer}label input+span:before{content:\"\";font-size:14px;border-radius:0;display:inline-block;text-align:center;vertical-align:middle;padding:1px;min-height:12px;line-height:12px;min-width:12px;margin-right:5px;border:1.5px solid #8f929e;background-color:#fff;font-weight:400;margin-top:-1px}label input+span:before,label:hover input+span:before{background-color:#fff;border-color:#8f929e;color:#4646ce;border-radius:2px}label input:checked+span:before,label:hover input:checked+span:before{content:url('data:image/svg+xml; utf8, <svg width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M1 5L4.5 8.5L11 1.5\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/> </svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:checked+span.cross:before,label:hover input:checked+span.cross:before{content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91786 4.99992L9.03356 1.88386C9.11927 1.79808 9.16654 1.68365 9.16668 1.56162C9.16668 1.43952 9.1194 1.32495 9.03356 1.23931L8.7605 0.966323C8.67466 0.880342 8.56026 0.833252 8.43811 0.833252C8.31615 0.833252 8.20169 0.880342 8.11585 0.966323L5.00016 4.08218L1.88431 0.966323C1.79861 0.880342 1.68407 0.833252 1.56199 0.833252C1.44004 0.833252 1.32559 0.880342 1.23988 0.966323L0.966677 1.23931C0.788899 1.4171 0.788899 1.70628 0.966677 1.88386L4.08245 4.99992L0.966677 8.11584C0.880904 8.20175 0.833707 8.31619 0.833707 8.43822C0.833707 8.56025 0.880904 8.67468 0.966677 8.76053L1.23981 9.03351C1.32551 9.11943 1.44003 9.16658 1.56191 9.16658C1.684 9.16658 1.79853 9.11943 1.88424 9.03351L5.00008 5.91759L8.11578 9.03351C8.20162 9.11943 8.31608 9.16658 8.43803 9.16658C8.56005 9.16658 8.67459 9.11943 8.76043 9.03351L9.03349 8.76053C9.11919 8.67475 9.16646 8.56025 9.16646 8.43822C9.16646 8.31619 9.11919 8.20175 9.03349 8.11591L5.91786 4.99992Z\" fill=\"white\"/></svg>')}label input+span.indeterminate:before,label:hover input+span.indeterminate:before{content:url('data:image/svg+xml; utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 2\" fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.25 1C0.25 0.585786 0.585786 0.25 1 0.25L11 0.250001C11.4142 0.250001 11.75 0.585787 11.75 1C11.75 1.41421 11.4142 1.75 11 1.75L1 1.75C0.585786 1.75 0.25 1.41421 0.25 1Z\" fill=\"white\"/></svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:disabled+span{color:#8f929e}label input:disabled+span:before{border-color:#dfe0e3;pointer-events:none}label input[disabled]:checked+span:before{background:#8f929e;border-color:#8f929e;pointer-events:none}:host label{position:relative}:host label:hover:after{content:\"\";width:24px;height:24px;background:#f2f2fb;border-radius:50%;position:absolute;left:-4px;top:.5px}:host.disabled label:hover:after{display:none}\n"], dependencies: [{ kind: "directive", type: DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3040
3046
|
}
|
|
3041
3047
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
3042
3048
|
type: Component,
|
|
3043
3049
|
args: [{ selector: 'dr-checkbox', providers: [
|
|
3044
3050
|
{ provide: NG_VALUE_ACCESSOR, useExisting: CheckboxComponent, multi: true }
|
|
3045
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span [class]=\"icon\"
|
|
3051
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label>\n <input type=\"checkbox\"\n [attr.data-test]=\"checkedStatus ? 'checked' : 'unchecked'\"\n [checked]=\"checkedStatus\"\n [disabled]=\"disabled\"\n (change)=\"setValue($event)\"\n (click)=\"$event.stopPropagation()\">\n <span #checkboxContent\n [class]=\"icon\"\n [class.indeterminate]=\"indeterminate\"\n [drTooltip]=\"tooltip\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: ["input+span{vertical-align:middle;line-height:30px}input+span,input+span:before{box-sizing:content-box!important;-webkit-box-sizing:content-box!important;-moz-box-sizing:content-box!important}input{visibility:hidden;position:absolute;width:0}label input+span{position:relative;z-index:19;display:inline-block;margin:0 5px 0 0;line-height:17px;min-height:14px;min-width:14px}:host.text-nowrap label input+span{white-space:nowrap;overflow:hidden;max-width:100%;text-overflow:ellipsis;line-height:20px}label input+span:hover{cursor:pointer}label input+span:before{content:\"\";font-size:14px;border-radius:0;display:inline-block;text-align:center;vertical-align:middle;padding:1px;min-height:12px;line-height:12px;min-width:12px;margin-right:5px;border:1.5px solid #8f929e;background-color:#fff;font-weight:400;margin-top:-1px}label input+span:before,label:hover input+span:before{background-color:#fff;border-color:#8f929e;color:#4646ce;border-radius:2px}label input:checked+span:before,label:hover input:checked+span:before{content:url('data:image/svg+xml; utf8, <svg width=\"12\" height=\"10\" viewBox=\"0 0 12 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"> <path d=\"M1 5L4.5 8.5L11 1.5\" stroke=\"white\" stroke-width=\"1.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/> </svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:checked+span.cross:before,label:hover input:checked+span.cross:before{content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91786 4.99992L9.03356 1.88386C9.11927 1.79808 9.16654 1.68365 9.16668 1.56162C9.16668 1.43952 9.1194 1.32495 9.03356 1.23931L8.7605 0.966323C8.67466 0.880342 8.56026 0.833252 8.43811 0.833252C8.31615 0.833252 8.20169 0.880342 8.11585 0.966323L5.00016 4.08218L1.88431 0.966323C1.79861 0.880342 1.68407 0.833252 1.56199 0.833252C1.44004 0.833252 1.32559 0.880342 1.23988 0.966323L0.966677 1.23931C0.788899 1.4171 0.788899 1.70628 0.966677 1.88386L4.08245 4.99992L0.966677 8.11584C0.880904 8.20175 0.833707 8.31619 0.833707 8.43822C0.833707 8.56025 0.880904 8.67468 0.966677 8.76053L1.23981 9.03351C1.32551 9.11943 1.44003 9.16658 1.56191 9.16658C1.684 9.16658 1.79853 9.11943 1.88424 9.03351L5.00008 5.91759L8.11578 9.03351C8.20162 9.11943 8.31608 9.16658 8.43803 9.16658C8.56005 9.16658 8.67459 9.11943 8.76043 9.03351L9.03349 8.76053C9.11919 8.67475 9.16646 8.56025 9.16646 8.43822C9.16646 8.31619 9.11919 8.20175 9.03349 8.11591L5.91786 4.99992Z\" fill=\"white\"/></svg>')}label input+span.indeterminate:before,label:hover input+span.indeterminate:before{content:url('data:image/svg+xml; utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"10\" height=\"10\" viewBox=\"0 0 10 2\" fill=\"none\"><path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M0.25 1C0.25 0.585786 0.585786 0.25 1 0.25L11 0.250001C11.4142 0.250001 11.75 0.585787 11.75 1C11.75 1.41421 11.4142 1.75 11 1.75L1 1.75C0.585786 1.75 0.25 1.41421 0.25 1Z\" fill=\"white\"/></svg>');background:#4646ce;border-color:#4646ce;color:#fff}label input:disabled+span{color:#8f929e}label input:disabled+span:before{border-color:#dfe0e3;pointer-events:none}label input[disabled]:checked+span:before{background:#8f929e;border-color:#8f929e;pointer-events:none}:host label{position:relative}:host label:hover:after{content:\"\";width:24px;height:24px;background:#f2f2fb;border-radius:50%;position:absolute;left:-4px;top:.5px}:host.disabled label:hover:after{display:none}\n"] }]
|
|
3046
3052
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { checkedStatus: [{
|
|
3047
3053
|
type: Input
|
|
3048
3054
|
}], disabled: [{
|
|
3049
3055
|
type: Input
|
|
3056
|
+
}, {
|
|
3057
|
+
type: HostBinding,
|
|
3058
|
+
args: ['class.disabled']
|
|
3050
3059
|
}], icon: [{
|
|
3051
3060
|
type: Input
|
|
3052
3061
|
}], indeterminate: [{
|
|
3053
3062
|
type: Input
|
|
3063
|
+
}], textNowrap: [{
|
|
3064
|
+
type: Input
|
|
3065
|
+
}, {
|
|
3066
|
+
type: HostBinding,
|
|
3067
|
+
args: ['class.text-nowrap']
|
|
3054
3068
|
}], checkedChange: [{
|
|
3055
3069
|
type: Output
|
|
3070
|
+
}], checkboxContent: [{
|
|
3071
|
+
type: ViewChild,
|
|
3072
|
+
args: ['checkboxContent']
|
|
3056
3073
|
}] } });
|
|
3057
3074
|
|
|
3058
3075
|
class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
|
|
@@ -6393,7 +6410,7 @@ class DialogModalWrapperComponent {
|
|
|
6393
6410
|
this.destroy$.complete();
|
|
6394
6411
|
}
|
|
6395
6412
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogModalWrapperComponent, deps: [{ token: i1$6.MatLegacyDialogRef }, { token: DialogService }, { token: MAT_LEGACY_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6396
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogModalWrapperComponent, selector: "dr-dialog-modal-wrapper", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<div header class=\"header-dialog\">\n <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n <i *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\"\n data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n <ng-container>{{ dialogData.content }}</ng-container>\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 *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 *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\">{{ field.label }}</label>\n <div class=\"input-group p-0\"\n [ngClass]=\"{ 'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth }\">\n <dr-select *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\"\n class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n {{ dialogData.footerTemplateData.label }}</button>\n </ng-template>\n </dr-select>\n <dr-input *ngIf=\"field.type === dialogFieldType.INPUT\" data-test=\"modalInput\" class=\"form-control\"\n [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n <dr-date-picker *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 class=\"form-field-error-alert\" *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\"\n *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 (click)=\"onDecline()\"\n *ngIf=\"dialogData.customButton\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n class=\"buttons-wrapper--custom-btn\"\n data-test=\"declineBtn\">{{ dialogData.customButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n [theme]=\"'secondary'\">{{ dialogData.cancelButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n [isLoading]=\"isLoading\" [disabled]=\"form.invalid\">{{ dialogData.acceptButton.label }}</dr-button>\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:16px 32px 22px}.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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: CheckboxComponent, selector: "dr-checkbox", inputs: ["checkedStatus", "disabled", "icon", "indeterminate"], outputs: ["checkedChange"] }, { kind: "component", type: DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step", "searchMini"], outputs: ["blur", "modelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }, { kind: "component", type: DrSelectComponent, selector: "dr-select", inputs: ["className", "items", "addTag", "appendTo", "bindLabel", "bindValue", "clearable", "searchable", "searchFn", "multiple", "hideSelected", "placeholder", "loading", "loadingText", "readonly", "disabled", "groupBy", "optionWithDescription", "id", "keyDownFn", "selectedItem", "dropdownClass", "closeOnSelect", "textView", "autofocus", "isOpen"], outputs: ["change", "open", "closeUp"] }, { kind: "component", type: DrDatePickerComponent, selector: "dr-date-picker", inputs: ["format", "min", "max", "periodPosition", "placeholder", "disabled", "fiscalYearMonthsModifier", "datepickerFilter"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
6413
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DialogModalWrapperComponent, selector: "dr-dialog-modal-wrapper", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<div header class=\"header-dialog\">\n <h1 class=\"title-dialog\" data-test=\"modalTitle\">\n <i *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\"\n data-test=\"xBtn\"></i>\n</div>\n<div *ngIf=\"dialogData.content\" class=\"content-dialog\">\n <ng-container>{{ dialogData.content }}</ng-container>\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 *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 *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\">{{ field.label }}</label>\n <div class=\"input-group p-0\"\n [ngClass]=\"{ 'col-md-10': field.label && !field.isLabelFullWidth, 'col-md-12': !field.label || field.isLabelFullWidth }\">\n <dr-select *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\"\n class=\"{{ dialogData.footerTemplateData.icon }}\"></i>\n {{ dialogData.footerTemplateData.label }}</button>\n </ng-template>\n </dr-select>\n <dr-input *ngIf=\"field.type === dialogFieldType.INPUT\" data-test=\"modalInput\" class=\"form-control\"\n [formControlName]=\"field.name\" [placeholder]=\"field.placeholder\"></dr-input>\n <dr-date-picker *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 class=\"form-field-error-alert\" *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\"\n *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 (click)=\"onDecline()\"\n *ngIf=\"dialogData.customButton\"\n [theme]=\"dialogData.customButton?.theme || 'secondary'\"\n class=\"buttons-wrapper--custom-btn\"\n data-test=\"declineBtn\">{{ dialogData.customButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.cancelButton\" data-test=\"modalCloseBtn\" (click)=\"closeDialog()\"\n [theme]=\"'secondary'\">{{ dialogData.cancelButton.label }}</dr-button>\n <dr-button *ngIf=\"dialogData.acceptButton\" data-test=\"modalAddBtn\" (click)=\"onAccept()\" [theme]=\"'primary'\"\n [isLoading]=\"isLoading\" [disabled]=\"form.invalid\">{{ dialogData.acceptButton.label }}</dr-button>\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:16px 32px 22px}.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"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }, { kind: "component", type: CheckboxComponent, selector: "dr-checkbox", inputs: ["checkedStatus", "disabled", "icon", "indeterminate", "textNowrap"], outputs: ["checkedChange"] }, { kind: "component", type: DrInputComponent, selector: "dr-input", inputs: ["disabled", "buttonOptions", "type", "name", "placeholder", "readonly", "clearable", "min", "max", "minLength", "maxlength", "step", "searchMini"], outputs: ["blur", "modelDebounceChange", "searchHandler", "clearHandler", "buttonHandler"] }, { kind: "component", type: DrSelectComponent, selector: "dr-select", inputs: ["className", "items", "addTag", "appendTo", "bindLabel", "bindValue", "clearable", "searchable", "searchFn", "multiple", "hideSelected", "placeholder", "loading", "loadingText", "readonly", "disabled", "groupBy", "optionWithDescription", "id", "keyDownFn", "selectedItem", "dropdownClass", "closeOnSelect", "textView", "autofocus", "isOpen"], outputs: ["change", "open", "closeUp"] }, { kind: "component", type: DrDatePickerComponent, selector: "dr-date-picker", inputs: ["format", "min", "max", "periodPosition", "placeholder", "disabled", "fiscalYearMonthsModifier", "datepickerFilter"] }, { kind: "directive", type: i1$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }] }); }
|
|
6397
6414
|
}
|
|
6398
6415
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DialogModalWrapperComponent, decorators: [{
|
|
6399
6416
|
type: Component,
|