@datarailsshared/datarailsshared 1.5.246 → 1.5.249
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.249.tgz +0 -0
- package/esm2022/lib/dr-error/dr-error.component.mjs +6 -3
- package/esm2022/lib/dr-inputs/date-pickers/dr-date-picker-with-timeframe/dr-date-picker-with-timeframe.component.mjs +2 -2
- package/fesm2022/datarailsshared-datarailsshared.mjs +7 -4
- package/fesm2022/datarailsshared-datarailsshared.mjs.map +1 -1
- package/lib/dr-error/dr-error.component.d.ts +2 -1
- package/package.json +1 -1
- package/datarailsshared-datarailsshared-1.5.246.tgz +0 -0
|
Binary file
|
|
@@ -10,6 +10,7 @@ export class DrErrorComponent {
|
|
|
10
10
|
this.formGroupDirective = formGroupDirective;
|
|
11
11
|
this.label = 'Field error';
|
|
12
12
|
this.errorTooltipPosition = 'top';
|
|
13
|
+
this.displayAsLabel = false;
|
|
13
14
|
this.noIcon = false;
|
|
14
15
|
}
|
|
15
16
|
set control(value) {
|
|
@@ -35,11 +36,11 @@ export class DrErrorComponent {
|
|
|
35
36
|
return this._control.errors?.isWarning;
|
|
36
37
|
}
|
|
37
38
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrErrorComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
38
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrErrorComponent, selector: "dr-error", inputs: { control: "control", controlName: "controlName", label: "label", errorTooltipPosition: "errorTooltipPosition", noIcon: "noIcon" }, host: { properties: { "class.no-icon": "this.noIcon" } }, ngImport: i0, template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{label}}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;
|
|
39
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrErrorComponent, selector: "dr-error", inputs: { control: "control", controlName: "controlName", label: "label", errorTooltipPosition: "errorTooltipPosition", displayAsLabel: "displayAsLabel", noIcon: "noIcon" }, host: { properties: { "class.no-icon": "this.noIcon" } }, ngImport: i0, template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"displayAsLabel ? null : errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.error-container--cursor-pointer]=\"!displayAsLabel\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{ displayAsLabel ? errorString : label }}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;width:auto;color:#bf1d30}:host .error-container i{font-size:16px;margin-right:2px}:host .error-container span{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}:host .error-container--cursor-pointer{cursor:pointer}:host.no-icon{margin-top:2px}:host.no-icon .error-container span{font-size:12px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }] }); }
|
|
39
40
|
}
|
|
40
41
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrErrorComponent, decorators: [{
|
|
41
42
|
type: Component,
|
|
42
|
-
args: [{ selector: 'dr-error', template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{label}}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;
|
|
43
|
+
args: [{ selector: 'dr-error', template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"displayAsLabel ? null : errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.error-container--cursor-pointer]=\"!displayAsLabel\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{ displayAsLabel ? errorString : label }}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;width:auto;color:#bf1d30}:host .error-container i{font-size:16px;margin-right:2px}:host .error-container span{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}:host .error-container--cursor-pointer{cursor:pointer}:host.no-icon{margin-top:2px}:host.no-icon .error-container span{font-size:12px}\n"] }]
|
|
43
44
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.FormGroupDirective, decorators: [{
|
|
44
45
|
type: Optional
|
|
45
46
|
}] }]; }, propDecorators: { control: [{
|
|
@@ -50,10 +51,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
50
51
|
type: Input
|
|
51
52
|
}], errorTooltipPosition: [{
|
|
52
53
|
type: Input
|
|
54
|
+
}], displayAsLabel: [{
|
|
55
|
+
type: Input
|
|
53
56
|
}], noIcon: [{
|
|
54
57
|
type: Input
|
|
55
58
|
}, {
|
|
56
59
|
type: HostBinding,
|
|
57
60
|
args: ['class.no-icon']
|
|
58
61
|
}] } });
|
|
59
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
62
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHItZXJyb3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGF0YXJhaWxzc2hhcmVkL3NyYy9saWIvZHItZXJyb3IvZHItZXJyb3IuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGF0YXJhaWxzc2hhcmVkL3NyYy9saWIvZHItZXJyb3IvZHItZXJyb3IuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLGlCQUFpQixFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFFLFFBQVEsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzRixPQUFPLEVBQUUsV0FBVyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7O0FBT2pFLE1BQU0sT0FBTyxnQkFBZ0I7SUFDekIsWUFBb0IsR0FBc0IsRUFBc0Isa0JBQXNDO1FBQWxGLFFBQUcsR0FBSCxHQUFHLENBQW1CO1FBQXNCLHVCQUFrQixHQUFsQixrQkFBa0IsQ0FBb0I7UUFtQjdGLFVBQUssR0FBRyxhQUFhLENBQUM7UUFDdEIseUJBQW9CLEdBQUcsS0FBSyxDQUFDO1FBQzdCLG1CQUFjLEdBQUcsS0FBSyxDQUFDO1FBRU8sV0FBTSxHQUFHLEtBQUssQ0FBQztJQXZCbUQsQ0FBQztJQUcxRyxJQUFhLE9BQU8sQ0FBQyxLQUFrQjtRQUNuQyxJQUFJLEtBQUssRUFBRTtZQUNQLElBQUksQ0FBQyxRQUFRLEdBQUcsS0FBSyxDQUFDO1NBQ3pCO0lBQ0wsQ0FBQztJQUVELElBQWEsV0FBVyxDQUFDLEtBQWE7UUFDbEMsSUFBSSxDQUFDLEtBQUssSUFBSSxPQUFPLEtBQUssS0FBSyxRQUFRO1lBQUUsT0FBTztRQUVoRCxJQUFJLENBQUMsSUFBSSxDQUFDLGtCQUFrQixFQUFFO1lBQzFCLE1BQU0sSUFBSSxLQUFLLENBQUMseURBQXlELENBQUMsQ0FBQztTQUM5RTtRQUVELElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLGtCQUFrQixDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsS0FBSyxDQUFnQixDQUFDO0lBQzdFLENBQUM7SUFRRCxJQUFJLFdBQVc7UUFDWCxJQUFJLElBQUksQ0FBQyxRQUFRLENBQUMsUUFBUSxDQUFDLFVBQVUsQ0FBQyxFQUFFO1lBQ3BDLE9BQU8sb0JBQW9CLENBQUM7U0FDL0I7UUFFRCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUMsTUFBTSxFQUFFLFdBQVcsSUFBSSxJQUFJLENBQUM7SUFDckQsQ0FBQztJQUVELElBQUksU0FBUztRQUNULE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQyxNQUFNLEVBQUUsU0FBUyxDQUFDO0lBQzNDLENBQUM7a0lBcENRLGdCQUFnQjtzSEFBaEIsZ0JBQWdCLHdSQ1I3Qiw2YkFTQTs7NEZERGEsZ0JBQWdCO2tCQUw1QixTQUFTOytCQUVJLFVBQVU7OzBCQUl5QixRQUFROzRDQUd4QyxPQUFPO3NCQUFuQixLQUFLO2dCQU1PLFdBQVc7c0JBQXZCLEtBQUs7Z0JBVUcsS0FBSztzQkFBYixLQUFLO2dCQUNHLG9CQUFvQjtzQkFBNUIsS0FBSztnQkFDRyxjQUFjO3NCQUF0QixLQUFLO2dCQUVpQyxNQUFNO3NCQUE1QyxLQUFLOztzQkFBSSxXQUFXO3VCQUFDLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3RvclJlZiwgQ29tcG9uZW50LCBIb3N0QmluZGluZywgSW5wdXQsIE9wdGlvbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQ29udHJvbCwgRm9ybUdyb3VwRGlyZWN0aXZlIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgICB0ZW1wbGF0ZVVybDogJ2RyLWVycm9yLmNvbXBvbmVudC5odG1sJyxcbiAgICBzZWxlY3RvcjogJ2RyLWVycm9yJyxcbiAgICBzdHlsZVVybHM6IFsnZHItZXJyb3IuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgRHJFcnJvckNvbXBvbmVudCB7XG4gICAgY29uc3RydWN0b3IocHJpdmF0ZSBjZHI6IENoYW5nZURldGVjdG9yUmVmLCBAT3B0aW9uYWwoKSBwcml2YXRlIGZvcm1Hcm91cERpcmVjdGl2ZTogRm9ybUdyb3VwRGlyZWN0aXZlKSB7fVxuXG4gICAgcHVibGljIF9jb250cm9sOiBGb3JtQ29udHJvbDtcbiAgICBASW5wdXQoKSBzZXQgY29udHJvbCh2YWx1ZTogRm9ybUNvbnRyb2wpIHtcbiAgICAgICAgaWYgKHZhbHVlKSB7XG4gICAgICAgICAgICB0aGlzLl9jb250cm9sID0gdmFsdWU7XG4gICAgICAgIH1cbiAgICB9XG5cbiAgICBASW5wdXQoKSBzZXQgY29udHJvbE5hbWUodmFsdWU6IHN0cmluZykge1xuICAgICAgICBpZiAoIXZhbHVlIHx8IHR5cGVvZiB2YWx1ZSAhPT0gJ3N0cmluZycpIHJldHVybjtcblxuICAgICAgICBpZiAoIXRoaXMuZm9ybUdyb3VwRGlyZWN0aXZlKSB7XG4gICAgICAgICAgICB0aHJvdyBuZXcgRXJyb3IoJ1lvdSBtdXN0IHByb3ZpZGUgYSBmb3JtR3JvdXBEaXJlY3RpdmUgdG8gdXNlIHRoaXMgaW5wdXQnKTtcbiAgICAgICAgfVxuXG4gICAgICAgIHRoaXMuY29udHJvbCA9IHRoaXMuZm9ybUdyb3VwRGlyZWN0aXZlLmNvbnRyb2wuZ2V0KHZhbHVlKSBhcyBGb3JtQ29udHJvbDtcbiAgICB9XG5cbiAgICBASW5wdXQoKSBsYWJlbCA9ICdGaWVsZCBlcnJvcic7XG4gICAgQElucHV0KCkgZXJyb3JUb29sdGlwUG9zaXRpb24gPSAndG9wJztcbiAgICBASW5wdXQoKSBkaXNwbGF5QXNMYWJlbCA9IGZhbHNlO1xuXG4gICAgQElucHV0KCkgQEhvc3RCaW5kaW5nKCdjbGFzcy5uby1pY29uJykgbm9JY29uID0gZmFsc2U7XG5cbiAgICBnZXQgZXJyb3JTdHJpbmcoKSB7XG4gICAgICAgIGlmICh0aGlzLl9jb250cm9sLmhhc0Vycm9yKCdyZXF1aXJlZCcpKSB7XG4gICAgICAgICAgICByZXR1cm4gJ0ZpZWxkIGlzIHJlcXVpcmVkISc7XG4gICAgICAgIH1cblxuICAgICAgICByZXR1cm4gdGhpcy5fY29udHJvbC5lcnJvcnM/LmVycm9yU3RyaW5nIHx8IG51bGw7XG4gICAgfVxuXG4gICAgZ2V0IGlzV2FybmluZygpIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2NvbnRyb2wuZXJyb3JzPy5pc1dhcm5pbmc7XG4gICAgfVxufVxuIiwiPGRpdiAqbmdJZj1cIl9jb250cm9sLnN0YXR1cyA9PT0gJ0lOVkFMSUQnICYmICFfY29udHJvbC5wcmlzdGluZVwiXG4gICAgIFtkclRvb2x0aXBdPVwiZGlzcGxheUFzTGFiZWwgPyBudWxsIDogZXJyb3JTdHJpbmdcIlxuICAgICBbZHJUb29sdGlwUG9zaXRpb25dPVwiZXJyb3JUb29sdGlwUG9zaXRpb25cIlxuICAgICBjbGFzcz1cImVycm9yLWNvbnRhaW5lclwiXG4gICAgIFtjbGFzcy5lcnJvci1jb250YWluZXItLWN1cnNvci1wb2ludGVyXT1cIiFkaXNwbGF5QXNMYWJlbFwiXG4gICAgIFtjbGFzcy53YXJuaW5nXT1cImlzV2FybmluZ1wiPlxuICAgIDxpICpuZ0lmPVwiIW5vSWNvblwiIGNsYXNzPVwiZHItaWNvbi1zdGF0dXMtZXJyb3JcIj48L2k+XG4gICAgPHNwYW4+e3sgZGlzcGxheUFzTGFiZWwgPyBlcnJvclN0cmluZyA6IGxhYmVsIH19PC9zcGFuPlxuPC9kaXY+XG4iXX0=
|
|
@@ -157,14 +157,14 @@ export class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
|
|
|
157
157
|
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrDatePickerWithTimeframeComponent, selector: "dr-date-picker-with-timeframe", inputs: { isDashboardDatepicker: "isDashboardDatepicker", dateFormatConfig: "dateFormatConfig", canSelectTimeframe: "canSelectTimeframe", availableTimeframes: "availableTimeframes", paginationDebounce: "paginationDebounce", isUsingDateTagPresets: "isUsingDateTagPresets", presetTag: "presetTag" }, outputs: { onChangeFormat: "onChangeFormat", onChangePresetTag: "onChangePresetTag" }, host: { properties: { "class.dr-date-picker-on-dashboard": "this.isDashboardClassDisplayed" } }, providers: [
|
|
158
158
|
{ provide: NG_VALUE_ACCESSOR, useExisting: DrDatePickerWithTimeframeComponent, multi: true },
|
|
159
159
|
{ provide: DrDatePickerService }
|
|
160
|
-
], usesInheritance: true, ngImport: i0, template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:
|
|
160
|
+
], usesInheritance: true, ngImport: i0, template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}\n"], dependencies: [{ kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
161
161
|
}
|
|
162
162
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrDatePickerWithTimeframeComponent, decorators: [{
|
|
163
163
|
type: Component,
|
|
164
164
|
args: [{ selector: 'dr-date-picker-with-timeframe', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
165
165
|
{ provide: NG_VALUE_ACCESSOR, useExisting: DrDatePickerWithTimeframeComponent, multi: true },
|
|
166
166
|
{ provide: DrDatePickerService }
|
|
167
|
-
], template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:
|
|
167
|
+
], template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}\n"] }]
|
|
168
168
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.DateAdapter }, { type: i2.DrDatePickerService }]; }, propDecorators: { isDashboardClassDisplayed: [{
|
|
169
169
|
type: HostBinding,
|
|
170
170
|
args: ['class.dr-date-picker-on-dashboard']
|
|
@@ -3200,14 +3200,14 @@ class DrDatePickerWithTimeframeComponent extends DrDatePickerComponent {
|
|
|
3200
3200
|
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrDatePickerWithTimeframeComponent, selector: "dr-date-picker-with-timeframe", inputs: { isDashboardDatepicker: "isDashboardDatepicker", dateFormatConfig: "dateFormatConfig", canSelectTimeframe: "canSelectTimeframe", availableTimeframes: "availableTimeframes", paginationDebounce: "paginationDebounce", isUsingDateTagPresets: "isUsingDateTagPresets", presetTag: "presetTag" }, outputs: { onChangeFormat: "onChangeFormat", onChangePresetTag: "onChangePresetTag" }, host: { properties: { "class.dr-date-picker-on-dashboard": "this.isDashboardClassDisplayed" } }, providers: [
|
|
3201
3201
|
{ provide: NG_VALUE_ACCESSOR, useExisting: DrDatePickerWithTimeframeComponent, multi: true },
|
|
3202
3202
|
{ provide: DrDatePickerService }
|
|
3203
|
-
], usesInheritance: true, ngImport: i0, template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:
|
|
3203
|
+
], usesInheritance: true, ngImport: i0, template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}\n"], dependencies: [{ kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i1$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: DrButtonComponent, selector: "dr-button", inputs: ["theme", "icon", "iconColor", "iconSize", "iconAfter", "iconAfterColor", "iconAfterSize", "disabled", "isLoading", "isActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
3204
3204
|
}
|
|
3205
3205
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrDatePickerWithTimeframeComponent, decorators: [{
|
|
3206
3206
|
type: Component,
|
|
3207
3207
|
args: [{ selector: 'dr-date-picker-with-timeframe', changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
3208
3208
|
{ provide: NG_VALUE_ACCESSOR, useExisting: DrDatePickerWithTimeframeComponent, multi: true },
|
|
3209
3209
|
{ provide: DrDatePickerService }
|
|
3210
|
-
], template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:
|
|
3210
|
+
], template: "<dr-button [disabled]=\"isPrevDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-left\" (click)=\"pagingClicked(false)\"></dr-button>\n<div class=\"dr-datepicker-input-container\">\n <i *ngIf=\"isDashboardDatepicker\" class=\"dr-icon-date\"></i>\n\n <div class=\"dr-datepicker-input-container__formatted-value-display\" (click)=\"datepickerInput.click()\">\n <span *ngIf=\"presetTagSelected && datePickerService.isUsingDateTagPresets\"> {{ presetTagSelected }} </span>\n <span>{{ presetTagSelected && datePickerService.isUsingDateTagPresets ? '(' + displayedFormattedValue + ')' : displayedFormattedValue }}</span>\n </div>\n <input\n #datepickerInput\n [(ngModel)]=\"value\"\n (click)=\"datePicker.open()\"\n [matDatepicker]=\"datePicker\"\n [readonly]=\"readonly\"\n [min]=\"_min\"\n [max]=\"_max\"\n />\n</div>\n<dr-button [disabled]=\"isNextDateDisabled\" *ngIf=\"!disabled\" theme=\"icon\" icon=\"dr-icon-arrow-right\" (click)=\"pagingClicked(true)\"></dr-button>\n<mat-datepicker #datePicker\n class=\"dr-timeframe-datepicker\"\n [calendarHeaderComponent]=\"customHeader\"\n (yearSelected)=\"chosenPeriodHandler($event, timeframeOption.YEAR)\"\n (monthSelected)=\"chosenPeriodHandler($event, timeframeOption.MONTH)\"\n [panelClass]=\"datePickerService.isUsingDateTagPresets ? 'date-picker-preset-tag' : 'dr-timeframe-datepicker'\"\n >\n</mat-datepicker>\n", styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:Poppins,sans-serif;background-color:#fff;border:1px solid #9EA1AA;border-radius:6px;color:#333;overflow:hidden;outline:none;cursor:pointer}:host:hover{border-color:#9ea1aa}:host.active,:host:focus-within{border-color:#4646ce!important;color:#333}:host.disabled{pointer-events:none;border:1px solid #AEABAC;background:#F0F1F4;color:#aeabac}:host.disabled:after{color:#aeabac}:host.ng-valid.ng-dirty{border-color:#037c5a}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#bf1d30!important}:host.ng-untouched.ng-valid{border-color:#9ea1aa}:host:after,:host:before{position:absolute;display:flex;border-color:#6D6E6F transparent transparent;color:#6d6e6f}:host:after{font-family:DataRails!important;content:\"\\ea13\";font-size:24px;color:#6d6e6f;top:0;bottom:0;right:8px;pointer-events:none;position:absolute;display:flex;align-items:center;justify-content:center}:host i{display:flex;align-items:center;position:absolute;color:#6d6e6f;left:8px;top:0;bottom:0}:host input{display:flex;flex-grow:1;height:100%;border:none;text-align:left;padding-left:35px;padding-right:25px;cursor:pointer!important;outline:none}:host input.when-quarter{position:absolute;visibility:hidden}:host input:disabled{border:none;color:#aeabac;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host input::placeholder{color:#6d6e6f;font-size:14px;line-height:18px}::ng-deep .mat-datepicker-popup .mat-datepicker-content{margin:7px 0;box-shadow:0 4px 8px 1px #00000040;border-radius:12px!important}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]{border:inherit;color:inherit;background-color:inherit}::ng-deep .mat-datepicker-popup .mat-datepicker-content button[disabled]:hover{border:inherit}::ng-deep .mat-datepicker-popup .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){background:#F2F2FB;color:#4646ce;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-selected{background-color:#4646ce;color:#f2f2fb;font-weight:600}::ng-deep .mat-datepicker-popup .mat-calendar-body-today.mat-calendar-body-selected{box-shadow:none}::ng-deep .mat-datepicker-popup .mat-button-focus-overlay{background:#F5F5F5}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-icon-button:hover .mat-button-focus-overlay{opacity:1!important;background:#F5F5F5;transition:opacity .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-controls .mat-calendar-period-button:hover{background:#F5F5F5;transition:background .2s cubic-bezier(.35,0,.25,1)}::ng-deep .mat-datepicker-popup .mat-calendar-table-header th{font-size:14px;font-weight:600;color:#333}::ng-deep .mat-datepicker-popup .mat-calendar-table-header-divider{display:none}::ng-deep .mat-datepicker-popup .mat-calendar-body-label{color:#fff;padding:0}:host{border:none;display:flex;align-items:center}:host.disabled{background:transparent;color:#aeabac}:host.disabled.dr-date-picker-on-dashboard{border:none;padding:0 8px}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{text-decoration:none;color:#aeabac;font-weight:400}:host.disabled.dr-date-picker-on-dashboard .dr-datepicker-input-container i{color:#aeabac}:host.dr-date-picker-on-dashboard{width:-moz-fit-content;width:fit-content;justify-content:space-between}:host.dr-date-picker-on-dashboard mat-datepicker{position:absolute}:host.dr-date-picker-on-dashboard:after{visibility:hidden}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container{display:flex;flex-direction:row;justify-content:center;align-items:center;margin-left:-10px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container__formatted-value-display{font-weight:600;width:auto;margin-left:5px}:host.dr-date-picker-on-dashboard .dr-datepicker-input-container .dr-icon-date{display:block;position:relative;top:0;margin-right:8px;color:#4e566c}:host .dr-datepicker-input-container input{visibility:hidden;position:absolute;width:100%}:host .dr-datepicker-input-container__formatted-value-display{width:90px;height:22px;padding-left:0;text-align:center;line-height:22px;color:#0c142b;text-decoration-line:underline}:host .dr-datepicker-input-container__formatted-value-display:hover{background-color:#f2f2fb;border-radius:5px;cursor:pointer;text-decoration-line:underline;color:#4646ce}::ng-deep .date-picker-preset-tag{width:386px!important}::ng-deep .date-picker-preset-tag .mat-calendar-content{padding-left:32px!important;padding-right:32px!important}\n"] }]
|
|
3211
3211
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$4.DateAdapter }, { type: DrDatePickerService }]; }, propDecorators: { isDashboardClassDisplayed: [{
|
|
3212
3212
|
type: HostBinding,
|
|
3213
3213
|
args: ['class.dr-date-picker-on-dashboard']
|
|
@@ -5972,6 +5972,7 @@ class DrErrorComponent {
|
|
|
5972
5972
|
this.formGroupDirective = formGroupDirective;
|
|
5973
5973
|
this.label = 'Field error';
|
|
5974
5974
|
this.errorTooltipPosition = 'top';
|
|
5975
|
+
this.displayAsLabel = false;
|
|
5975
5976
|
this.noIcon = false;
|
|
5976
5977
|
}
|
|
5977
5978
|
set control(value) {
|
|
@@ -5997,11 +5998,11 @@ class DrErrorComponent {
|
|
|
5997
5998
|
return this._control.errors?.isWarning;
|
|
5998
5999
|
}
|
|
5999
6000
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrErrorComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.FormGroupDirective, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6000
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrErrorComponent, selector: "dr-error", inputs: { control: "control", controlName: "controlName", label: "label", errorTooltipPosition: "errorTooltipPosition", noIcon: "noIcon" }, host: { properties: { "class.no-icon": "this.noIcon" } }, ngImport: i0, template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{label}}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;
|
|
6001
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: DrErrorComponent, selector: "dr-error", inputs: { control: "control", controlName: "controlName", label: "label", errorTooltipPosition: "errorTooltipPosition", displayAsLabel: "displayAsLabel", noIcon: "noIcon" }, host: { properties: { "class.no-icon": "this.noIcon" } }, ngImport: i0, template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"displayAsLabel ? null : errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.error-container--cursor-pointer]=\"!displayAsLabel\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{ displayAsLabel ? errorString : label }}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;width:auto;color:#bf1d30}:host .error-container i{font-size:16px;margin-right:2px}:host .error-container span{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}:host .error-container--cursor-pointer{cursor:pointer}:host.no-icon{margin-top:2px}:host.no-icon .error-container span{font-size:12px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: DrTooltipDirective, selector: "[drTooltip]", inputs: ["drTooltip", "drTooltipContext", "drTooltipPosition", "drTooltipClass", "drTooltipTheme", "drTooltipMousleaveTimeout", "drTooltipOptions", "drTooltipShow"] }] }); }
|
|
6001
6002
|
}
|
|
6002
6003
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: DrErrorComponent, decorators: [{
|
|
6003
6004
|
type: Component,
|
|
6004
|
-
args: [{ selector: 'dr-error', template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{label}}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;
|
|
6005
|
+
args: [{ selector: 'dr-error', template: "<div *ngIf=\"_control.status === 'INVALID' && !_control.pristine\"\n [drTooltip]=\"displayAsLabel ? null : errorString\"\n [drTooltipPosition]=\"errorTooltipPosition\"\n class=\"error-container\"\n [class.error-container--cursor-pointer]=\"!displayAsLabel\"\n [class.warning]=\"isWarning\">\n <i *ngIf=\"!noIcon\" class=\"dr-icon-status-error\"></i>\n <span>{{ displayAsLabel ? errorString : label }}</span>\n</div>\n", styles: [":host{display:flex;margin-top:8px}:host:empty{display:none}:host .error-container{display:flex;align-items:center;width:auto;color:#bf1d30}:host .error-container i{font-size:16px;margin-right:2px}:host .error-container span{font-family:Poppins,sans-serif;font-style:normal;font-weight:400;font-size:11px;line-height:20px}:host .error-container.warning{color:#ffb800}:host .error-container.warning span{color:#9e5f00}:host .error-container--cursor-pointer{cursor:pointer}:host.no-icon{margin-top:2px}:host.no-icon .error-container span{font-size:12px}\n"] }]
|
|
6005
6006
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$2.FormGroupDirective, decorators: [{
|
|
6006
6007
|
type: Optional
|
|
6007
6008
|
}] }]; }, propDecorators: { control: [{
|
|
@@ -6012,6 +6013,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
6012
6013
|
type: Input
|
|
6013
6014
|
}], errorTooltipPosition: [{
|
|
6014
6015
|
type: Input
|
|
6016
|
+
}], displayAsLabel: [{
|
|
6017
|
+
type: Input
|
|
6015
6018
|
}], noIcon: [{
|
|
6016
6019
|
type: Input
|
|
6017
6020
|
}, {
|