ecabs-components 0.0.56 → 0.0.57

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.
@@ -148,7 +148,7 @@ EcabsDateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14
148
148
  multi: true,
149
149
  },
150
150
  DecimalPipe,
151
- ], usesInheritance: true, ngImport: i0, template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -1.25rem 0rem -.25rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ElementWrapperComponent, selector: "app-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i4.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i4.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7.DigitsOnlyDirective, selector: "[appDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: i8.NumberBorderDirective, selector: "[appNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "directive", type: i9.MaskDateDirective, selector: "[appMaskDate]", inputs: ["isDateTimeMask", "considerSeconds"] }] });
151
+ ], usesInheritance: true, ngImport: i0, template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -.25rem 0rem .125rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ElementWrapperComponent, selector: "app-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i4.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i4.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7.DigitsOnlyDirective, selector: "[appDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: i8.NumberBorderDirective, selector: "[appNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "directive", type: i9.MaskDateDirective, selector: "[appMaskDate]", inputs: ["isDateTimeMask", "considerSeconds"] }] });
152
152
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDateTimePickerComponent, decorators: [{
153
153
  type: Component,
154
154
  args: [{ selector: 'ecabs-date-time-picker', providers: [
@@ -158,7 +158,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
158
158
  multi: true,
159
159
  },
160
160
  DecimalPipe,
161
- ], template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -1.25rem 0rem -.25rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"] }]
161
+ ], template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -.25rem 0rem .125rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"] }]
162
162
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.DecimalPipe }]; }, propDecorators: { minDate: [{
163
163
  type: Input
164
164
  }], maxDate: [{
@@ -1760,7 +1760,7 @@ EcabsDateTimePickerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14
1760
1760
  multi: true,
1761
1761
  },
1762
1762
  DecimalPipe,
1763
- ], usesInheritance: true, ngImport: i0, template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -1.25rem 0rem -.25rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ElementWrapperComponent, selector: "app-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4$3.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i4$3.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i4$3.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[appDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: NumberBorderDirective, selector: "[appNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "directive", type: MaskDateDirective, selector: "[appMaskDate]", inputs: ["isDateTimeMask", "considerSeconds"] }] });
1763
+ ], usesInheritance: true, ngImport: i0, template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -.25rem 0rem .125rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ElementWrapperComponent, selector: "app-element-wrapper", inputs: ["data", "showCloseIcon", "focusedFlag", "showPassword", "control"], outputs: ["showHidePassword", "clear", "increase", "decrease"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4$3.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i4$3.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i4$3.MatDatepickerActions, selector: "mat-datepicker-actions, mat-date-range-picker-actions" }, { kind: "directive", type: i4$3.MatDatepickerCancel, selector: "[matDatepickerCancel], [matDateRangePickerCancel]" }, { kind: "directive", type: i4$3.MatDatepickerApply, selector: "[matDatepickerApply], [matDateRangePickerApply]" }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: DigitsOnlyDirective, selector: "[appDigitsOnly]", inputs: ["digitsOnly", "allowHyphen", "decimal", "decimalSeparator", "unit"] }, { kind: "directive", type: NumberBorderDirective, selector: "[appNumberBorder]", inputs: ["maxValue", "minValue"] }, { kind: "directive", type: MaskDateDirective, selector: "[appMaskDate]", inputs: ["isDateTimeMask", "considerSeconds"] }] });
1764
1764
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: EcabsDateTimePickerComponent, decorators: [{
1765
1765
  type: Component,
1766
1766
  args: [{ selector: 'ecabs-date-time-picker', providers: [
@@ -1770,7 +1770,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
1770
1770
  multi: true,
1771
1771
  },
1772
1772
  DecimalPipe,
1773
- ], template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -1.25rem 0rem -.25rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"] }]
1773
+ ], template: "<app-element-wrapper [data]=\"getData()\">\r\n <div class=\"form-field__input--wrapper w-full\">\r\n <input\r\n class=\"fake-input\"\r\n [id]=\"_date\"\r\n [(ngModel)]=\"_date\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n [matDatepicker]=\"picker\"\r\n [min]=\"minDate\"\r\n [max]=\"maxDate\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <mat-datepicker #picker [calendarHeaderComponent]=\"header\" [touchUi]=\"touchUi\">\r\n <mat-datepicker-actions>\r\n <div class=\"actions\">\r\n <div class=\"time-inputs time--inputs\">\r\n <input\r\n class=\"form-field__input time\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [id]=\"hours\"\r\n [value]=\"_hours\"\r\n [maxValue]=\"maxValueHours\"\r\n [(ngModel)]=\"hours\"\r\n />\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"minutes\"\r\n [(ngModel)]=\"minutes\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n\r\n <ng-container *ngIf=\"!hideSeconds\">\r\n <span class=\"font-bold\">:</span>\r\n <input\r\n class=\"form-field__input time\"\r\n [id]=\"seconds\"\r\n [(ngModel)]=\"seconds\"\r\n appDigitsOnly\r\n appNumberBorder\r\n [digitsOnly]=\"true\"\r\n [maxValue]=\"maxValueMinutesSeconds\"\r\n />\r\n </ng-container>\r\n </div>\r\n\r\n <div class=\"grid-picker-actions\">\r\n <button type=\"button\" mat-stroked-button class=\"w-full\" color=\"primary\" matDatepickerCancel>\r\n {{ cancleLabel }}\r\n </button>\r\n\r\n <button\r\n type=\"button\"\r\n mat-button\r\n class=\"w-full ml-0\"\r\n color=\"primary\"\r\n matDatepickerApply\r\n (click)=\"onApply()\"\r\n >\r\n {{ applyLabel }}\r\n </button>\r\n </div>\r\n </div>\r\n </mat-datepicker-actions>\r\n </mat-datepicker>\r\n <input\r\n class=\"form-field__input w-full date-input\"\r\n [id]=\"name\"\r\n [(ngModel)]=\"pickerValue\"\r\n [placeholder]=\"placeholder\"\r\n [disabled]=\"disabled\"\r\n appMaskDate\r\n [isDateTimeMask]=\"true\"\r\n [considerSeconds]=\"!hideSeconds\"\r\n (blur)=\"onTouch()\"\r\n />\r\n <button type=\"button\" mat-icon-button class=\"datepicker-toggle\" (click)=\"picker.open()\">\r\n <mat-icon>calendar_today</mat-icon>\r\n </button>\r\n </div>\r\n</app-element-wrapper>\r\n", styles: [".time--inputs:before,.time--inputs:after{position:absolute;content:\"\"}.datepicker-toggle{transform:translate(-1.25rem)}.time{width:3.375rem}.fake-input{visibility:hidden;width:0;padding:0;margin:0}.date-input{margin:0rem -.25rem 0rem .125rem}.time--inputs{position:relative;margin-top:2.4rem;margin-bottom:2.4rem}.time--inputs:before,.time--inputs:after{height:1px;right:0;left:0;background-color:var(--color-gray-300)}.time--inputs:before{top:-1.6rem}.time--inputs:after{bottom:-1.6rem}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.font-bold{font-weight:700}.actions{display:flex;flex-direction:column;width:100%!important;row-gap:1rem}.time-inputs{display:flex;gap:.5rem;justify-content:center;align-items:center}\n"] }]
1774
1774
  }], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.DecimalPipe }]; }, propDecorators: { minDate: [{
1775
1775
  type: Input
1776
1776
  }], maxDate: [{