i-tech-shared-components 1.1.23 → 1.1.26
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 +54 -51
- package/fesm2022/i-tech-shared-components.mjs.map +1 -1
- package/package.json +13 -14
- package/theme/_flex.scss +92 -0
- package/theme/_label.scss +14 -0
- package/theme/_margin_padding_height_width.scss +143 -0
- package/theme/_material_ovveride.scss +82 -0
- package/theme/_modal_and_cards.scss +56 -0
- package/theme/_texts.scss +87 -0
- package/theme/variables/_desctop_sizes.scss +8 -0
- package/theme.scss +4 -2
- package/esm2022/i-tech-shared-components.mjs +0 -5
- package/esm2022/lib/components/autocomplete-select/autocomplete-select.component.mjs +0 -420
- package/esm2022/lib/components/button/button.component.mjs +0 -122
- package/esm2022/lib/components/clear-value/clear-value.component.mjs +0 -34
- package/esm2022/lib/components/date-picker/date-picker.component.mjs +0 -117
- package/esm2022/lib/components/date-range-datepicker/date-range-datepicker.component.mjs +0 -118
- package/esm2022/lib/components/icon-button/icon-button.component.mjs +0 -49
- package/esm2022/lib/components/menu/menu.component.mjs +0 -51
- package/esm2022/lib/components/text/text-input.component.mjs +0 -73
- package/esm2022/lib/directives/date-mask.directive.mjs +0 -92
- package/esm2022/lib/directives/input-mask.directive.mjs +0 -92
- package/esm2022/lib/interfaces/app-input.interface.mjs +0 -2
- package/esm2022/lib/interfaces/autocomplete-configs.interface.mjs +0 -2
- package/esm2022/lib/interfaces/button-types.enum.mjs +0 -17
- package/esm2022/lib/interfaces/dropdown-selection.constants.mjs +0 -12
- package/esm2022/lib/pipes/array-to-string.pipe.mjs +0 -17
- package/esm2022/lib/pipes/generate-error-messages.pipe.mjs +0 -29
- package/esm2022/lib/pipes/get-value-by-key-from-object.pipe.mjs +0 -45
- package/esm2022/lib/services/input.service.mjs +0 -35
- package/esm2022/public-api.mjs +0 -20
|
@@ -35,10 +35,10 @@ class GenerateErrorMessagesPipe {
|
|
|
35
35
|
'errorMessages.pattern.' + defaultPatternKey : 'errorMessages.' + key;
|
|
36
36
|
return this.translateService.instant(errorMessageKey, translateParams);
|
|
37
37
|
}
|
|
38
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
39
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
38
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: GenerateErrorMessagesPipe, deps: [{ token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
39
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.1.2", ngImport: i0, type: GenerateErrorMessagesPipe, isStandalone: true, name: "generateErrorMessages" }); }
|
|
40
40
|
}
|
|
41
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: GenerateErrorMessagesPipe, decorators: [{
|
|
42
42
|
type: Pipe,
|
|
43
43
|
args: [{
|
|
44
44
|
name: 'generateErrorMessages',
|
|
@@ -51,10 +51,10 @@ class ArrayToStringPipe {
|
|
|
51
51
|
transform(value) {
|
|
52
52
|
return (typeof value === 'string') ? value : value.join(',');
|
|
53
53
|
}
|
|
54
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
55
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
54
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: ArrayToStringPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
55
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.1.2", ngImport: i0, type: ArrayToStringPipe, isStandalone: true, name: "arrayToString" }); }
|
|
56
56
|
}
|
|
57
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
57
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: ArrayToStringPipe, decorators: [{
|
|
58
58
|
type: Pipe,
|
|
59
59
|
args: [{
|
|
60
60
|
name: 'arrayToString',
|
|
@@ -94,10 +94,10 @@ class GetValueByKeyFromObjectPipe {
|
|
|
94
94
|
return ((returnValue !== "undefined") && (returnValue !== null)) ? returnValue : '---';
|
|
95
95
|
}
|
|
96
96
|
}
|
|
97
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
98
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
97
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: GetValueByKeyFromObjectPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
98
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.1.2", ngImport: i0, type: GetValueByKeyFromObjectPipe, isStandalone: true, name: "getValueByKeyFromObject" }); }
|
|
99
99
|
}
|
|
100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: GetValueByKeyFromObjectPipe, decorators: [{
|
|
101
101
|
type: Pipe,
|
|
102
102
|
args: [{
|
|
103
103
|
name: 'getValueByKeyFromObject',
|
|
@@ -127,10 +127,10 @@ class InputService {
|
|
|
127
127
|
}
|
|
128
128
|
throw new Error(`...`);
|
|
129
129
|
}
|
|
130
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
131
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "
|
|
130
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: InputService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
131
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: InputService, providedIn: 'root' }); }
|
|
132
132
|
}
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: InputService, decorators: [{
|
|
134
134
|
type: Injectable,
|
|
135
135
|
args: [{
|
|
136
136
|
providedIn: 'root'
|
|
@@ -190,9 +190,12 @@ class InputMaskDirective {
|
|
|
190
190
|
if (this.inputMask === 'number') {
|
|
191
191
|
return this.checkingForNumbers(value, event, newChar, fromPaste);
|
|
192
192
|
}
|
|
193
|
-
else {
|
|
193
|
+
else if (this.inputMask === 'string') {
|
|
194
194
|
return this.checkingForTexts(value, event);
|
|
195
195
|
}
|
|
196
|
+
else {
|
|
197
|
+
return true;
|
|
198
|
+
}
|
|
196
199
|
}
|
|
197
200
|
checkingForNumbers(value, event, newChar, fromPaste = false) {
|
|
198
201
|
if ((isNaN(this.minimumValue) || this.minimumValue < 0) && value === '-') {
|
|
@@ -222,10 +225,10 @@ class InputMaskDirective {
|
|
|
222
225
|
}
|
|
223
226
|
return true;
|
|
224
227
|
}
|
|
225
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
226
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
228
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: InputMaskDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
229
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.2", type: InputMaskDirective, isStandalone: true, selector: "[inputMask]", inputs: { inputMask: "inputMask", min: "min", max: "max", float: "float" }, host: { listeners: { "paste": "onPaste($event)" } }, ngImport: i0 }); }
|
|
227
230
|
}
|
|
228
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
231
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: InputMaskDirective, decorators: [{
|
|
229
232
|
type: Directive,
|
|
230
233
|
args: [{
|
|
231
234
|
selector: '[inputMask]',
|
|
@@ -255,10 +258,10 @@ class IconButtonComponent {
|
|
|
255
258
|
this.buttonClick.emit();
|
|
256
259
|
}
|
|
257
260
|
}
|
|
258
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
259
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
261
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
262
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: IconButtonComponent, isStandalone: true, selector: "i-tech-icon-button", inputs: { size: "size", type: "type", iconSvg: "iconSvg", iconName: "iconName", tooltip: "tooltip", disabled: "disabled" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<button\n *ngIf=\"['tonal','standard'].includes(type)\"\n mat-icon-button\n [ngClass]=\"{small: size === 'small', tonal: type === 'tonal', standard: type === 'standard'}\"\n [matTooltip]=\"tooltip | translate\"\n [matTooltipDisabled]=\"!tooltip\"\n [disabled]=\"disabled || false\"\n (click)=\"onClick($event)\"\n>\n <mat-icon *ngIf=\"iconSvg\" [svgIcon]=\"iconSvg\"></mat-icon>\n <mat-icon *ngIf=\"iconName\">{{iconName}}</mat-icon>\n</button>\n\n<button\n *ngIf=\"type === 'filled'\"\n mat-fab\n class=\"filled\"\n [ngClass]=\"{small: size === 'small'}\"\n [matTooltip]=\"tooltip | translate\"\n [matTooltipDisabled]=\"!tooltip\"\n [color]=\"'primary'\"\n [disabled]=\"disabled || false\"\n (click)=\"onClick($event)\"\n>\n <mat-icon *ngIf=\"iconSvg\" [svgIcon]=\"iconSvg\"></mat-icon>\n <mat-icon *ngIf=\"iconName\">{{iconName}}</mat-icon>\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: MatFabButton, selector: "button[mat-fab]", inputs: ["extended"], exportAs: ["matButton"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
260
263
|
}
|
|
261
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
264
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
262
265
|
type: Component,
|
|
263
266
|
args: [{ selector: 'i-tech-icon-button', imports: [
|
|
264
267
|
MatIconButton,
|
|
@@ -268,7 +271,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
268
271
|
MatIcon,
|
|
269
272
|
MatFabButton,
|
|
270
273
|
NgIf
|
|
271
|
-
],
|
|
274
|
+
], template: "<button\n *ngIf=\"['tonal','standard'].includes(type)\"\n mat-icon-button\n [ngClass]=\"{small: size === 'small', tonal: type === 'tonal', standard: type === 'standard'}\"\n [matTooltip]=\"tooltip | translate\"\n [matTooltipDisabled]=\"!tooltip\"\n [disabled]=\"disabled || false\"\n (click)=\"onClick($event)\"\n>\n <mat-icon *ngIf=\"iconSvg\" [svgIcon]=\"iconSvg\"></mat-icon>\n <mat-icon *ngIf=\"iconName\">{{iconName}}</mat-icon>\n</button>\n\n<button\n *ngIf=\"type === 'filled'\"\n mat-fab\n class=\"filled\"\n [ngClass]=\"{small: size === 'small'}\"\n [matTooltip]=\"tooltip | translate\"\n [matTooltipDisabled]=\"!tooltip\"\n [color]=\"'primary'\"\n [disabled]=\"disabled || false\"\n (click)=\"onClick($event)\"\n>\n <mat-icon *ngIf=\"iconSvg\" [svgIcon]=\"iconSvg\"></mat-icon>\n <mat-icon *ngIf=\"iconName\">{{iconName}}</mat-icon>\n</button>\n" }]
|
|
272
275
|
}], propDecorators: { size: [{
|
|
273
276
|
type: Input
|
|
274
277
|
}], type: [{
|
|
@@ -316,10 +319,10 @@ class TextInputComponent {
|
|
|
316
319
|
this.ngControl.control.reset();
|
|
317
320
|
}
|
|
318
321
|
}
|
|
319
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
320
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
322
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: TextInputComponent, deps: [{ token: InputService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
323
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: TextInputComponent, isStandalone: true, selector: "i-tech-text-input", inputs: { inputData: "inputData" }, outputs: { focusOutEmitter: "focusOutEmitter" }, ngImport: i0, template: "<div *ngIf=\"inputData && ngControl\">\n <div class=\"w-100\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : inputData.readOnly || ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && inputData.submit)\n }\"\n *ngIf=\"inputData.label\">\n {{ inputData.label | translate }}\n </mat-label>\n <span *ngIf=\"inputData.required\" class=\"required-input\"\n [ngClass]=\"{'readonly-color' : inputData.readOnly || ngControl.control.disabled}\">*</span>\n </div>\n <mat-form-field appearance=\"outline\" class=\"w-100\"\n [class.readonly-field]=\"inputData.readOnly || ngControl.control.disabled\"\n >\n <!-- Leading Icon -->\n <mat-icon *ngIf=\"inputData.iconPrefix\"\n matPrefix\n [ngClass]=\"{\n 'readonly-color' : !inputData.iconPrefixColor &&\n (inputData.readOnly || ngControl.control.disabled),\n 'default-form-icon-color' : !inputData.iconPrefixColor &&\n !(inputData.readOnly || ngControl.control.disabled)\n }\"\n [matTooltip]=\"((inputData.iconPrefixTooltip || '') | translate)\"\n [style.color]=\"inputData.iconPrefixColor || null\"\n >{{ inputData.iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"inputData.iconPrefixSvg\"\n matPrefix\n [matTooltip]=\"((inputData.iconPrefixTooltip || '') | translate)\"\n [svgIcon]=\"inputData.iconPrefixSvg\"\n ></mat-icon>\n\n <!-- Input Field -->\n <input matInput\n *ngIf=\"!inputData.textarea\"\n [type]=\"inputData.type || 'text'\"\n [readonly]=\"inputData.readOnly\"\n [placeholder]=\"(inputData.placeholder || '') | translate\"\n [pattern]=\"inputData.pattern!\"\n [formControl]=\"ngControl.control\"\n [mask]=\"inputData.mask || ''\"\n [ngClass]=\"{'readonly-color readonly-cursor' : inputData.readOnly || ngControl.control.disabled}\"\n [inputMask]=\"inputData.inputMask!\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n (blur)=\"onFocusOut()\"\n >\n\n <textarea matInput\n *ngIf=\"inputData.textarea\"\n [type]=\"inputData.type || 'text'\"\n [readonly]=\"inputData.readOnly\"\n [placeholder]=\"(inputData.placeholder || '') | translate\"\n [pattern]=\"inputData.pattern!\"\n [formControl]=\"ngControl.control\"\n [ngClass]=\"{'readonly-color' : inputData.readOnly || ngControl.control.disabled}\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n ></textarea>\n\n <!-- Clear Icon -->\n <i-tech-icon-button\n *ngIf=\"inputData.clearable\"\n iconName=\"cancel\"\n matSuffix\n [disabled]=\"inputData.readOnly || ngControl.control.disabled || false\"\n [ngClass]=\"inputData.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"clear()\"\n >\n </i-tech-icon-button>\n\n <!-- Trailing Icon -->\n <i-tech-icon-button\n *ngIf=\"inputData.iconSuffix\"\n [iconName]=\"inputData.iconSuffix\"\n [disabled]=\"inputData.readOnly || ngControl.control.disabled || false\"\n [ngClass]=\"inputData.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n matSuffix\n >\n </i-tech-icon-button>\n\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && inputData.submit)\">\n {{ ngControl.control | generateErrorMessages : (inputData.label || '') : inputData.defaultPatternKey }}\n </mat-error>\n\n <!-- Helper Text -->\n <mat-hint *ngIf=\"!(!!(ngControl.control.errors && inputData.submit)) && inputData.hint\">\n {{ inputData.hint | translate }}\n </mat-hint>\n </mat-form-field>\n</div>\n", dependencies: [{ kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "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.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: GenerateErrorMessagesPipe, name: "generateErrorMessages" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled"], outputs: ["buttonClick"] }, { kind: "directive", type: InputMaskDirective, selector: "[inputMask]", inputs: ["inputMask", "min", "max", "float"] }, { kind: "directive", type: NgxMaskDirective, selector: "input[mask], textarea[mask]", inputs: ["mask", "specialCharacters", "patterns", "prefix", "suffix", "thousandSeparator", "decimalMarker", "dropSpecialCharacters", "hiddenInput", "showMaskTyped", "placeHolderCharacter", "shownMaskExpression", "clearIfNotMatch", "validation", "separatorLimit", "allowNegativeNumbers", "leadZeroDateTime", "leadZero", "triggerOnMaskChange", "apm", "inputTransformFn", "outputTransformFn", "keepCharacterPositions", "instantPrefix"], outputs: ["maskFilled"], exportAs: ["mask", "ngxMask"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }] }); }
|
|
321
324
|
}
|
|
322
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
325
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: TextInputComponent, decorators: [{
|
|
323
326
|
type: Component,
|
|
324
327
|
args: [{ selector: 'i-tech-text-input', imports: [
|
|
325
328
|
TranslateModule,
|
|
@@ -334,7 +337,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
334
337
|
InputMaskDirective,
|
|
335
338
|
NgxMaskDirective,
|
|
336
339
|
MatFormFieldModule
|
|
337
|
-
],
|
|
340
|
+
], template: "<div *ngIf=\"inputData && ngControl\">\n <div class=\"w-100\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : inputData.readOnly || ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && inputData.submit)\n }\"\n *ngIf=\"inputData.label\">\n {{ inputData.label | translate }}\n </mat-label>\n <span *ngIf=\"inputData.required\" class=\"required-input\"\n [ngClass]=\"{'readonly-color' : inputData.readOnly || ngControl.control.disabled}\">*</span>\n </div>\n <mat-form-field appearance=\"outline\" class=\"w-100\"\n [class.readonly-field]=\"inputData.readOnly || ngControl.control.disabled\"\n >\n <!-- Leading Icon -->\n <mat-icon *ngIf=\"inputData.iconPrefix\"\n matPrefix\n [ngClass]=\"{\n 'readonly-color' : !inputData.iconPrefixColor &&\n (inputData.readOnly || ngControl.control.disabled),\n 'default-form-icon-color' : !inputData.iconPrefixColor &&\n !(inputData.readOnly || ngControl.control.disabled)\n }\"\n [matTooltip]=\"((inputData.iconPrefixTooltip || '') | translate)\"\n [style.color]=\"inputData.iconPrefixColor || null\"\n >{{ inputData.iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"inputData.iconPrefixSvg\"\n matPrefix\n [matTooltip]=\"((inputData.iconPrefixTooltip || '') | translate)\"\n [svgIcon]=\"inputData.iconPrefixSvg\"\n ></mat-icon>\n\n <!-- Input Field -->\n <input matInput\n *ngIf=\"!inputData.textarea\"\n [type]=\"inputData.type || 'text'\"\n [readonly]=\"inputData.readOnly\"\n [placeholder]=\"(inputData.placeholder || '') | translate\"\n [pattern]=\"inputData.pattern!\"\n [formControl]=\"ngControl.control\"\n [mask]=\"inputData.mask || ''\"\n [ngClass]=\"{'readonly-color readonly-cursor' : inputData.readOnly || ngControl.control.disabled}\"\n [inputMask]=\"inputData.inputMask!\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n (blur)=\"onFocusOut()\"\n >\n\n <textarea matInput\n *ngIf=\"inputData.textarea\"\n [type]=\"inputData.type || 'text'\"\n [readonly]=\"inputData.readOnly\"\n [placeholder]=\"(inputData.placeholder || '') | translate\"\n [pattern]=\"inputData.pattern!\"\n [formControl]=\"ngControl.control\"\n [ngClass]=\"{'readonly-color' : inputData.readOnly || ngControl.control.disabled}\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n ></textarea>\n\n <!-- Clear Icon -->\n <i-tech-icon-button\n *ngIf=\"inputData.clearable\"\n iconName=\"cancel\"\n matSuffix\n [disabled]=\"inputData.readOnly || ngControl.control.disabled || false\"\n [ngClass]=\"inputData.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"clear()\"\n >\n </i-tech-icon-button>\n\n <!-- Trailing Icon -->\n <i-tech-icon-button\n *ngIf=\"inputData.iconSuffix\"\n [iconName]=\"inputData.iconSuffix\"\n [disabled]=\"inputData.readOnly || ngControl.control.disabled || false\"\n [ngClass]=\"inputData.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n matSuffix\n >\n </i-tech-icon-button>\n\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && inputData.submit)\">\n {{ ngControl.control | generateErrorMessages : (inputData.label || '') : inputData.defaultPatternKey }}\n </mat-error>\n\n <!-- Helper Text -->\n <mat-hint *ngIf=\"!(!!(ngControl.control.errors && inputData.submit)) && inputData.hint\">\n {{ inputData.hint | translate }}\n </mat-hint>\n </mat-form-field>\n</div>\n" }]
|
|
338
341
|
}], ctorParameters: () => [{ type: InputService }], propDecorators: { inputData: [{
|
|
339
342
|
type: Input
|
|
340
343
|
}], focusOutEmitter: [{
|
|
@@ -405,17 +408,17 @@ class ButtonComponent {
|
|
|
405
408
|
this.buttonClick.emit();
|
|
406
409
|
}
|
|
407
410
|
}
|
|
408
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
409
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
411
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
412
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: ButtonComponent, isStandalone: true, selector: "i-tech-button", inputs: { text: "text", data_cy: "data_cy", fontIcon: "fontIcon", svgIcon: "svgIcon", type: "type", customClass: "customClass", submit: "submit", disabled: "disabled", activated: "activated", color: "color" }, outputs: { buttonClick: "buttonClick" }, providers: [
|
|
410
413
|
NgxMaskDirective,
|
|
411
414
|
NgxMaskPipe,
|
|
412
415
|
TranslatePipe,
|
|
413
416
|
TranslateService
|
|
414
417
|
], ngImport: i0, template: "<button *ngIf=\"[ButtonType.FILLED,ButtonType.WARNING].includes(type)\"\n mat-flat-button\n [attr.data-cy]=\"data_cy\"\n [color]=\"type === ButtonType.WARNING ? 'warn' : color\"\n [class.activated]=\"activated\"\n [ngClass]=\"(customClass || '')\"\n [disabled]=\"disabled || submit\"\n (click)=\"onClick($event)\"\n>\n <span *ngIf=\"submit\" class=\"spinner-overlay\">\n <mat-spinner diameter=\"16\"></mat-spinner>\n </span>\n <mat-icon *ngIf=\"fontIcon && !submit\">{{fontIcon}}</mat-icon>\n <mat-icon *ngIf=\"svgIcon && !submit\" [svgIcon]=\"svgIcon\"></mat-icon>\n <span>{{text | translate}}</span>\n</button>\n<button *ngIf=\"[ButtonType.TONAL,ButtonType.TEXT].includes(type)\"\n mat-button\n [attr.data-cy]=\"data_cy\"\n [ngClass]=\"(type === ButtonType.TONAL ? 'tertiary ' : '') + (customClass || '')\"\n [class.activated]=\"activated\"\n [disabled]=\"disabled || submit\"\n (click)=\"onClick($event)\"\n>\n <span *ngIf=\"submit\" class=\"spinner-overlay\">\n <mat-spinner diameter=\"16\"></mat-spinner>\n </span>\n <mat-icon *ngIf=\"fontIcon && !submit\">{{fontIcon}}</mat-icon>\n <mat-icon *ngIf=\"svgIcon && !submit\" [svgIcon]=\"svgIcon\"></mat-icon>\n\n <span>{{text | translate}}</span>\n</button>\n<button *ngIf=\"type === ButtonType.OUTLINE\"\n [color]=\"color\"\n mat-stroked-button\n [attr.data-cy]=\"data_cy\"\n [ngClass]=\"(customClass || '') \"\n [disabled]=\"disabled || submit\"\n (click)=\"onClick($event)\"\n [class.activated]=\"activated\"\n>\n <span *ngIf=\"submit\" class=\"spinner-overlay\">\n <mat-spinner diameter=\"16\"></mat-spinner>\n </span>\n <mat-icon *ngIf=\"fontIcon && !submit\" >{{fontIcon}}</mat-icon>\n <mat-icon *ngIf=\"svgIcon && !submit\" [svgIcon]=\"svgIcon\"></mat-icon>\n <span>{{text | translate}}</span>\n</button>\n", styles: [""], dependencies: [{ kind: "component", type: MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] }); }
|
|
415
418
|
}
|
|
416
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
419
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
417
420
|
type: Component,
|
|
418
|
-
args: [{ selector: 'i-tech-button',
|
|
421
|
+
args: [{ selector: 'i-tech-button', imports: [
|
|
419
422
|
MatButton,
|
|
420
423
|
NgClass,
|
|
421
424
|
MatProgressSpinner,
|
|
@@ -456,15 +459,15 @@ class ClearValueComponent {
|
|
|
456
459
|
constructor() {
|
|
457
460
|
this.resetValue = new EventEmitter();
|
|
458
461
|
}
|
|
459
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
460
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
462
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: ClearValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
463
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: ClearValueComponent, isStandalone: true, selector: "i-tech-clear-value", inputs: { className: "className", additionalClass: "additionalClass" }, outputs: { resetValue: "resetValue" }, ngImport: i0, template: `<img
|
|
461
464
|
class="pointer"
|
|
462
465
|
[ngClass]="className || 'standard'"
|
|
463
466
|
(click)="resetValue.emit()"
|
|
464
467
|
ngSrc="./ic_close.svg"
|
|
465
468
|
height="24" width="24" alt=""/>`, isInline: true, styles: ["img{position:absolute;width:15px;height:15px}.big{width:25px;height:25px}.range_date{right:-65px;top:15px}.standard{right:-20px;top:40px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }] }); }
|
|
466
469
|
}
|
|
467
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
470
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: ClearValueComponent, decorators: [{
|
|
468
471
|
type: Component,
|
|
469
472
|
args: [{ selector: 'i-tech-clear-value', template: `<img
|
|
470
473
|
class="pointer"
|
|
@@ -474,7 +477,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
474
477
|
height="24" width="24" alt=""/>`, imports: [
|
|
475
478
|
NgClass,
|
|
476
479
|
NgOptimizedImage
|
|
477
|
-
],
|
|
480
|
+
], styles: ["img{position:absolute;width:15px;height:15px}.big{width:25px;height:25px}.range_date{right:-65px;top:15px}.standard{right:-20px;top:40px}\n"] }]
|
|
478
481
|
}], propDecorators: { className: [{
|
|
479
482
|
type: Input
|
|
480
483
|
}], additionalClass: [{
|
|
@@ -832,10 +835,10 @@ class AutocompleteSelectComponent {
|
|
|
832
835
|
matSelect.open();
|
|
833
836
|
searchInput?.nativeElement?.focus();
|
|
834
837
|
}
|
|
835
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
836
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AutocompleteSelectComponent, isStandalone: true, selector: "i-tech-autocomplete-select", inputs: { className: "className", submitValue: "submitValue", configs: "configs", detectChanges: "detectChanges" }, outputs: { selectionChange: "selectionChange", emitAction: "emitAction" }, host: { listeners: { "document:visibilitychange": "handleVisibilityChange()" } }, viewQueries: [{ propertyName: "matSelect", first: true, predicate: ["matSelect"], descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "allSelected", first: true, predicate: ["allSelected"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"new-mat-autocomplete\" id=\"mat_autocomplete\"\n [ngClass]=\"{\n 'mat-select-without_icon': !selectConfig.iconUrl && !selectConfig.activeStateIconUrl,\n 'mat-select-with-search': selectConfig.search,\n 'without-label': selectConfig.hideLabel,\n 'invalid_field': ngControl.control.errors && submitValue,\n 'readonly-field': selectConfig.readOnly || ngControl.control.disabled\n }\"\n [matTooltip]=\"(selectConfig.hover && !ngControl.control.disabled ? ((selectConfig.hover || '') | translate) : '')\"\n [matTooltipClass]=\"'mat-mdc-tooltip big-td-mat-tooltip'\"\n [matTooltipPosition]=\"'above'\"\n *ngIf=\"selectConfig && ngControl\">\n\n <div class=\"w-100\" *ngIf=\"!selectConfig.hideLabel\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : selectConfig.readOnly || ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && submitValue)\n }\">\n {{ selectConfig.label | translate }}\n </mat-label>\n <span *ngIf=\"selectConfig.required\" class=\"required-input\"\n [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\">*</span>\n </div>\n\n\n <!-- Search Input -->\n <div class=\"search-input w-100\"\n (click)=\"$event.stopPropagation();$event.preventDefault()\"\n [ngClass]=\"{ hide_input_placeholder: showPlaceholder || ngControl.control.disabled }\"\n *ngIf=\"selectConfig.search\"\n >\n <input autocomplete=\"off\"\n id=\"searchInput\"\n type=\"text\"\n [ngClass]=\"{'pr-25': !selectConfig.iconUrl}\"\n #searchInput\n [disabled]=\"ngControl.control.disabled || selectConfig.hover\"\n [placeholder]=\"(ngControl.control.disabled || selectConfig.hover) ? '' : 'Search'\"\n (focusout)=\"inputFocusOut()\"\n (focus)=\"openSelection()\"\n (keydown)=\"$event.stopPropagation()\"\n (keyup)=\"getDataWithSearch(searchInput.value,$event)\">\n\n <!-- Search Icon -->\n <span class=\"search-icon\">\n <i-tech-icon-button\n class=\"mr-10\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color'\n : 'default-form-icon-color'\"\n *ngIf=\"selectConfig.iconPrefix && !showPlaceholder\"\n [iconName]=\"selectConfig.iconPrefix || ''\"\n [disabled]=\"selectConfig.readOnly || false\"\n matPrefix\n >\n </i-tech-icon-button>\n </span>\n </div>\n\n <!-- Placeholder/Selected Value Display -->\n <ng-container *ngIf=\"showPlaceholder && selectConfig.search\">\n <div class=\"custom-placeholder\"\n *ngIf=\"(!ngControl?.value && !ngControl?.value?.length) ||\n (selectConfig.multiple && ngControl?.value && !ngControl?.value?.length)\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n >\n {{ ((selectConfig.placeholder || '') | translate) }}\n </div>\n <div class=\"custom-placeholder custom-value ellipsis\"\n [ngClass]=\"{\n 'pr-42': selectConfig.iconUrl,\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n *ngIf=\"ngControl?.value\"\n >\n {{ selectConfig?.multiple ? (ngControl.value | arrayToString) : showingValue }}\n </div>\n </ng-container>\n\n <!-- Custom Icon -->\n <img class=\"left_icon_new pointer\"\n alt=\"Toggle Selection\"\n (click)=\"iconClick(matSelect, searchInput)\"\n *ngIf=\"!selectConfig.matIconName && (selectConfig.iconUrl || selectConfig.activeStateIconUrl)\"\n [src]=\"'assets/images/icons/global/' + (ngControl.control?.value && selectConfig?.activeStateIconUrl ?\n selectConfig.activeStateIconUrl\n : selectConfig.iconUrl)\">\n\n <mat-form-field appearance=\"outline\" class=\"w-100\" (click)=\"selectConfig?.search ? focusSearchInput() : null\">\n <!-- Material Select -->\n <mat-select #matSelect=\"matSelect\"\n [panelClass]=\"'autocomplete-transform-panel-location'\"\n [attr.aria-placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [aria-label]=\"selectConfig.label | translate\"\n [id]=\"selectConfig.filtrationKey || ''\"\n (opened)=\"registerPanelScrollEvent(matSelect)\"\n (openedChange)=\"openedChange($event)\"\n [formControl]=\"ngControl.control\"\n [multiple]=\"selectConfig.multiple\"\n (selectionChange)=\"emitSelectionChangeAndClose($event)\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [disabled]=\"ngControl.control.disabled\"\n >\n\n <!-- Loading State -->\n <mat-option *ngIf=\"pending\" class=\"option_loading relative\">\n <div class=\"request_loading\">\n <img ngSrc=\"./loader.svg\" alt=\"\" height=\"200\" width=\"200\"/>\n </div>\n </mat-option>\n\n <!-- Options -->\n <ng-container *ngIf=\"data?.length && !pending\">\n <!-- Add New Option -->\n <mat-option *ngIf=\"selectConfig.actions\"\n class=\"pointer add_new\"\n disabled\n (click)=\"closePanelAndUnsetFocus();addNewItemEvent()\">\n <!--(click)=\"ngControl.control.reset(null);\n matSelect._onBlur();closePanelAndUnsetFocus();addNewItemEvent()\">-->\n <i-tech-button\n [type]=\"ButtonType.OUTLINE\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \"\n [customClass]=\"'w-100 mat-autocomplete-select-button'\">\n </i-tech-button>\n </mat-option>\n\n <!-- Regular Options -->\n <ng-container *ngIf=\"!selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\">\n {{\n ((selectConfig.valueToShowByKey | getValueByKeyFromObject\n : item : selectConfig.valueToShowByParam : selectConfig.withParamSymbol) || '') | translate\n }}\n </mat-option>\n </ng-container>\n\n <!-- Custom Text Options -->\n <ng-container *ngIf=\"selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\"\n [disabled]=\"selectConfig?.changeText[item].disabled\">\n {{ selectConfig?.changeText[item].text | translate }}\n </mat-option>\n </ng-container>\n </ng-container>\n\n <!-- Empty State -->\n <ng-container *ngIf=\"!pending && !data.length\">\n <mat-option disabled class=\"empty_selection_state\">\n <div class=\"actions_and_tile add_new flex_column w-100 flex_center_align_center\">\n <span>{{ 'dropdown_no_items' | translate }}</span>\n <div class=\"mt-10\">\n <i-tech-button\n *ngIf=\"selectConfig?.actions\"\n [type]=\"ButtonType.OUTLINE\"\n (buttonClick)=\"closePanelAndUnsetFocus();addNewItemEvent()\"\n [customClass]=\"'mat-autocomplete-select-button'\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \">\n </i-tech-button>\n </div>\n </div>\n </mat-option>\n </ng-container>\n </mat-select>\n <mat-icon *ngIf=\"selectConfig.iconPrefix\"\n matPrefix\n [ngClass]=\"{\n 'readonly-color' : !selectConfig['iconPrefixColor']\n && (selectConfig.readOnly || ngControl.control.disabled),\n 'default-form-icon-color' : !selectConfig['iconPrefixColor']\n && !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n >{{ selectConfig.iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"selectConfig['iconPrefixSvg']\"\n matPrefix\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n [svgIcon]=\"selectConfig['iconPrefixSvg'] || ''\"\n ></mat-icon>\n\n <i-tech-icon-button\n *ngIf=\"selectConfig.search && selectConfig.clearable && !ngControl.control.disabled && !!ngControl.control.value\"\n iconName=\"cancel\"\n matSuffix\n [disabled]=\"selectConfig.readOnly || false\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"\n $event.stopPropagation();\n $event.preventDefault();\n ngControl.control.reset(null);\n matSelect._onBlur();\n closePanelAndUnsetFocus()\n \"\n >\n </i-tech-icon-button>\n <mat-icon\n matSuffix\n class=\"select-arrow\"\n [class.open]=\"matSelect.panelOpen\"\n [ngClass]=\"{\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled),\n 'mt-8': !!ngControl.control.value && selectConfig.clearable\n }\"\n >\n keyboard_arrow_down\n </mat-icon>\n <!-- Error Message -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submitValue)\">\n {{ ngControl.control | generateErrorMessages : selectConfig.label : selectConfig.defaultPatternKey }}\n </mat-error>\n </mat-form-field>\n\n <!-- Reset Button -->\n <i-tech-clear-value *ngIf=\"selectConfig.reset\" (resetValue)=\"resetValue()\"></i-tech-clear-value>\n</div>\n", styles: [".left_icon_new{position:absolute;right:2px;top:1px}::ng-deep .request_loading{width:40px;height:40px;background-color:#fff!important}::ng-deep .request_loading:hover{background-color:var(--primary99)!important}::ng-deep .request_loading:focus{background-color:var(--primary99)!important}::ng-deep .request_loading img{position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%)}::ng-deep .mat-mdc-option.add_new{opacity:1!important;pointer-events:auto!important}::ng-deep .mat-mdc-option.add_new .mat-pseudo-checkbox{display:none!important}::ng-deep .mat-mdc-option.add_new .mdc-list-item__primary-text{display:inline-block!important;width:100%!important}::ng-deep .mat-mdc-option.add_new span{color:unset!important;font-size:unset!important;margin:unset!important;opacity:1!important}@media (min-width: 1920px) and (max-width: 2500px){.mat-autocomplete{height:90px!important}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSelectModule }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i6.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: ButtonComponent, selector: "i-tech-button", inputs: ["text", "data_cy", "fontIcon", "svgIcon", "type", "customClass", "submit", "disabled", "activated", "color"], outputs: ["buttonClick"] }, { kind: "pipe", type: GetValueByKeyFromObjectPipe, name: "getValueByKeyFromObject" }, { kind: "pipe", type: ArrayToStringPipe, name: "arrayToString" }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: GenerateErrorMessagesPipe, name: "generateErrorMessages" }, { kind: "component", type: ClearValueComponent, selector: "i-tech-clear-value", inputs: ["className", "additionalClass"], outputs: ["resetValue"] }, { kind: "ngmodule", type: MatFormFieldModule }] }); }
|
|
838
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: AutocompleteSelectComponent, deps: [{ token: InputService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
839
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: AutocompleteSelectComponent, isStandalone: true, selector: "i-tech-autocomplete-select", inputs: { className: "className", submitValue: "submitValue", configs: "configs", detectChanges: "detectChanges" }, outputs: { selectionChange: "selectionChange", emitAction: "emitAction" }, host: { listeners: { "document:visibilitychange": "handleVisibilityChange()" } }, viewQueries: [{ propertyName: "matSelect", first: true, predicate: ["matSelect"], descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }, { propertyName: "allSelected", first: true, predicate: ["allSelected"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"new-mat-autocomplete\" id=\"mat_autocomplete\"\n [ngClass]=\"{\n 'mat-select-without_icon': !selectConfig.iconUrl && !selectConfig.activeStateIconUrl,\n 'mat-select-with-search': selectConfig.search,\n 'without-label': selectConfig.hideLabel,\n 'invalid_field': ngControl.control.errors && submitValue,\n 'readonly-field': selectConfig.readOnly || ngControl.control.disabled\n }\"\n [matTooltip]=\"(selectConfig.hover && !ngControl.control.disabled ? ((selectConfig.hover || '') | translate) : '')\"\n [matTooltipClass]=\"'mat-mdc-tooltip big-td-mat-tooltip'\"\n [matTooltipPosition]=\"'above'\"\n *ngIf=\"selectConfig && ngControl\">\n\n <div class=\"w-100\" *ngIf=\"!selectConfig.hideLabel\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : selectConfig.readOnly || ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && submitValue)\n }\">\n {{ selectConfig.label | translate }}\n </mat-label>\n <span *ngIf=\"selectConfig.required\" class=\"required-input\"\n [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\">*</span>\n </div>\n\n\n <!-- Search Input -->\n <div class=\"search-input w-100\"\n (click)=\"$event.stopPropagation();$event.preventDefault()\"\n [ngClass]=\"{ hide_input_placeholder: showPlaceholder || ngControl.control.disabled }\"\n *ngIf=\"selectConfig.search\"\n >\n <input autocomplete=\"off\"\n id=\"searchInput\"\n type=\"text\"\n [ngClass]=\"{'pr-25': !selectConfig.iconUrl}\"\n #searchInput\n [disabled]=\"ngControl.control.disabled || selectConfig.hover\"\n [placeholder]=\"(ngControl.control.disabled || selectConfig.hover) ? '' : 'Search'\"\n (focusout)=\"inputFocusOut()\"\n (focus)=\"openSelection()\"\n (keydown)=\"$event.stopPropagation()\"\n (keyup)=\"getDataWithSearch(searchInput.value,$event)\">\n\n <!-- Search Icon -->\n <span class=\"search-icon\">\n <i-tech-icon-button\n class=\"mr-10\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color'\n : 'default-form-icon-color'\"\n *ngIf=\"selectConfig.iconPrefix && !showPlaceholder\"\n [iconName]=\"selectConfig.iconPrefix || ''\"\n [disabled]=\"selectConfig.readOnly || false\"\n matPrefix\n >\n </i-tech-icon-button>\n </span>\n </div>\n\n <!-- Placeholder/Selected Value Display -->\n <ng-container *ngIf=\"showPlaceholder && selectConfig.search\">\n <div class=\"custom-placeholder\"\n *ngIf=\"(!ngControl?.value && !ngControl?.value?.length) ||\n (selectConfig.multiple && ngControl?.value && !ngControl?.value?.length)\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n >\n {{ ((selectConfig.placeholder || '') | translate) }}\n </div>\n <div class=\"custom-placeholder custom-value ellipsis\"\n [ngClass]=\"{\n 'pr-42': selectConfig.iconUrl,\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n *ngIf=\"ngControl?.value\"\n >\n {{ selectConfig?.multiple ? (ngControl.value | arrayToString) : showingValue }}\n </div>\n </ng-container>\n\n <!-- Custom Icon -->\n <img class=\"left_icon_new pointer\"\n alt=\"Toggle Selection\"\n (click)=\"iconClick(matSelect, searchInput)\"\n *ngIf=\"!selectConfig.matIconName && (selectConfig.iconUrl || selectConfig.activeStateIconUrl)\"\n [src]=\"'assets/images/icons/global/' + (ngControl.control?.value && selectConfig?.activeStateIconUrl ?\n selectConfig.activeStateIconUrl\n : selectConfig.iconUrl)\">\n\n <mat-form-field appearance=\"outline\" class=\"w-100\" (click)=\"selectConfig?.search ? focusSearchInput() : null\">\n <!-- Material Select -->\n <mat-select #matSelect=\"matSelect\"\n [panelClass]=\"'autocomplete-transform-panel-location'\"\n [attr.aria-placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [aria-label]=\"selectConfig.label | translate\"\n [id]=\"selectConfig.filtrationKey || ''\"\n (opened)=\"registerPanelScrollEvent(matSelect)\"\n (openedChange)=\"openedChange($event)\"\n [formControl]=\"ngControl.control\"\n [multiple]=\"selectConfig.multiple\"\n (selectionChange)=\"emitSelectionChangeAndClose($event)\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [disabled]=\"ngControl.control.disabled\"\n >\n\n <!-- Loading State -->\n <mat-option *ngIf=\"pending\" class=\"option_loading relative\">\n <div class=\"request_loading\">\n <img ngSrc=\"./loader.svg\" alt=\"\" height=\"200\" width=\"200\"/>\n </div>\n </mat-option>\n\n <!-- Options -->\n <ng-container *ngIf=\"data?.length && !pending\">\n <!-- Add New Option -->\n <mat-option *ngIf=\"selectConfig.actions\"\n class=\"pointer add_new\"\n disabled\n (click)=\"closePanelAndUnsetFocus();addNewItemEvent()\">\n <!--(click)=\"ngControl.control.reset(null);\n matSelect._onBlur();closePanelAndUnsetFocus();addNewItemEvent()\">-->\n <i-tech-button\n [type]=\"ButtonType.OUTLINE\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \"\n [customClass]=\"'w-100 mat-autocomplete-select-button'\">\n </i-tech-button>\n </mat-option>\n\n <!-- Regular Options -->\n <ng-container *ngIf=\"!selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\">\n {{\n ((selectConfig.valueToShowByKey | getValueByKeyFromObject\n : item : selectConfig.valueToShowByParam : selectConfig.withParamSymbol) || '') | translate\n }}\n </mat-option>\n </ng-container>\n\n <!-- Custom Text Options -->\n <ng-container *ngIf=\"selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\"\n [disabled]=\"selectConfig?.changeText[item].disabled\">\n {{ selectConfig?.changeText[item].text | translate }}\n </mat-option>\n </ng-container>\n </ng-container>\n\n <!-- Empty State -->\n <ng-container *ngIf=\"!pending && !data.length\">\n <mat-option disabled class=\"empty_selection_state\">\n <div class=\"actions_and_tile add_new flex_column w-100 flex_center_align_center\">\n <span>{{ 'dropdown_no_items' | translate }}</span>\n <div class=\"mt-10\">\n <i-tech-button\n *ngIf=\"selectConfig?.actions\"\n [type]=\"ButtonType.OUTLINE\"\n (buttonClick)=\"closePanelAndUnsetFocus();addNewItemEvent()\"\n [customClass]=\"'mat-autocomplete-select-button'\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \">\n </i-tech-button>\n </div>\n </div>\n </mat-option>\n </ng-container>\n </mat-select>\n <mat-icon *ngIf=\"selectConfig.iconPrefix\"\n matPrefix\n [ngClass]=\"{\n 'readonly-color' : !selectConfig['iconPrefixColor']\n && (selectConfig.readOnly || ngControl.control.disabled),\n 'default-form-icon-color' : !selectConfig['iconPrefixColor']\n && !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n >{{ selectConfig.iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"selectConfig['iconPrefixSvg']\"\n matPrefix\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n [svgIcon]=\"selectConfig['iconPrefixSvg'] || ''\"\n ></mat-icon>\n\n <i-tech-icon-button\n *ngIf=\"selectConfig.search && selectConfig.clearable && !ngControl.control.disabled && !!ngControl.control.value\"\n iconName=\"cancel\"\n matSuffix\n [disabled]=\"selectConfig.readOnly || false\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"\n $event.stopPropagation();\n $event.preventDefault();\n ngControl.control.reset(null);\n matSelect._onBlur();\n closePanelAndUnsetFocus()\n \"\n >\n </i-tech-icon-button>\n <mat-icon\n matSuffix\n class=\"select-arrow\"\n [class.open]=\"matSelect.panelOpen\"\n [ngClass]=\"{\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled),\n 'mt-8': !!ngControl.control.value && selectConfig.clearable\n }\"\n >\n keyboard_arrow_down\n </mat-icon>\n <!-- Error Message -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submitValue)\">\n {{ ngControl.control | generateErrorMessages : selectConfig.label : selectConfig.defaultPatternKey }}\n </mat-error>\n </mat-form-field>\n\n <!-- Reset Button -->\n <i-tech-clear-value *ngIf=\"selectConfig.reset\" (resetValue)=\"resetValue()\"></i-tech-clear-value>\n</div>\n", styles: [".left_icon_new{position:absolute;right:2px;top:1px}::ng-deep .request_loading{width:40px;height:40px;background-color:#fff!important}::ng-deep .request_loading:hover{background-color:var(--primary99)!important}::ng-deep .request_loading:focus{background-color:var(--primary99)!important}::ng-deep .request_loading img{position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%)}::ng-deep .mat-mdc-option.add_new{opacity:1!important;pointer-events:auto!important}::ng-deep .mat-mdc-option.add_new .mat-pseudo-checkbox{display:none!important}::ng-deep .mat-mdc-option.add_new .mdc-list-item__primary-text{display:inline-block!important;width:100%!important}::ng-deep .mat-mdc-option.add_new span{color:unset!important;font-size:unset!important;margin:unset!important;opacity:1!important}@media (min-width: 1920px) and (max-width: 2500px){.mat-autocomplete{height:90px!important}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled"], outputs: ["buttonClick"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatSelectModule }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i5.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i6.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: ButtonComponent, selector: "i-tech-button", inputs: ["text", "data_cy", "fontIcon", "svgIcon", "type", "customClass", "submit", "disabled", "activated", "color"], outputs: ["buttonClick"] }, { kind: "pipe", type: GetValueByKeyFromObjectPipe, name: "getValueByKeyFromObject" }, { kind: "pipe", type: ArrayToStringPipe, name: "arrayToString" }, { kind: "directive", type: NgOptimizedImage, selector: "img[ngSrc]", inputs: ["ngSrc", "ngSrcset", "sizes", "width", "height", "loading", "priority", "loaderParams", "disableOptimizedSrcset", "fill", "placeholder", "placeholderConfig", "src", "srcset"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: GenerateErrorMessagesPipe, name: "generateErrorMessages" }, { kind: "component", type: ClearValueComponent, selector: "i-tech-clear-value", inputs: ["className", "additionalClass"], outputs: ["resetValue"] }, { kind: "ngmodule", type: MatFormFieldModule }] }); }
|
|
837
840
|
}
|
|
838
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
841
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: AutocompleteSelectComponent, decorators: [{
|
|
839
842
|
type: Component,
|
|
840
843
|
args: [{ selector: 'i-tech-autocomplete-select', imports: [
|
|
841
844
|
NgClass,
|
|
@@ -854,7 +857,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
854
857
|
GenerateErrorMessagesPipe,
|
|
855
858
|
ClearValueComponent,
|
|
856
859
|
MatFormFieldModule
|
|
857
|
-
], standalone: true, template: "<div class=\"new-mat-autocomplete\" id=\"mat_autocomplete\"\n [ngClass]=\"{\n 'mat-select-without_icon': !selectConfig.iconUrl && !selectConfig.activeStateIconUrl,\n 'mat-select-with-search': selectConfig.search,\n 'without-label': selectConfig.hideLabel,\n 'invalid_field': ngControl.control.errors && submitValue,\n 'readonly-field': selectConfig.readOnly || ngControl.control.disabled\n }\"\n [matTooltip]=\"(selectConfig.hover && !ngControl.control.disabled ? ((selectConfig.hover || '') | translate) : '')\"\n [matTooltipClass]=\"'mat-mdc-tooltip big-td-mat-tooltip'\"\n [matTooltipPosition]=\"'above'\"\n *ngIf=\"selectConfig && ngControl\">\n\n <div class=\"w-100\" *ngIf=\"!selectConfig.hideLabel\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : selectConfig.readOnly || ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && submitValue)\n }\">\n {{ selectConfig.label | translate }}\n </mat-label>\n <span *ngIf=\"selectConfig.required\" class=\"required-input\"\n [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\">*</span>\n </div>\n\n\n <!-- Search Input -->\n <div class=\"search-input w-100\"\n (click)=\"$event.stopPropagation();$event.preventDefault()\"\n [ngClass]=\"{ hide_input_placeholder: showPlaceholder || ngControl.control.disabled }\"\n *ngIf=\"selectConfig.search\"\n >\n <input autocomplete=\"off\"\n id=\"searchInput\"\n type=\"text\"\n [ngClass]=\"{'pr-25': !selectConfig.iconUrl}\"\n #searchInput\n [disabled]=\"ngControl.control.disabled || selectConfig.hover\"\n [placeholder]=\"(ngControl.control.disabled || selectConfig.hover) ? '' : 'Search'\"\n (focusout)=\"inputFocusOut()\"\n (focus)=\"openSelection()\"\n (keydown)=\"$event.stopPropagation()\"\n (keyup)=\"getDataWithSearch(searchInput.value,$event)\">\n\n <!-- Search Icon -->\n <span class=\"search-icon\">\n <i-tech-icon-button\n class=\"mr-10\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color'\n : 'default-form-icon-color'\"\n *ngIf=\"selectConfig.iconPrefix && !showPlaceholder\"\n [iconName]=\"selectConfig.iconPrefix || ''\"\n [disabled]=\"selectConfig.readOnly || false\"\n matPrefix\n >\n </i-tech-icon-button>\n </span>\n </div>\n\n <!-- Placeholder/Selected Value Display -->\n <ng-container *ngIf=\"showPlaceholder && selectConfig.search\">\n <div class=\"custom-placeholder\"\n *ngIf=\"(!ngControl?.value && !ngControl?.value?.length) ||\n (selectConfig.multiple && ngControl?.value && !ngControl?.value?.length)\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n >\n {{ ((selectConfig.placeholder || '') | translate) }}\n </div>\n <div class=\"custom-placeholder custom-value ellipsis\"\n [ngClass]=\"{\n 'pr-42': selectConfig.iconUrl,\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n *ngIf=\"ngControl?.value\"\n >\n {{ selectConfig?.multiple ? (ngControl.value | arrayToString) : showingValue }}\n </div>\n </ng-container>\n\n <!-- Custom Icon -->\n <img class=\"left_icon_new pointer\"\n alt=\"Toggle Selection\"\n (click)=\"iconClick(matSelect, searchInput)\"\n *ngIf=\"!selectConfig.matIconName && (selectConfig.iconUrl || selectConfig.activeStateIconUrl)\"\n [src]=\"'assets/images/icons/global/' + (ngControl.control?.value && selectConfig?.activeStateIconUrl ?\n selectConfig.activeStateIconUrl\n : selectConfig.iconUrl)\">\n\n <mat-form-field appearance=\"outline\" class=\"w-100\" (click)=\"selectConfig?.search ? focusSearchInput() : null\">\n <!-- Material Select -->\n <mat-select #matSelect=\"matSelect\"\n [panelClass]=\"'autocomplete-transform-panel-location'\"\n [attr.aria-placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [aria-label]=\"selectConfig.label | translate\"\n [id]=\"selectConfig.filtrationKey || ''\"\n (opened)=\"registerPanelScrollEvent(matSelect)\"\n (openedChange)=\"openedChange($event)\"\n [formControl]=\"ngControl.control\"\n [multiple]=\"selectConfig.multiple\"\n (selectionChange)=\"emitSelectionChangeAndClose($event)\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [disabled]=\"ngControl.control.disabled\"\n >\n\n <!-- Loading State -->\n <mat-option *ngIf=\"pending\" class=\"option_loading relative\">\n <div class=\"request_loading\">\n <img ngSrc=\"./loader.svg\" alt=\"\" height=\"200\" width=\"200\"/>\n </div>\n </mat-option>\n\n <!-- Options -->\n <ng-container *ngIf=\"data?.length && !pending\">\n <!-- Add New Option -->\n <mat-option *ngIf=\"selectConfig.actions\"\n class=\"pointer add_new\"\n disabled\n (click)=\"closePanelAndUnsetFocus();addNewItemEvent()\">\n <!--(click)=\"ngControl.control.reset(null);\n matSelect._onBlur();closePanelAndUnsetFocus();addNewItemEvent()\">-->\n <i-tech-button\n [type]=\"ButtonType.OUTLINE\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \"\n [customClass]=\"'w-100 mat-autocomplete-select-button'\">\n </i-tech-button>\n </mat-option>\n\n <!-- Regular Options -->\n <ng-container *ngIf=\"!selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\">\n {{\n ((selectConfig.valueToShowByKey | getValueByKeyFromObject\n : item : selectConfig.valueToShowByParam : selectConfig.withParamSymbol) || '') | translate\n }}\n </mat-option>\n </ng-container>\n\n <!-- Custom Text Options -->\n <ng-container *ngIf=\"selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\"\n [disabled]=\"selectConfig?.changeText[item].disabled\">\n {{ selectConfig?.changeText[item].text | translate }}\n </mat-option>\n </ng-container>\n </ng-container>\n\n <!-- Empty State -->\n <ng-container *ngIf=\"!pending && !data.length\">\n <mat-option disabled class=\"empty_selection_state\">\n <div class=\"actions_and_tile add_new flex_column w-100 flex_center_align_center\">\n <span>{{ 'dropdown_no_items' | translate }}</span>\n <div class=\"mt-10\">\n <i-tech-button\n *ngIf=\"selectConfig?.actions\"\n [type]=\"ButtonType.OUTLINE\"\n (buttonClick)=\"closePanelAndUnsetFocus();addNewItemEvent()\"\n [customClass]=\"'mat-autocomplete-select-button'\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \">\n </i-tech-button>\n </div>\n </div>\n </mat-option>\n </ng-container>\n </mat-select>\n <mat-icon *ngIf=\"selectConfig.iconPrefix\"\n matPrefix\n [ngClass]=\"{\n 'readonly-color' : !selectConfig['iconPrefixColor']\n && (selectConfig.readOnly || ngControl.control.disabled),\n 'default-form-icon-color' : !selectConfig['iconPrefixColor']\n && !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n >{{ selectConfig.iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"selectConfig['iconPrefixSvg']\"\n matPrefix\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n [svgIcon]=\"selectConfig['iconPrefixSvg'] || ''\"\n ></mat-icon>\n\n <i-tech-icon-button\n *ngIf=\"selectConfig.search && selectConfig.clearable && !ngControl.control.disabled && !!ngControl.control.value\"\n iconName=\"cancel\"\n matSuffix\n [disabled]=\"selectConfig.readOnly || false\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"\n $event.stopPropagation();\n $event.preventDefault();\n ngControl.control.reset(null);\n matSelect._onBlur();\n closePanelAndUnsetFocus()\n \"\n >\n </i-tech-icon-button>\n <mat-icon\n matSuffix\n class=\"select-arrow\"\n [class.open]=\"matSelect.panelOpen\"\n [ngClass]=\"{\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled),\n 'mt-8': !!ngControl.control.value && selectConfig.clearable\n }\"\n >\n keyboard_arrow_down\n </mat-icon>\n <!-- Error Message -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submitValue)\">\n {{ ngControl.control | generateErrorMessages : selectConfig.label : selectConfig.defaultPatternKey }}\n </mat-error>\n </mat-form-field>\n\n <!-- Reset Button -->\n <i-tech-clear-value *ngIf=\"selectConfig.reset\" (resetValue)=\"resetValue()\"></i-tech-clear-value>\n</div>\n", styles: [".left_icon_new{position:absolute;right:2px;top:1px}::ng-deep .request_loading{width:40px;height:40px;background-color:#fff!important}::ng-deep .request_loading:hover{background-color:var(--primary99)!important}::ng-deep .request_loading:focus{background-color:var(--primary99)!important}::ng-deep .request_loading img{position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%)}::ng-deep .mat-mdc-option.add_new{opacity:1!important;pointer-events:auto!important}::ng-deep .mat-mdc-option.add_new .mat-pseudo-checkbox{display:none!important}::ng-deep .mat-mdc-option.add_new .mdc-list-item__primary-text{display:inline-block!important;width:100%!important}::ng-deep .mat-mdc-option.add_new span{color:unset!important;font-size:unset!important;margin:unset!important;opacity:1!important}@media (min-width: 1920px) and (max-width: 2500px){.mat-autocomplete{height:90px!important}}\n"] }]
|
|
860
|
+
], template: "<div class=\"new-mat-autocomplete\" id=\"mat_autocomplete\"\n [ngClass]=\"{\n 'mat-select-without_icon': !selectConfig.iconUrl && !selectConfig.activeStateIconUrl,\n 'mat-select-with-search': selectConfig.search,\n 'without-label': selectConfig.hideLabel,\n 'invalid_field': ngControl.control.errors && submitValue,\n 'readonly-field': selectConfig.readOnly || ngControl.control.disabled\n }\"\n [matTooltip]=\"(selectConfig.hover && !ngControl.control.disabled ? ((selectConfig.hover || '') | translate) : '')\"\n [matTooltipClass]=\"'mat-mdc-tooltip big-td-mat-tooltip'\"\n [matTooltipPosition]=\"'above'\"\n *ngIf=\"selectConfig && ngControl\">\n\n <div class=\"w-100\" *ngIf=\"!selectConfig.hideLabel\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : selectConfig.readOnly || ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && submitValue)\n }\">\n {{ selectConfig.label | translate }}\n </mat-label>\n <span *ngIf=\"selectConfig.required\" class=\"required-input\"\n [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\">*</span>\n </div>\n\n\n <!-- Search Input -->\n <div class=\"search-input w-100\"\n (click)=\"$event.stopPropagation();$event.preventDefault()\"\n [ngClass]=\"{ hide_input_placeholder: showPlaceholder || ngControl.control.disabled }\"\n *ngIf=\"selectConfig.search\"\n >\n <input autocomplete=\"off\"\n id=\"searchInput\"\n type=\"text\"\n [ngClass]=\"{'pr-25': !selectConfig.iconUrl}\"\n #searchInput\n [disabled]=\"ngControl.control.disabled || selectConfig.hover\"\n [placeholder]=\"(ngControl.control.disabled || selectConfig.hover) ? '' : 'Search'\"\n (focusout)=\"inputFocusOut()\"\n (focus)=\"openSelection()\"\n (keydown)=\"$event.stopPropagation()\"\n (keyup)=\"getDataWithSearch(searchInput.value,$event)\">\n\n <!-- Search Icon -->\n <span class=\"search-icon\">\n <i-tech-icon-button\n class=\"mr-10\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color'\n : 'default-form-icon-color'\"\n *ngIf=\"selectConfig.iconPrefix && !showPlaceholder\"\n [iconName]=\"selectConfig.iconPrefix || ''\"\n [disabled]=\"selectConfig.readOnly || false\"\n matPrefix\n >\n </i-tech-icon-button>\n </span>\n </div>\n\n <!-- Placeholder/Selected Value Display -->\n <ng-container *ngIf=\"showPlaceholder && selectConfig.search\">\n <div class=\"custom-placeholder\"\n *ngIf=\"(!ngControl?.value && !ngControl?.value?.length) ||\n (selectConfig.multiple && ngControl?.value && !ngControl?.value?.length)\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n >\n {{ ((selectConfig.placeholder || '') | translate) }}\n </div>\n <div class=\"custom-placeholder custom-value ellipsis\"\n [ngClass]=\"{\n 'pr-42': selectConfig.iconUrl,\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n *ngIf=\"ngControl?.value\"\n >\n {{ selectConfig?.multiple ? (ngControl.value | arrayToString) : showingValue }}\n </div>\n </ng-container>\n\n <!-- Custom Icon -->\n <img class=\"left_icon_new pointer\"\n alt=\"Toggle Selection\"\n (click)=\"iconClick(matSelect, searchInput)\"\n *ngIf=\"!selectConfig.matIconName && (selectConfig.iconUrl || selectConfig.activeStateIconUrl)\"\n [src]=\"'assets/images/icons/global/' + (ngControl.control?.value && selectConfig?.activeStateIconUrl ?\n selectConfig.activeStateIconUrl\n : selectConfig.iconUrl)\">\n\n <mat-form-field appearance=\"outline\" class=\"w-100\" (click)=\"selectConfig?.search ? focusSearchInput() : null\">\n <!-- Material Select -->\n <mat-select #matSelect=\"matSelect\"\n [panelClass]=\"'autocomplete-transform-panel-location'\"\n [attr.aria-placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [aria-label]=\"selectConfig.label | translate\"\n [id]=\"selectConfig.filtrationKey || ''\"\n (opened)=\"registerPanelScrollEvent(matSelect)\"\n (openedChange)=\"openedChange($event)\"\n [formControl]=\"ngControl.control\"\n [multiple]=\"selectConfig.multiple\"\n (selectionChange)=\"emitSelectionChangeAndClose($event)\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [placeholder]=\"(selectConfig.placeholder || '') | translate\"\n [disabled]=\"ngControl.control.disabled\"\n >\n\n <!-- Loading State -->\n <mat-option *ngIf=\"pending\" class=\"option_loading relative\">\n <div class=\"request_loading\">\n <img ngSrc=\"./loader.svg\" alt=\"\" height=\"200\" width=\"200\"/>\n </div>\n </mat-option>\n\n <!-- Options -->\n <ng-container *ngIf=\"data?.length && !pending\">\n <!-- Add New Option -->\n <mat-option *ngIf=\"selectConfig.actions\"\n class=\"pointer add_new\"\n disabled\n (click)=\"closePanelAndUnsetFocus();addNewItemEvent()\">\n <!--(click)=\"ngControl.control.reset(null);\n matSelect._onBlur();closePanelAndUnsetFocus();addNewItemEvent()\">-->\n <i-tech-button\n [type]=\"ButtonType.OUTLINE\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \"\n [customClass]=\"'w-100 mat-autocomplete-select-button'\">\n </i-tech-button>\n </mat-option>\n\n <!-- Regular Options -->\n <ng-container *ngIf=\"!selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\">\n {{\n ((selectConfig.valueToShowByKey | getValueByKeyFromObject\n : item : selectConfig.valueToShowByParam : selectConfig.withParamSymbol) || '') | translate\n }}\n </mat-option>\n </ng-container>\n\n <!-- Custom Text Options -->\n <ng-container *ngIf=\"selectConfig?.changeText && data.length\">\n <mat-option *ngFor=\"let item of data\"\n [value]=\"selectConfig.valueByKey | getValueByKeyFromObject : item\"\n (mouseup)=\"optionClick(item)\"\n (mousedown)=\"preventDefault($event)\"\n [disabled]=\"selectConfig?.changeText[item].disabled\">\n {{ selectConfig?.changeText[item].text | translate }}\n </mat-option>\n </ng-container>\n </ng-container>\n\n <!-- Empty State -->\n <ng-container *ngIf=\"!pending && !data.length\">\n <mat-option disabled class=\"empty_selection_state\">\n <div class=\"actions_and_tile add_new flex_column w-100 flex_center_align_center\">\n <span>{{ 'dropdown_no_items' | translate }}</span>\n <div class=\"mt-10\">\n <i-tech-button\n *ngIf=\"selectConfig?.actions\"\n [type]=\"ButtonType.OUTLINE\"\n (buttonClick)=\"closePanelAndUnsetFocus();addNewItemEvent()\"\n [customClass]=\"'mat-autocomplete-select-button'\"\n [fontIcon]=\"'add'\"\n [text]=\"('dropdown_add_item' | translate : {INPUT_NAME: (selectConfig.label | translate)}) \">\n </i-tech-button>\n </div>\n </div>\n </mat-option>\n </ng-container>\n </mat-select>\n <mat-icon *ngIf=\"selectConfig.iconPrefix\"\n matPrefix\n [ngClass]=\"{\n 'readonly-color' : !selectConfig['iconPrefixColor']\n && (selectConfig.readOnly || ngControl.control.disabled),\n 'default-form-icon-color' : !selectConfig['iconPrefixColor']\n && !(selectConfig.readOnly || ngControl.control.disabled)\n }\"\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n >{{ selectConfig.iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"selectConfig['iconPrefixSvg']\"\n matPrefix\n [matTooltip]=\"((selectConfig?.['iconPrefixTooltip'] || '') | translate)\"\n [svgIcon]=\"selectConfig['iconPrefixSvg'] || ''\"\n ></mat-icon>\n\n <i-tech-icon-button\n *ngIf=\"selectConfig.search && selectConfig.clearable && !ngControl.control.disabled && !!ngControl.control.value\"\n iconName=\"cancel\"\n matSuffix\n [disabled]=\"selectConfig.readOnly || false\"\n [ngClass]=\"selectConfig.readOnly || ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"\n $event.stopPropagation();\n $event.preventDefault();\n ngControl.control.reset(null);\n matSelect._onBlur();\n closePanelAndUnsetFocus()\n \"\n >\n </i-tech-icon-button>\n <mat-icon\n matSuffix\n class=\"select-arrow\"\n [class.open]=\"matSelect.panelOpen\"\n [ngClass]=\"{\n 'readonly-color': selectConfig.readOnly || ngControl.control.disabled,\n 'default-form-icon-color': !(selectConfig.readOnly || ngControl.control.disabled),\n 'mt-8': !!ngControl.control.value && selectConfig.clearable\n }\"\n >\n keyboard_arrow_down\n </mat-icon>\n <!-- Error Message -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submitValue)\">\n {{ ngControl.control | generateErrorMessages : selectConfig.label : selectConfig.defaultPatternKey }}\n </mat-error>\n </mat-form-field>\n\n <!-- Reset Button -->\n <i-tech-clear-value *ngIf=\"selectConfig.reset\" (resetValue)=\"resetValue()\"></i-tech-clear-value>\n</div>\n", styles: [".left_icon_new{position:absolute;right:2px;top:1px}::ng-deep .request_loading{width:40px;height:40px;background-color:#fff!important}::ng-deep .request_loading:hover{background-color:var(--primary99)!important}::ng-deep .request_loading:focus{background-color:var(--primary99)!important}::ng-deep .request_loading img{position:absolute;left:50%;top:50%;width:100%;height:100%;transform:translate(-50%,-50%)}::ng-deep .mat-mdc-option.add_new{opacity:1!important;pointer-events:auto!important}::ng-deep .mat-mdc-option.add_new .mat-pseudo-checkbox{display:none!important}::ng-deep .mat-mdc-option.add_new .mdc-list-item__primary-text{display:inline-block!important;width:100%!important}::ng-deep .mat-mdc-option.add_new span{color:unset!important;font-size:unset!important;margin:unset!important;opacity:1!important}@media (min-width: 1920px) and (max-width: 2500px){.mat-autocomplete{height:90px!important}}\n"] }]
|
|
858
861
|
}], ctorParameters: () => [{ type: InputService }], propDecorators: { matSelect: [{
|
|
859
862
|
type: ViewChild,
|
|
860
863
|
args: ['matSelect']
|
|
@@ -946,10 +949,10 @@ class DateMaskDirective {
|
|
|
946
949
|
}
|
|
947
950
|
return isValid;
|
|
948
951
|
}
|
|
949
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
950
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "
|
|
952
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: DateMaskDirective, deps: [{ token: i0.ElementRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
953
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.1.2", type: DateMaskDirective, isStandalone: true, selector: "[dateMask]", inputs: { maskType: "maskType", matDatepicker: "matDatepicker", rangeFormControl: "rangeFormControl" }, host: { listeners: { "input": "onInput()", "paste": "onPaste($event)" } }, providers: [NgxMaskDirective], ngImport: i0 }); }
|
|
951
954
|
}
|
|
952
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
955
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: DateMaskDirective, decorators: [{
|
|
953
956
|
type: Directive,
|
|
954
957
|
args: [{
|
|
955
958
|
selector: '[dateMask]',
|
|
@@ -1014,10 +1017,10 @@ class DatePickerComponent {
|
|
|
1014
1017
|
this.inputElement.nativeElement.blur();
|
|
1015
1018
|
}, 120);
|
|
1016
1019
|
}
|
|
1017
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1018
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1020
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: DatePickerComponent, deps: [{ token: InputService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1021
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: DatePickerComponent, isStandalone: true, selector: "i-tech-date-picker", inputs: { label: "label", defaultPatternKey: "defaultPatternKey", required: "required", pastDatesDisabled: "pastDatesDisabled", hintText: "hintText", placeholder: "placeholder", iconPrefix: "iconPrefix", iconPrefixSvg: "iconPrefixSvg", iconPrefixTooltip: "iconPrefixTooltip", iconPrefixColor: "iconPrefixColor", iconPrefixVariant: "iconPrefixVariant", valueChangeEmit: "valueChangeEmit", minDate: "minDate", clearable: "clearable", submit: "submit" }, outputs: { valueChangeEmitter: "valueChangeEmitter" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true }], ngImport: i0, template: "<div class=\"flex_column relative mat-date-range-input\" *ngIf=\"ngControl\" [ngClass]=\"{'check_requirements': submit}\">\n <div class=\"w-100\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && submit)\n }\">\n {{ label | translate }}\n </mat-label>\n <span *ngIf=\"required\" class=\"required-input\" [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\">*</span>\n </div>\n <mat-form-field appearance=\"outline\" [ngClass]=\"{'opened_calendar': isOpen}\"\n [class.readonly-field]=\"ngControl.control.disabled\">\n <input matInput #inputElement\n type=\"text\"\n [formControl]=\"ngControl.control\"\n [placeholder]=\"placeholder | translate\"\n [min]=\"minDate\"\n dateMask\n [matDatepicker]=\"datePicker\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [matDatepickerFilter]=\"dateFilter\"\n (focus)=\"focused = true\"\n (click)=\"datePicker.open();\"\n (dateChange)=\"emitChange()\"\n >\n\n <mat-icon *ngIf=\"iconPrefix\"\n matPrefix\n [matTooltip]=\"((iconPrefixTooltip || '') | translate)\"\n [style.color]=\"iconPrefixColor\"\n >{{ iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"iconPrefixSvg\"\n matPrefix\n [matTooltip]=\"((iconPrefixTooltip || '') | translate)\"\n [svgIcon]=\"iconPrefixSvg\"\n ></mat-icon>\n\n <app-icon-button\n *ngIf=\"clearable && !ngControl.control.disabled && !!ngControl.control.value\"\n iconName=\"cancel\"\n matSuffix\n [ngClass]=\"ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"$event.stopPropagation();$event.preventDefault();ngControl.control.reset(null);\"\n >\n </app-icon-button>\n\n <i-tech-icon-button matSuffix\n [iconName]=\"'date_range'\"\n [disabled]=\"ngControl.control.disabled\"\n (click)=\"datePicker.open()\"\n [ngClass]=\"ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n ></i-tech-icon-button>\n\n <mat-datepicker #datePicker (closed)=\"isOpen = false;clickForFocusOut()\"\n (opened)=\"isOpen = true;focused = true\"></mat-datepicker>\n\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submit)\">\n {{ ngControl.control | generateErrorMessages : label : defaultPatternKey }}\n </mat-error>\n\n <!-- Helper Text -->\n <mat-hint *ngIf=\"!(!!(ngControl.control.errors && submit)) && hintText\"\n [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\"\n >\n {{ hintText | translate }}\n </mat-hint>\n\n </mat-form-field>\n</div>\n", dependencies: [{ 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: i2.TranslatePipe, name: "translate" }, { 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.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { 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.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i4.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i4.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { 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: MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: DateMaskDirective, selector: "[dateMask]", inputs: ["maskType", "matDatepicker", "rangeFormControl"] }, { kind: "pipe", type: GenerateErrorMessagesPipe, name: "generateErrorMessages" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled"], outputs: ["buttonClick"] }] }); }
|
|
1019
1022
|
}
|
|
1020
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1023
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: DatePickerComponent, decorators: [{
|
|
1021
1024
|
type: Component,
|
|
1022
1025
|
args: [{ selector: 'i-tech-date-picker', imports: [
|
|
1023
1026
|
NgClass, NgIf,
|
|
@@ -1030,7 +1033,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1030
1033
|
MatIconModule,
|
|
1031
1034
|
DateMaskDirective,
|
|
1032
1035
|
GenerateErrorMessagesPipe, IconButtonComponent
|
|
1033
|
-
],
|
|
1036
|
+
], template: "<div class=\"flex_column relative mat-date-range-input\" *ngIf=\"ngControl\" [ngClass]=\"{'check_requirements': submit}\">\n <div class=\"w-100\">\n <mat-label [ngClass]=\"{\n 'readonly-color' : ngControl.control.disabled,\n 'invalid-label-color': !!(ngControl.control.errors && submit)\n }\">\n {{ label | translate }}\n </mat-label>\n <span *ngIf=\"required\" class=\"required-input\" [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\">*</span>\n </div>\n <mat-form-field appearance=\"outline\" [ngClass]=\"{'opened_calendar': isOpen}\"\n [class.readonly-field]=\"ngControl.control.disabled\">\n <input matInput #inputElement\n type=\"text\"\n [formControl]=\"ngControl.control\"\n [placeholder]=\"placeholder | translate\"\n [min]=\"minDate\"\n dateMask\n [matDatepicker]=\"datePicker\"\n [errorStateMatcher]=\"customErrorStateMatcher\"\n [matDatepickerFilter]=\"dateFilter\"\n (focus)=\"focused = true\"\n (click)=\"datePicker.open();\"\n (dateChange)=\"emitChange()\"\n >\n\n <mat-icon *ngIf=\"iconPrefix\"\n matPrefix\n [matTooltip]=\"((iconPrefixTooltip || '') | translate)\"\n [style.color]=\"iconPrefixColor\"\n >{{ iconPrefix }}\n </mat-icon>\n\n <mat-icon *ngIf=\"iconPrefixSvg\"\n matPrefix\n [matTooltip]=\"((iconPrefixTooltip || '') | translate)\"\n [svgIcon]=\"iconPrefixSvg\"\n ></mat-icon>\n\n <app-icon-button\n *ngIf=\"clearable && !ngControl.control.disabled && !!ngControl.control.value\"\n iconName=\"cancel\"\n matSuffix\n [ngClass]=\"ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n (click)=\"$event.stopPropagation();$event.preventDefault();ngControl.control.reset(null);\"\n >\n </app-icon-button>\n\n <i-tech-icon-button matSuffix\n [iconName]=\"'date_range'\"\n [disabled]=\"ngControl.control.disabled\"\n (click)=\"datePicker.open()\"\n [ngClass]=\"ngControl.control.disabled ? 'readonly-color' : 'default-form-icon-color'\"\n ></i-tech-icon-button>\n\n <mat-datepicker #datePicker (closed)=\"isOpen = false;clickForFocusOut()\"\n (opened)=\"isOpen = true;focused = true\"></mat-datepicker>\n\n <!-- Error Messages -->\n <mat-error *ngIf=\"!!(ngControl.control.errors && submit)\">\n {{ ngControl.control | generateErrorMessages : label : defaultPatternKey }}\n </mat-error>\n\n <!-- Helper Text -->\n <mat-hint *ngIf=\"!(!!(ngControl.control.errors && submit)) && hintText\"\n [ngClass]=\"{'readonly-color' : ngControl.control.disabled}\"\n >\n {{ hintText | translate }}\n </mat-hint>\n\n </mat-form-field>\n</div>\n" }]
|
|
1034
1037
|
}], ctorParameters: () => [{ type: InputService }], propDecorators: { label: [{
|
|
1035
1038
|
type: Input
|
|
1036
1039
|
}], defaultPatternKey: [{
|
|
@@ -1128,10 +1131,10 @@ class DateRangeDatepickerComponent {
|
|
|
1128
1131
|
this.setDate(value, element);
|
|
1129
1132
|
}
|
|
1130
1133
|
}
|
|
1131
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1132
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1134
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: DateRangeDatepickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1135
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", 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" }, outputs: { resetForm: "resetForm", selectionChange: "selectionChange" }, viewQueries: [{ propertyName: "picker", first: true, predicate: ["picker"], descendants: true }, { propertyName: "min", first: true, predicate: ["min"], 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\">\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 [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-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)=\"selectionChange.emit([null, null])\"\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: i2.TranslatePipe, name: "translate" }, { kind: "component", type: IconButtonComponent, selector: "i-tech-icon-button", inputs: ["size", "type", "iconSvg", "iconName", "tooltip", "disabled"], outputs: ["buttonClick"] }, { kind: "directive", type: DateMaskDirective, selector: "[dateMask]", inputs: ["maskType", "matDatepicker", "rangeFormControl"] }] }); }
|
|
1133
1136
|
}
|
|
1134
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: DateRangeDatepickerComponent, decorators: [{
|
|
1135
1138
|
type: Component,
|
|
1136
1139
|
args: [{ selector: 'i-tech-mat-range-datepicker', imports: [
|
|
1137
1140
|
MatFormFieldModule,
|
|
@@ -1140,7 +1143,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1140
1143
|
NgClass, NgIf,
|
|
1141
1144
|
TranslateModule,
|
|
1142
1145
|
IconButtonComponent, DateMaskDirective
|
|
1143
|
-
],
|
|
1146
|
+
], template: "<div class=\"flex_column relative mat-date-range-input\"\n [formGroup]=\"dateRangeForm\"\n>\n <div class=\"w-100\">\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 [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-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)=\"selectionChange.emit([null, null])\"\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" }]
|
|
1144
1147
|
}], propDecorators: { label: [{
|
|
1145
1148
|
type: Input
|
|
1146
1149
|
}], placeholder: [{
|
|
@@ -1194,12 +1197,12 @@ class MenuComponent {
|
|
|
1194
1197
|
this.DropdownItemIcon = DropdownItemIcon;
|
|
1195
1198
|
this.matMenuState = false;
|
|
1196
1199
|
}
|
|
1197
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
1198
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "
|
|
1200
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1201
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.2", type: MenuComponent, isStandalone: true, selector: "i-tech-menu", inputs: { text: "text", dataName: "dataName", containerClass: "containerClass", positionX: "positionX", menuOptions: "menuOptions" }, outputs: { emitEvent: "emitEvent" }, ngImport: i0, template: "<div class=\"custom_dropdown_container\"\n [attr.data-name]=\"dataName\"\n [ngClass]=\"containerClass\"\n>\n <i-tech-button\n [matMenuTriggerFor]=\"beforeMenu\"\n [type]=\"ButtonType.OUTLINE\"\n [fontIcon]=\"'keyboard_arrow_down'\"\n [text]=\"(text || '') \"\n (menuOpened)=\"matMenuState = true\"\n (menuClosed)=\"matMenuState = false\"\n [activated]=\"matMenuState\"\n ></i-tech-button>\n <mat-menu #beforeMenu=\"matMenu\" [xPosition]=\"positionX\">\n <button mat-menu-item *ngFor=\"let option of menuOptions\" (click)=\"emitEvent.emit(option.value)\">\n <mat-icon *ngIf=\"option.type\" [svgIcon]=\"DropdownItemIcon[option.type]\"></mat-icon>\n <mat-label class=\"meu_item_label\">{{(option.text || '') | translate}}</mat-label>\n </button>\n </mat-menu>\n</div>\n", styles: [".custom_dropdown_container i-tech-button{display:inline-block}mat-menu{height:max-content}\n"], dependencies: [{ kind: "directive", type: MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "i-tech-button", inputs: ["text", "data_cy", "fontIcon", "svgIcon", "type", "customClass", "submit", "disabled", "activated", "color"], outputs: ["buttonClick"] }, { kind: "directive", type: MatLabel, selector: "mat-label" }] }); }
|
|
1199
1202
|
}
|
|
1200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
1203
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.2", ngImport: i0, type: MenuComponent, decorators: [{
|
|
1201
1204
|
type: Component,
|
|
1202
|
-
args: [{ selector: "i-tech-menu",
|
|
1205
|
+
args: [{ selector: "i-tech-menu", imports: [
|
|
1203
1206
|
MatMenuTrigger,
|
|
1204
1207
|
MatMenu,
|
|
1205
1208
|
MatIcon,
|