i-tech-shared-components 1.4.38 → 1.4.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/i-tech-shared-components.mjs +10 -4
- package/fesm2022/i-tech-shared-components.mjs.map +1 -1
- package/lib/components/date-range-datepicker/date-range-datepicker.component.d.ts +2 -1
- package/lib/components/date-time-picker/date-time-picker.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -1361,6 +1361,7 @@ class DateRangeDatepickerComponent {
|
|
|
1361
1361
|
this.errorMessage = '';
|
|
1362
1362
|
this.hintText = 'MM/DD/YYYY - MM/DD/YYYY';
|
|
1363
1363
|
this.testId = '';
|
|
1364
|
+
this.panelClass = '';
|
|
1364
1365
|
this.resetForm = new EventEmitter();
|
|
1365
1366
|
this.selectionChange = new EventEmitter();
|
|
1366
1367
|
this.isOpen = false;
|
|
@@ -1436,7 +1437,7 @@ class DateRangeDatepickerComponent {
|
|
|
1436
1437
|
}
|
|
1437
1438
|
}
|
|
1438
1439
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DateRangeDatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1439
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DateRangeDatepickerComponent, isStandalone: true, selector: "i-tech-mat-range-datepicker", inputs: { label: "label", placeholder: "placeholder", value: "value", defaultValue: "defaultValue", key: "key", submit: "submit", clearValue: "clearValue", errorMessage: "errorMessage", onePlaceholder: "onePlaceholder", hintText: "hintText", testId: "testId" }, outputs: { resetForm: "resetForm", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }, { propertyName: "min", first: true, predicate: ["min"], descendants: true }, { propertyName: "max", first: true, predicate: ["max"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex_column relative mat-date-range-input\"\n [formGroup]=\"dateRangeForm\"\n>\n <div class=\"w-100\" *ngIf=\"label\">\n <mat-label>\n {{ (label || '') | translate }}\n </mat-label>\n </div>\n <mat-form-field appearance=\"outline\" [ngClass]=\"{'opened_calendar': isOpen}\">\n <mat-date-range-input [rangePicker]=\"picker\">\n <input formControlName=\"startDate\"\n [attr.data-testId]=\"'date-range-' + testId + '-min-date'\"\n [placeholder]=\" (placeholder ? placeholder[0] : 'Start Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-accessKey]=\"key ? key.start : 'minStartDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matStartDate #min\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['startDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],min)\"\n (dateChange)=\"setDate([min.value, max.value || null],min)\">\n <input formControlName=\"endDate\"\n [placeholder]=\"(placeholder ? placeholder[1] : 'End Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-testId]=\"'date-range-' + testId + '-end-date'\"\n [attr.data-accessKey]=\"key ? key.end : 'maxEndDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matEndDate #max\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['endDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],max)\"\n (dateChange)=\"setDate([min.value, max.value || null],max)\">\n </mat-date-range-input>\n <i-tech-icon-button matSuffix\n [iconName]=\"'cancel'\"\n (buttonClick)=\"setDate([null,null], max)\"\n class=\"default-form-icon-color\"\n *ngIf=\"dateRangeForm.get('startDate')?.value && this.dateRangeForm.get('endDate')?.value\"\n ></i-tech-icon-button>\n <i-tech-icon-button\n matSuffix\n [iconName]=\"'date_range'\"\n (buttonClick)=\"picker.open()\"\n class=\"default-form-icon-color\"\n ></i-tech-icon-button>\n <mat-date-range-picker\n #picker\n (closed)=\"isOpen = false;clickForFocusOut()\"\n (opened)=\"isOpen = true\"\n ></mat-date-range-picker>\n <mat-hint *ngIf=\"hintText && !errorMessage\">{{ hintText }}</mat-hint>\n </mat-form-field>\n</div>\n", dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i3$1.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i3$1.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i3$1.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i3$1.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled", "testId"], outputs: ["buttonClick"] }, { kind: "directive", type: DateMaskDirective, selector: "[dateMask]", inputs: ["maskType", "matDatepicker", "rangeFormControl"] }] }); }
|
|
1440
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DateRangeDatepickerComponent, isStandalone: true, selector: "i-tech-mat-range-datepicker", inputs: { label: "label", placeholder: "placeholder", value: "value", defaultValue: "defaultValue", key: "key", submit: "submit", clearValue: "clearValue", errorMessage: "errorMessage", onePlaceholder: "onePlaceholder", hintText: "hintText", testId: "testId", panelClass: "panelClass" }, outputs: { resetForm: "resetForm", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }, { propertyName: "min", first: true, predicate: ["min"], descendants: true }, { propertyName: "max", first: true, predicate: ["max"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex_column relative mat-date-range-input\"\n [formGroup]=\"dateRangeForm\"\n>\n <div class=\"w-100\" *ngIf=\"label\">\n <mat-label>\n {{ (label || '') | translate }}\n </mat-label>\n </div>\n <mat-form-field appearance=\"outline\" [ngClass]=\"{'opened_calendar': isOpen}\">\n <mat-date-range-input [rangePicker]=\"picker\"\n\n >\n <input formControlName=\"startDate\"\n [attr.data-testId]=\"'date-range-' + testId + '-min-date'\"\n [placeholder]=\" (placeholder ? placeholder[0] : 'Start Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-accessKey]=\"key ? key.start : 'minStartDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matStartDate #min\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['startDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],min)\"\n (dateChange)=\"setDate([min.value, max.value || null],min)\">\n <input formControlName=\"endDate\"\n [placeholder]=\"(placeholder ? placeholder[1] : 'End Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-testId]=\"'date-range-' + testId + '-end-date'\"\n [attr.data-accessKey]=\"key ? key.end : 'maxEndDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matEndDate #max\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['endDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],max)\"\n (dateChange)=\"setDate([min.value, max.value || null],max)\">\n </mat-date-range-input>\n <i-tech-icon-button matSuffix\n [iconName]=\"'cancel'\"\n (buttonClick)=\"setDate([null,null], max)\"\n class=\"default-form-icon-color\"\n *ngIf=\"dateRangeForm.get('startDate')?.value && this.dateRangeForm.get('endDate')?.value\"\n ></i-tech-icon-button>\n <i-tech-icon-button\n matSuffix\n [iconName]=\"'date_range'\"\n (buttonClick)=\"picker.open()\"\n class=\"default-form-icon-color\"\n ></i-tech-icon-button>\n <mat-date-range-picker\n [panelClass]=\"panelClass\"\n #picker\n (closed)=\"isOpen = false;clickForFocusOut()\"\n (opened)=\"isOpen = true\"\n ></mat-date-range-picker>\n <mat-hint *ngIf=\"hintText && !errorMessage\">{{ hintText }}</mat-hint>\n </mat-form-field>\n</div>\n", dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { 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: "ngmodule", type: ReactiveFormsModule }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i3$1.MatDateRangeInput, selector: "mat-date-range-input", inputs: ["rangePicker", "required", "dateFilter", "min", "max", "disabled", "separator", "comparisonStart", "comparisonEnd"], exportAs: ["matDateRangeInput"] }, { kind: "directive", type: i3$1.MatStartDate, selector: "input[matStartDate]", outputs: ["dateChange", "dateInput"] }, { kind: "directive", type: i3$1.MatEndDate, selector: "input[matEndDate]", outputs: ["dateChange", "dateInput"] }, { kind: "component", type: i3$1.MatDateRangePicker, selector: "mat-date-range-picker", exportAs: ["matDateRangePicker"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled", "testId"], outputs: ["buttonClick"] }, { kind: "directive", type: DateMaskDirective, selector: "[dateMask]", inputs: ["maskType", "matDatepicker", "rangeFormControl"] }] }); }
|
|
1440
1441
|
}
|
|
1441
1442
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DateRangeDatepickerComponent, decorators: [{
|
|
1442
1443
|
type: Component,
|
|
@@ -1447,7 +1448,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1447
1448
|
NgClass, NgIf,
|
|
1448
1449
|
TranslateModule,
|
|
1449
1450
|
IconButtonComponent, DateMaskDirective
|
|
1450
|
-
], standalone: true, template: "<div class=\"flex_column relative mat-date-range-input\"\n [formGroup]=\"dateRangeForm\"\n>\n <div class=\"w-100\" *ngIf=\"label\">\n <mat-label>\n {{ (label || '') | translate }}\n </mat-label>\n </div>\n <mat-form-field appearance=\"outline\" [ngClass]=\"{'opened_calendar': isOpen}\">\n <mat-date-range-input [rangePicker]=\"picker\">\n <input formControlName=\"startDate\"\n [attr.data-testId]=\"'date-range-' + testId + '-min-date'\"\n [placeholder]=\" (placeholder ? placeholder[0] : 'Start Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-accessKey]=\"key ? key.start : 'minStartDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matStartDate #min\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['startDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],min)\"\n (dateChange)=\"setDate([min.value, max.value || null],min)\">\n <input formControlName=\"endDate\"\n [placeholder]=\"(placeholder ? placeholder[1] : 'End Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-testId]=\"'date-range-' + testId + '-end-date'\"\n [attr.data-accessKey]=\"key ? key.end : 'maxEndDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matEndDate #max\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['endDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],max)\"\n (dateChange)=\"setDate([min.value, max.value || null],max)\">\n </mat-date-range-input>\n <i-tech-icon-button matSuffix\n [iconName]=\"'cancel'\"\n (buttonClick)=\"setDate([null,null], max)\"\n class=\"default-form-icon-color\"\n *ngIf=\"dateRangeForm.get('startDate')?.value && this.dateRangeForm.get('endDate')?.value\"\n ></i-tech-icon-button>\n <i-tech-icon-button\n matSuffix\n [iconName]=\"'date_range'\"\n (buttonClick)=\"picker.open()\"\n class=\"default-form-icon-color\"\n ></i-tech-icon-button>\n <mat-date-range-picker\n #picker\n (closed)=\"isOpen = false;clickForFocusOut()\"\n (opened)=\"isOpen = true\"\n ></mat-date-range-picker>\n <mat-hint *ngIf=\"hintText && !errorMessage\">{{ hintText }}</mat-hint>\n </mat-form-field>\n</div>\n" }]
|
|
1451
|
+
], standalone: true, template: "<div class=\"flex_column relative mat-date-range-input\"\n [formGroup]=\"dateRangeForm\"\n>\n <div class=\"w-100\" *ngIf=\"label\">\n <mat-label>\n {{ (label || '') | translate }}\n </mat-label>\n </div>\n <mat-form-field appearance=\"outline\" [ngClass]=\"{'opened_calendar': isOpen}\">\n <mat-date-range-input [rangePicker]=\"picker\"\n\n >\n <input formControlName=\"startDate\"\n [attr.data-testId]=\"'date-range-' + testId + '-min-date'\"\n [placeholder]=\" (placeholder ? placeholder[0] : 'Start Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-accessKey]=\"key ? key.start : 'minStartDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matStartDate #min\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['startDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],min)\"\n (dateChange)=\"setDate([min.value, max.value || null],min)\">\n <input formControlName=\"endDate\"\n [placeholder]=\"(placeholder ? placeholder[1] : 'End Date')\"\n [title]=\"key ? key.title : 'Date'\"\n [attr.data-testId]=\"'date-range-' + testId + '-end-date'\"\n [attr.data-accessKey]=\"key ? key.end : 'maxEndDate'\"\n [attr.data-parentKey]=\"key ? (key.start + '_' + key.end) : 'minStartDate_maxEndDate'\"\n matEndDate #max\n dateMask\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [rangeFormControl]=\"dateRangeForm.controls['endDate']\"\n (keydown)=\"keyEventHandler($event,[min.value, max.value || null],max)\"\n (dateChange)=\"setDate([min.value, max.value || null],max)\">\n </mat-date-range-input>\n <i-tech-icon-button matSuffix\n [iconName]=\"'cancel'\"\n (buttonClick)=\"setDate([null,null], max)\"\n class=\"default-form-icon-color\"\n *ngIf=\"dateRangeForm.get('startDate')?.value && this.dateRangeForm.get('endDate')?.value\"\n ></i-tech-icon-button>\n <i-tech-icon-button\n matSuffix\n [iconName]=\"'date_range'\"\n (buttonClick)=\"picker.open()\"\n class=\"default-form-icon-color\"\n ></i-tech-icon-button>\n <mat-date-range-picker\n [panelClass]=\"panelClass\"\n #picker\n (closed)=\"isOpen = false;clickForFocusOut()\"\n (opened)=\"isOpen = true\"\n ></mat-date-range-picker>\n <mat-hint *ngIf=\"hintText && !errorMessage\">{{ hintText }}</mat-hint>\n </mat-form-field>\n</div>\n" }]
|
|
1451
1452
|
}], propDecorators: { label: [{
|
|
1452
1453
|
type: Input
|
|
1453
1454
|
}], placeholder: [{
|
|
@@ -1470,6 +1471,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1470
1471
|
type: Input
|
|
1471
1472
|
}], testId: [{
|
|
1472
1473
|
type: Input
|
|
1474
|
+
}], panelClass: [{
|
|
1475
|
+
type: Input
|
|
1473
1476
|
}], resetForm: [{
|
|
1474
1477
|
type: Output
|
|
1475
1478
|
}], selectionChange: [{
|
|
@@ -1618,6 +1621,7 @@ class DateTimePickerComponent {
|
|
|
1618
1621
|
this.dateChangeEvent = new EventEmitter();
|
|
1619
1622
|
this.submit = false;
|
|
1620
1623
|
this.required = false;
|
|
1624
|
+
this.panelClass = '';
|
|
1621
1625
|
this._disabled = false;
|
|
1622
1626
|
this.isFocused = false;
|
|
1623
1627
|
this.form = new UntypedFormGroup({
|
|
@@ -1730,13 +1734,13 @@ class DateTimePickerComponent {
|
|
|
1730
1734
|
}, 50);
|
|
1731
1735
|
}
|
|
1732
1736
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DateTimePickerComponent, deps: [{ token: InputService }, { token: ParseDateService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1733
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DateTimePickerComponent, isStandalone: true, selector: "i-tech-date-time-picker", inputs: { label: "label", submit: "submit", required: "required", disabled: "disabled" }, outputs: { dateChangeEvent: "dateChangeEvent" }, providers: [ParseDateService], viewQueries: [{ propertyName: "DatePickerElement", first: true, predicate: ["DatePicker"], descendants: true }, { propertyName: "timeInput", first: true, predicate: ["dateElement"], descendants: true }], ngImport: i0, template: "<div class=\"date_time_picker_container relative\"\n *ngIf=\"ngControl?.control\"\n [class.invalid_form]=\"ngControl.control.errors && submit\"\n [class.readonly_field]=\"disabled\"\n>\n <mat-label [ngClass]=\"{\n 'readonly-color': disabled\n }\"\n >{{label | translate}}</mat-label>\n <span *ngIf=\"required\" class=\"required-input\" [ngClass]=\"{'readonly-color': disabled}\"> *</span>\n\n <div class=\"date_time_picker\"\n [formGroup]=\"form\"\n [ngClass]=\"{'focused': isFocused, 'disabled': disabled}\"\n >\n <input type=\"text\" dateMask class=\"date\"\n placeholder=\"mm/dd/yy\"\n formControlName=\"date\"\n [matDatepicker]=\"DatePicker\"\n [attr.data-testId]=\"'date-picker-date'\"\n [disabled]=\"disabled\"\n (click)=\"!disabled && DatePicker.open()\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n >\n <mat-datepicker #DatePicker\n (closed)=\"onDatePickerClosed()\">\n </mat-datepicker>\n <input type=\"time\"\n #dateElement\n class=\"time\"\n [attr.data-testId]=\"'date-picker-time'\"\n formControlName=\"time\"\n [disabled]=\"disabled\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n (change)=\"setDateTimeValue()\"\n />\n </div>\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submit)\">\n {{ngControl.control | generateErrorMessages : (label || '')}}\n </mat-error>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i3$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i3$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: DateMaskDirective, selector: "[dateMask]", inputs: ["maskType", "matDatepicker", "rangeFormControl"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormsModule }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "pipe", type: GenerateErrorMessagesPipe, name: "generateErrorMessages" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] }); }
|
|
1737
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DateTimePickerComponent, isStandalone: true, selector: "i-tech-date-time-picker", inputs: { label: "label", submit: "submit", required: "required", panelClass: "panelClass", disabled: "disabled" }, outputs: { dateChangeEvent: "dateChangeEvent" }, providers: [ParseDateService], viewQueries: [{ propertyName: "DatePickerElement", first: true, predicate: ["DatePicker"], descendants: true }, { propertyName: "timeInput", first: true, predicate: ["dateElement"], descendants: true }], ngImport: i0, template: "<div class=\"date_time_picker_container relative\"\n *ngIf=\"ngControl?.control\"\n [class.invalid_form]=\"ngControl.control.errors && submit\"\n [class.readonly_field]=\"disabled\"\n>\n <mat-label [ngClass]=\"{\n 'readonly-color': disabled\n }\"\n >{{label | translate}}</mat-label>\n <span *ngIf=\"required\" class=\"required-input\" [ngClass]=\"{'readonly-color': disabled}\"> *</span>\n\n <div class=\"date_time_picker\"\n [formGroup]=\"form\"\n [ngClass]=\"{'focused': isFocused, 'disabled': disabled}\"\n >\n <input type=\"text\" dateMask class=\"date\"\n placeholder=\"mm/dd/yy\"\n formControlName=\"date\"\n [matDatepicker]=\"DatePicker\"\n [attr.data-testId]=\"'date-picker-date'\"\n [disabled]=\"disabled\"\n (click)=\"!disabled && DatePicker.open()\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n >\n <mat-datepicker #DatePicker\n [panelClass]=\"panelClass\"\n (closed)=\"onDatePickerClosed()\">\n </mat-datepicker>\n <input type=\"time\"\n #dateElement\n class=\"time\"\n [attr.data-testId]=\"'date-picker-time'\"\n formControlName=\"time\"\n [disabled]=\"disabled\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n (change)=\"setDateTimeValue()\"\n />\n </div>\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submit)\">\n {{ngControl.control | generateErrorMessages : (label || '')}}\n </mat-error>\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i3$1.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i3$1.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "directive", type: DateMaskDirective, selector: "[dateMask]", inputs: ["maskType", "matDatepicker", "rangeFormControl"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "ngmodule", type: FormsModule }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }, { kind: "pipe", type: GenerateErrorMessagesPipe, name: "generateErrorMessages" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: MatError, selector: "mat-error, [matError]", inputs: ["id"] }] }); }
|
|
1734
1738
|
}
|
|
1735
1739
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DateTimePickerComponent, decorators: [{
|
|
1736
1740
|
type: Component,
|
|
1737
1741
|
args: [{ selector: 'i-tech-date-time-picker', imports: [MatDatepickerModule, DateMaskDirective, TranslateModule,
|
|
1738
1742
|
FormsModule, NgClass, ReactiveFormsModule, MatLabel, GenerateErrorMessagesPipe, NgIf, MatError, MatIconButton
|
|
1739
|
-
], standalone: true, providers: [ParseDateService], template: "<div class=\"date_time_picker_container relative\"\n *ngIf=\"ngControl?.control\"\n [class.invalid_form]=\"ngControl.control.errors && submit\"\n [class.readonly_field]=\"disabled\"\n>\n <mat-label [ngClass]=\"{\n 'readonly-color': disabled\n }\"\n >{{label | translate}}</mat-label>\n <span *ngIf=\"required\" class=\"required-input\" [ngClass]=\"{'readonly-color': disabled}\"> *</span>\n\n <div class=\"date_time_picker\"\n [formGroup]=\"form\"\n [ngClass]=\"{'focused': isFocused, 'disabled': disabled}\"\n >\n <input type=\"text\" dateMask class=\"date\"\n placeholder=\"mm/dd/yy\"\n formControlName=\"date\"\n [matDatepicker]=\"DatePicker\"\n [attr.data-testId]=\"'date-picker-date'\"\n [disabled]=\"disabled\"\n (click)=\"!disabled && DatePicker.open()\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n >\n <mat-datepicker #DatePicker\n (closed)=\"onDatePickerClosed()\">\n </mat-datepicker>\n <input type=\"time\"\n #dateElement\n class=\"time\"\n [attr.data-testId]=\"'date-picker-time'\"\n formControlName=\"time\"\n [disabled]=\"disabled\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n (change)=\"setDateTimeValue()\"\n />\n </div>\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submit)\">\n {{ngControl.control | generateErrorMessages : (label || '')}}\n </mat-error>\n</div>\n" }]
|
|
1743
|
+
], standalone: true, providers: [ParseDateService], template: "<div class=\"date_time_picker_container relative\"\n *ngIf=\"ngControl?.control\"\n [class.invalid_form]=\"ngControl.control.errors && submit\"\n [class.readonly_field]=\"disabled\"\n>\n <mat-label [ngClass]=\"{\n 'readonly-color': disabled\n }\"\n >{{label | translate}}</mat-label>\n <span *ngIf=\"required\" class=\"required-input\" [ngClass]=\"{'readonly-color': disabled}\"> *</span>\n\n <div class=\"date_time_picker\"\n [formGroup]=\"form\"\n [ngClass]=\"{'focused': isFocused, 'disabled': disabled}\"\n >\n <input type=\"text\" dateMask class=\"date\"\n placeholder=\"mm/dd/yy\"\n formControlName=\"date\"\n [matDatepicker]=\"DatePicker\"\n [attr.data-testId]=\"'date-picker-date'\"\n [disabled]=\"disabled\"\n (click)=\"!disabled && DatePicker.open()\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n >\n <mat-datepicker #DatePicker\n [panelClass]=\"panelClass\"\n (closed)=\"onDatePickerClosed()\">\n </mat-datepicker>\n <input type=\"time\"\n #dateElement\n class=\"time\"\n [attr.data-testId]=\"'date-picker-time'\"\n formControlName=\"time\"\n [disabled]=\"disabled\"\n (focus)=\"onFocus($event)\"\n (focusout)=\"onBlur($event)\"\n (change)=\"setDateTimeValue()\"\n />\n </div>\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submit)\">\n {{ngControl.control | generateErrorMessages : (label || '')}}\n </mat-error>\n</div>\n" }]
|
|
1740
1744
|
}], ctorParameters: () => [{ type: InputService }, { type: ParseDateService }], propDecorators: { DatePickerElement: [{
|
|
1741
1745
|
type: ViewChild,
|
|
1742
1746
|
args: ['DatePicker']
|
|
@@ -1748,6 +1752,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
1748
1752
|
type: Input
|
|
1749
1753
|
}], required: [{
|
|
1750
1754
|
type: Input
|
|
1755
|
+
}], panelClass: [{
|
|
1756
|
+
type: Input
|
|
1751
1757
|
}], disabled: [{
|
|
1752
1758
|
type: Input
|
|
1753
1759
|
}], timeInput: [{
|