npm - @testgorilla/tgo-ui - Versions diffs - 6.2.3 → 6.2.4 - Mend

@testgorilla/tgo-ui 6.2.3 → 6.2.4

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.

Files changed (161) hide show

package/fesm2022/testgorilla-tgo-ui-components-datepicker.mjs CHANGED Viewed

@@ -32,7 +32,7 @@ class DatepickerService {
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DatepickerService, decorators: [{
             type: Injectable,
             args: [{
-                    providedIn: 'root'
+                    providedIn: 'root',
                 }]
         }] });
@@ -295,7 +295,7 @@ class DatepickerComponent {
     // Set errors length for validation
     // Consider only those errors which are not empty
     setErrorsLength() {
-        if (!!this._errors) {
+        if (this._errors) {
             return this._errors.filter(err => !!err).length > 0 ? true : false;
         }
         return false;
@@ -340,8 +340,8 @@ class DatepickerComponent {
         }
     }
     dateRangeChange() {
-        const start = this.range.controls.start.value;
-        const end = this.range.controls.end.value;
+        const start = this.range.controls.start.value ?? null;
+        const end = this.range.controls.end.value ?? null;
         this.onValueChange([start ? new Date(start) : start, end ? new Date(end) : end]);
     }
     setMonthAndYear(normalizedMonthAndYear, datepicker) {
@@ -383,14 +383,14 @@ class DatepickerComponent {
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DatepickerComponent, isStandalone: false, selector: "ui-datepicker", inputs: { label: "label", fieldName: "fieldName", placeholder: "placeholder", id: "id", value: "value", errors: "errors", isRange: "isRange", setSingleDateRangeOnBlur: "setSingleDateRangeOnBlur", showInnerErrors: "showInnerErrors", innerErrorsMessage: "innerErrorsMessage", disabled: "disabled", required: "required", hintMessage: "hintMessage", updateOnBlur: "updateOnBlur", showBottomContent: "showBottomContent", fullWidth: "fullWidth", minDate: "minDate", maxDate: "maxDate", monthPicker: "monthPicker", applicationTheme: "applicationTheme", hideBuiltInErrors: "hideBuiltInErrors", hideLabelInErrors: "hideLabelInErrors", preventUserInput: "preventUserInput", companyColor: "companyColor", browserTimezone: "browserTimezone" }, outputs: { changed: "changed" }, host: { properties: { "class": "this.class" } }, providers: [
             { provide: DateAdapter, useClass: UiDateAdapter },
             { provide: MAT_DATE_FORMATS, useValue: UI_DATE_FORMATS },
-        ], usesOnChanges: true, ngImport: i0, template: "@if (monthPicker) {\n  <mat-form-field\n    appNoDateFormat\n    appearance=\"outline\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n    [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n  >\n    <mat-label *ngIf=\"label\">\n      <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n    </mat-label>\n\n    <input\n      matInput\n      [id]=\"id!\"\n      (blur)=\"onTouch()\"\n      [placeholder]=\"placeholder!\"\n      [matDatepicker]=\"dp\"\n      [value]=\"value\"\n      [disabled]=\"disabled\"\n      [name]=\"fieldName!\"\n      [min]=\"minDate\"\n      [max]=\"maxDate\"\n      [readonly]=\"preventUserInput\"\n      (change)=\"onInput($event)\"\n      (dateChange)=\"onValueChange($event.value)\"\n    />\n    <mat-datepicker-toggle matIconSuffix [for]=\"dp\">\n      <ui-icon\n        matDatepickerToggleIcon\n        [applicationTheme]=\"applicationTheme\"\n        name=\"Calendar\"\n        size=\"24\"\n        color=\"inherit\"\n      ></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-datepicker\n      panelClass=\"month-picker\"\n      #dp\n      startView=\"multi-year\"\n      (monthSelected)=\"setMonthAndYear($event, dp)\"\n    ></mat-datepicker>\n\n    <mat-hint class=\"info\" *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n      >{{ hint }}\n    </mat-hint>\n    <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n      <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n    </mat-hint>\n  </mat-form-field>\n} @else {\n  @if (isRange) {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n      class=\"range-datepicker\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n\n      <mat-date-range-input [formGroup]=\"range\" [rangePicker]=\"rangePicker\" [min]=\"minDate\" [max]=\"maxDate\">\n        <input\n          matStartDate\n          formControlName=\"start\"\n          [placeholder]=\"translationContext + 'START_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(true)\"\n        />\n        <input\n          matEndDate\n          formControlName=\"end\"\n          [placeholder]=\"translationContext + 'END_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(false)\"\n        />\n      </mat-date-range-input>\n      <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-date-range-picker #rangePicker (closed)=\"handleCloseRangePicker()\"></mat-date-range-picker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"\n          hint &&\n          !_errors &&\n          !(ngControl?.touched && (ngControl?.errors | hasValidationError)) &&\n          !(range?.invalid && showInnerErrors)\n        \"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint\n        class=\"error\"\n        *ngIf=\"\n          errorsLength ||\n          (ngControl?.touched && (ngControl?.errors | hasValidationError)) ||\n          (range?.invalid && showInnerErrors)\n        \"\n      >\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  } @else {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n      <input\n        matInput\n        [matDatepicker]=\"picker\"\n        (blur)=\"onTouch()\"\n        (dateChange)=\"onValueChange($event.value)\"\n        [id]=\"id!\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [readonly]=\"preventUserInput\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n      />\n      <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #picker></mat-datepicker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  }\n}\n\n<ng-template #labelTpl>{{ label }}<span *ngIf=\"required\"> *</span></ng-template>\n<ng-template #hintsTpl>\n  @if (errorsLength) {\n    <div class=\"errors\" *ngFor=\"let error of _errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n      <span [innerHTML]=\"error\"></span>\n    </div>\n  }\n  @if (ngControl && !hideBuiltInErrors) {\n    <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n  }\n  @if (showInnerErrors) {\n    @if (isRange) {\n      <div class=\"errors\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n        <span [innerHTML]=\"innerErrorsMessage\"></span>\n      </div>\n    }\n  }\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.month-picker .mat-calendar-period-button{pointer-events:none}.month-picker .mat-calendar-arrow{display:none}.ui-datepicker{width:100%}.ui-datepicker .mat-mdc-form-field{margin-top:0;min-width:296px}.ui-datepicker .mat-mdc-form-field.range-datepicker .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-datepicker .mat-mdc-form-field.full-width{width:100%}.ui-datepicker .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;max-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:0;font-size:12px;line-height:16px;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#e02800}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex;padding-bottom:10px}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint .hint-message{color:#888!important;margin-top:4px}.mat-datepicker-content .mat-mdc-button.mat-unthemed .mdc-button__label>span{font-weight:600}.mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:#e9f0f1}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:#e9f0f1}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .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),[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before,[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-selected,[theme=light] .mat-datepicker-content .mat-calendar-body-selected{background-color:var(--datepicker-selected-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected),[theme=light] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected){background:transparent;--mat-datepicker-calendar-date-focus-state-background-color: $tgo-white }[theme=dark] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),[theme=light] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){--mat-datepicker-calendar-date-focus-state-background-color: var(--datepicker-hover-color)}.info{margin-top:4px!important;padding-bottom:10px}\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i6.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i7.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i7.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i7.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: NoDateFormatDirective, selector: "[appNoDateFormat]" }, { kind: "component", type: i9.ValidationErrorComponent, selector: "ui-validation-error", inputs: ["ngControl", "touchedOn", "errorMessage", "label", "applicationTheme"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: i10.HasValidationErrorPipe, name: "hasValidationError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+        ], usesOnChanges: true, ngImport: i0, template: "@if (monthPicker) {\n  <mat-form-field\n    appNoDateFormat\n    appearance=\"outline\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n    [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n  >\n    <mat-label *ngIf=\"label\">\n      <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n    </mat-label>\n\n    <input\n      matInput\n      [id]=\"id!\"\n      (blur)=\"onTouch()\"\n      [placeholder]=\"placeholder!\"\n      [matDatepicker]=\"dp\"\n      [value]=\"value\"\n      [disabled]=\"disabled\"\n      [name]=\"fieldName!\"\n      [min]=\"minDate\"\n      [max]=\"maxDate\"\n      [readonly]=\"preventUserInput\"\n      (change)=\"onInput($event)\"\n      (dateChange)=\"onValueChange($event.value)\"\n    />\n    <mat-datepicker-toggle matIconSuffix [for]=\"dp\">\n      <ui-icon\n        matDatepickerToggleIcon\n        [applicationTheme]=\"applicationTheme\"\n        name=\"Calendar\"\n        size=\"24\"\n        color=\"inherit\"\n      ></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-datepicker\n      panelClass=\"month-picker\"\n      #dp\n      startView=\"multi-year\"\n      (monthSelected)=\"setMonthAndYear($event, dp)\"\n    ></mat-datepicker>\n\n    <mat-hint class=\"info\" *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n      >{{ hint }}\n    </mat-hint>\n    <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n      <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n    </mat-hint>\n  </mat-form-field>\n} @else {\n  @if (isRange) {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n      class=\"range-datepicker\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n\n      <mat-date-range-input [formGroup]=\"range\" [rangePicker]=\"rangePicker\" [min]=\"minDate\" [max]=\"maxDate\">\n        <input\n          matStartDate\n          formControlName=\"start\"\n          [placeholder]=\"translationContext + 'START_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(true)\"\n        />\n        <input\n          matEndDate\n          formControlName=\"end\"\n          [placeholder]=\"translationContext + 'END_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(false)\"\n        />\n      </mat-date-range-input>\n      <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-date-range-picker #rangePicker (closed)=\"handleCloseRangePicker()\"></mat-date-range-picker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"\n          hint &&\n          !_errors &&\n          !(ngControl?.touched && (ngControl?.errors | hasValidationError)) &&\n          !(range?.invalid && showInnerErrors)\n        \"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint\n        class=\"error\"\n        *ngIf=\"\n          errorsLength ||\n          (ngControl?.touched && (ngControl?.errors | hasValidationError)) ||\n          (range?.invalid && showInnerErrors)\n        \"\n      >\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  } @else {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n      <input\n        matInput\n        [matDatepicker]=\"picker\"\n        (blur)=\"onTouch()\"\n        (dateChange)=\"onValueChange($event.value)\"\n        [id]=\"id!\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [readonly]=\"preventUserInput\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n      />\n      <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #picker></mat-datepicker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  }\n}\n\n<ng-template #labelTpl>{{ label }}<span *ngIf=\"required\"> *</span></ng-template>\n<ng-template #hintsTpl>\n  @if (errorsLength) {\n    <div class=\"errors\" *ngFor=\"let error of _errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n      <span [innerHTML]=\"error\"></span>\n    </div>\n  }\n  @if (ngControl && !hideBuiltInErrors) {\n    <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n  }\n  @if (showInnerErrors) {\n    @if (isRange) {\n      <div class=\"errors\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n        <span [innerHTML]=\"innerErrorsMessage\"></span>\n      </div>\n    }\n  }\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.month-picker .mat-calendar-period-button{pointer-events:none}.month-picker .mat-calendar-arrow{display:none}.ui-datepicker{width:100%}.ui-datepicker .mat-mdc-form-field{margin-top:0;min-width:296px}.ui-datepicker .mat-mdc-form-field.range-datepicker .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-datepicker .mat-mdc-form-field.full-width{width:100%}.ui-datepicker .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;max-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:0;font-size:12px;line-height:16px;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#e02800}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex;padding-bottom:10px}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint .hint-message{color:#888!important;margin-top:4px}.mat-datepicker-content .mat-mdc-button.mat-unthemed .mdc-button__label>span{font-weight:600}.mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:#e9f0f1}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:#e9f0f1}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .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),[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before,[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-selected,[theme=light] .mat-datepicker-content .mat-calendar-body-selected{background-color:var(--datepicker-selected-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected),[theme=light] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected){background:transparent;--mat-datepicker-calendar-date-focus-state-background-color: $tgo-white}[theme=dark] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),[theme=light] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){--mat-datepicker-calendar-date-focus-state-background-color: var(--datepicker-hover-color)}.info{margin-top:4px!important;padding-bottom:10px}\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i4.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4.MatLabel, selector: "mat-label" }, { kind: "directive", type: i4.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i6.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i1.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i7.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i7.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i7.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i7.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "component", type: i7.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i7.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i7.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i7.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: NoDateFormatDirective, selector: "[appNoDateFormat]" }, { kind: "component", type: i9.ValidationErrorComponent, selector: "ui-validation-error", inputs: ["ngControl", "touchedOn", "errorMessage", "label", "applicationTheme"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: i10.HasValidationErrorPipe, name: "hasValidationError" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DatepickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ui-datepicker', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
                         { provide: DateAdapter, useClass: UiDateAdapter },
                         { provide: MAT_DATE_FORMATS, useValue: UI_DATE_FORMATS },
-                    ], standalone: false, template: "@if (monthPicker) {\n  <mat-form-field\n    appNoDateFormat\n    appearance=\"outline\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n    [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n  >\n    <mat-label *ngIf=\"label\">\n      <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n    </mat-label>\n\n    <input\n      matInput\n      [id]=\"id!\"\n      (blur)=\"onTouch()\"\n      [placeholder]=\"placeholder!\"\n      [matDatepicker]=\"dp\"\n      [value]=\"value\"\n      [disabled]=\"disabled\"\n      [name]=\"fieldName!\"\n      [min]=\"minDate\"\n      [max]=\"maxDate\"\n      [readonly]=\"preventUserInput\"\n      (change)=\"onInput($event)\"\n      (dateChange)=\"onValueChange($event.value)\"\n    />\n    <mat-datepicker-toggle matIconSuffix [for]=\"dp\">\n      <ui-icon\n        matDatepickerToggleIcon\n        [applicationTheme]=\"applicationTheme\"\n        name=\"Calendar\"\n        size=\"24\"\n        color=\"inherit\"\n      ></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-datepicker\n      panelClass=\"month-picker\"\n      #dp\n      startView=\"multi-year\"\n      (monthSelected)=\"setMonthAndYear($event, dp)\"\n    ></mat-datepicker>\n\n    <mat-hint class=\"info\" *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n      >{{ hint }}\n    </mat-hint>\n    <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n      <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n    </mat-hint>\n  </mat-form-field>\n} @else {\n  @if (isRange) {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n      class=\"range-datepicker\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n\n      <mat-date-range-input [formGroup]=\"range\" [rangePicker]=\"rangePicker\" [min]=\"minDate\" [max]=\"maxDate\">\n        <input\n          matStartDate\n          formControlName=\"start\"\n          [placeholder]=\"translationContext + 'START_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(true)\"\n        />\n        <input\n          matEndDate\n          formControlName=\"end\"\n          [placeholder]=\"translationContext + 'END_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(false)\"\n        />\n      </mat-date-range-input>\n      <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-date-range-picker #rangePicker (closed)=\"handleCloseRangePicker()\"></mat-date-range-picker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"\n          hint &&\n          !_errors &&\n          !(ngControl?.touched && (ngControl?.errors | hasValidationError)) &&\n          !(range?.invalid && showInnerErrors)\n        \"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint\n        class=\"error\"\n        *ngIf=\"\n          errorsLength ||\n          (ngControl?.touched && (ngControl?.errors | hasValidationError)) ||\n          (range?.invalid && showInnerErrors)\n        \"\n      >\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  } @else {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n      <input\n        matInput\n        [matDatepicker]=\"picker\"\n        (blur)=\"onTouch()\"\n        (dateChange)=\"onValueChange($event.value)\"\n        [id]=\"id!\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [readonly]=\"preventUserInput\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n      />\n      <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #picker></mat-datepicker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  }\n}\n\n<ng-template #labelTpl>{{ label }}<span *ngIf=\"required\"> *</span></ng-template>\n<ng-template #hintsTpl>\n  @if (errorsLength) {\n    <div class=\"errors\" *ngFor=\"let error of _errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n      <span [innerHTML]=\"error\"></span>\n    </div>\n  }\n  @if (ngControl && !hideBuiltInErrors) {\n    <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n  }\n  @if (showInnerErrors) {\n    @if (isRange) {\n      <div class=\"errors\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n        <span [innerHTML]=\"innerErrorsMessage\"></span>\n      </div>\n    }\n  }\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.month-picker .mat-calendar-period-button{pointer-events:none}.month-picker .mat-calendar-arrow{display:none}.ui-datepicker{width:100%}.ui-datepicker .mat-mdc-form-field{margin-top:0;min-width:296px}.ui-datepicker .mat-mdc-form-field.range-datepicker .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-datepicker .mat-mdc-form-field.full-width{width:100%}.ui-datepicker .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;max-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:0;font-size:12px;line-height:16px;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#e02800}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex;padding-bottom:10px}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint .hint-message{color:#888!important;margin-top:4px}.mat-datepicker-content .mat-mdc-button.mat-unthemed .mdc-button__label>span{font-weight:600}.mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:#e9f0f1}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:#e9f0f1}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .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),[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before,[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-selected,[theme=light] .mat-datepicker-content .mat-calendar-body-selected{background-color:var(--datepicker-selected-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected),[theme=light] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected){background:transparent;--mat-datepicker-calendar-date-focus-state-background-color: $tgo-white }[theme=dark] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),[theme=light] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){--mat-datepicker-calendar-date-focus-state-background-color: var(--datepicker-hover-color)}.info{margin-top:4px!important;padding-bottom:10px}\n"] }]
+                    ], standalone: false, template: "@if (monthPicker) {\n  <mat-form-field\n    appNoDateFormat\n    appearance=\"outline\"\n    [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n    [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n  >\n    <mat-label *ngIf=\"label\">\n      <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n    </mat-label>\n\n    <input\n      matInput\n      [id]=\"id!\"\n      (blur)=\"onTouch()\"\n      [placeholder]=\"placeholder!\"\n      [matDatepicker]=\"dp\"\n      [value]=\"value\"\n      [disabled]=\"disabled\"\n      [name]=\"fieldName!\"\n      [min]=\"minDate\"\n      [max]=\"maxDate\"\n      [readonly]=\"preventUserInput\"\n      (change)=\"onInput($event)\"\n      (dateChange)=\"onValueChange($event.value)\"\n    />\n    <mat-datepicker-toggle matIconSuffix [for]=\"dp\">\n      <ui-icon\n        matDatepickerToggleIcon\n        [applicationTheme]=\"applicationTheme\"\n        name=\"Calendar\"\n        size=\"24\"\n        color=\"inherit\"\n      ></ui-icon>\n    </mat-datepicker-toggle>\n    <mat-datepicker\n      panelClass=\"month-picker\"\n      #dp\n      startView=\"multi-year\"\n      (monthSelected)=\"setMonthAndYear($event, dp)\"\n    ></mat-datepicker>\n\n    <mat-hint class=\"info\" *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n      >{{ hint }}\n    </mat-hint>\n    <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n      <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n    </mat-hint>\n  </mat-form-field>\n} @else {\n  @if (isRange) {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n      class=\"range-datepicker\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n\n      <mat-date-range-input [formGroup]=\"range\" [rangePicker]=\"rangePicker\" [min]=\"minDate\" [max]=\"maxDate\">\n        <input\n          matStartDate\n          formControlName=\"start\"\n          [placeholder]=\"translationContext + 'START_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(true)\"\n        />\n        <input\n          matEndDate\n          formControlName=\"end\"\n          [placeholder]=\"translationContext + 'END_DATE' | uiTranslate | async\"\n          (dateChange)=\"dateRangeChange()\"\n          (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(false)\"\n        />\n      </mat-date-range-input>\n      <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-date-range-picker #rangePicker (closed)=\"handleCloseRangePicker()\"></mat-date-range-picker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"\n          hint &&\n          !_errors &&\n          !(ngControl?.touched && (ngControl?.errors | hasValidationError)) &&\n          !(range?.invalid && showInnerErrors)\n        \"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint\n        class=\"error\"\n        *ngIf=\"\n          errorsLength ||\n          (ngControl?.touched && (ngControl?.errors | hasValidationError)) ||\n          (range?.invalid && showInnerErrors)\n        \"\n      >\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  } @else {\n    <mat-form-field\n      appearance=\"outline\"\n      [color]=\"errorsLength || (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n      [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n    >\n      <mat-label *ngIf=\"label\">\n        <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n      </mat-label>\n      <input\n        matInput\n        [matDatepicker]=\"picker\"\n        (blur)=\"onTouch()\"\n        (dateChange)=\"onValueChange($event.value)\"\n        [id]=\"id!\"\n        [placeholder]=\"placeholder!\"\n        [value]=\"value\"\n        [disabled]=\"disabled\"\n        [name]=\"fieldName!\"\n        [readonly]=\"preventUserInput\"\n        [min]=\"minDate\"\n        [max]=\"maxDate\"\n      />\n      <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n        <ui-icon\n          matDatepickerToggleIcon\n          [applicationTheme]=\"applicationTheme\"\n          name=\"Calendar\"\n          size=\"24\"\n          color=\"inherit\"\n        ></ui-icon>\n      </mat-datepicker-toggle>\n      <mat-datepicker #picker></mat-datepicker>\n\n      <mat-hint\n        class=\"info\"\n        *ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors | hasValidationError))\"\n        >{{ hint }}\n      </mat-hint>\n      <mat-hint class=\"error\" *ngIf=\"errorsLength || (ngControl?.touched && (ngControl?.errors | hasValidationError))\">\n        <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n      </mat-hint>\n    </mat-form-field>\n  }\n}\n\n<ng-template #labelTpl>{{ label }}<span *ngIf=\"required\"> *</span></ng-template>\n<ng-template #hintsTpl>\n  @if (errorsLength) {\n    <div class=\"errors\" *ngFor=\"let error of _errors\">\n      <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n      <span [innerHTML]=\"error\"></span>\n    </div>\n  }\n  @if (ngControl && !hideBuiltInErrors) {\n    <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n  }\n  @if (showInnerErrors) {\n    @if (isRange) {\n      <div class=\"errors\">\n        <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n        <span [innerHTML]=\"innerErrorsMessage\"></span>\n      </div>\n    }\n  }\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.month-picker .mat-calendar-period-button{pointer-events:none}.month-picker .mat-calendar-arrow{display:none}.ui-datepicker{width:100%}.ui-datepicker .mat-mdc-form-field{margin-top:0;min-width:296px}.ui-datepicker .mat-mdc-form-field.range-datepicker .mat-mdc-form-field-hint.error svg{color:#e02800!important}.ui-datepicker .mat-mdc-form-field.full-width{width:100%}.ui-datepicker .mat-mdc-form-field.hide-bottom-content .mat-mdc-form-field-subscript-wrapper{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper{height:48px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label{top:22px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline{color:#888}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mdc-notched-outline .mdc-floating-label--float-above{transform:translateY(-30px) scale(.75)}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-infix{min-height:48px;max-height:48px;padding:4px 0;line-height:22px;display:inline-flex;align-items:center}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper{padding:0 0 12px;margin-top:0;font-size:12px;line-height:16px;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-subscript-wrapper .mat-form-field-hint-spacer{display:none}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.info{color:#888;width:100%}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-bottom-align:before{height:0}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint-wrapper{padding:0;position:relative}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error,.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error svg{color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error{display:flex}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-hint.error ui-icon{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-form-field-appearance-outline .mat-mdc-form-field-icon-suffix{margin-right:4px}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline:not(.mdc-text-field--disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__leading,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__trailing,.ui-datepicker .mat-mdc-form-field.mat-warn.mat-form-field-appearance-outline .mdc-notched-outline .mdc-notched-outline__notch{border-color:#e02800}.ui-datepicker .mat-mdc-form-field.mat-warn.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#e02800}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error{display:flex;flex-flow:column;row-gap:4px}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint.error .errors{display:flex;padding-bottom:10px}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-form-field-appearance-outline:not(.mat-form-field-disabled) .mat-mdc-form-field-flex:hover .mdc-notched-outline{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-accent.mat-focused .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-form-field-infix .mat-form-field-label mat-label{color:#276678}.ui-datepicker .mat-mdc-form-field.mat-form-field-disabled.mat-form-field-appearance-outline .mdc-notched-outline{color:#e0e0e0}.ui-datepicker .mat-mdc-form-field .mat-mdc-form-field-hint .hint-message{color:#888!important;margin-top:4px}.mat-datepicker-content .mat-mdc-button.mat-unthemed .mdc-button__label>span{font-weight:600}.mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:#e9f0f1}.mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:#e9f0f1}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .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),[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .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-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before,[theme=light] .mat-datepicker-content.mat-datepicker-content.mat-accent .mat-calendar-body-in-range:before{background-color:var(--datepicker-hover-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-selected,[theme=light] .mat-datepicker-content .mat-calendar-body-selected{background-color:var(--datepicker-selected-color)}[theme=dark] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected),[theme=light] .mat-datepicker-content .mat-calendar-body-today:not(.mat-calendar-body-selected){background:transparent;--mat-datepicker-calendar-date-focus-state-background-color: $tgo-white}[theme=dark] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical),[theme=light] .mat-datepicker-content .mat-calendar-body-active>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected):not(.mat-calendar-body-comparison-identical){--mat-datepicker-calendar-date-focus-state-background-color: var(--datepicker-hover-color)}.info{margin-top:4px!important;padding-bottom:10px}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {

