ecabs-components 1.0.20 → 1.0.21
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/esm2022/lib/ecabs-buttons/ecabs-buttons.component.mjs +3 -6
- package/esm2022/lib/ecabs-checkbox-toggle/ecabs-checkbox-toggle.component.mjs +2 -2
- package/esm2022/lib/ecabs-date-time-picker/ecabs-date-time-picker.component.mjs +2 -2
- package/esm2022/lib/ecabs-dialog-confirm/ecabs-dialog-confirm.component.mjs +1 -1
- package/esm2022/lib/ecabs-dialog-message/ecabs-dialog-message.component.mjs +1 -1
- package/esm2022/lib/ecabs-increment/ecabs-increment.component.mjs +2 -2
- package/esm2022/lib/ecabs-picker-header/ecabs-picker-header.component.mjs +2 -2
- package/fesm2022/ecabs-components.mjs +12 -15
- package/fesm2022/ecabs-components.mjs.map +1 -1
- package/lib/ecabs-buttons/ecabs-buttons.component.d.ts +2 -3
- package/package.json +1 -1
- package/styles/material/overrides/_button.scss +1 -0
- package/styles/material/overrides/_icon.scss +1 -1
- package/styles/material/overrides/_phone.scss +24 -2
|
@@ -154,7 +154,7 @@ export class EcabsDateTimePickerComponent extends ElementBaseComponent {
|
|
|
154
154
|
multi: true,
|
|
155
155
|
},
|
|
156
156
|
DecimalPipe,
|
|
157
|
-
], 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 cancel-button\" 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 apply-button\"\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);background-color:inherit;left:-.125rem}.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}
|
|
157
|
+
], 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 cancel-button\" 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 apply-button\"\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:\"\"}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.datepicker-toggle{transform:translate(-1.25rem);background-color:inherit;left:-.125rem}.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}.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}.grid-picker-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.grid-picker-actions button{width:100%}\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.MatLegacyButton, 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"] }] });
|
|
158
158
|
}
|
|
159
159
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDateTimePickerComponent, decorators: [{
|
|
160
160
|
type: Component,
|
|
@@ -165,7 +165,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
165
165
|
multi: true,
|
|
166
166
|
},
|
|
167
167
|
DecimalPipe,
|
|
168
|
-
], 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 cancel-button\" 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 apply-button\"\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);background-color:inherit;left:-.125rem}.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}
|
|
168
|
+
], 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 cancel-button\" 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 apply-button\"\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:\"\"}:host ::ng-deep .form-field{margin-right:-1.25rem;margin-left:-.125rem}.datepicker-toggle{transform:translate(-1.25rem);background-color:inherit;left:-.125rem}.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}.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}.grid-picker-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.grid-picker-actions button{width:100%}\n"] }]
|
|
169
169
|
}], ctorParameters: function () { return [{ type: i0.Injector }, { type: i1.DecimalPipe }]; }, propDecorators: { minDate: [{
|
|
170
170
|
type: Input
|
|
171
171
|
}], maxDate: [{
|
|
@@ -38,7 +38,7 @@ export class EcabsDialogConfirmComponent {
|
|
|
38
38
|
}
|
|
39
39
|
}
|
|
40
40
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDialogConfirmComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
41
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsDialogConfirmComponent, selector: "ecabs-dialog-confirm", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div class=\"font-semibold heading--xs modal-title {{ data.titleColor }}\" *ngIf=\"data.title\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n <div>{{ data?.content }}</div>\r\n <ng-container *ngTemplateOutlet=\"data?.message\"></ng-container>\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons (click)=\"dialogRef.close(false)\" [stroked]=\"true\">\r\n {{ data?.cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons [color]=\"data?.color || color\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-mdc-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-mdc-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}.modal-title.warn{color:var(--color-error)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.MatLegacyDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i3.MatLegacyDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i3.MatLegacyDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i4.ButtonsComponent, selector: "ecabs-buttons", inputs: ["label", "disabled", "loading", "
|
|
41
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsDialogConfirmComponent, selector: "ecabs-dialog-confirm", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div class=\"font-semibold heading--xs modal-title {{ data.titleColor }}\" *ngIf=\"data.title\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n <div>{{ data?.content }}</div>\r\n <ng-container *ngTemplateOutlet=\"data?.message\"></ng-container>\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons (click)=\"dialogRef.close(false)\" [stroked]=\"true\">\r\n {{ data?.cancelLabel }}\r\n </ecabs-buttons>\r\n\r\n <ecabs-buttons [color]=\"data?.color || color\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-mdc-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-mdc-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}.modal-title.warn{color:var(--color-error)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.MatLegacyDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i3.MatLegacyDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i3.MatLegacyDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i4.ButtonsComponent, selector: "ecabs-buttons", inputs: ["label", "disabled", "loading", "size", "type", "raised", "stroked", "full", "color"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
42
42
|
}
|
|
43
43
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDialogConfirmComponent, decorators: [{
|
|
44
44
|
type: Component,
|
|
@@ -35,7 +35,7 @@ export class EcabsDialogMessageComponent {
|
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
37
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDialogMessageComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
38
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsDialogMessageComponent, selector: "ecabs-dialog-message", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div *ngIf=\"data.title\" class=\"title font-semibold heading--xs\" [ngClass]=\"data?.titleColor || titleColor\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n {{data?.message}}\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons [color]=\"data?.color || color\" [full]=\"data?.isButtonBlock\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-mdc-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-mdc-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host .title.success,:host ::ng-deep .title.success{color:var(--color-success)}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatLegacyDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i3.MatLegacyDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i3.MatLegacyDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i4.ButtonsComponent, selector: "ecabs-buttons", inputs: ["label", "disabled", "loading", "
|
|
38
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: EcabsDialogMessageComponent, selector: "ecabs-dialog-message", ngImport: i0, template: "<div matDialogTitle *ngIf=\"data?.title || !!data?.isPopover\" class=\"flex flex-column\">\r\n <div *ngIf=\"!!data?.isPopover\" class=\"w-full flex justify-end\">\r\n <mat-icon\r\n (click)=\"dialogRef.close(true)\"\r\n class=\"mat-icon material-icons-outlined float-right icon--close mb-2\"\r\n role=\"button\"\r\n >\r\n close\r\n </mat-icon>\r\n </div>\r\n\r\n <div *ngIf=\"data.title\" class=\"title font-semibold heading--xs\" [ngClass]=\"data?.titleColor || titleColor\">\r\n {{ data.title }}\r\n </div>\r\n</div>\r\n\r\n<div mat-dialog-content>\r\n {{data?.message}}\r\n</div>\r\n\r\n<div class=\"pb-6\">\r\n <div mat-dialog-actions class=\"btn__group flex justify-end w-full\" *ngIf=\"!data?.isPopover\">\r\n <ecabs-buttons [color]=\"data?.color || color\" [full]=\"data?.isButtonBlock\" [loading]=\"data.loading$ | async\" (click)=\"closeDialog()\">\r\n {{ data?.confirmLabel }}\r\n </ecabs-buttons>\r\n </div>\r\n</div>\r\n", styles: [":host .mat-mdc-dialog-title .mat-icon.icon--close,:host ::ng-deep .mat-mdc-dialog-title .mat-icon.icon--close{width:20px;height:20px;line-height:20px;font-size:20px}:host .title.success,:host ::ng-deep .title.success{color:var(--color-success)}:host app-buttons,:host ::ng-deep app-buttons{width:calc(50% - .5rem)}:host button,:host ::ng-deep button{width:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatLegacyDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i3.MatLegacyDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i3.MatLegacyDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i4.ButtonsComponent, selector: "ecabs-buttons", inputs: ["label", "disabled", "loading", "size", "type", "raised", "stroked", "full", "color"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
39
39
|
}
|
|
40
40
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EcabsDialogMessageComponent, decorators: [{
|
|
41
41
|
type: Component,
|