package/fesm2022/testgorilla-tgo-ui-components-datepicker.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-datepicker.mjs","sources":["../../../components/datepicker/datepicker.service.ts","../../../components/datepicker/date-adapter.ts","../../../components/datepicker/no-date-format.directive.ts","../../../components/datepicker/datepicker.component.ts","../../../components/datepicker/datepicker.component.html","../../../components/datepicker/datepicker.component.module.ts","../../../components/datepicker/testgorilla-tgo-ui-components-datepicker.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\n\n@Injectable({\n providedIn: 'root'\n})\nexport class DatepickerService {\n #useBrowserTimezone = false;\n\n set useBrowserTimezone(value: boolean) {\n this.#useBrowserTimezone = value;\n }\n\n get useBrowserTimezone(): boolean {\n return this.#useBrowserTimezone;\n }\n}\n","import { NativeDateAdapter } from '@angular/material/core';\nimport { inject, Injectable } from '@angular/core';\nimport { DatepickerService } from './datepicker.service';\nimport { formatDate } from '@angular/common';\n\nexport const UI_DATE_FORMATS = {\n parse: {\n dateInput: { day: 'numeric', month: 'numeric', year: 'numeric' },\n },\n display: {\n dateInput: 'input',\n monthYearLabel: { year: 'numeric', month: 'short' },\n dateA11yLabel: { year: 'numeric', month: 'long', day: 'numeric' },\n monthYearA11yLabel: { year: 'numeric', month: 'long' },\n },\n};\n\n@Injectable()\nexport class UiDateAdapter extends NativeDateAdapter {\n #datepickerService = inject(DatepickerService);\n\n constructor() {\n super();\n }\n\n override format(date: Date): string {\n if (!this.#datepickerService.useBrowserTimezone) {\n return formatDate(date, 'MM/dd/yyyy', 'en-US');\n }\n\n const locale = navigator.language;\n const options: Partial<Intl.DateTimeFormatOptions> = {\n timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,\n dateStyle: 'short',\n };\n\n return new Intl.DateTimeFormat(locale, options).format(date);\n }\n}\n","import { formatDate } from '@angular/common';\nimport { Directive, Injectable } from '@angular/core';\nimport { DateAdapter, MAT_DATE_FORMATS, MatDateFormats, NativeDateAdapter } from '@angular/material/core';\n\n@Injectable()\nexport class CustomDateAdapter extends NativeDateAdapter {\n override format(date: Date): string {\n return formatDate(date, 'MM/yyyy', 'en-US');\n }\n}\n\nconst FORMATS: MatDateFormats = {\n parse: {\n dateInput: 'MM/YYYY',\n },\n display: {\n dateInput: 'MM/YYYY',\n monthYearLabel: 'MMM YYYY',\n dateA11yLabel: 'LL',\n monthYearA11yLabel: 'MMMM YYYY',\n },\n};\n\n@Directive({\n selector: '[appNoDateFormat]',\n providers: [\n {\n provide: DateAdapter,\n useClass: CustomDateAdapter,\n },\n {\n provide: MAT_DATE_FORMATS,\n useValue: FORMATS,\n },\n ],\n standalone: true,\n})\nexport class NoDateFormatDirective {}\n","/* eslint-disable no-underscore-dangle /\nimport {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n DoCheck,\n EventEmitter,\n HostBinding,\n Inject,\n Input,\n OnChanges,\n Optional,\n Output,\n Self,\n SimpleChanges,\n ViewEncapsulation,\n OnInit,\n} from '@angular/core';\nimport { ControlValueAccessor, FormControl, FormGroup, NgControl } from '@angular/forms';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { MatDatepicker } from '@angular/material/datepicker';\nimport { adjustLightness } from '@testgorilla/tgo-ui/components/core';\nimport { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';\nimport { UI_DATE_FORMATS, UiDateAdapter } from './date-adapter';\nimport { DatepickerService } from './datepicker.service';\n\n@Component({\n selector: 'ui-datepicker',\n templateUrl: './datepicker.component.html',\n styleUrls: ['./datepicker.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n { provide: DateAdapter, useClass: UiDateAdapter },\n { provide: MAT_DATE_FORMATS, useValue: UI_DATE_FORMATS },\n ],\n standalone: false,\n})\n// eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\nexport class DatepickerComponent implements OnChanges, ControlValueAccessor, DoCheck, OnInit {\n @HostBinding() class = 'ui-datepicker';\n\n /\n Form field label\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() label? = '';\n\n /\n Input name attribute\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() fieldName?: string;\n\n /\n Input placeholder\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() placeholder? = '';\n\n /\n Input id\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() id? = '';\n\n /\n Input value\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() value?: Array<Date \| null> \| Date;\n\n _errors: string[];\n /\n Input field errors\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() set errors(errors: string[]) {\n this._errors = errors?.filter(Boolean) ?? [];\n this.errorsLength = this.setErrorsLength();\n }\n\n /\n Determines if input is date range\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() isRange: boolean;\n\n /\n Determines if on blur of calendar and no end date is selected, set the end date as the start date\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() setSingleDateRangeOnBlur: boolean;\n\n /\n Determines if inner errors should be shown\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() showInnerErrors: boolean;\n\n /\n Determines inner errors message\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() innerErrorsMessage: string;\n\n /\n Determines if input is disabled\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() disabled: boolean;\n\n /\n Input is required or not\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() required: boolean;\n\n /\n Hint text\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() hintMessage: string;\n\n /\n Input is update only on blur\n \n @type {Boolean}\n * @memberof DatepickerComponent\n /\n @Input() updateOnBlur = false;\n\n /\n Show reserved content below form field\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() showBottomContent = true;\n\n /\n Set full width DatepickerComponent\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() fullWidth = false;\n\n /\n Set min date for Datepicker\n \n @type {Date}\n * @memberof DatepickerComponent\n /\n @Input() minDate: Date \| undefined;\n\n /\n Set max date for Datepicker\n \n @type {Date}\n * @memberof DatepickerComponent\n /\n @Input() maxDate: Date \| undefined;\n\n /\n Show and pick date without day\n * @default false\n * @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() monthPicker = false;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof DatepickerComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Hide in-build errors for Reactive Forms\n \n @type {number}\n * @memberof DatepickerComponent\n /\n @Input() hideBuiltInErrors = false;\n\n /\n Hide label in errors\n \n @type {number}\n * @memberof DatepickerComponent\n /\n @Input() hideLabelInErrors = false;\n\n /\n Prevent user input\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() preventUserInput = false;\n\n /\n Color of the option hover.\n * Defaults to Test Gorilla primary color.\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() companyColor = '';\n\n /\n Use browser timezone\n * @type boolean\n * @memberof DatepickerComponent\n /\n @Input() set browserTimezone(value: boolean) {\n this.datepickerService.useBrowserTimezone = value;\n }\n\n /\n @ignore\n /\n onChange = (_: any) => {};\n\n /\n @ignore\n /\n onTouch = () => {};\n\n /\n Event emitted when the value is change - when used outside of form\n \n @type {Date}\n * @memberof DatepickerComponent\n /\n @Output() changed = new EventEmitter<Date \| Date[]>();\n\n range = new FormGroup({\n start: new FormControl<Date \| null>(null),\n end: new FormControl<Date \| null>(null),\n });\n\n errorsLength: boolean;\n protected translationContext = 'DATEPICKER.';\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private cdr: ChangeDetectorRef,\n @Optional() @Self() public ngControl: NgControl,\n private datepickerService: DatepickerService\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n\n if (this.ngControl != null) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n get hint(): string {\n if (this.hintMessage === undefined) {\n return this.isRange ? 'MM/DD/YYYY - MM/DD/YYYY' : this.monthPicker ? 'MM/YYYY' : 'MM/DD/YYYY';\n }\n\n return this.hintMessage;\n }\n\n /\n Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors\n * to display validation errors that might happen (e.g. required)\n /\n // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\n ngDoCheck(): void {\n if (this.ngControl?.touched \|\| this.ngControl?.errors) {\n this.cdr.markForCheck();\n }\n }\n\n // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\n ngOnInit() {\n document.body.setAttribute('theme', this.applicationTheme);\n this.setStyleVariable();\n }\n\n // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\n ngOnChanges(changes: SimpleChanges): void {\n if (this.isRange) {\n this.setRange();\n }\n if (changes['companyColor']) {\n this.setStyleVariable();\n }\n }\n\n // Set errors length for validation\n // Consider only those errors which are not empty\n setErrorsLength(): boolean {\n if (!!this._errors) {\n return this._errors.filter(err => !!err).length > 0 ? true : false;\n }\n return false;\n }\n\n onValueChange(value: Date \| Date[]) {\n this.writeValue(value);\n this.errorsLength = this.setErrorsLength();\n if (!this.updateOnBlur) {\n this.onTouch();\n }\n this.onChange(value);\n this.changed.emit(value);\n }\n\n writeValue(value?: Date \| Date[]): void {\n this.value = value;\n if (this.isRange) {\n this.setRange();\n }\n }\n\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: any): void {\n this.onTouch = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.cdr.markForCheck();\n }\n\n handleCloseRangePicker(): void {\n if (this.setSingleDateRangeOnBlur) {\n this.fillSingleDateRange(true);\n }\n }\n\n fillSingleDateRange(isStart: boolean): void {\n const { start, end } = this.range.controls;\n const sourceControl = isStart ? start : end;\n const targetControl = isStart ? end : start;\n\n if (sourceControl.value && !targetControl.value) {\n targetControl.setValue(sourceControl.value);\n this.dateRangeChange();\n }\n }\n\n dateRangeChange() {\n const start = this.range.controls.start.value!;\n const end = this.range.controls.end.value!;\n this.onValueChange([start ? new Date(start) : start, end ? new Date(end) : end] as Date[]);\n }\n\n setMonthAndYear(normalizedMonthAndYear: any, datepicker: MatDatepicker<Date>) {\n const ctrlValue = (this.value as Date) \|\| new Date();\n\n ctrlValue.setMonth(normalizedMonthAndYear.getMonth());\n ctrlValue.setFullYear(normalizedMonthAndYear.getFullYear());\n\n datepicker.close();\n\n this.onValueChange(new Date(ctrlValue));\n }\n\n private setRange() {\n if (Array.isArray(this.value)) {\n const [start, end] = this.value;\n\n if (start && String(this.range.controls.start.value) !== String(start)) {\n this.range.controls.start.setValue(new Date(start));\n }\n\n if (end && String(this.range.controls.end.value) !== String(end)) {\n this.range.controls.end.setValue(new Date(end));\n }\n }\n\n if (!this.value) {\n this.range.controls.start.setValue(null);\n this.range.controls.end.setValue(null);\n }\n }\n\n onInput(event: Event) {\n const target = event.target as EventTarget & { value: string };\n const [month, year] = target.value.split('/');\n const date = new Date().getDate();\n const fullDateString = `${month}/${date}/${year}`;\n const fullDate = new Date(fullDateString);\n this.onValueChange(fullDate);\n }\n\n private setStyleVariable() {\n const hover = this.companyColor ? adjustLightness(this.companyColor, 'hover') : '#FFF2FC';\n document.body.style.setProperty('--datepicker-hover-color', hover);\n document.body.style.setProperty('--datepicker-selected-color', `${this.companyColor \|\| '#D410AA'}`);\n }\n}\n","@if (monthPicker) {\n <mat-form-field\n appNoDateFormat\n appearance=\"outline\"\n [color]=\"errorsLength \|\| (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n >\n <mat-label ngIf=\"label\">\n <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n </mat-label>\n\n <input\n matInput\n [id]=\"id!\"\n (blur)=\"onTouch()\"\n [placeholder]=\"placeholder!\"\n [matDatepicker]=\"dp\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [name]=\"fieldName!\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [readonly]=\"preventUserInput\"\n (change)=\"onInput($event)\"\n (dateChange)=\"onValueChange($event.value)\"\n />\n <mat-datepicker-toggle matIconSuffix [for]=\"dp\">\n <ui-icon\n matDatepickerToggleIcon\n [applicationTheme]=\"applicationTheme\"\n name=\"Calendar\"\n size=\"24\"\n color=\"inherit\"\n ></ui-icon>\n </mat-datepicker-toggle>\n <mat-datepicker\n panelClass=\"month-picker\"\n #dp\n startView=\"multi-year\"\n (monthSelected)=\"setMonthAndYear($event, dp)\"\n ></mat-datepicker>\n\n <mat-hint class=\"info\" ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors \| hasValidationError))\"\n >{{ hint }}\n </mat-hint>\n <mat-hint class=\"error\" ngIf=\"errorsLength \|\| (ngControl?.touched && (ngControl?.errors \| hasValidationError))\">\n <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n </mat-hint>\n </mat-form-field>\n} @else {\n @if (isRange) {\n <mat-form-field\n appearance=\"outline\"\n [color]=\"errorsLength \|\| (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n class=\"range-datepicker\"\n >\n <mat-label ngIf=\"label\">\n <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n </mat-label>\n\n <mat-date-range-input [formGroup]=\"range\" [rangePicker]=\"rangePicker\" [min]=\"minDate\" [max]=\"maxDate\">\n <input\n matStartDate\n formControlName=\"start\"\n [placeholder]=\"translationContext + 'START_DATE' \| uiTranslate \| async\"\n (dateChange)=\"dateRangeChange()\"\n (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(true)\"\n />\n <input\n matEndDate\n formControlName=\"end\"\n [placeholder]=\"translationContext + 'END_DATE' \| uiTranslate \| async\"\n (dateChange)=\"dateRangeChange()\"\n (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(false)\"\n />\n </mat-date-range-input>\n <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n <ui-icon\n matDatepickerToggleIcon\n [applicationTheme]=\"applicationTheme\"\n name=\"Calendar\"\n size=\"24\"\n color=\"inherit\"\n ></ui-icon>\n </mat-datepicker-toggle>\n <mat-date-range-picker #rangePicker (closed)=\"handleCloseRangePicker()\"></mat-date-range-picker>\n\n <mat-hint\n class=\"info\"\n ngIf=\"\n hint &&\n !_errors &&\n !(ngControl?.touched && (ngControl?.errors \| hasValidationError)) &&\n !(range?.invalid && showInnerErrors)\n \"\n >{{ hint }}\n </mat-hint>\n <mat-hint\n class=\"error\"\n ngIf=\"\n errorsLength \|\|\n (ngControl?.touched && (ngControl?.errors \| hasValidationError)) \|\|\n (range?.invalid && showInnerErrors)\n \"\n >\n <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n </mat-hint>\n </mat-form-field>\n } @else {\n <mat-form-field\n appearance=\"outline\"\n [color]=\"errorsLength \|\| (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n >\n <mat-label ngIf=\"label\">\n <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n </mat-label>\n <input\n matInput\n [matDatepicker]=\"picker\"\n (blur)=\"onTouch()\"\n (dateChange)=\"onValueChange($event.value)\"\n [id]=\"id!\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [name]=\"fieldName!\"\n [readonly]=\"preventUserInput\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n />\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n <ui-icon\n matDatepickerToggleIcon\n [applicationTheme]=\"applicationTheme\"\n name=\"Calendar\"\n size=\"24\"\n color=\"inherit\"\n ></ui-icon>\n </mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n\n <mat-hint\n class=\"info\"\n ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors \| hasValidationError))\"\n >{{ hint }}\n </mat-hint>\n <mat-hint class=\"error\" ngIf=\"errorsLength \|\| (ngControl?.touched && (ngControl?.errors \| hasValidationError))\">\n <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n </mat-hint>\n </mat-form-field>\n }\n}\n\n<ng-template #labelTpl>{{ label }}<span ngIf=\"required\"> </span></ng-template>\n<ng-template #hintsTpl>\n @if (errorsLength) {\n <div class=\"errors\" ngFor=\"let error of _errors\">\n <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n <span [innerHTML]=\"error\"></span>\n </div>\n }\n @if (ngControl && !hideBuiltInErrors) {\n <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n }\n @if (showInnerErrors) {\n @if (isRange) {\n <div class=\"errors\">\n <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n <span [innerHTML]=\"innerErrorsMessage\"></span>\n </div>\n }\n }\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DatepickerComponent } from './datepicker.component';\nimport { MatDatepickerModule } from '@angular/material/datepicker';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { MatNativeDateModule } from '@angular/material/core';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { NoDateFormatDirective } from './no-date-format.directive';\nimport { HasValidationErrorPipe } from '@testgorilla/tgo-ui/components/core';\nimport { ValidationErrorModule } from '@testgorilla/tgo-ui/components/validation-error';\n\n@NgModule({\n declarations: [DatepickerComponent],\n imports: [\n CommonModule,\n MatFormFieldModule,\n MatInputModule,\n IconComponentModule,\n FormsModule,\n ReactiveFormsModule,\n MatDatepickerModule,\n MatNativeDateModule,\n UiTranslatePipe,\n NoDateFormatDirective,\n HasValidationErrorPipe,\n ValidationErrorModule,\n ],\n exports: [DatepickerComponent],\n})\nexport class DatepickerComponentModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i2.DatepickerService","i8.NoDateFormatDirective"],"mappings":";;;;;;;;;;;;;;;;;;;;MAKa,iBAAiB,CAAA;IAC5B,mBAAmB,GAAG,KAAK;IAE3B,IAAI,kBAAkB,CAAC,KAAc,EAAA;AACnC,QAAA,IAAI,CAAC,mBAAmB,GAAG,KAAK;IAClC;AAEA,IAAA,IAAI,kBAAkB,GAAA;QACpB,OAAO,IAAI,CAAC,mBAAmB;IACjC;+GATW,iBAAiB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;AAAjB,IAAA,SAAA,IAAA,CAAA,KAAA,GAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,iBAAiB,cAFhB,MAAM,EAAA,CAAA,CAAA;;4FAEP,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAH7B,UAAU;AAAC,YAAA,IAAA,EAAA,CAAA;AACV,oBAAA,UAAU,EAAE;AACb,iBAAA;;;ACCM,MAAM,eAAe,GAAG;AAC7B,IAAA,KAAK,EAAE;AACL,QAAA,SAAS,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE;AACjE,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,SAAS,EAAE,OAAO;QAClB,cAAc,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAE;AACnD,QAAA,aAAa,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,SAAS,EAAE;QACjE,kBAAkB,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE;AACvD,KAAA;;AAIG,MAAO,aAAc,SAAQ,iBAAiB,CAAA;AAClD,IAAA,kBAAkB,GAAG,MAAM,CAAC,iBAAiB,CAAC;AAE9C,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;IACT;AAES,IAAA,MAAM,CAAC,IAAU,EAAA;AACxB,QAAA,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,kBAAkB,EAAE;YAC/C,OAAO,UAAU,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,CAAC;QAChD;AAEA,QAAA,MAAM,MAAM,GAAG,SAAS,CAAC,QAAQ;AACjC,QAAA,MAAM,OAAO,GAAwC;YACnD,QAAQ,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC,eAAe,EAAE,CAAC,QAAQ;AAC1D,YAAA,SAAS,EAAE,OAAO;SACnB;AAED,QAAA,OAAO,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC;IAC9D;+GAnBW,aAAa,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;mHAAb,aAAa,EAAA,CAAA,CAAA;;4FAAb,aAAa,EAAA,UAAA,EAAA,CAAA;kBADzB;;;ACZK,MAAO,iBAAkB,SAAQ,iBAAiB,CAAA;AAC7C,IAAA,MAAM,CAAC,IAAU,EAAA;QACxB,OAAO,UAAU,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,CAAC;IAC7C;+GAHW,iBAAiB,EAAA,IAAA,EAAA,IAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,UAAA,EAAA,CAAA,CAAA;mHAAjB,iBAAiB,EAAA,CAAA,CAAA;;4FAAjB,iBAAiB,EAAA,UAAA,EAAA,CAAA;kBAD7B;;AAOD,MAAM,OAAO,GAAmB;AAC9B,IAAA,KAAK,EAAE;AACL,QAAA,SAAS,EAAE,SAAS;AACrB,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,SAAS,EAAE,SAAS;AACpB,QAAA,cAAc,EAAE,UAAU;AAC1B,QAAA,aAAa,EAAE,IAAI;AACnB,QAAA,kBAAkB,EAAE,WAAW;AAChC,KAAA;CACF;MAgBY,qBAAqB,CAAA;+GAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qBAAqB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,SAAA,EAZrB;AACT,YAAA;AACE,gBAAA,OAAO,EAAE,WAAW;AACpB,gBAAA,QAAQ,EAAE,iBAAiB;AAC5B,aAAA;AACD,YAAA;AACE,gBAAA,OAAO,EAAE,gBAAgB;AACzB,gBAAA,QAAQ,EAAE,OAAO;AAClB,aAAA;AACF,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA,CAAA;;4FAGU,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAdjC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE,mBAAmB;AAC7B,oBAAA,SAAS,EAAE;AACT,wBAAA;AACE,4BAAA,OAAO,EAAE,WAAW;AACpB,4BAAA,QAAQ,EAAE,iBAAiB;AAC5B,yBAAA;AACD,wBAAA;AACE,4BAAA,OAAO,EAAE,gBAAgB;AACzB,4BAAA,QAAQ,EAAE,OAAO;AAClB,yBAAA;AACF,qBAAA;AACD,oBAAA,UAAU,EAAE,IAAI;AACjB,iBAAA;;;ACpCD;AAsCA;MACa,mBAAmB,CAAA;AA4C9B;;;;;AAKG;IACH,IAAa,MAAM,CAAC,MAAgB,EAAA;QAClC,IAAI,CAAC,OAAO,GAAG,MAAM,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE;AAC5C,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE;IAC5C;AAoJA;;;;AAIG;IACH,IAAa,eAAe,CAAC,KAAc,EAAA;AACzC,QAAA,IAAI,CAAC,iBAAiB,CAAC,kBAAkB,GAAG,KAAK;IACnD;AA4BA,IAAA,WAAA,CAC6E,eAAiC,EACpG,GAAsB,EACH,SAAoB,EACvC,iBAAoC,EAAA;QAH+B,IAAA,CAAA,eAAe,GAAf,eAAe;QAClF,IAAA,CAAA,GAAG,GAAH,GAAG;QACgB,IAAA,CAAA,SAAS,GAAT,SAAS;QAC5B,IAAA,CAAA,iBAAiB,GAAjB,iBAAiB;QA/OZ,IAAA,CAAA,KAAK,GAAG,eAAe;AAEtC;;;;;AAKG;QACM,IAAA,CAAA,KAAK,GAAI,EAAE;AAUpB;;;;;AAKG;QACM,IAAA,CAAA,WAAW,GAAI,EAAE;AAE1B;;;;;AAKG;QACM,IAAA,CAAA,EAAE,GAAI,EAAE;AA8EjB;;;;;AAKG;QACM,IAAA,CAAA,YAAY,GAAG,KAAK;AAE7B;;;;;AAKG;QACM,IAAA,CAAA,iBAAiB,GAAG,IAAI;AAEjC;;;;;AAKG;QACM,IAAA,CAAA,SAAS,GAAG,KAAK;AAkB1B;;;;;AAKG;QACM,IAAA,CAAA,WAAW,GAAG,KAAK;AAE5B;;;;;;AAMG;QACM,IAAA,CAAA,gBAAgB,GAAqB,OAAO;AAErD;;;;;AAKG;QACM,IAAA,CAAA,iBAAiB,GAAG,KAAK;AAElC;;;;;AAKG;QACM,IAAA,CAAA,iBAAiB,GAAG,KAAK;AAElC;;;;;AAKG;QACM,IAAA,CAAA,gBAAgB,GAAG,KAAK;AAEjC;;;;;;AAMG;QACM,IAAA,CAAA,YAAY,GAAG,EAAE;AAW1B;;AAEG;AACH,QAAA,IAAA,CAAA,QAAQ,GAAG,CAAC,CAAM,KAAI,EAAE,CAAC;AAEzB;;AAEG;AACH,QAAA,IAAA,CAAA,OAAO,GAAG,MAAK,EAAE,CAAC;AAElB;;;;;AAKG;AACO,QAAA,IAAA,CAAA,OAAO,GAAG,IAAI,YAAY,EAAiB;QAErD,IAAA,CAAA,KAAK,GAAG,IAAI,SAAS,CAAC;AACpB,YAAA,KAAK,EAAE,IAAI,WAAW,CAAc,IAAI,CAAC;AACzC,YAAA,GAAG,EAAE,IAAI,WAAW,CAAc,IAAI,CAAC;AACxC,SAAA,CAAC;QAGQ,IAAA,CAAA,kBAAkB,GAAG,aAAa;QAQ1C,IAAI,eAAe,EAAE;AACnB,YAAA,IAAI,CAAC,gBAAgB,GAAG,eAAe;QACzC;AAEA,QAAA,IAAI,IAAI,CAAC,SAAS,IAAI,IAAI,EAAE;AAC1B,YAAA,IAAI,CAAC,SAAS,CAAC,aAAa,GAAG,IAAI;QACrC;IACF;AAEA,IAAA,IAAI,IAAI,GAAA;AACN,QAAA,IAAI,IAAI,CAAC,WAAW,KAAK,SAAS,EAAE;YAClC,OAAO,IAAI,CAAC,OAAO,GAAG,yBAAyB,GAAG,IAAI,CAAC,WAAW,GAAG,SAAS,GAAG,YAAY;QAC/F;QAEA,OAAO,IAAI,CAAC,WAAW;IACzB;AAEA;;;AAGG;;IAEH,SAAS,GAAA;AACP,QAAA,IAAI,IAAI,CAAC,SAAS,EAAE,OAAO,IAAI,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE;AACrD,YAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;QACzB;IACF;;IAGA,QAAQ,GAAA;QACN,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,gBAAgB,CAAC;QAC1D,IAAI,CAAC,gBAAgB,EAAE;IACzB;;AAGA,IAAA,WAAW,CAAC,OAAsB,EAAA;AAChC,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,QAAQ,EAAE;QACjB;AACA,QAAA,IAAI,OAAO,CAAC,cAAc,CAAC,EAAE;YAC3B,IAAI,CAAC,gBAAgB,EAAE;QACzB;IACF;;;IAIA,eAAe,GAAA;AACb,QAAA,IAAI,CAAC,CAAC,IAAI,CAAC,OAAO,EAAE;YAClB,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,GAAG,IAAI,GAAG,KAAK;QACpE;AACA,QAAA,OAAO,KAAK;IACd;AAEA,IAAA,aAAa,CAAC,KAAoB,EAAA;AAChC,QAAA,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC;AACtB,QAAA,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,EAAE;AAC1C,QAAA,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE;YACtB,IAAI,CAAC,OAAO,EAAE;QAChB;AACA,QAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;AACpB,QAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;IAC1B;AAEA,IAAA,UAAU,CAAC,KAAqB,EAAA;AAC9B,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK;AAClB,QAAA,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,QAAQ,EAAE;QACjB;IACF;AAEA,IAAA,gBAAgB,CAAC,EAAO,EAAA;AACtB,QAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;IACpB;AAEA,IAAA,iBAAiB,CAAC,EAAO,EAAA;AACvB,QAAA,IAAI,CAAC,OAAO,GAAG,EAAE;IACnB;AAEA,IAAA,gBAAgB,CAAC,UAAmB,EAAA;AAClC,QAAA,IAAI,CAAC,QAAQ,GAAG,UAAU;AAC1B,QAAA,IAAI,CAAC,GAAG,CAAC,YAAY,EAAE;IACzB;IAEA,sBAAsB,GAAA;AACpB,QAAA,IAAI,IAAI,CAAC,wBAAwB,EAAE;AACjC,YAAA,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC;QAChC;IACF;AAEA,IAAA,mBAAmB,CAAC,OAAgB,EAAA;QAClC,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ;QAC1C,MAAM,aAAa,GAAG,OAAO,GAAG,KAAK,GAAG,GAAG;QAC3C,MAAM,aAAa,GAAG,OAAO,GAAG,GAAG,GAAG,KAAK;QAE3C,IAAI,aAAa,CAAC,KAAK,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE;AAC/C,YAAA,aAAa,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;YAC3C,IAAI,CAAC,eAAe,EAAE;QACxB;IACF;IAEA,eAAe,GAAA;QACb,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAM;QAC9C,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAM;AAC1C,QAAA,IAAI,CAAC,aAAa,CAAC,CAAC,KAAK,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,KAAK,EAAE,GAAG,GAAG,IAAI,IAAI,CAAC,GAAG,CAAC,GAAG,GAAG,CAAW,CAAC;IAC5F;IAEA,eAAe,CAAC,sBAA2B,EAAE,UAA+B,EAAA;QAC1E,MAAM,SAAS,GAAI,IAAI,CAAC,KAAc,IAAI,IAAI,IAAI,EAAE;QAEpD,SAAS,CAAC,QAAQ,CAAC,sBAAsB,CAAC,QAAQ,EAAE,CAAC;QACrD,SAAS,CAAC,WAAW,CAAC,sBAAsB,CAAC,WAAW,EAAE,CAAC;QAE3D,UAAU,CAAC,KAAK,EAAE;QAElB,IAAI,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,CAAC;IACzC;IAEQ,QAAQ,GAAA;QACd,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;YAC7B,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK;YAE/B,IAAI,KAAK,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,MAAM,CAAC,KAAK,CAAC,EAAE;AACtE,gBAAA,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;YACrD;YAEA,IAAI,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,MAAM,CAAC,GAAG,CAAC,EAAE;AAChE,gBAAA,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC;YACjD;QACF;AAEA,QAAA,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACf,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC;YACxC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC;QACxC;IACF;AAEA,IAAA,OAAO,CAAC,KAAY,EAAA;AAClB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAyC;AAC9D,QAAA,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;QAC7C,MAAM,IAAI,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE;QACjC,MAAM,cAAc,GAAG,CAAA,EAAG,KAAK,IAAI,IAAI,CAAA,CAAA,EAAI,IAAI,CAAA,CAAE;AACjD,QAAA,MAAM,QAAQ,GAAG,IAAI,IAAI,CAAC,cAAc,CAAC;AACzC,QAAA,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC;IAC9B;IAEQ,gBAAgB,GAAA;QACtB,MAAM,KAAK,GAAG,IAAI,CAAC,YAAY,GAAG,eAAe,CAAC,IAAI,CAAC,YAAY,EAAE,OAAO,CAAC,GAAG,SAAS;QACzF,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,0BAA0B,EAAE,KAAK,CAAC;AAClE,QAAA,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,6BAA6B,EAAE,CAAA,EAAG,IAAI,CAAC,YAAY,IAAI,SAAS,CAAA,CAAE,CAAC;IACrG;AAvYW,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,mBAAmB,kBA6OR,oCAAoC,EAAA,QAAA,EAAA,IAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,EAAA,EAAA,KAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,IAAA,EAAA,IAAA,EAAA,EAAA,EAAA,KAAA,EAAAA,iBAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AA7O/C,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,mBAAmB,EAAA,YAAA,EAAA,KAAA,EAAA,QAAA,EAAA,eAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,EAAA,EAAA,IAAA,EAAA,KAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,wBAAA,EAAA,0BAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,UAAA,EAAA,WAAA,EAAA,aAAA,EAAA,YAAA,EAAA,cAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,SAAA,EAAA,WAAA,EAAA,OAAA,EAAA,SAAA,EAAA,OAAA,EAAA,SAAA,EAAA,WAAA,EAAA,aAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,gBAAA,EAAA,kBAAA,EAAA,YAAA,EAAA,cAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,OAAA,EAAA,EAAA,OAAA,EAAA,SAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,OAAA,EAAA,YAAA,EAAA,EAAA,EAAA,SAAA,EAPnB;AACT,YAAA,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,aAAa,EAAE;AACjD,YAAA,EAAE,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,eAAe,EAAE;AACzD,SAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECnCH,qlMA+KA,EAAA,MAAA,EAAA,CAAA,upRAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,CAAA,SAAA,EAAA,cAAA,EAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,OAAA,EAAA,YAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,WAAA,CAAA,EAAA,QAAA,EAAA,CAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,WAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,IAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,+CAAA,EAAA,MAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,yHAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,IAAA,EAAA,aAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,mBAAA,EAAA,kBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,qBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,OAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,8MAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,2CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,oBAAA,EAAA,QAAA,EAAA,0FAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,WAAA,CAAA,EAAA,OAAA,EAAA,CAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,QAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,iBAAA,EAAA,UAAA,EAAA,SAAA,CAAA,EAAA,OAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,QAAA,EAAA,CAAA,eAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,CAAA,eAAA,EAAA,KAAA,EAAA,KAAA,EAAA,qBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,mBAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,MAAA,EAAA,CAAA,KAAA,EAAA,UAAA,EAAA,YAAA,EAAA,UAAA,EAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,qBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,uBAAA,EAAA,QAAA,EAAA,2BAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,UAAA,EAAA,YAAA,EAAA,KAAA,EAAA,KAAA,EAAA,UAAA,EAAA,WAAA,EAAA,iBAAA,EAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,OAAA,EAAA,CAAA,YAAA,EAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,kBAAA,EAAA,QAAA,EAAA,uBAAA,EAAA,QAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAAC,qBAAA,EAAA,QAAA,EAAA,mBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,wBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,WAAA,EAAA,cAAA,EAAA,OAAA,EAAA,kBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,OAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,GAAA,CAAA,eAAA,EAAA,IAAA,EAAA,aAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,GAAA,CAAA,sBAAA,EAAA,IAAA,EAAA,oBAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;4FDxIa,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAb/B,SAAS;+BACE,eAAe,EAAA,aAAA,EAGV,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,EAAA,SAAA,EACpC;AACT,wBAAA,EAAE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,aAAa,EAAE;AACjD,wBAAA,EAAE,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,eAAe,EAAE;AACzD,qBAAA,EAAA,UAAA,EACW,KAAK,EAAA,QAAA,EAAA,qlMAAA,EAAA,MAAA,EAAA,CAAA,upRAAA,CAAA,EAAA;;0BAgPd;;0BAAY,MAAM;2BAAC,oCAAoC;;0BAEvD;;0BAAY;sEA9OA,KAAK,EAAA,CAAA;sBAAnB;gBAQQ,KAAK,EAAA,CAAA;sBAAb;gBAQQ,SAAS,EAAA,CAAA;sBAAjB;gBAQQ,WAAW,EAAA,CAAA;sBAAnB;gBAQQ,EAAE,EAAA,CAAA;sBAAV;gBAQQ,KAAK,EAAA,CAAA;sBAAb;gBASY,MAAM,EAAA,CAAA;sBAAlB;gBAWQ,OAAO,EAAA,CAAA;sBAAf;gBAQQ,wBAAwB,EAAA,CAAA;sBAAhC;gBAQQ,eAAe,EAAA,CAAA;sBAAvB;gBAQQ,kBAAkB,EAAA,CAAA;sBAA1B;gBAQQ,QAAQ,EAAA,CAAA;sBAAhB;gBAQQ,QAAQ,EAAA,CAAA;sBAAhB;gBAQQ,WAAW,EAAA,CAAA;sBAAnB;gBAQQ,YAAY,EAAA,CAAA;sBAApB;gBAQQ,iBAAiB,EAAA,CAAA;sBAAzB;gBAQQ,SAAS,EAAA,CAAA;sBAAjB;gBAQQ,OAAO,EAAA,CAAA;sBAAf;gBAQQ,OAAO,EAAA,CAAA;sBAAf;gBAQQ,WAAW,EAAA,CAAA;sBAAnB;gBASQ,gBAAgB,EAAA,CAAA;sBAAxB;gBAQQ,iBAAiB,EAAA,CAAA;sBAAzB;gBAQQ,iBAAiB,EAAA,CAAA;sBAAzB;gBAQQ,gBAAgB,EAAA,CAAA;sBAAxB;gBASQ,YAAY,EAAA,CAAA;sBAApB;gBAOY,eAAe,EAAA,CAAA;sBAA3B;gBAoBS,OAAO,EAAA,CAAA;sBAAhB;;;MEzOU,yBAAyB,CAAA;+GAAzB,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;gHAAzB,yBAAyB,EAAA,YAAA,EAAA,CAjBrB,mBAAmB,CAAA,EAAA,OAAA,EAAA,CAEhC,YAAY;YACZ,kBAAkB;YAClB,cAAc;YACd,mBAAmB;YACnB,WAAW;YACX,mBAAmB;YACnB,mBAAmB;YACnB,mBAAmB;YACnB,eAAe;YACf,qBAAqB;YACrB,sBAAsB;AACtB,YAAA,qBAAqB,aAEb,mBAAmB,CAAA,EAAA,CAAA,CAAA;AAElB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,yBAAyB,YAflC,YAAY;YACZ,kBAAkB;YAClB,cAAc;YACd,mBAAmB;YACnB,WAAW;YACX,mBAAmB;YACnB,mBAAmB;YACnB,mBAAmB;YAInB,qBAAqB,CAAA,EAAA,CAAA,CAAA;;4FAIZ,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBAlBrC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,mBAAmB,CAAC;AACnC,oBAAA,OAAO,EAAE;wBACP,YAAY;wBACZ,kBAAkB;wBAClB,cAAc;wBACd,mBAAmB;wBACnB,WAAW;wBACX,mBAAmB;wBACnB,mBAAmB;wBACnB,mBAAmB;wBACnB,eAAe;wBACf,qBAAqB;wBACrB,sBAAsB;wBACtB,qBAAqB;AACtB,qBAAA;oBACD,OAAO,EAAE,CAAC,mBAAmB,CAAC;AAC/B,iBAAA;;;AC/BD;;AAEG;;;;"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-datepicker.mjs","sources":["../../../components/datepicker/datepicker.service.ts","../../../components/datepicker/date-adapter.ts","../../../components/datepicker/no-date-format.directive.ts","../../../components/datepicker/datepicker.component.ts","../../../components/datepicker/datepicker.component.html","../../../components/datepicker/datepicker.component.module.ts","../../../components/datepicker/testgorilla-tgo-ui-components-datepicker.ts"],"sourcesContent":["import { Injectable } from '@angular/core';\n\n@Injectable({\n providedIn: 'root',\n})\nexport class DatepickerService {\n #useBrowserTimezone = false;\n\n set useBrowserTimezone(value: boolean) {\n this.#useBrowserTimezone = value;\n }\n\n get useBrowserTimezone(): boolean {\n return this.#useBrowserTimezone;\n }\n}\n","import { NativeDateAdapter } from '@angular/material/core';\nimport { inject, Injectable } from '@angular/core';\nimport { DatepickerService } from './datepicker.service';\nimport { formatDate } from '@angular/common';\n\nexport const UI_DATE_FORMATS = {\n parse: {\n dateInput: { day: 'numeric', month: 'numeric', year: 'numeric' },\n },\n display: {\n dateInput: 'input',\n monthYearLabel: { year: 'numeric', month: 'short' },\n dateA11yLabel: { year: 'numeric', month: 'long', day: 'numeric' },\n monthYearA11yLabel: { year: 'numeric', month: 'long' },\n },\n};\n\n@Injectable()\nexport class UiDateAdapter extends NativeDateAdapter {\n #datepickerService = inject(DatepickerService);\n\n constructor() {\n super();\n }\n\n override format(date: Date): string {\n if (!this.#datepickerService.useBrowserTimezone) {\n return formatDate(date, 'MM/dd/yyyy', 'en-US');\n }\n\n const locale = navigator.language;\n const options: Partial<Intl.DateTimeFormatOptions> = {\n timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,\n dateStyle: 'short',\n };\n\n return new Intl.DateTimeFormat(locale, options).format(date);\n }\n}\n","import { formatDate } from '@angular/common';\nimport { Directive, Injectable } from '@angular/core';\nimport { DateAdapter, MAT_DATE_FORMATS, MatDateFormats, NativeDateAdapter } from '@angular/material/core';\n\n@Injectable()\nexport class CustomDateAdapter extends NativeDateAdapter {\n override format(date: Date): string {\n return formatDate(date, 'MM/yyyy', 'en-US');\n }\n}\n\nconst FORMATS: MatDateFormats = {\n parse: {\n dateInput: 'MM/YYYY',\n },\n display: {\n dateInput: 'MM/YYYY',\n monthYearLabel: 'MMM YYYY',\n dateA11yLabel: 'LL',\n monthYearA11yLabel: 'MMMM YYYY',\n },\n};\n\n@Directive({\n selector: '[appNoDateFormat]',\n providers: [\n {\n provide: DateAdapter,\n useClass: CustomDateAdapter,\n },\n {\n provide: MAT_DATE_FORMATS,\n useValue: FORMATS,\n },\n ],\n standalone: true,\n})\nexport class NoDateFormatDirective {}\n","/* eslint-disable no-underscore-dangle /\nimport {\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n DoCheck,\n EventEmitter,\n HostBinding,\n Inject,\n Input,\n OnChanges,\n Optional,\n Output,\n Self,\n SimpleChanges,\n ViewEncapsulation,\n OnInit,\n} from '@angular/core';\nimport { ControlValueAccessor, FormControl, FormGroup, NgControl } from '@angular/forms';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { MatDatepicker } from '@angular/material/datepicker';\nimport { adjustLightness } from '@testgorilla/tgo-ui/components/core';\nimport { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';\nimport { UI_DATE_FORMATS, UiDateAdapter } from './date-adapter';\nimport { DatepickerService } from './datepicker.service';\n\n@Component({\n selector: 'ui-datepicker',\n templateUrl: './datepicker.component.html',\n styleUrls: ['./datepicker.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n providers: [\n { provide: DateAdapter, useClass: UiDateAdapter },\n { provide: MAT_DATE_FORMATS, useValue: UI_DATE_FORMATS },\n ],\n standalone: false,\n})\n// eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\nexport class DatepickerComponent implements OnChanges, ControlValueAccessor, DoCheck, OnInit {\n @HostBinding() class = 'ui-datepicker';\n\n /\n Form field label\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() label? = '';\n\n /\n Input name attribute\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() fieldName?: string;\n\n /\n Input placeholder\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() placeholder? = '';\n\n /\n Input id\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() id? = '';\n\n /\n Input value\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() value?: Array<Date \| null> \| Date;\n\n _errors: string[];\n /\n Input field errors\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() set errors(errors: string[]) {\n this._errors = errors?.filter(Boolean) ?? [];\n this.errorsLength = this.setErrorsLength();\n }\n\n /\n Determines if input is date range\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() isRange: boolean;\n\n /\n Determines if on blur of calendar and no end date is selected, set the end date as the start date\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() setSingleDateRangeOnBlur: boolean;\n\n /\n Determines if inner errors should be shown\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() showInnerErrors: boolean;\n\n /\n Determines inner errors message\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() innerErrorsMessage: string;\n\n /\n Determines if input is disabled\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() disabled: boolean;\n\n /\n Input is required or not\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() required: boolean;\n\n /\n Hint text\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() hintMessage: string;\n\n /\n Input is update only on blur\n \n @type {Boolean}\n * @memberof DatepickerComponent\n /\n @Input() updateOnBlur = false;\n\n /\n Show reserved content below form field\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() showBottomContent = true;\n\n /\n Set full width DatepickerComponent\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() fullWidth = false;\n\n /\n Set min date for Datepicker\n \n @type {Date}\n * @memberof DatepickerComponent\n /\n @Input() minDate: Date \| undefined;\n\n /\n Set max date for Datepicker\n \n @type {Date}\n * @memberof DatepickerComponent\n /\n @Input() maxDate: Date \| undefined;\n\n /\n Show and pick date without day\n * @default false\n * @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() monthPicker = false;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof DatepickerComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n Hide in-build errors for Reactive Forms\n \n @type {number}\n * @memberof DatepickerComponent\n /\n @Input() hideBuiltInErrors = false;\n\n /\n Hide label in errors\n \n @type {number}\n * @memberof DatepickerComponent\n /\n @Input() hideLabelInErrors = false;\n\n /\n Prevent user input\n \n @type {boolean}\n * @memberof DatepickerComponent\n /\n @Input() preventUserInput = false;\n\n /\n Color of the option hover.\n * Defaults to Test Gorilla primary color.\n \n @type {string}\n * @memberof DatepickerComponent\n /\n @Input() companyColor = '';\n\n /\n Use browser timezone\n * @type boolean\n * @memberof DatepickerComponent\n /\n @Input() set browserTimezone(value: boolean) {\n this.datepickerService.useBrowserTimezone = value;\n }\n\n /\n @ignore\n /\n onChange = (_: any) => {};\n\n /\n @ignore\n /\n onTouch = () => {};\n\n /\n Event emitted when the value is change - when used outside of form\n \n @type {Date}\n * @memberof DatepickerComponent\n /\n @Output() changed = new EventEmitter<Date \| Date[]>();\n\n range = new FormGroup({\n start: new FormControl<Date \| null>(null),\n end: new FormControl<Date \| null>(null),\n });\n\n errorsLength: boolean;\n protected translationContext = 'DATEPICKER.';\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme,\n private cdr: ChangeDetectorRef,\n @Optional() @Self() public ngControl: NgControl,\n private datepickerService: DatepickerService\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n\n if (this.ngControl != null) {\n this.ngControl.valueAccessor = this;\n }\n }\n\n get hint(): string {\n if (this.hintMessage === undefined) {\n return this.isRange ? 'MM/DD/YYYY - MM/DD/YYYY' : this.monthPicker ? 'MM/YYYY' : 'MM/DD/YYYY';\n }\n\n return this.hintMessage;\n }\n\n /\n Used to mark component view as dirty when touched programmatically with markAsTouched/markAllAsTouched or errors\n * to display validation errors that might happen (e.g. required)\n /\n // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\n ngDoCheck(): void {\n if (this.ngControl?.touched \|\| this.ngControl?.errors) {\n this.cdr.markForCheck();\n }\n }\n\n // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\n ngOnInit() {\n document.body.setAttribute('theme', this.applicationTheme);\n this.setStyleVariable();\n }\n\n // eslint-disable-next-line @angular-eslint/no-conflicting-lifecycle\n ngOnChanges(changes: SimpleChanges): void {\n if (this.isRange) {\n this.setRange();\n }\n if (changes['companyColor']) {\n this.setStyleVariable();\n }\n }\n\n // Set errors length for validation\n // Consider only those errors which are not empty\n setErrorsLength(): boolean {\n if (this._errors) {\n return this._errors.filter(err => !!err).length > 0 ? true : false;\n }\n return false;\n }\n\n onValueChange(value: Date \| Date[]) {\n this.writeValue(value);\n this.errorsLength = this.setErrorsLength();\n if (!this.updateOnBlur) {\n this.onTouch();\n }\n this.onChange(value);\n this.changed.emit(value);\n }\n\n writeValue(value?: Date \| Date[]): void {\n this.value = value;\n if (this.isRange) {\n this.setRange();\n }\n }\n\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n registerOnTouched(fn: any): void {\n this.onTouch = fn;\n }\n\n setDisabledState(isDisabled: boolean): void {\n this.disabled = isDisabled;\n this.cdr.markForCheck();\n }\n\n handleCloseRangePicker(): void {\n if (this.setSingleDateRangeOnBlur) {\n this.fillSingleDateRange(true);\n }\n }\n\n fillSingleDateRange(isStart: boolean): void {\n const { start, end } = this.range.controls;\n const sourceControl = isStart ? start : end;\n const targetControl = isStart ? end : start;\n\n if (sourceControl.value && !targetControl.value) {\n targetControl.setValue(sourceControl.value);\n this.dateRangeChange();\n }\n }\n\n dateRangeChange() {\n const start = this.range.controls.start.value ?? null;\n const end = this.range.controls.end.value ?? null;\n this.onValueChange([start ? new Date(start) : start, end ? new Date(end) : end] as Date[]);\n }\n\n setMonthAndYear(normalizedMonthAndYear: any, datepicker: MatDatepicker<Date>) {\n const ctrlValue = (this.value as Date) \|\| new Date();\n\n ctrlValue.setMonth(normalizedMonthAndYear.getMonth());\n ctrlValue.setFullYear(normalizedMonthAndYear.getFullYear());\n\n datepicker.close();\n\n this.onValueChange(new Date(ctrlValue));\n }\n\n private setRange() {\n if (Array.isArray(this.value)) {\n const [start, end] = this.value;\n\n if (start && String(this.range.controls.start.value) !== String(start)) {\n this.range.controls.start.setValue(new Date(start));\n }\n\n if (end && String(this.range.controls.end.value) !== String(end)) {\n this.range.controls.end.setValue(new Date(end));\n }\n }\n\n if (!this.value) {\n this.range.controls.start.setValue(null);\n this.range.controls.end.setValue(null);\n }\n }\n\n onInput(event: Event) {\n const target = event.target as EventTarget & { value: string };\n const [month, year] = target.value.split('/');\n const date = new Date().getDate();\n const fullDateString = `${month}/${date}/${year}`;\n const fullDate = new Date(fullDateString);\n this.onValueChange(fullDate);\n }\n\n private setStyleVariable() {\n const hover = this.companyColor ? adjustLightness(this.companyColor, 'hover') : '#FFF2FC';\n document.body.style.setProperty('--datepicker-hover-color', hover);\n document.body.style.setProperty('--datepicker-selected-color', `${this.companyColor \|\| '#D410AA'}`);\n }\n}\n","@if (monthPicker) {\n <mat-form-field\n appNoDateFormat\n appearance=\"outline\"\n [color]=\"errorsLength \|\| (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n >\n <mat-label ngIf=\"label\">\n <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n </mat-label>\n\n <input\n matInput\n [id]=\"id!\"\n (blur)=\"onTouch()\"\n [placeholder]=\"placeholder!\"\n [matDatepicker]=\"dp\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [name]=\"fieldName!\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n [readonly]=\"preventUserInput\"\n (change)=\"onInput($event)\"\n (dateChange)=\"onValueChange($event.value)\"\n />\n <mat-datepicker-toggle matIconSuffix [for]=\"dp\">\n <ui-icon\n matDatepickerToggleIcon\n [applicationTheme]=\"applicationTheme\"\n name=\"Calendar\"\n size=\"24\"\n color=\"inherit\"\n ></ui-icon>\n </mat-datepicker-toggle>\n <mat-datepicker\n panelClass=\"month-picker\"\n #dp\n startView=\"multi-year\"\n (monthSelected)=\"setMonthAndYear($event, dp)\"\n ></mat-datepicker>\n\n <mat-hint class=\"info\" ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors \| hasValidationError))\"\n >{{ hint }}\n </mat-hint>\n <mat-hint class=\"error\" ngIf=\"errorsLength \|\| (ngControl?.touched && (ngControl?.errors \| hasValidationError))\">\n <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n </mat-hint>\n </mat-form-field>\n} @else {\n @if (isRange) {\n <mat-form-field\n appearance=\"outline\"\n [color]=\"errorsLength \|\| (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n class=\"range-datepicker\"\n >\n <mat-label ngIf=\"label\">\n <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n </mat-label>\n\n <mat-date-range-input [formGroup]=\"range\" [rangePicker]=\"rangePicker\" [min]=\"minDate\" [max]=\"maxDate\">\n <input\n matStartDate\n formControlName=\"start\"\n [placeholder]=\"translationContext + 'START_DATE' \| uiTranslate \| async\"\n (dateChange)=\"dateRangeChange()\"\n (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(true)\"\n />\n <input\n matEndDate\n formControlName=\"end\"\n [placeholder]=\"translationContext + 'END_DATE' \| uiTranslate \| async\"\n (dateChange)=\"dateRangeChange()\"\n (blur)=\"setSingleDateRangeOnBlur && fillSingleDateRange(false)\"\n />\n </mat-date-range-input>\n <mat-datepicker-toggle matIconSuffix [for]=\"rangePicker\">\n <ui-icon\n matDatepickerToggleIcon\n [applicationTheme]=\"applicationTheme\"\n name=\"Calendar\"\n size=\"24\"\n color=\"inherit\"\n ></ui-icon>\n </mat-datepicker-toggle>\n <mat-date-range-picker #rangePicker (closed)=\"handleCloseRangePicker()\"></mat-date-range-picker>\n\n <mat-hint\n class=\"info\"\n ngIf=\"\n hint &&\n !_errors &&\n !(ngControl?.touched && (ngControl?.errors \| hasValidationError)) &&\n !(range?.invalid && showInnerErrors)\n \"\n >{{ hint }}\n </mat-hint>\n <mat-hint\n class=\"error\"\n ngIf=\"\n errorsLength \|\|\n (ngControl?.touched && (ngControl?.errors \| hasValidationError)) \|\|\n (range?.invalid && showInnerErrors)\n \"\n >\n <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n </mat-hint>\n </mat-form-field>\n } @else {\n <mat-form-field\n appearance=\"outline\"\n [color]=\"errorsLength \|\| (ngControl?.errors && ngControl?.touched) ? 'warn' : 'accent'\"\n [ngClass]=\"{ 'hide-bottom-content': !showBottomContent, 'full-width': fullWidth }\"\n >\n <mat-label ngIf=\"label\">\n <ng-container [ngTemplateOutlet]=\"labelTpl\"></ng-container>\n </mat-label>\n <input\n matInput\n [matDatepicker]=\"picker\"\n (blur)=\"onTouch()\"\n (dateChange)=\"onValueChange($event.value)\"\n [id]=\"id!\"\n [placeholder]=\"placeholder!\"\n [value]=\"value\"\n [disabled]=\"disabled\"\n [name]=\"fieldName!\"\n [readonly]=\"preventUserInput\"\n [min]=\"minDate\"\n [max]=\"maxDate\"\n />\n <mat-datepicker-toggle matIconSuffix [for]=\"picker\">\n <ui-icon\n matDatepickerToggleIcon\n [applicationTheme]=\"applicationTheme\"\n name=\"Calendar\"\n size=\"24\"\n color=\"inherit\"\n ></ui-icon>\n </mat-datepicker-toggle>\n <mat-datepicker #picker></mat-datepicker>\n\n <mat-hint\n class=\"info\"\n ngIf=\"hint && !_errors && !(ngControl?.touched && (ngControl?.errors \| hasValidationError))\"\n >{{ hint }}\n </mat-hint>\n <mat-hint class=\"error\" ngIf=\"errorsLength \|\| (ngControl?.touched && (ngControl?.errors \| hasValidationError))\">\n <ng-container [ngTemplateOutlet]=\"hintsTpl\"></ng-container>\n </mat-hint>\n </mat-form-field>\n }\n}\n\n<ng-template #labelTpl>{{ label }}<span ngIf=\"required\"> </span></ng-template>\n<ng-template #hintsTpl>\n @if (errorsLength) {\n <div class=\"errors\" ngFor=\"let error of _errors\">\n <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n <span [innerHTML]=\"error\"></span>\n </div>\n }\n @if (ngControl && !hideBuiltInErrors) {\n <ui-validation-error [ngControl]=\"ngControl\" [label]=\"hideLabelInErrors ? null : label\"></ui-validation-error>\n }\n @if (showInnerErrors) {\n @if (isRange) {\n <div class=\"errors\">\n <ui-icon [applicationTheme]=\"applicationTheme\" name=\"Error\"></ui-icon>\n <span [innerHTML]=\"innerErrorsMessage\"></span>\n </div>\n }\n }\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { DatepickerComponent } from './datepicker.component';\nimport { MatDatepickerModule } from '@angular/material/datepicker';\nimport { FormsModule, ReactiveFormsModule } from '@angular/forms';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { MatNativeDateModule } from '@angular/material/core';\nimport { UiTranslatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { NoDateFormatDirective } from './no-date-format.directive';\nimport { HasValidationErrorPipe } from '@testgorilla/tgo-ui/components/core';\nimport { ValidationErrorModule } from '@testgorilla/tgo-ui/components/validation-error';\n\n@NgModule({\n declarations: [DatepickerComponent],\n imports: [\n CommonModule,\n MatFormFieldModule,\n MatInputModule,\n IconComponentModule,\n FormsModule,\n ReactiveFormsModule,\n MatDatepickerModule,\n MatNativeDateModule,\n UiTranslatePipe,\n NoDateFormatDirective,\n HasValidationErrorPipe,\n ValidationErrorModule,\n ],\n exports: [DatepickerComponent],\n})\nexport class DatepickerComponentModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":["i2.DatepickerService","i8.NoDateFormatDirective"],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-dialog.mjs CHANGED Viewed

@@ -10,7 +10,7 @@ import * as i4 from '@testgorilla/tgo-ui/components/core';
 import { UiTranslatePipe, LanguageService } from '@testgorilla/tgo-ui/components/core';
 class DialogComponent {
-    onEsc(_) {
+    onEsc() {
         this.dismiss();
     }
     constructor(defaultAppTheme, dialogRef, data) {
@@ -206,7 +206,7 @@ class DialogComponent {
         this.primaryButtonClickEvent.emit(event);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DialogComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DialogComponent, isStandalone: false, selector: "ui-dialog", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, showCloseButton: { classPropertyName: "showCloseButton", publicName: "showCloseButton", isSignal: false, isRequired: false, transformFunction: null }, canCloseFn: { classPropertyName: "canCloseFn", publicName: "canCloseFn", isSignal: false, isRequired: false, transformFunction: null }, secondaryButtonLabel: { classPropertyName: "secondaryButtonLabel", publicName: "secondaryButtonLabel", isSignal: false, isRequired: false, transformFunction: null }, footerMessage: { classPropertyName: "footerMessage", publicName: "footerMessage", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonLabel: { classPropertyName: "primaryButtonLabel", publicName: "primaryButtonLabel", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonIconName: { classPropertyName: "primaryButtonIconName", publicName: "primaryButtonIconName", isSignal: false, isRequired: false, transformFunction: null }, secondaryButtonType: { classPropertyName: "secondaryButtonType", publicName: "secondaryButtonType", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonType: { classPropertyName: "primaryButtonType", publicName: "primaryButtonType", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonDataTestId: { classPropertyName: "primaryButtonDataTestId", publicName: "primaryButtonDataTestId", isSignal: false, isRequired: false, transformFunction: null }, secondaryButtonDataTestId: { classPropertyName: "secondaryButtonDataTestId", publicName: "secondaryButtonDataTestId", isSignal: false, isRequired: false, transformFunction: null }, companyColor: { classPropertyName: "companyColor", publicName: "companyColor", isSignal: false, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null }, disablePrimaryButton: { classPropertyName: "disablePrimaryButton", publicName: "disablePrimaryButton", isSignal: false, isRequired: false, transformFunction: null }, disableClose: { classPropertyName: "disableClose", publicName: "disableClose", isSignal: false, isRequired: false, transformFunction: null }, shouldDisableButtons: { classPropertyName: "shouldDisableButtons", publicName: "shouldDisableButtons", isSignal: false, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: false, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: false, isRequired: false, transformFunction: null }, keyboardOpen: { classPropertyName: "keyboardOpen", publicName: "keyboardOpen", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonIconPosition: { classPropertyName: "primaryButtonIconPosition", publicName: "primaryButtonIconPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeEvent: "closeEvent", secondaryButtonClickEvent: "secondaryButtonClickEvent", primaryButtonClickEvent: "primaryButtonClickEvent" }, host: { listeners: { "keydown.esc": "onEsc($event)" }, properties: { "style.--color": "this.companyColor" } }, queries: [{ propertyName: "customHeader", first: true, predicate: ["dialogHeader"], descendants: true }], viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dialog-container\" [attr.theme]=\"applicationTheme\">\n  <div\n    mat-dialog-title\n    class=\"dialog-title\"\n    [attr.aria-modal]=\"true\"\n    [attr.aria-labelledby]=\"'labelledby'\"\n    [attr.aria-describedby]=\"'ariaDescribedby'\"\n  >\n    <span [style.display]=\"'none'\" id=\"ariaDescribedby\">{{ ariaDescribedby }}</span>\n\n    <!-- Default header content -->\n    <ng-container *ngIf=\"!hasCustomHeader\">\n      <h3 class=\"bold\" id=\"labelledby\">{{ title }}</h3>\n      <div *ngIf=\"showCloseButton\">\n        <ui-button\n          #closeButton\n          [variant]=\"'icon-button'\"\n          [iconName]=\"'Close'\"\n          [companyColor]=\"applicationTheme === 'classic' ? '#000' : '#242424'\"\n          [applicationTheme]=\"applicationTheme\"\n          [tooltip]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n          (click)=\"onClose($event)\"\n          (buttonClickEvent)=\"dismiss()\"\n          id=\"dialog-close-button\"\n        ></ui-button>\n      </div>\n    </ng-container>\n\n    <!-- Custom header content projection -->\n    <ng-content select=\"[dialogHeader]\"></ng-content>\n  </div>\n  <mat-dialog-content>\n    <ng-content></ng-content>\n  </mat-dialog-content>\n  <div\n    mat-dialog-actions\n    *ngIf=\"secondaryButtonLabel !== '' || primaryButtonLabel !== ''\"\n    [class.dialog-action-w-message]=\"!!footerMessage\"\n  >\n    @if (footerMessage) {\n      <div class=\"actions-footer-message\">{{ footerMessage }}</div>\n    }\n    <ui-button\n      *ngIf=\"!!secondaryButtonLabel\"\n      [companyColor]=\"companyColor\"\n      [variant]=\"secondaryButtonType\"\n      [applicationTheme]=\"applicationTheme\"\n      [label]=\"secondaryButtonLabel\"\n      [attr.data-testid]=\"secondaryButtonDataTestId\"\n      (click)=\"onSecondaryButtonClick($event)\"\n    ></ui-button>\n    <ui-button\n      *ngIf=\"!!primaryButtonLabel\"\n      [iconPosition]=\"primaryButtonIconPosition()\"\n      [iconName]=\"primaryButtonIconName ? primaryButtonIconName : undefined\"\n      [variant]=\"primaryButtonType\"\n      [disabled]=\"disableButtons || disablePrimaryButton\"\n      [applicationTheme]=\"applicationTheme\"\n      (click)=\"onPrimaryButtonClick($event)\"\n      [label]=\"primaryButtonLabel\"\n      [companyColor]=\"companyColor\"\n      [attr.data-testid]=\"primaryButtonDataTestId\"\n      (buttonClickEvent)=\"dismiss()\"\n    ></ui-button>\n  </div>\n\n  <!--  This is announcement for screen reader that dialog was closed-->\n  <div aria-live=\"assertive\" role=\"alert\" style=\"position: absolute; left: -9999px\">\n    <span *ngIf=\"modalClosed\">{{ 'DIALOG.CLOSED' | uiTranslate | async }}</span>\n  </div>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.ui-dialog-wrapper{display:flex;flex-flow:column}.ui-dialog-wrapper.small{width:600px}.ui-dialog-wrapper.large{width:956px}.ui-dialog-wrapper.x-large{width:1312px}.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{border-radius:8px;padding:16px}.ui-dialog-wrapper.dark .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface,.ui-dialog-wrapper.light .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{padding:32px}.ui-dialog-wrapper.dark .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface,.ui-dialog-wrapper.light .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{border-radius:10px}.ui-dialog-wrapper.dark .dialog-title,.ui-dialog-wrapper.light .dialog-title{height:40px;padding:0;margin-bottom:32px}.ui-dialog-wrapper.dark .mat-mdc-dialog-content,.ui-dialog-wrapper.light .mat-mdc-dialog-content{padding:0}.ui-dialog-wrapper.dark .mat-mdc-dialog-actions,.ui-dialog-wrapper.light .mat-mdc-dialog-actions{padding:0;margin-top:32px}.ui-dialog-wrapper .mat-mdc-dialog-content{font-size:14px;color:#000;line-height:20px}.ui-dialog-wrapper.dark .mat-mdc-dialog-container{--mdc-dialog-container-color: #424242}.ui-dialog-wrapper.dark .mat-mdc-dialog-content{color:#fff!important}.ui-dialog-wrapper.dark .dialog-title{--mdc-dialog-subhead-color: #ffffff}.dialog-title{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:0}.dialog-title .close{margin-right:-24px}.dialog-title:before{content:none}.mat-mdc-dialog-actions{display:flex;justify-content:flex-end;column-gap:16px;padding:16px 0 0;margin-bottom:0;min-height:48px}.mat-mdc-dialog-actions.dialog-action-w-message{justify-content:space-between}.mat-mdc-dialog-actions .actions-footer-message{flex:1 0 auto}@media (max-width: 1024px){.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:320px;max-width:600px;border-radius:0}.mat-mdc-dialog-content{max-height:524px}}@media (max-width: 600px){.cdk-overlay-pane.ui-dialog-wrapper{max-width:100%!important;min-height:100%;display:flex;justify-content:center}.cdk-overlay-pane.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:100%;max-width:100%;height:100%;display:flex;flex-grow:1;border-radius:0}.cdk-overlay-pane.ui-dialog-wrapper.x-large{height:100%}.cdk-overlay-pane.ui-dialog-wrapper.x-large .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{padding:16px}ui-dialog{height:100%;display:flex;flex-flow:column}.mat-mdc-dialog-content{max-height:unset;display:flex;flex-grow:1;flex-direction:column}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: DialogComponent, isStandalone: false, selector: "ui-dialog", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: false, isRequired: false, transformFunction: null }, showCloseButton: { classPropertyName: "showCloseButton", publicName: "showCloseButton", isSignal: false, isRequired: false, transformFunction: null }, canCloseFn: { classPropertyName: "canCloseFn", publicName: "canCloseFn", isSignal: false, isRequired: false, transformFunction: null }, secondaryButtonLabel: { classPropertyName: "secondaryButtonLabel", publicName: "secondaryButtonLabel", isSignal: false, isRequired: false, transformFunction: null }, footerMessage: { classPropertyName: "footerMessage", publicName: "footerMessage", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonLabel: { classPropertyName: "primaryButtonLabel", publicName: "primaryButtonLabel", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonIconName: { classPropertyName: "primaryButtonIconName", publicName: "primaryButtonIconName", isSignal: false, isRequired: false, transformFunction: null }, secondaryButtonType: { classPropertyName: "secondaryButtonType", publicName: "secondaryButtonType", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonType: { classPropertyName: "primaryButtonType", publicName: "primaryButtonType", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonDataTestId: { classPropertyName: "primaryButtonDataTestId", publicName: "primaryButtonDataTestId", isSignal: false, isRequired: false, transformFunction: null }, secondaryButtonDataTestId: { classPropertyName: "secondaryButtonDataTestId", publicName: "secondaryButtonDataTestId", isSignal: false, isRequired: false, transformFunction: null }, companyColor: { classPropertyName: "companyColor", publicName: "companyColor", isSignal: false, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null }, disablePrimaryButton: { classPropertyName: "disablePrimaryButton", publicName: "disablePrimaryButton", isSignal: false, isRequired: false, transformFunction: null }, disableClose: { classPropertyName: "disableClose", publicName: "disableClose", isSignal: false, isRequired: false, transformFunction: null }, shouldDisableButtons: { classPropertyName: "shouldDisableButtons", publicName: "shouldDisableButtons", isSignal: false, isRequired: false, transformFunction: null }, ariaLabelledby: { classPropertyName: "ariaLabelledby", publicName: "ariaLabelledby", isSignal: false, isRequired: false, transformFunction: null }, ariaDescribedby: { classPropertyName: "ariaDescribedby", publicName: "ariaDescribedby", isSignal: false, isRequired: false, transformFunction: null }, keyboardOpen: { classPropertyName: "keyboardOpen", publicName: "keyboardOpen", isSignal: false, isRequired: false, transformFunction: null }, primaryButtonIconPosition: { classPropertyName: "primaryButtonIconPosition", publicName: "primaryButtonIconPosition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closeEvent: "closeEvent", secondaryButtonClickEvent: "secondaryButtonClickEvent", primaryButtonClickEvent: "primaryButtonClickEvent" }, host: { listeners: { "keydown.esc": "onEsc()" }, properties: { "style.--color": "this.companyColor" } }, queries: [{ propertyName: "customHeader", first: true, predicate: ["dialogHeader"], descendants: true }], viewQueries: [{ propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dialog-container\" [attr.theme]=\"applicationTheme\">\n  <div\n    mat-dialog-title\n    class=\"dialog-title\"\n    [attr.aria-modal]=\"true\"\n    [attr.aria-labelledby]=\"'labelledby'\"\n    [attr.aria-describedby]=\"'ariaDescribedby'\"\n  >\n    <span [style.display]=\"'none'\" id=\"ariaDescribedby\">{{ ariaDescribedby }}</span>\n\n    <!-- Default header content -->\n    <ng-container *ngIf=\"!hasCustomHeader\">\n      <h3 class=\"bold\" id=\"labelledby\">{{ title }}</h3>\n      <div *ngIf=\"showCloseButton\">\n        <ui-button\n          #closeButton\n          [variant]=\"'icon-button'\"\n          [iconName]=\"'Close'\"\n          [companyColor]=\"applicationTheme === 'classic' ? '#000' : '#242424'\"\n          [applicationTheme]=\"applicationTheme\"\n          [tooltip]=\"('COMMON.CLOSE' | uiTranslate | async)!\"\n          (click)=\"onClose($event)\"\n          (buttonClickEvent)=\"dismiss()\"\n          id=\"dialog-close-button\"\n        ></ui-button>\n      </div>\n    </ng-container>\n\n    <!-- Custom header content projection -->\n    <ng-content select=\"[dialogHeader]\"></ng-content>\n  </div>\n  <mat-dialog-content>\n    <ng-content></ng-content>\n  </mat-dialog-content>\n  <div\n    mat-dialog-actions\n    *ngIf=\"secondaryButtonLabel !== '' || primaryButtonLabel !== ''\"\n    [class.dialog-action-w-message]=\"!!footerMessage\"\n  >\n    @if (footerMessage) {\n      <div class=\"actions-footer-message\">{{ footerMessage }}</div>\n    }\n    <ui-button\n      *ngIf=\"!!secondaryButtonLabel\"\n      [companyColor]=\"companyColor\"\n      [variant]=\"secondaryButtonType\"\n      [applicationTheme]=\"applicationTheme\"\n      [label]=\"secondaryButtonLabel\"\n      [attr.data-testid]=\"secondaryButtonDataTestId\"\n      (click)=\"onSecondaryButtonClick($event)\"\n    ></ui-button>\n    <ui-button\n      *ngIf=\"!!primaryButtonLabel\"\n      [iconPosition]=\"primaryButtonIconPosition()\"\n      [iconName]=\"primaryButtonIconName ? primaryButtonIconName : undefined\"\n      [variant]=\"primaryButtonType\"\n      [disabled]=\"disableButtons || disablePrimaryButton\"\n      [applicationTheme]=\"applicationTheme\"\n      (click)=\"onPrimaryButtonClick($event)\"\n      [label]=\"primaryButtonLabel\"\n      [companyColor]=\"companyColor\"\n      [attr.data-testid]=\"primaryButtonDataTestId\"\n      (buttonClickEvent)=\"dismiss()\"\n    ></ui-button>\n  </div>\n\n  <!--  This is announcement for screen reader that dialog was closed-->\n  <div aria-live=\"assertive\" role=\"alert\" style=\"position: absolute; left: -9999px\">\n    <span *ngIf=\"modalClosed\">{{ 'DIALOG.CLOSED' | uiTranslate | async }}</span>\n  </div>\n</div>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}.ui-dialog-wrapper{display:flex;flex-flow:column}.ui-dialog-wrapper.small{width:600px}.ui-dialog-wrapper.large{width:956px}.ui-dialog-wrapper.x-large{width:1312px}.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{border-radius:8px;padding:16px}.ui-dialog-wrapper.dark .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface,.ui-dialog-wrapper.light .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{padding:32px}.ui-dialog-wrapper.dark .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface,.ui-dialog-wrapper.light .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{border-radius:10px}.ui-dialog-wrapper.dark .dialog-title,.ui-dialog-wrapper.light .dialog-title{height:40px;padding:0;margin-bottom:32px}.ui-dialog-wrapper.dark .mat-mdc-dialog-content,.ui-dialog-wrapper.light .mat-mdc-dialog-content{padding:0}.ui-dialog-wrapper.dark .mat-mdc-dialog-actions,.ui-dialog-wrapper.light .mat-mdc-dialog-actions{padding:0;margin-top:32px}.ui-dialog-wrapper .mat-mdc-dialog-content{font-size:14px;color:#000;line-height:20px}.ui-dialog-wrapper.dark .mat-mdc-dialog-container{--mdc-dialog-container-color: #424242}.ui-dialog-wrapper.dark .mat-mdc-dialog-content{color:#fff!important}.ui-dialog-wrapper.dark .dialog-title{--mdc-dialog-subhead-color: #ffffff}.dialog-title{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin:0}.dialog-title .close{margin-right:-24px}.dialog-title:before{content:none}.mat-mdc-dialog-actions{display:flex;justify-content:flex-end;column-gap:16px;padding:16px 0 0;margin-bottom:0;min-height:48px}.mat-mdc-dialog-actions.dialog-action-w-message{justify-content:space-between}.mat-mdc-dialog-actions .actions-footer-message{flex:1 0 auto}@media (max-width: 1024px){.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:320px;max-width:600px;border-radius:0}.mat-mdc-dialog-content{max-height:524px}}@media (max-width: 600px){.cdk-overlay-pane.ui-dialog-wrapper{max-width:100%!important;min-height:100%;display:flex;justify-content:center}.cdk-overlay-pane.ui-dialog-wrapper .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{min-width:100%;max-width:100%;height:100%;display:flex;flex-grow:1;border-radius:0}.cdk-overlay-pane.ui-dialog-wrapper.x-large{height:100%}.cdk-overlay-pane.ui-dialog-wrapper.x-large .mat-mdc-dialog-container .mdc-dialog__container .mat-mdc-dialog-surface{padding:16px}ui-dialog{height:100%;display:flex;flex-flow:column}.mat-mdc-dialog-content{max-height:unset;display:flex;flex-grow:1;flex-direction:column}}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.UiTranslatePipe, name: "uiTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DialogComponent, decorators: [{
             type: Component,
@@ -271,7 +271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
                 args: ['closeButton']
             }], onEsc: [{
                 type: HostListener,
-                args: ['keydown.esc', ['$event']]
+                args: ['keydown.esc']
             }], customHeader: [{
                 type: ContentChild,
                 args: ['dialogHeader']
@@ -369,11 +369,11 @@ class ConfirmDialogComponent {
         this.dialogRef.close(true);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ConfirmDialogComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: ConfirmDialogComponent, isStandalone: false, selector: "ui-confirm-dialog", inputs: { applicationTheme: "applicationTheme" }, ngImport: i0, template: "<ng-container>\n  <ui-dialog\n    [title]=\"title ?? ('COMMON.CONFIRM' | uiTranslate | async)!\"\n    [primaryButtonLabel]=\"confirmButtonText ?? ('COMMON.YES' | uiTranslate | async)!\"\n    [secondaryButtonLabel]=\"\n      showSecondaryButton ? cancelButtonText ?? ('COMMON.CANCEL' | uiTranslate | async)! : undefined\n    \"\n    (primaryButtonClickEvent)=\"onConfirm()\"\n    (secondaryButtonClickEvent)=\"dialogRef.close(false)\"\n    (closeEvent)=\"dialogRef.close(null)\"\n    [primaryButtonType]=\"primaryButtonType\"\n    [primaryButtonIconName]=\"primaryButtonIconName\"\n    [secondaryButtonType]=\"secondaryButtonType\"\n    [applicationTheme]=\"applicationTheme\"\n    [showCloseButton]=\"showCloseButton\"\n    [companyColor]=\"color\"\n    [primaryButtonDataTestId]=\"primaryButtonDataTestId\"\n    [secondaryButtonDataTestId]=\"secondaryButtonDataTestId\"\n    [primaryButtonIconPosition]=\"primaryButtonIconPosition\"\n  >\n    <div class=\"message\">{{ confirmMessage }}</div>\n    @if (confirmMessageHtml) {\n      <div class=\"message\" [innerHTML]=\"confirmMessageHtml\"></div>\n    }\n  </ui-dialog>\n</ng-container>\n", styles: ["::ng-deep .ui-dialog-wrapper{max-width:600px!important}\n"], dependencies: [{ kind: "component", type: DialogComponent, selector: "ui-dialog", inputs: ["title", "showCloseButton", "canCloseFn", "secondaryButtonLabel", "footerMessage", "primaryButtonLabel", "primaryButtonIconName", "secondaryButtonType", "primaryButtonType", "primaryButtonDataTestId", "secondaryButtonDataTestId", "companyColor", "applicationTheme", "disablePrimaryButton", "disableClose", "shouldDisableButtons", "ariaLabelledby", "ariaDescribedby", "keyboardOpen", "primaryButtonIconPosition"], outputs: ["closeEvent", "secondaryButtonClickEvent", "primaryButtonClickEvent"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.UiTranslatePipe, name: "uiTranslate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.19", type: ConfirmDialogComponent, isStandalone: false, selector: "ui-confirm-dialog", inputs: { applicationTheme: "applicationTheme" }, ngImport: i0, template: "<ng-container>\n  <ui-dialog\n    [title]=\"title ?? ('COMMON.CONFIRM' | uiTranslate | async)!\"\n    [primaryButtonLabel]=\"confirmButtonText ?? ('COMMON.YES' | uiTranslate | async)!\"\n    [secondaryButtonLabel]=\"\n      showSecondaryButton ? (cancelButtonText ?? ('COMMON.CANCEL' | uiTranslate | async)!) : undefined\n    \"\n    (primaryButtonClickEvent)=\"onConfirm()\"\n    (secondaryButtonClickEvent)=\"dialogRef.close(false)\"\n    (closeEvent)=\"dialogRef.close(null)\"\n    [primaryButtonType]=\"primaryButtonType\"\n    [primaryButtonIconName]=\"primaryButtonIconName\"\n    [secondaryButtonType]=\"secondaryButtonType\"\n    [applicationTheme]=\"applicationTheme\"\n    [showCloseButton]=\"showCloseButton\"\n    [companyColor]=\"color\"\n    [primaryButtonDataTestId]=\"primaryButtonDataTestId\"\n    [secondaryButtonDataTestId]=\"secondaryButtonDataTestId\"\n    [primaryButtonIconPosition]=\"primaryButtonIconPosition\"\n  >\n    <div class=\"message\">{{ confirmMessage }}</div>\n    @if (confirmMessageHtml) {\n      <div class=\"message\" [innerHTML]=\"confirmMessageHtml\"></div>\n    }\n  </ui-dialog>\n</ng-container>\n", styles: ["::ng-deep .ui-dialog-wrapper{max-width:600px!important}\n"], dependencies: [{ kind: "component", type: DialogComponent, selector: "ui-dialog", inputs: ["title", "showCloseButton", "canCloseFn", "secondaryButtonLabel", "footerMessage", "primaryButtonLabel", "primaryButtonIconName", "secondaryButtonType", "primaryButtonType", "primaryButtonDataTestId", "secondaryButtonDataTestId", "companyColor", "applicationTheme", "disablePrimaryButton", "disableClose", "shouldDisableButtons", "ariaLabelledby", "ariaDescribedby", "keyboardOpen", "primaryButtonIconPosition"], outputs: ["closeEvent", "secondaryButtonClickEvent", "primaryButtonClickEvent"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.UiTranslatePipe, name: "uiTranslate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ConfirmDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ui-confirm-dialog', standalone: false, template: "<ng-container>\n  <ui-dialog\n    [title]=\"title ?? ('COMMON.CONFIRM' | uiTranslate | async)!\"\n    [primaryButtonLabel]=\"confirmButtonText ?? ('COMMON.YES' | uiTranslate | async)!\"\n    [secondaryButtonLabel]=\"\n      showSecondaryButton ? cancelButtonText ?? ('COMMON.CANCEL' | uiTranslate | async)! : undefined\n    \"\n    (primaryButtonClickEvent)=\"onConfirm()\"\n    (secondaryButtonClickEvent)=\"dialogRef.close(false)\"\n    (closeEvent)=\"dialogRef.close(null)\"\n    [primaryButtonType]=\"primaryButtonType\"\n    [primaryButtonIconName]=\"primaryButtonIconName\"\n    [secondaryButtonType]=\"secondaryButtonType\"\n    [applicationTheme]=\"applicationTheme\"\n    [showCloseButton]=\"showCloseButton\"\n    [companyColor]=\"color\"\n    [primaryButtonDataTestId]=\"primaryButtonDataTestId\"\n    [secondaryButtonDataTestId]=\"secondaryButtonDataTestId\"\n    [primaryButtonIconPosition]=\"primaryButtonIconPosition\"\n  >\n    <div class=\"message\">{{ confirmMessage }}</div>\n    @if (confirmMessageHtml) {\n      <div class=\"message\" [innerHTML]=\"confirmMessageHtml\"></div>\n    }\n  </ui-dialog>\n</ng-container>\n", styles: ["::ng-deep .ui-dialog-wrapper{max-width:600px!important}\n"] }]
+            args: [{ selector: 'ui-confirm-dialog', standalone: false, template: "<ng-container>\n  <ui-dialog\n    [title]=\"title ?? ('COMMON.CONFIRM' | uiTranslate | async)!\"\n    [primaryButtonLabel]=\"confirmButtonText ?? ('COMMON.YES' | uiTranslate | async)!\"\n    [secondaryButtonLabel]=\"\n      showSecondaryButton ? (cancelButtonText ?? ('COMMON.CANCEL' | uiTranslate | async)!) : undefined\n    \"\n    (primaryButtonClickEvent)=\"onConfirm()\"\n    (secondaryButtonClickEvent)=\"dialogRef.close(false)\"\n    (closeEvent)=\"dialogRef.close(null)\"\n    [primaryButtonType]=\"primaryButtonType\"\n    [primaryButtonIconName]=\"primaryButtonIconName\"\n    [secondaryButtonType]=\"secondaryButtonType\"\n    [applicationTheme]=\"applicationTheme\"\n    [showCloseButton]=\"showCloseButton\"\n    [companyColor]=\"color\"\n    [primaryButtonDataTestId]=\"primaryButtonDataTestId\"\n    [secondaryButtonDataTestId]=\"secondaryButtonDataTestId\"\n    [primaryButtonIconPosition]=\"primaryButtonIconPosition\"\n  >\n    <div class=\"message\">{{ confirmMessage }}</div>\n    @if (confirmMessageHtml) {\n      <div class=\"message\" [innerHTML]=\"confirmMessageHtml\"></div>\n    }\n  </ui-dialog>\n</ng-container>\n", styles: ["::ng-deep .ui-dialog-wrapper{max-width:600px!important}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {
@@ -403,7 +403,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
                         { provide: MAT_DIALOG_DATA, useValue: {} },
                         { provide: MatDialogRef, useValue: {} },
                     ],
-                    imports: [CommonModule, MatDialogModule, ButtonComponentModule, DialogComponentModule, UiTranslatePipe]
+                    imports: [CommonModule, MatDialogModule, ButtonComponentModule, DialogComponentModule, UiTranslatePipe],
                 }]
         }] });
@@ -438,11 +438,11 @@ class DialogCustomComponent {
         return true;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DialogCustomComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DialogCustomComponent, isStandalone: false, selector: "ui-dialog-custom", inputs: { applicationTheme: "applicationTheme" }, ngImport: i0, template: "<ui-dialog\n  [title]=\"data.title\"\n  [showCloseButton]=\"data.showCloseButton\"\n  [applicationTheme]=\"applicationTheme\"\n  [primaryButtonLabel]=\"'OK'\"\n  [secondaryButtonLabel]=\"'Cancel'\"\n  [canCloseFn]=\"canClose\"\n  [keyboardOpen]=\"data.keyboardOpen\"\n  [footerMessage]=\"data.footerMessage\"\n>\n  <!-- Custom header content -->\n  <div *ngIf=\"data.type === 'custom-header'\" dialogHeader class=\"custom-header\">\n    <div class=\"button-group\">\n      <ui-button\n        label=\"Action 1\"\n        [variant]=\"'ghost'\"\n        [applicationTheme]=\"applicationTheme\"\n      ></ui-button>\n      <ui-button\n        label=\"Action 2\"\n        [variant]=\"'primary'\"\n        [applicationTheme]=\"applicationTheme\"\n      ></ui-button>\n    </div>\n  </div>\n\n  <!-- Dialog content -->\n  <div class=\"dialog-content\">\n    <p *ngIf=\"data.type === 'default'\" class=\"dialog-message\">\n      This is a default dialog example with a standard header.\n    </p>\n    <p *ngIf=\"data.type === 'custom-header'\" class=\"dialog-message\">\n      This dialog uses a custom header with content projection.\n    </p>\n    <p class=\"dialog-message\">\n      The dialog will be closeable in 2 seconds (demonstrating canCloseFn).\n    </p>\n  </div>\n</ui-dialog>\n", styles: [".custom-header{width:100%}.custom-header .button-group{display:flex;gap:8px;align-items:center;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DialogComponent, selector: "ui-dialog", inputs: ["title", "showCloseButton", "canCloseFn", "secondaryButtonLabel", "footerMessage", "primaryButtonLabel", "primaryButtonIconName", "secondaryButtonType", "primaryButtonType", "primaryButtonDataTestId", "secondaryButtonDataTestId", "companyColor", "applicationTheme", "disablePrimaryButton", "disableClose", "shouldDisableButtons", "ariaLabelledby", "ariaDescribedby", "keyboardOpen", "primaryButtonIconPosition"], outputs: ["closeEvent", "secondaryButtonClickEvent", "primaryButtonClickEvent"] }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DialogCustomComponent, isStandalone: false, selector: "ui-dialog-custom", inputs: { applicationTheme: "applicationTheme" }, ngImport: i0, template: "<ui-dialog\n  [title]=\"data.title\"\n  [showCloseButton]=\"data.showCloseButton\"\n  [applicationTheme]=\"applicationTheme\"\n  [primaryButtonLabel]=\"'OK'\"\n  [secondaryButtonLabel]=\"'Cancel'\"\n  [canCloseFn]=\"canClose\"\n  [keyboardOpen]=\"data.keyboardOpen\"\n  [footerMessage]=\"data.footerMessage\"\n>\n  <!-- Custom header content -->\n  <div *ngIf=\"data.type === 'custom-header'\" dialogHeader class=\"custom-header\">\n    <div class=\"button-group\">\n      <ui-button label=\"Action 1\" [variant]=\"'ghost'\" [applicationTheme]=\"applicationTheme\"></ui-button>\n      <ui-button label=\"Action 2\" [variant]=\"'primary'\" [applicationTheme]=\"applicationTheme\"></ui-button>\n    </div>\n  </div>\n\n  <!-- Dialog content -->\n  <div class=\"dialog-content\">\n    <p *ngIf=\"data.type === 'default'\" class=\"dialog-message\">\n      This is a default dialog example with a standard header.\n    </p>\n    <p *ngIf=\"data.type === 'custom-header'\" class=\"dialog-message\">\n      This dialog uses a custom header with content projection.\n    </p>\n    <p class=\"dialog-message\">The dialog will be closeable in 2 seconds (demonstrating canCloseFn).</p>\n  </div>\n</ui-dialog>\n", styles: [".custom-header{width:100%}.custom-header .button-group{display:flex;gap:8px;align-items:center;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DialogComponent, selector: "ui-dialog", inputs: ["title", "showCloseButton", "canCloseFn", "secondaryButtonLabel", "footerMessage", "primaryButtonLabel", "primaryButtonIconName", "secondaryButtonType", "primaryButtonType", "primaryButtonDataTestId", "secondaryButtonDataTestId", "companyColor", "applicationTheme", "disablePrimaryButton", "disableClose", "shouldDisableButtons", "ariaLabelledby", "ariaDescribedby", "keyboardOpen", "primaryButtonIconPosition"], outputs: ["closeEvent", "secondaryButtonClickEvent", "primaryButtonClickEvent"] }, { kind: "component", type: i3.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DialogCustomComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ui-dialog-custom', encapsulation: ViewEncapsulation.None, standalone: false, template: "<ui-dialog\n  [title]=\"data.title\"\n  [showCloseButton]=\"data.showCloseButton\"\n  [applicationTheme]=\"applicationTheme\"\n  [primaryButtonLabel]=\"'OK'\"\n  [secondaryButtonLabel]=\"'Cancel'\"\n  [canCloseFn]=\"canClose\"\n  [keyboardOpen]=\"data.keyboardOpen\"\n  [footerMessage]=\"data.footerMessage\"\n>\n  <!-- Custom header content -->\n  <div *ngIf=\"data.type === 'custom-header'\" dialogHeader class=\"custom-header\">\n    <div class=\"button-group\">\n      <ui-button\n        label=\"Action 1\"\n        [variant]=\"'ghost'\"\n        [applicationTheme]=\"applicationTheme\"\n      ></ui-button>\n      <ui-button\n        label=\"Action 2\"\n        [variant]=\"'primary'\"\n        [applicationTheme]=\"applicationTheme\"\n      ></ui-button>\n    </div>\n  </div>\n\n  <!-- Dialog content -->\n  <div class=\"dialog-content\">\n    <p *ngIf=\"data.type === 'default'\" class=\"dialog-message\">\n      This is a default dialog example with a standard header.\n    </p>\n    <p *ngIf=\"data.type === 'custom-header'\" class=\"dialog-message\">\n      This dialog uses a custom header with content projection.\n    </p>\n    <p class=\"dialog-message\">\n      The dialog will be closeable in 2 seconds (demonstrating canCloseFn).\n    </p>\n  </div>\n</ui-dialog>\n", styles: [".custom-header{width:100%}.custom-header .button-group{display:flex;gap:8px;align-items:center;margin-left:auto}\n"] }]
+            args: [{ selector: 'ui-dialog-custom', encapsulation: ViewEncapsulation.None, standalone: false, template: "<ui-dialog\n  [title]=\"data.title\"\n  [showCloseButton]=\"data.showCloseButton\"\n  [applicationTheme]=\"applicationTheme\"\n  [primaryButtonLabel]=\"'OK'\"\n  [secondaryButtonLabel]=\"'Cancel'\"\n  [canCloseFn]=\"canClose\"\n  [keyboardOpen]=\"data.keyboardOpen\"\n  [footerMessage]=\"data.footerMessage\"\n>\n  <!-- Custom header content -->\n  <div *ngIf=\"data.type === 'custom-header'\" dialogHeader class=\"custom-header\">\n    <div class=\"button-group\">\n      <ui-button label=\"Action 1\" [variant]=\"'ghost'\" [applicationTheme]=\"applicationTheme\"></ui-button>\n      <ui-button label=\"Action 2\" [variant]=\"'primary'\" [applicationTheme]=\"applicationTheme\"></ui-button>\n    </div>\n  </div>\n\n  <!-- Dialog content -->\n  <div class=\"dialog-content\">\n    <p *ngIf=\"data.type === 'default'\" class=\"dialog-message\">\n      This is a default dialog example with a standard header.\n    </p>\n    <p *ngIf=\"data.type === 'custom-header'\" class=\"dialog-message\">\n      This dialog uses a custom header with content projection.\n    </p>\n    <p class=\"dialog-message\">The dialog will be closeable in 2 seconds (demonstrating canCloseFn).</p>\n  </div>\n</ui-dialog>\n", styles: [".custom-header{width:100%}.custom-header .button-group{display:flex;gap:8px;align-items:center;margin-left:auto}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {