master-control 0.3.75 → 0.3.77
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/annuity-premium-calculator/annuity-premium-calculator.component.mjs +27 -5
- package/esm2022/lib/master-control.component.mjs +2 -2
- package/esm2022/lib/master-control.service.mjs +3 -3
- package/esm2022/lib/multiple-select/multiple-select.component.mjs +3 -33
- package/esm2022/lib/select-textbox/select-textbox.component.mjs +21 -15
- package/esm2022/lib/toggle/toggle.component.mjs +18 -6
- package/fesm2022/master-control.mjs +148 -139
- package/fesm2022/master-control.mjs.map +1 -1
- package/lib/annuity-premium-calculator/annuity-premium-calculator.component.d.ts +6 -1
- package/lib/master-control.service.d.ts +1 -1
- package/lib/multiple-select/multiple-select.component.d.ts +2 -2
- package/lib/select-textbox/select-textbox.component.d.ts +3 -0
- package/lib/toggle/toggle.component.d.ts +2 -1
- package/master-control-0.3.77.tgz +0 -0
- package/package.json +1 -1
- package/master-control-0.3.75.tgz +0 -0
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, input, EventEmitter, Component, Output, Directive, Inject, Input, HostListener, createComponent, ViewChild, output, effect } from '@angular/core';
|
|
3
|
-
import * as
|
|
2
|
+
import { Injectable, input, EventEmitter, Component, Output, Directive, Inject, Input, HostListener, forwardRef, createComponent, ViewChild, output, effect } from '@angular/core';
|
|
3
|
+
import * as i2 from '@angular/material/input';
|
|
4
4
|
import { MatInputModule } from '@angular/material/input';
|
|
5
|
-
import * as i2 from '@angular/material/form-field';
|
|
5
|
+
import * as i2$1 from '@angular/material/form-field';
|
|
6
6
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
|
7
|
-
import * as i1
|
|
7
|
+
import * as i1 from '@angular/common';
|
|
8
8
|
import { CommonModule, DOCUMENT, NgIf, NgFor } from '@angular/common';
|
|
9
9
|
import * as i4 from '@angular/forms';
|
|
10
10
|
import { NG_VALUE_ACCESSOR, ReactiveFormsModule, FormsModule, FormGroup } from '@angular/forms';
|
|
@@ -14,34 +14,34 @@ import * as i4$1 from '@angular/material/core';
|
|
|
14
14
|
import { MatOptionModule, DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
|
|
15
15
|
import * as i3 from '@angular/material/select';
|
|
16
16
|
import { MatSelectModule } from '@angular/material/select';
|
|
17
|
-
import * as i2$
|
|
17
|
+
import * as i2$2 from '@angular/material/radio';
|
|
18
18
|
import { MatRadioModule } from '@angular/material/radio';
|
|
19
|
-
import * as i1$
|
|
19
|
+
import * as i1$1 from '@angular/platform-browser';
|
|
20
20
|
import { MomentDateAdapter, MomentDateModule } from '@angular/material-moment-adapter';
|
|
21
21
|
import * as i5 from '@angular/material/datepicker';
|
|
22
22
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
|
23
23
|
import * as i4$2 from '@angular/material/checkbox';
|
|
24
24
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
25
|
-
import * as i2$
|
|
25
|
+
import * as i2$3 from '@angular/material/tabs';
|
|
26
26
|
import { MatTabsModule } from '@angular/material/tabs';
|
|
27
27
|
import * as i6 from '@angular/material/chips';
|
|
28
28
|
import { MatChipsModule } from '@angular/material/chips';
|
|
29
29
|
import * as i7 from '@angular/material/icon';
|
|
30
30
|
import { MatIconModule } from '@angular/material/icon';
|
|
31
|
-
import * as i2$
|
|
31
|
+
import * as i2$4 from '@angular/material/stepper';
|
|
32
32
|
import { MatStepperModule } from '@angular/material/stepper';
|
|
33
33
|
import * as i4$3 from '@angular/material/tooltip';
|
|
34
34
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
35
35
|
import * as i5$2 from '@angular/material/paginator';
|
|
36
36
|
import { MatPaginatorModule } from '@angular/material/paginator';
|
|
37
|
-
import * as i1$
|
|
37
|
+
import * as i1$2 from '@angular/material/button-toggle';
|
|
38
38
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
|
39
39
|
import * as i4$4 from '@angular/google-maps';
|
|
40
40
|
import { GoogleMapsModule } from '@angular/google-maps';
|
|
41
|
-
import * as i1$
|
|
42
|
-
import * as i1$
|
|
41
|
+
import * as i1$3 from '@angular/common/http';
|
|
42
|
+
import * as i1$4 from '@angular/material/progress-bar';
|
|
43
43
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
44
|
-
import * as i1$
|
|
44
|
+
import * as i1$5 from '@angular/material/expansion';
|
|
45
45
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
46
46
|
|
|
47
47
|
class MasterControlService {
|
|
@@ -272,7 +272,7 @@ class MasterControlService {
|
|
|
272
272
|
const data = localStorage.getItem(key);
|
|
273
273
|
return data ? JSON.parse(data) : null;
|
|
274
274
|
}
|
|
275
|
-
addComasToNumberValues(value) {
|
|
275
|
+
addComasToNumberValues(value, isRemoveRupeeSymbol = false) {
|
|
276
276
|
let newVal = value;
|
|
277
277
|
if (!this.checkIfValueIsEmpty(value)) {
|
|
278
278
|
if (Number(value
|
|
@@ -294,7 +294,7 @@ class MasterControlService {
|
|
|
294
294
|
.split('₹')[1];
|
|
295
295
|
}
|
|
296
296
|
}
|
|
297
|
-
return newVal;
|
|
297
|
+
return isRemoveRupeeSymbol ? newVal?.replaceAll('₹', '').trim() : newVal;
|
|
298
298
|
}
|
|
299
299
|
removeComasAndCurrencySymbolFromNumberValues(value) {
|
|
300
300
|
if (!this.checkIfValueIsEmpty(value)) {
|
|
@@ -395,7 +395,7 @@ class TextboxComponent {
|
|
|
395
395
|
useExisting: TextboxComponent,
|
|
396
396
|
multi: true
|
|
397
397
|
}
|
|
398
|
-
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n'--custom-width': field()?.controlStyle?.width ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.configData?.inputType ? field()?.configData?.inputType : field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.configData?.inputType ? field()?.configData?.inputType : field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <mat-hint *ngIf=\"field()?.configData?.helperText\">{{field()?.configData?.helperText}}</mat-hint>\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n <!-- <mat-error *ngIf=\"field()?.configData?.isInvalidPattern && !masterService.checkIfValueIsEmpty(field()?.validators?.patternMessage)\">\r\n {{ field()?.validators?.patternMessage }}\r\n </mat-error> -->\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:5px}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{font-size:14px!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type:
|
|
398
|
+
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n'--custom-width': field()?.controlStyle?.width ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.configData?.inputType ? field()?.configData?.inputType : field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.configData?.inputType ? field()?.configData?.inputType : field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <mat-hint *ngIf=\"field()?.configData?.helperText\">{{field()?.configData?.helperText}}</mat-hint>\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n <!-- <mat-error *ngIf=\"field()?.configData?.isInvalidPattern && !masterService.checkIfValueIsEmpty(field()?.validators?.patternMessage)\">\r\n {{ field()?.validators?.patternMessage }}\r\n </mat-error> -->\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:5px}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{font-size:14px!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
399
399
|
}
|
|
400
400
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxComponent, decorators: [{
|
|
401
401
|
type: Component,
|
|
@@ -422,7 +422,7 @@ class ButtonComponent {
|
|
|
422
422
|
}
|
|
423
423
|
field = input.required();
|
|
424
424
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
425
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ButtonComponent, isStandalone: true, selector: "lib-button", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<Button\r\n class=\"button\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [disabled]=\"field()?.isDisable\"\r\n [ngStyle]=\"\r\n {\r\n '--button-border-width': field()?.controlStyle?.borderWidth ,\r\n '--button-border-color': field()?.controlStyle?.borderColor ,\r\n '--button-border-style': field()?.controlStyle?.borderStyle ,\r\n '--button-width': field()?.controlStyle?.width ,\r\n '--button-font-size': field()?.controlStyle?.fontSize ,\r\n '--button-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--button-background': field()?.controlStyle?.background ,\r\n '--button-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--button-text-color': field()?.controlStyle?.color ,\r\n '--button-margin': field()?.controlStyle?.margin ,\r\n }\"\r\n [ngClass]=\"field()?.isDisable ? 'button-disable' : 'button'\"\r\n>\r\n<span class=\"button-text\">\r\n<img *ngIf=\"field()?.imageUrl\" [src]='field().imageUrl'>\r\n<span>{{field()?.label}}</span>\r\n</span>\r\n</Button>\r\n", styles: [".button{height:var(--button-height, 32px)!important;min-width:var(--button-width, 164px)!important;background:var(--button-background, #ffbb00)!important;border-width:var(--button-border-width, 0px)!important;border-color:var(--button-border-color, #fb0)!important;border-style:var(--button-border-style, solid)!important;border-radius:var(--button-border-radius, 8px)!important;font-size:var(--button-font-size, 12px)!important;font-weight:var(--button-font-weight, 800)!important;color:var(--button-text-color, #444)!important;max-width:fit-content}.button-text{display:flex;justify-content:center;gap:4px}.button-text img{margin-top:3px}*{font-family:Mulish!important}.button-disable{background:#ececec!important}@media screen and (max-width: 768px){.button{height:40px!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
425
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ButtonComponent, isStandalone: true, selector: "lib-button", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<Button\r\n class=\"button\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [disabled]=\"field()?.isDisable\"\r\n [ngStyle]=\"\r\n {\r\n '--button-border-width': field()?.controlStyle?.borderWidth ,\r\n '--button-border-color': field()?.controlStyle?.borderColor ,\r\n '--button-border-style': field()?.controlStyle?.borderStyle ,\r\n '--button-width': field()?.controlStyle?.width ,\r\n '--button-font-size': field()?.controlStyle?.fontSize ,\r\n '--button-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--button-background': field()?.controlStyle?.background ,\r\n '--button-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--button-text-color': field()?.controlStyle?.color ,\r\n '--button-margin': field()?.controlStyle?.margin ,\r\n }\"\r\n [ngClass]=\"field()?.isDisable ? 'button-disable' : 'button'\"\r\n>\r\n<span class=\"button-text\">\r\n<img *ngIf=\"field()?.imageUrl\" [src]='field().imageUrl'>\r\n<span>{{field()?.label}}</span>\r\n</span>\r\n</Button>\r\n", styles: [".button{height:var(--button-height, 32px)!important;min-width:var(--button-width, 164px)!important;background:var(--button-background, #ffbb00)!important;border-width:var(--button-border-width, 0px)!important;border-color:var(--button-border-color, #fb0)!important;border-style:var(--button-border-style, solid)!important;border-radius:var(--button-border-radius, 8px)!important;font-size:var(--button-font-size, 12px)!important;font-weight:var(--button-font-weight, 800)!important;color:var(--button-text-color, #444)!important;max-width:fit-content}.button-text{display:flex;justify-content:center;gap:4px}.button-text img{margin-top:3px}*{font-family:Mulish!important}.button-disable{background:#ececec!important}@media screen and (max-width: 768px){.button{height:40px!important}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
426
426
|
}
|
|
427
427
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
428
428
|
type: Component,
|
|
@@ -692,7 +692,7 @@ class SelectComponent {
|
|
|
692
692
|
useExisting: SelectComponent,
|
|
693
693
|
multi: true
|
|
694
694
|
}
|
|
695
|
-
], ngImport: i0, template: "<label class=\"field-lable info-label\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">\r\n <span>{{ field()?.label}}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></span>\r\n <!-- <span style=\"justify-content: end;\" *ngIf=\"field() && field()?.configData?.infoMessage\">\r\n <img class=\"mx-1\" src=\"https://cdn.godigit.com/retail-life/question-mark.svg\" alt=\"\">\r\n <u>{{field()?.configData?.infoMessage}} ></u>\r\n </span>\\ -->\r\n <span class=\"info-content\" *ngIf=\"configData.isInfoMsgVisible\">\r\n <img class=\"mx-1\" *ngIf=\"field()?.configData?.imageURL\" [src]=\"field()?.configData?.imageURL\" alt=\"\">\r\n <u style=\"cursor: pointer;\" (click)=\"handleWhereToFindClick()\">{{field()?.configData?.infoMsg}}</u>\r\n <span [appTooltipTemplate]=\"HtmlContent\" arrowPosition=\"left\" tooltipPosition=\"bottom\">\r\n <img [src]=\"field().imageUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n </span>\r\n <ng-template #HtmlContent>\r\n <span [innerHTML]=\"field().configData?.infoMessage\"></span>\r\n </ng-template>\r\n\r\n</label>\r\n\r\n<mat-form-field appearance=\"outline\" class=\"input-full-width full-width w-100\" *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-select [id]=\"field()?.fieldName\" [attr.name]=\"field()?.fieldName\" [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\" [disabled]=\"field()?.isDisable\" (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\" (selectionChange)=\"selectionChanged($event)\" [formControl]=\"reactiveFormControlobject()\">\r\n <mat-option *ngFor=\"let data of field()?.options\" [value]=\"data.value\">{{\r\n data.label\r\n }}</mat-option>\r\n </mat-select>\r\n }@else {\r\n <mat-select [id]=\"field()?.fieldName\" [attr.name]=\"field()?.fieldName\" [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\" [disabled]=\"field()?.isDisable\" (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\" (selectionChange)=\"selectionChanged($event)\">\r\n <mat-option *ngFor=\"let data of field()?.options\" [value]=\"data.value\">{{\r\n data.label\r\n }}</mat-option>\r\n </mat-select>\r\n }\r\n\r\n <!-- selectField.invalid && (selectField.dirty || selectField.touched) -->\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message mt-2\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important;display:flex;justify-content:space-between;align-items:center}.error-message{color:red}.info-content{display:flex;align-items:center;margin-left:auto}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important}*{font-family:mulish!important}.info-label{display:flex;justify-content:start}.toggle-img{width:12px}@media screen and (max-width: 768px){.toggle-img{width:16px}}::ng-deep .mat-mdc-select{display:grid!important;width:auto!important}:host ::ng-deep .mat-mdc-select-value-text{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:14px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.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: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: CustomizedTooltipDirective, selector: "[appTooltipTemplate]", inputs: ["appTooltipTemplate"] }] });
|
|
695
|
+
], ngImport: i0, template: "<label class=\"field-lable info-label\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">\r\n <span>{{ field()?.label}}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></span>\r\n <!-- <span style=\"justify-content: end;\" *ngIf=\"field() && field()?.configData?.infoMessage\">\r\n <img class=\"mx-1\" src=\"https://cdn.godigit.com/retail-life/question-mark.svg\" alt=\"\">\r\n <u>{{field()?.configData?.infoMessage}} ></u>\r\n </span>\\ -->\r\n <span class=\"info-content\" *ngIf=\"configData.isInfoMsgVisible\">\r\n <img class=\"mx-1\" *ngIf=\"field()?.configData?.imageURL\" [src]=\"field()?.configData?.imageURL\" alt=\"\">\r\n <u style=\"cursor: pointer;\" (click)=\"handleWhereToFindClick()\">{{field()?.configData?.infoMsg}}</u>\r\n <span [appTooltipTemplate]=\"HtmlContent\" arrowPosition=\"left\" tooltipPosition=\"bottom\">\r\n <img [src]=\"field().imageUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n </span>\r\n <ng-template #HtmlContent>\r\n <span [innerHTML]=\"field().configData?.infoMessage\"></span>\r\n </ng-template>\r\n\r\n</label>\r\n\r\n<mat-form-field appearance=\"outline\" class=\"input-full-width full-width w-100\" *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-select [id]=\"field()?.fieldName\" [attr.name]=\"field()?.fieldName\" [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\" [disabled]=\"field()?.isDisable\" (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\" (selectionChange)=\"selectionChanged($event)\" [formControl]=\"reactiveFormControlobject()\">\r\n <mat-option *ngFor=\"let data of field()?.options\" [value]=\"data.value\">{{\r\n data.label\r\n }}</mat-option>\r\n </mat-select>\r\n }@else {\r\n <mat-select [id]=\"field()?.fieldName\" [attr.name]=\"field()?.fieldName\" [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\" [disabled]=\"field()?.isDisable\" (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\" (selectionChange)=\"selectionChanged($event)\">\r\n <mat-option *ngFor=\"let data of field()?.options\" [value]=\"data.value\">{{\r\n data.label\r\n }}</mat-option>\r\n </mat-select>\r\n }\r\n\r\n <!-- selectField.invalid && (selectField.dirty || selectField.touched) -->\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message mt-2\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important;display:flex;justify-content:space-between;align-items:center}.error-message{color:red}.info-content{display:flex;align-items:center;margin-left:auto}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important}*{font-family:mulish!important}.info-label{display:flex;justify-content:start}.toggle-img{width:12px}@media screen and (max-width: 768px){.toggle-img{width:16px}}::ng-deep .mat-mdc-select{display:grid!important;width:auto!important}:host ::ng-deep .mat-mdc-select-value-text{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:14px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.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: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: CustomizedTooltipDirective, selector: "[appTooltipTemplate]", inputs: ["appTooltipTemplate"] }] });
|
|
696
696
|
}
|
|
697
697
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectComponent, decorators: [{
|
|
698
698
|
type: Component,
|
|
@@ -772,7 +772,7 @@ class RadioComponent {
|
|
|
772
772
|
useExisting: RadioComponent,
|
|
773
773
|
multi: true
|
|
774
774
|
}
|
|
775
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\" [ngStyle]=\"{\r\n }\">{{field()?.label}}<span class=\"error-message\" *ngIf=\"field()?.validators?.isRequired\">*</span></label>\r\n @if(reactiveFormControlobject()) {\r\n <mat-radio-group class=\"w-100\" *ngIf=\"field() && field()?.isVisible\"\r\n class=\"radio-btn-group radio-btn-gender\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n (change)=\"onRadioGroupChange($event)\"\r\n >\r\n <div\r\n class=\"card radio-card-gender py-auto px-1\"\r\n *ngFor=\"let data of field()?.options\"\r\n [ngClass]=\"{'disable-radio-btn': field()?.isDisable || reactiveFormControlobject?.disabled}\"\r\n (click)=\"toggleRadio(data.value, $event)\"\r\n [ngStyle]=\"{\r\n '--radio-button-border-color': inputValue === data.value ? field()?.controlStyle?.focusBorderColor : field()?.controlStyle?.borderColor,\r\n '--radio-button-background-color': inputValue === data.value ? field()?.controlStyle?.focusBackground : field()?.controlStyle?.background,\r\n '--radio-button-border-width': inputValue === data.value ? field()?.controlStyle?.focusBorderWidth : field()?.controlStyle?.borderWidth,\r\n '--radio-button-border-radius': inputValue === data.value ? field()?.controlStyle?.borderRadius : field()?.controlStyle?.borderRadius,\r\n }\"\r\n >\r\n <mat-radio-button\r\n style=\"min-width: 72px; text-align: center;\"\r\n class=\"radioButtonGender\"\r\n [value]=\"data.value\"\r\n >\r\n <span style=\"white-space: pre-line;\" class=\"forRadioLabel\" [ngStyle]=\"{\r\n '--radio-button-font-weight': field()?.controlStyle?.fontWeight,\r\n '--radio-button-font-size': field()?.controlStyle?.fontSize,\r\n '--radio-button-font-color': field()?.controlStyle?.color,\r\n }\">{{ data.label }}\r\n <img class=\"radio-btn-icon\" *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n </span>\r\n </mat-radio-button>\r\n </div>\r\n </mat-radio-group>\r\n }@else {\r\n <mat-radio-group class=\"w-100\" *ngIf=\"field() && field()?.isVisible\"\r\n class=\"radio-btn-group radio-btn-gender\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [value]=\"inputValue\"\r\n (change)=\"onRadioGroupChange($event)\"\r\n >\r\n <div\r\n class=\"card radio-card-gender py-auto px-1\"\r\n style=\"width: 100% !important; min-width: fit-content !important;\"\r\n *ngFor=\"let data of field()?.options\"\r\n [ngClass]=\"{'disable-radio-btn': field()?.isDisable}\"\r\n (click)=\"toggleRadio(data.value, $event)\"\r\n [ngStyle]=\"{\r\n '--radio-button-border-color': inputValue === data.value ? field()?.controlStyle?.focusBorderColor : field()?.controlStyle?.borderColor,\r\n '--radio-button-background-color': inputValue === data.value ? field()?.controlStyle?.focusBackground : field()?.controlStyle?.background,\r\n '--radio-button-border-width': inputValue === data.value ? field()?.controlStyle?.focusBorderWidth : field()?.controlStyle?.borderWidth,\r\n '--radio-button-border-radius': inputValue === data.value ? field()?.controlStyle?.borderRadius : field()?.controlStyle?.borderRadius,\r\n }\"\r\n >\r\n <mat-radio-button\r\n style=\"min-width: 72px; text-align: center;\"\r\n class=\"radioButtonGender\"\r\n [value]=\"data.value\"\r\n >\r\n <span style=\"white-space: pre-line;\" class=\"forRadioLabel\" [ngStyle]=\"{\r\n '--radio-button-font-weight': field()?.controlStyle?.fontWeight,\r\n '--radio-button-font-size': field()?.controlStyle?.fontSize,\r\n '--radio-button-font-color': field()?.controlStyle?.color,\r\n }\">{{ data.label }}\r\n <img class=\"radio-btn-icon\" *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n </span>\r\n </mat-radio-button>\r\n </div>\r\n </mat-radio-group>\r\n }\r\n <div class=\"error-message\" *ngIf=\"false\">\r\n {{field()?.validators?.patternMessage}}.\r\n</div>\r\n", styles: [".radio-selection-border{border:1px solid #ffbb00!important;background:#fffaeb!important}*{font-family:mulish!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important;white-space:pre-wrap!important}.error-message{color:red}.radio-btn-group{display:flex;align-items:center;gap:1rem;align-self:stretch}::ng-deep .radio-btn-gender .mdc-form-field .mdc-radio{display:none!important}.radio-card-gender{box-shadow:none;border-color:var(--radio-button-border-color,#DADADA);border-width:var(--radio-button-border-width, 1px solid);background:var(--radio-button-background-color, #FFFFFF);display:flex;align-items:center;cursor:pointer;width:max-content!important;border-radius:var(--radio-button-border-radius, 6px)}::ng-deep .radioButtonGender .mdc-form-field .mdc-radio{display:none!important}.forRadioLabel{font-size:var(--radio-button-font-size, 12px)!important;font-weight:var(--radio-button-font-weight, 400);cursor:pointer;color:var(--radio-button-font-color, #444444)}.radio-btn-icon{margin-top:-2px;margin-left:4px}.selected-radio-btn{border:1px solid #ffbb00!important}.disable-radio-btn{background:#f5f5f5;pointer-events:none;cursor:none}\n"], dependencies: [{ kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i2$
|
|
775
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\" [ngStyle]=\"{\r\n }\">{{field()?.label}}<span class=\"error-message\" *ngIf=\"field()?.validators?.isRequired\">*</span></label>\r\n @if(reactiveFormControlobject()) {\r\n <mat-radio-group class=\"w-100\" *ngIf=\"field() && field()?.isVisible\"\r\n class=\"radio-btn-group radio-btn-gender\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n (change)=\"onRadioGroupChange($event)\"\r\n >\r\n <div\r\n class=\"card radio-card-gender py-auto px-1\"\r\n *ngFor=\"let data of field()?.options\"\r\n [ngClass]=\"{'disable-radio-btn': field()?.isDisable || reactiveFormControlobject?.disabled}\"\r\n (click)=\"toggleRadio(data.value, $event)\"\r\n [ngStyle]=\"{\r\n '--radio-button-border-color': inputValue === data.value ? field()?.controlStyle?.focusBorderColor : field()?.controlStyle?.borderColor,\r\n '--radio-button-background-color': inputValue === data.value ? field()?.controlStyle?.focusBackground : field()?.controlStyle?.background,\r\n '--radio-button-border-width': inputValue === data.value ? field()?.controlStyle?.focusBorderWidth : field()?.controlStyle?.borderWidth,\r\n '--radio-button-border-radius': inputValue === data.value ? field()?.controlStyle?.borderRadius : field()?.controlStyle?.borderRadius,\r\n }\"\r\n >\r\n <mat-radio-button\r\n style=\"min-width: 72px; text-align: center;\"\r\n class=\"radioButtonGender\"\r\n [value]=\"data.value\"\r\n >\r\n <span style=\"white-space: pre-line;\" class=\"forRadioLabel\" [ngStyle]=\"{\r\n '--radio-button-font-weight': field()?.controlStyle?.fontWeight,\r\n '--radio-button-font-size': field()?.controlStyle?.fontSize,\r\n '--radio-button-font-color': field()?.controlStyle?.color,\r\n }\">{{ data.label }}\r\n <img class=\"radio-btn-icon\" *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n </span>\r\n </mat-radio-button>\r\n </div>\r\n </mat-radio-group>\r\n }@else {\r\n <mat-radio-group class=\"w-100\" *ngIf=\"field() && field()?.isVisible\"\r\n class=\"radio-btn-group radio-btn-gender\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [value]=\"inputValue\"\r\n (change)=\"onRadioGroupChange($event)\"\r\n >\r\n <div\r\n class=\"card radio-card-gender py-auto px-1\"\r\n style=\"width: 100% !important; min-width: fit-content !important;\"\r\n *ngFor=\"let data of field()?.options\"\r\n [ngClass]=\"{'disable-radio-btn': field()?.isDisable}\"\r\n (click)=\"toggleRadio(data.value, $event)\"\r\n [ngStyle]=\"{\r\n '--radio-button-border-color': inputValue === data.value ? field()?.controlStyle?.focusBorderColor : field()?.controlStyle?.borderColor,\r\n '--radio-button-background-color': inputValue === data.value ? field()?.controlStyle?.focusBackground : field()?.controlStyle?.background,\r\n '--radio-button-border-width': inputValue === data.value ? field()?.controlStyle?.focusBorderWidth : field()?.controlStyle?.borderWidth,\r\n '--radio-button-border-radius': inputValue === data.value ? field()?.controlStyle?.borderRadius : field()?.controlStyle?.borderRadius,\r\n }\"\r\n >\r\n <mat-radio-button\r\n style=\"min-width: 72px; text-align: center;\"\r\n class=\"radioButtonGender\"\r\n [value]=\"data.value\"\r\n >\r\n <span style=\"white-space: pre-line;\" class=\"forRadioLabel\" [ngStyle]=\"{\r\n '--radio-button-font-weight': field()?.controlStyle?.fontWeight,\r\n '--radio-button-font-size': field()?.controlStyle?.fontSize,\r\n '--radio-button-font-color': field()?.controlStyle?.color,\r\n }\">{{ data.label }}\r\n <img class=\"radio-btn-icon\" *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n </span>\r\n </mat-radio-button>\r\n </div>\r\n </mat-radio-group>\r\n }\r\n <div class=\"error-message\" *ngIf=\"false\">\r\n {{field()?.validators?.patternMessage}}.\r\n</div>\r\n", styles: [".radio-selection-border{border:1px solid #ffbb00!important;background:#fffaeb!important}*{font-family:mulish!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important;white-space:pre-wrap!important}.error-message{color:red}.radio-btn-group{display:flex;align-items:center;gap:1rem;align-self:stretch}::ng-deep .radio-btn-gender .mdc-form-field .mdc-radio{display:none!important}.radio-card-gender{box-shadow:none;border-color:var(--radio-button-border-color,#DADADA);border-width:var(--radio-button-border-width, 1px solid);background:var(--radio-button-background-color, #FFFFFF);display:flex;align-items:center;cursor:pointer;width:max-content!important;border-radius:var(--radio-button-border-radius, 6px)}::ng-deep .radioButtonGender .mdc-form-field .mdc-radio{display:none!important}.forRadioLabel{font-size:var(--radio-button-font-size, 12px)!important;font-weight:var(--radio-button-font-weight, 400);cursor:pointer;color:var(--radio-button-font-color, #444444)}.radio-btn-icon{margin-top:-2px;margin-left:4px}.selected-radio-btn{border:1px solid #ffbb00!important}.disable-radio-btn{background:#f5f5f5;pointer-events:none;cursor:none}\n"], dependencies: [{ kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i2$2.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$2.MatRadioButton, selector: "mat-radio-button", inputs: ["id", "name", "aria-label", "aria-labelledby", "aria-describedby", "disableRipple", "tabIndex", "checked", "value", "labelPosition", "disabled", "required", "color", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioButton"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
776
776
|
}
|
|
777
777
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioComponent, decorators: [{
|
|
778
778
|
type: Component,
|
|
@@ -798,7 +798,7 @@ class ToggleComponent {
|
|
|
798
798
|
this.masterService = masterService;
|
|
799
799
|
}
|
|
800
800
|
field = input.required();
|
|
801
|
-
inputValue =
|
|
801
|
+
inputValue = false;
|
|
802
802
|
reactiveFormControlobject = input();
|
|
803
803
|
_onChange = (inputValue) => { };
|
|
804
804
|
_onTouched = () => { };
|
|
@@ -824,11 +824,23 @@ class ToggleComponent {
|
|
|
824
824
|
this.change.emit(this.inputValue);
|
|
825
825
|
}
|
|
826
826
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToggleComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
827
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ToggleComponent, isStandalone: true, selector: "lib-toggle", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, reactiveFormControlobject: { classPropertyName: "reactiveFormControlobject", publicName: "reactiveFormControlobject", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" },
|
|
827
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ToggleComponent, isStandalone: true, selector: "lib-toggle", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, reactiveFormControlobject: { classPropertyName: "reactiveFormControlobject", publicName: "reactiveFormControlobject", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" }, providers: [
|
|
828
|
+
{
|
|
829
|
+
provide: NG_VALUE_ACCESSOR,
|
|
830
|
+
useExisting: forwardRef(() => ToggleComponent),
|
|
831
|
+
multi: true,
|
|
832
|
+
},
|
|
833
|
+
], ngImport: i0, template: "<div class=\"\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\" [ngStyle]=\"{\r\n '--custom-toggle-bg-color': field()?.controlStyle?.background,\r\n '--custom-toggle-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-toggle-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-toggle-border-radius': field()?.controlStyle?.borderRadius,\r\n '--custom-toggle-width': field()?.controlStyle?.width,\r\n }\"\r\n class=\"card toggle-background mt-2\"\r\n >\r\n <div class=\"toggle_switch mt-2\">\r\n <div *ngIf=\"field().configData?.leftLabel\" [ngStyle]=\"{\r\n '--custom-toggle-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-toggle-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-toggle-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-toggle-font-color': field()?.controlStyle?.color ,\r\n }\" class=\"toggle-text\">\r\n <div>{{field().configData?.leftLabel}}</div>\r\n </div>\r\n <div class=\"mt-1\">\r\n <label class=\"switch\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n type=\"checkbox\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [checked]=\"inputValue\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n (change)=\"onToggleChange($event)\"\r\n />\r\n }@else {\r\n <input\r\n type=\"checkbox\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [checked]=\"inputValue\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n (change)=\"onToggleChange($event)\"\r\n />\r\n }\r\n <span class=\"slider round\"></span>\r\n </label>\r\n </div>\r\n <div [ngStyle]=\"{\r\n '--custom-toggle-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-toggle-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-toggle-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-toggle-font-color': field()?.controlStyle?.color ,\r\n }\" class=\"toggle-text mb-2\">\r\n <div>{{field()?.label}}</div>\r\n <div style=\"font-size: 10px; font-weight: 400;\" *ngIf=\"field().configData?.subLabel\">{{field()?.configData?.subLabel}} <img alt=\"\" [src]=\"field()?.imageUrl\" *ngIf=\"field()?.imageUrl\" /> </div>\r\n </div>\r\n </div>\r\n </div>\r\n", styles: ["*{font-family:mulish!important}::ng-deep .toggle-background{background-color:var(--custom-toggle-bg-color , #f5f5f5)!important;padding:2px 8px;width:var(--custom-toggle-width , 100%)!important;box-shadow:none}::ng-deep .toggle-background{border-color:var(--custom-toggle-border-color , transparent)!important;border-radius:var(--custom-toggle-border-radius , 4px)!important;border-width:var(--custom-toggle-border-width , 1px)!important}::ng-deep .toggle_switch{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:400;font-family:Mulish;color:#444}::ng-deep .switch{position:relative;display:inline-block;width:34px;height:18px}::ng-deep .switch input{opacity:0;width:0;height:0}::ng-deep .slider{position:absolute;cursor:pointer;inset:0;background-color:#ddd;-webkit-transition:.4s;transition:.4s}::ng-deep .slider:before{position:absolute;content:\"\";height:11px;width:11px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}::ng-deep .slider.round{border-radius:34px}::ng-deep input:checked+.slider{background-color:#fb0}::ng-deep input:checked+.slider:before{-webkit-transform:translateX(16px);-ms-transform:translateX(16px);transform:translate(16px)}::ng-deep .slider.round:before{border-radius:50%}::ng-deep .remove-border{border:none!important;outline:none!important;box-shadow:none!important}::ng-deep .remove-border:focus-visible{border:none!important;outline:none!important;box-shadow:none!important}::ng-deep .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,.mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:#fb0!important;background-color:#fb0!important;border-radius:4px!important}::ng-deep .mdc-checkbox__checkmark{color:#fff!important}::ng-deep .mdc-checkbox__background{border:1px solid #dadada!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.CheckboxRequiredValidator, selector: "input[type=checkbox][required][formControlName],input[type=checkbox][required][formControl],input[type=checkbox][required][ngModel]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
828
834
|
}
|
|
829
835
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToggleComponent, decorators: [{
|
|
830
836
|
type: Component,
|
|
831
|
-
args: [{ selector: 'lib-toggle', standalone: true, imports: [CommonModule, ReactiveFormsModule],
|
|
837
|
+
args: [{ selector: 'lib-toggle', standalone: true, imports: [CommonModule, ReactiveFormsModule], providers: [
|
|
838
|
+
{
|
|
839
|
+
provide: NG_VALUE_ACCESSOR,
|
|
840
|
+
useExisting: forwardRef(() => ToggleComponent),
|
|
841
|
+
multi: true,
|
|
842
|
+
},
|
|
843
|
+
], template: "<div class=\"\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\" [ngStyle]=\"{\r\n '--custom-toggle-bg-color': field()?.controlStyle?.background,\r\n '--custom-toggle-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-toggle-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-toggle-border-radius': field()?.controlStyle?.borderRadius,\r\n '--custom-toggle-width': field()?.controlStyle?.width,\r\n }\"\r\n class=\"card toggle-background mt-2\"\r\n >\r\n <div class=\"toggle_switch mt-2\">\r\n <div *ngIf=\"field().configData?.leftLabel\" [ngStyle]=\"{\r\n '--custom-toggle-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-toggle-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-toggle-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-toggle-font-color': field()?.controlStyle?.color ,\r\n }\" class=\"toggle-text\">\r\n <div>{{field().configData?.leftLabel}}</div>\r\n </div>\r\n <div class=\"mt-1\">\r\n <label class=\"switch\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n type=\"checkbox\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [checked]=\"inputValue\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n (change)=\"onToggleChange($event)\"\r\n />\r\n }@else {\r\n <input\r\n type=\"checkbox\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [checked]=\"inputValue\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n (change)=\"onToggleChange($event)\"\r\n />\r\n }\r\n <span class=\"slider round\"></span>\r\n </label>\r\n </div>\r\n <div [ngStyle]=\"{\r\n '--custom-toggle-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-toggle-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-toggle-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-toggle-font-color': field()?.controlStyle?.color ,\r\n }\" class=\"toggle-text mb-2\">\r\n <div>{{field()?.label}}</div>\r\n <div style=\"font-size: 10px; font-weight: 400;\" *ngIf=\"field().configData?.subLabel\">{{field()?.configData?.subLabel}} <img alt=\"\" [src]=\"field()?.imageUrl\" *ngIf=\"field()?.imageUrl\" /> </div>\r\n </div>\r\n </div>\r\n </div>\r\n", styles: ["*{font-family:mulish!important}::ng-deep .toggle-background{background-color:var(--custom-toggle-bg-color , #f5f5f5)!important;padding:2px 8px;width:var(--custom-toggle-width , 100%)!important;box-shadow:none}::ng-deep .toggle-background{border-color:var(--custom-toggle-border-color , transparent)!important;border-radius:var(--custom-toggle-border-radius , 4px)!important;border-width:var(--custom-toggle-border-width , 1px)!important}::ng-deep .toggle_switch{display:flex;align-items:center;gap:10px;font-size:17px;font-weight:400;font-family:Mulish;color:#444}::ng-deep .switch{position:relative;display:inline-block;width:34px;height:18px}::ng-deep .switch input{opacity:0;width:0;height:0}::ng-deep .slider{position:absolute;cursor:pointer;inset:0;background-color:#ddd;-webkit-transition:.4s;transition:.4s}::ng-deep .slider:before{position:absolute;content:\"\";height:11px;width:11px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}::ng-deep .slider.round{border-radius:34px}::ng-deep input:checked+.slider{background-color:#fb0}::ng-deep input:checked+.slider:before{-webkit-transform:translateX(16px);-ms-transform:translateX(16px);transform:translate(16px)}::ng-deep .slider.round:before{border-radius:50%}::ng-deep .remove-border{border:none!important;outline:none!important;box-shadow:none!important}::ng-deep .remove-border:focus-visible{border:none!important;outline:none!important;box-shadow:none!important}::ng-deep .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,.mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:#fb0!important;background-color:#fb0!important;border-radius:4px!important}::ng-deep .mdc-checkbox__checkmark{color:#fff!important}::ng-deep .mdc-checkbox__background{border:1px solid #dadada!important}\n"] }]
|
|
832
844
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { change: [{
|
|
833
845
|
type: Output
|
|
834
846
|
}] } });
|
|
@@ -912,13 +924,13 @@ class FilePreviewComponent {
|
|
|
912
924
|
document.body.removeChild(link);
|
|
913
925
|
setTimeout(() => URL.revokeObjectURL(url), 100);
|
|
914
926
|
}
|
|
915
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FilePreviewComponent, deps: [{ token: i1$
|
|
916
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: FilePreviewComponent, isStandalone: true, selector: "lib-file-preview", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, file: { classPropertyName: "file", publicName: "file", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, ngImport: i0, template: "<div class=\"file-preview-modal\" \r\n *ngIf=\"field() && field()?.isVisible\"\r\n [id]=\"field()?.fieldName + '_preview'\"\r\n (click)=\"onBackdropClick($event)\"\r\n (keydown.escape)=\"closePreview()\"\r\n [ngStyle]=\"{\r\n '--modal-background': field()?.previewStyle?.modalBackground || 'rgba(0, 0, 0, 0.9)',\r\n '--modal-z-index': field()?.previewStyle?.zIndex || '10000',\r\n '--modal-width': field()?.previewStyle?.width || '100%',\r\n '--modal-height': field()?.previewStyle?.height || '100%'\r\n }\">\r\n \r\n <!-- Image Preview -->\r\n <div *ngIf=\"isImage()\" \r\n class=\"preview-container image-container\"\r\n [id]=\"field()?.fieldName + '_image_container'\"\r\n [ngStyle]=\"{\r\n '--image-container-background': field()?.previewStyle?.imageContainerBackground || 'transparent',\r\n '--image-container-border-radius': field()?.previewStyle?.imageContainerBorderRadius || '8px',\r\n '--image-container-padding': field()?.previewStyle?.imageContainerPadding || '20px',\r\n '--image-container-margin': field()?.previewStyle?.imageContainerMargin || '0'\r\n }\">\r\n \r\n <button class=\"close-btn\" \r\n type=\"button\"\r\n [id]=\"field()?.fieldName + '_close_btn'\"\r\n (click)=\"closePreview()\" \r\n [title]=\"field()?.previewStyle?.closeBtnTitle || 'Close'\"\r\n [ngStyle]=\"{\r\n '--close-btn-background': field()?.previewStyle?.closeBtnBackground || 'rgba(255, 255, 255, 0.9)',\r\n '--close-btn-color': field()?.previewStyle?.closeBtnColor || '#000',\r\n '--close-btn-border-radius': field()?.previewStyle?.closeBtnBorderRadius || '50%',\r\n '--close-btn-font-size': field()?.previewStyle?.closeBtnFontSize || '20px',\r\n '--close-btn-font-weight': field()?.previewStyle?.closeBtnFontWeight || 'bold',\r\n '--close-btn-hover-background': field()?.previewStyle?.closeBtnHoverBackground || 'rgba(255, 255, 255, 1)'\r\n }\">×</button>\r\n \r\n <h3 class=\"file-title\"\r\n [ngStyle]=\"{\r\n '--title-color': field()?.previewStyle?.titleColor || '#fff',\r\n '--title-font-family': field()?.previewStyle?.titleFontFamily || 'Mulish',\r\n '--title-font-size': field()?.previewStyle?.titleFontSize || '18px',\r\n '--title-font-weight': field()?.previewStyle?.titleFontWeight || '600',\r\n '--title-margin': field()?.previewStyle?.titleMargin || '0 0 10px 0',\r\n '--title-padding': field()?.previewStyle?.titlePadding || '0 10px'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <img [src]=\"fileDataUrl\" \r\n [alt]=\"file()?.name\" \r\n [id]=\"field()?.fieldName + '_preview_image'\"\r\n class=\"preview-image\"\r\n [ngStyle]=\"{\r\n '--image-max-width': field()?.previewStyle?.imageMaxWidth || '100%',\r\n '--image-max-height': field()?.previewStyle?.imageMaxHeight || '80vh',\r\n '--image-border-radius': field()?.previewStyle?.imageBorderRadius || '8px',\r\n '--image-box-shadow': field()?.previewStyle?.imageBoxShadow || '0 4px 20px rgba(0,0,0,0.5)',\r\n '--image-object-fit': field()?.previewStyle?.imageObjectFit || 'contain'\r\n }\" />\r\n </div>\r\n\r\n <!-- PDF Preview -->\r\n <div *ngIf=\"isPdf()\" \r\n class=\"preview-container pdf-container\"\r\n [id]=\"field()?.fieldName + '_pdf_container'\"\r\n [ngStyle]=\"{\r\n '--pdf-container-background': field()?.previewStyle?.pdfContainerBackground || '#fff',\r\n '--pdf-container-border-radius': field()?.previewStyle?.pdfContainerBorderRadius || '8px',\r\n '--pdf-container-width': field()?.previewStyle?.pdfContainerWidth || '95vw',\r\n '--pdf-container-height': field()?.previewStyle?.pdfContainerHeight || '95vh'\r\n }\">\r\n \r\n <!-- Top-right action buttons -->\r\n <div class=\"pdf-actions-top-right\"\r\n [ngStyle]=\"{\r\n '--actions-top': field()?.previewStyle?.actionsTop || '15px',\r\n '--actions-right': field()?.previewStyle?.actionsRight || '15px',\r\n '--actions-gap': field()?.previewStyle?.actionsGap || '10px'\r\n }\">\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"action-icon-btn close-btn\"\r\n [id]=\"field()?.fieldName + '_close_pdf'\"\r\n [title]=\"field()?.previewStyle?.closeBtnTitle || 'Close'\"\r\n [ngStyle]=\"{\r\n '--close-btn-background': field()?.previewStyle?.closeBtnBackground || 'rgba(255, 255, 255, 0.9)',\r\n '--close-btn-color': field()?.previewStyle?.closeBtnColor || '#000',\r\n '--close-btn-border-radius': field()?.previewStyle?.closeBtnBorderRadius || '50%',\r\n '--close-btn-font-size': field()?.previewStyle?.closeBtnFontSize || '20px',\r\n '--close-btn-font-weight': field()?.previewStyle?.closeBtnFontWeight || 'bold',\r\n '--close-btn-hover-background': field()?.previewStyle?.closeBtnHoverBackground || 'rgba(255, 255, 255, 1)'\r\n }\">×</button>\r\n </div>\r\n \r\n <!-- File title -->\r\n <h3 class=\"file-title pdf-title\"\r\n [ngStyle]=\"{\r\n '--pdf-title-color': field()?.previewStyle?.pdfTitleColor || '#333',\r\n '--pdf-title-font-family': field()?.previewStyle?.pdfTitleFontFamily || 'Mulish',\r\n '--pdf-title-font-size': field()?.previewStyle?.pdfTitleFontSize || '16px',\r\n '--pdf-title-font-weight': field()?.previewStyle?.pdfTitleFontWeight || '600',\r\n '--pdf-title-margin': field()?.previewStyle?.pdfTitleMargin || '0px 20px 10px 20px',\r\n '--pdf-title-padding': field()?.previewStyle?.pdfTitlePadding || '0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <iframe [src]=\"safeFileUrl\" \r\n [title]=\"file()?.name\" \r\n [id]=\"field()?.fieldName + '_pdf_iframe'\"\r\n class=\"pdf-iframe\"\r\n [ngStyle]=\"{\r\n '--iframe-border': field()?.previewStyle?.iframeBorder || 'none',\r\n '--iframe-border-radius': field()?.previewStyle?.iframeBorderRadius || '0',\r\n '--iframe-width': field()?.previewStyle?.iframeWidth || '100%',\r\n '--iframe-height': field()?.previewStyle?.iframeHeight || 'calc(100% - 80px)',\r\n '--iframe-min-height': field()?.previewStyle?.iframeMinHeight || '600px'\r\n }\"></iframe>\r\n </div>\r\n\r\n <!-- Text Preview -->\r\n <div *ngIf=\"isText()\" \r\n class=\"preview-container text-container\"\r\n [id]=\"field()?.fieldName + '_text_container'\"\r\n [ngStyle]=\"{\r\n '--text-container-background': field()?.previewStyle?.textContainerBackground || '#fff',\r\n '--text-container-border-radius': field()?.previewStyle?.textContainerBorderRadius || '8px',\r\n '--text-container-width': field()?.previewStyle?.textContainerWidth || '95vw',\r\n '--text-container-height': field()?.previewStyle?.textContainerHeight || '95vh'\r\n }\">\r\n \r\n <div class=\"text-header\"\r\n [id]=\"field()?.fieldName + '_text_header'\"\r\n [ngStyle]=\"{\r\n '--text-header-background': field()?.previewStyle?.textHeaderBackground || '#f8f9fa',\r\n '--text-header-border-color': field()?.previewStyle?.textHeaderBorderColor || '#dee2e6',\r\n '--text-header-padding': field()?.previewStyle?.textHeaderPadding || '15px 20px'\r\n }\">\r\n \r\n <h3 class=\"file-title\"\r\n [ngStyle]=\"{\r\n '--text-title-color': field()?.previewStyle?.textTitleColor || '#333',\r\n '--text-title-font-family': field()?.previewStyle?.textTitleFontFamily || 'Mulish',\r\n '--text-title-font-size': field()?.previewStyle?.textTitleFontSize || '16px',\r\n '--text-title-font-weight': field()?.previewStyle?.textTitleFontWeight || '600',\r\n '--text-title-margin': field()?.previewStyle?.textTitleMargin || '0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"btn btn-danger\"\r\n [id]=\"field()?.fieldName + '_close_text'\"\r\n [ngStyle]=\"{\r\n '--btn-danger-background': field()?.previewStyle?.btnDangerBackground || '#dc3545',\r\n '--btn-danger-color': field()?.previewStyle?.btnDangerColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.closeText || 'Close' }}</button>\r\n </div>\r\n \r\n <pre class=\"text-content\"\r\n [id]=\"field()?.fieldName + '_text_content'\"\r\n [ngStyle]=\"{\r\n '--text-content-background': field()?.previewStyle?.textContentBackground || '#fff',\r\n '--text-content-color': field()?.previewStyle?.textContentColor || '#333',\r\n '--text-content-font-family': field()?.previewStyle?.textContentFontFamily || 'Consolas, Monaco, Courier New, monospace',\r\n '--text-content-font-size': field()?.previewStyle?.textContentFontSize || '14px',\r\n '--text-content-line-height': field()?.previewStyle?.textContentLineHeight || '1.5',\r\n '--text-content-padding': field()?.previewStyle?.textContentPadding || '20px',\r\n '--text-content-margin': field()?.previewStyle?.textContentMargin || '0'\r\n }\">{{ textContent }}</pre>\r\n </div>\r\n\r\n <!-- Unsupported File -->\r\n <div *ngIf=\"isUnsupported()\" \r\n class=\"preview-container unsupported-container\"\r\n [id]=\"field()?.fieldName + '_unsupported_container'\"\r\n [ngStyle]=\"{\r\n '--unsupported-background': field()?.previewStyle?.unsupportedBackground || '#fff',\r\n '--unsupported-border-radius': field()?.previewStyle?.unsupportedBorderRadius || '8px',\r\n '--unsupported-padding': field()?.previewStyle?.unsupportedPadding || '40px',\r\n '--unsupported-min-width': field()?.previewStyle?.unsupportedMinWidth || '300px'\r\n }\">\r\n \r\n <div class=\"unsupported-content\">\r\n <h3 [ngStyle]=\"{\r\n '--unsupported-title-color': field()?.previewStyle?.unsupportedTitleColor || '#333',\r\n '--unsupported-title-font-family': field()?.previewStyle?.unsupportedTitleFontFamily || 'Mulish',\r\n '--unsupported-title-font-size': field()?.previewStyle?.unsupportedTitleFontSize || '18px',\r\n '--unsupported-title-font-weight': field()?.previewStyle?.unsupportedTitleFontWeight || '600',\r\n '--unsupported-title-margin': field()?.previewStyle?.unsupportedTitleMargin || '0 0 20px 0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <p [ngStyle]=\"{\r\n '--unsupported-text-color': field()?.previewStyle?.unsupportedTextColor || '#666',\r\n '--unsupported-text-font-size': field()?.previewStyle?.unsupportedTextFontSize || '14px',\r\n '--unsupported-text-margin': field()?.previewStyle?.unsupportedTextMargin || '0 0 30px 0'\r\n }\">{{ field()?.previewStyle?.unsupportedMessage || 'Preview not available for this file type' }}</p>\r\n \r\n <div class=\"unsupported-actions\"\r\n [ngStyle]=\"{\r\n '--actions-gap': field()?.previewStyle?.actionsGap || '15px',\r\n '--actions-justify': field()?.previewStyle?.actionsJustify || 'center'\r\n }\">\r\n \r\n <button (click)=\"downloadFile()\" \r\n type=\"button\"\r\n class=\"btn btn-primary\"\r\n [id]=\"field()?.fieldName + '_download'\"\r\n [ngStyle]=\"{\r\n '--btn-primary-background': field()?.previewStyle?.btnPrimaryBackground || '#007bff',\r\n '--btn-primary-color': field()?.previewStyle?.btnPrimaryColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.downloadText || 'Download' }}</button>\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"btn btn-secondary\"\r\n [id]=\"field()?.fieldName + '_close_unsupported'\"\r\n [ngStyle]=\"{\r\n '--btn-secondary-background': field()?.previewStyle?.btnSecondaryBackground || '#6c757d',\r\n '--btn-secondary-color': field()?.previewStyle?.btnSecondaryColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.closeText || 'Close' }}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".file-preview-modal{position:fixed;top:0;left:0;width:var(--modal-width, 100%);height:var(--modal-height, 100%);background:var(--modal-background, rgba(0, 0, 0, .9));z-index:var(--modal-z-index, 10000);display:flex;align-items:center;justify-content:center;overflow:auto}.preview-container{position:relative;max-width:90%;max-height:90%;display:flex;flex-direction:column;align-items:center;background:var(--image-container-background, transparent);border-radius:var(--image-container-border-radius, 8px);padding:var(--image-container-padding, 10px);margin:var(--image-container-margin, 0)}.close-btn{position:absolute;top:0;right:10px;width:40px!important;height:40px!important;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;background:var(--close-btn-background, rgba(255, 255, 255, .9));color:var(--close-btn-color, #000);border-radius:var(--close-btn-border-radius, 50%);font-size:var(--close-btn-font-size, 20px);font-weight:var(--close-btn-font-weight, bold);z-index:1001;box-shadow:1px 0 4px 1px #c7c7c7}.close-btn:hover{background:var(--close-btn-hover-background, rgba(255, 255, 255, 1))}.file-title{color:var(--title-color, #000000);font-family:var(--title-font-family, \"Mulish\");font-size:var(--title-font-size, 18px);font-weight:var(--title-font-weight, 600);margin:var(--title-margin, 0 0 10px 0);padding:var(--title-padding, 0 10px);text-align:center;word-break:break-all}.preview-image{max-width:var(--image-max-width, 100%);max-height:var(--image-max-height, 80vh);object-fit:var(--image-object-fit, contain);border-radius:var(--image-border-radius, 4px);box-shadow:var(--image-box-shadow, 0 4px 20px rgba(0, 0, 0, .3))}.preview-content{width:100%;height:80vh;border:none;border-radius:var(--content-border-radius, 4px)}.text-content{background:var(--text-background, #fff);color:var(--text-color, #000);padding:var(--text-padding, 20px);border-radius:var(--text-border-radius, 4px);max-width:var(--text-max-width, 800px);max-height:var(--text-max-height, 70vh);overflow:auto;white-space:pre-wrap;font-family:var(--text-font-family, \"Courier New, monospace\")}.action-buttons{margin-top:20px;display:flex;gap:10px}.action-btn{padding:var(--btn-padding, 8px 16px);background:var(--btn-background, #007bff);color:var(--btn-color, #fff);border:none;border-radius:var(--btn-border-radius, 4px);cursor:pointer;font-size:var(--btn-font-size, 14px)}.action-btn:hover{background:var(--btn-hover-background, #0056b3)}.unsupported-content{text-align:center;color:var(--unsupported-color, #fff);padding:var(--unsupported-padding, 40px)}.pdf-iframe{width:var(--iframe-width, 100%);height:var(--iframe-height, 80vh);min-height:var(--iframe-min-height, 600px);border:var(--iframe-border, none);border-radius:var(--iframe-border-radius, 0)}.pdf-container{width:var(--pdf-container-width, 95vw);height:var(--pdf-container-height, 95vh);background:var(--pdf-container-background, #fff);border-radius:var(--pdf-container-border-radius, 8px);display:flex;flex-direction:column;overflow:hidden}.pdf-header{background:var(--pdf-header-background, #f8f9fa);border-bottom:1px solid var(--pdf-header-border-color, #dee2e6);padding:var(--pdf-header-padding, 15px 20px);flex-shrink:0}.pdf-actions{display:flex;gap:10px;margin-top:10px}.btn{padding:var(--btn-padding, 8px 16px);border:none;border-radius:var(--btn-border-radius, 4px);cursor:pointer;font-size:var(--btn-font-size, 14px);font-weight:var(--btn-font-weight, 400);text-decoration:none;display:inline-block}.btn-primary{background:var(--btn-primary-background, #007bff);color:var(--btn-primary-color, #fff)}.btn-primary:hover{background:var(--btn-primary-hover-background, #0056b3)}.btn-danger{background:var(--btn-danger-background, #dc3545);color:var(--btn-danger-color, #fff)}.btn-danger:hover{background:var(--btn-danger-hover-background, #c82333)}.pdf-actions-top-right{position:absolute;top:var(--actions-top, 15px);right:var(--actions-right, 15px);display:flex;gap:var(--actions-gap, 10px);z-index:1001}.action-icon-btn{width:40px;height:40px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--icon-btn-border-radius, 50%);font-size:var(--icon-btn-font-size, 16px);transition:background-color .2s ease}.open-new-tab-btn{background:var(--icon-btn-background, rgba(255, 255, 255, .9));color:var(--icon-btn-color, #007bff)}.open-new-tab-btn:hover{background:var(--icon-btn-hover-background, rgba(255, 255, 255, 1))}.pdf-title{color:var(--pdf-title-color, #333);font-family:var(--pdf-title-font-family, \"Mulish\");font-size:var(--pdf-title-font-size, 16px);font-weight:var(--pdf-title-font-weight, 600);margin:var(--pdf-title-margin, 0 20px 10px 20px);padding:var(--pdf-title-padding, 0);text-align:center}.pdf-iframe{width:var(--iframe-width, 100%);height:var(--iframe-height, calc(100% - 80px) );min-height:var(--iframe-min-height, 600px);border:var(--iframe-border, none);border-radius:var(--iframe-border-radius, 0);margin:0 20px 20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
927
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FilePreviewComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
928
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: FilePreviewComponent, isStandalone: true, selector: "lib-file-preview", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, file: { classPropertyName: "file", publicName: "file", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, ngImport: i0, template: "<div class=\"file-preview-modal\" \r\n *ngIf=\"field() && field()?.isVisible\"\r\n [id]=\"field()?.fieldName + '_preview'\"\r\n (click)=\"onBackdropClick($event)\"\r\n (keydown.escape)=\"closePreview()\"\r\n [ngStyle]=\"{\r\n '--modal-background': field()?.previewStyle?.modalBackground || 'rgba(0, 0, 0, 0.9)',\r\n '--modal-z-index': field()?.previewStyle?.zIndex || '10000',\r\n '--modal-width': field()?.previewStyle?.width || '100%',\r\n '--modal-height': field()?.previewStyle?.height || '100%'\r\n }\">\r\n \r\n <!-- Image Preview -->\r\n <div *ngIf=\"isImage()\" \r\n class=\"preview-container image-container\"\r\n [id]=\"field()?.fieldName + '_image_container'\"\r\n [ngStyle]=\"{\r\n '--image-container-background': field()?.previewStyle?.imageContainerBackground || 'transparent',\r\n '--image-container-border-radius': field()?.previewStyle?.imageContainerBorderRadius || '8px',\r\n '--image-container-padding': field()?.previewStyle?.imageContainerPadding || '20px',\r\n '--image-container-margin': field()?.previewStyle?.imageContainerMargin || '0'\r\n }\">\r\n \r\n <button class=\"close-btn\" \r\n type=\"button\"\r\n [id]=\"field()?.fieldName + '_close_btn'\"\r\n (click)=\"closePreview()\" \r\n [title]=\"field()?.previewStyle?.closeBtnTitle || 'Close'\"\r\n [ngStyle]=\"{\r\n '--close-btn-background': field()?.previewStyle?.closeBtnBackground || 'rgba(255, 255, 255, 0.9)',\r\n '--close-btn-color': field()?.previewStyle?.closeBtnColor || '#000',\r\n '--close-btn-border-radius': field()?.previewStyle?.closeBtnBorderRadius || '50%',\r\n '--close-btn-font-size': field()?.previewStyle?.closeBtnFontSize || '20px',\r\n '--close-btn-font-weight': field()?.previewStyle?.closeBtnFontWeight || 'bold',\r\n '--close-btn-hover-background': field()?.previewStyle?.closeBtnHoverBackground || 'rgba(255, 255, 255, 1)'\r\n }\">×</button>\r\n \r\n <h3 class=\"file-title\"\r\n [ngStyle]=\"{\r\n '--title-color': field()?.previewStyle?.titleColor || '#fff',\r\n '--title-font-family': field()?.previewStyle?.titleFontFamily || 'Mulish',\r\n '--title-font-size': field()?.previewStyle?.titleFontSize || '18px',\r\n '--title-font-weight': field()?.previewStyle?.titleFontWeight || '600',\r\n '--title-margin': field()?.previewStyle?.titleMargin || '0 0 10px 0',\r\n '--title-padding': field()?.previewStyle?.titlePadding || '0 10px'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <img [src]=\"fileDataUrl\" \r\n [alt]=\"file()?.name\" \r\n [id]=\"field()?.fieldName + '_preview_image'\"\r\n class=\"preview-image\"\r\n [ngStyle]=\"{\r\n '--image-max-width': field()?.previewStyle?.imageMaxWidth || '100%',\r\n '--image-max-height': field()?.previewStyle?.imageMaxHeight || '80vh',\r\n '--image-border-radius': field()?.previewStyle?.imageBorderRadius || '8px',\r\n '--image-box-shadow': field()?.previewStyle?.imageBoxShadow || '0 4px 20px rgba(0,0,0,0.5)',\r\n '--image-object-fit': field()?.previewStyle?.imageObjectFit || 'contain'\r\n }\" />\r\n </div>\r\n\r\n <!-- PDF Preview -->\r\n <div *ngIf=\"isPdf()\" \r\n class=\"preview-container pdf-container\"\r\n [id]=\"field()?.fieldName + '_pdf_container'\"\r\n [ngStyle]=\"{\r\n '--pdf-container-background': field()?.previewStyle?.pdfContainerBackground || '#fff',\r\n '--pdf-container-border-radius': field()?.previewStyle?.pdfContainerBorderRadius || '8px',\r\n '--pdf-container-width': field()?.previewStyle?.pdfContainerWidth || '95vw',\r\n '--pdf-container-height': field()?.previewStyle?.pdfContainerHeight || '95vh'\r\n }\">\r\n \r\n <!-- Top-right action buttons -->\r\n <div class=\"pdf-actions-top-right\"\r\n [ngStyle]=\"{\r\n '--actions-top': field()?.previewStyle?.actionsTop || '15px',\r\n '--actions-right': field()?.previewStyle?.actionsRight || '15px',\r\n '--actions-gap': field()?.previewStyle?.actionsGap || '10px'\r\n }\">\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"action-icon-btn close-btn\"\r\n [id]=\"field()?.fieldName + '_close_pdf'\"\r\n [title]=\"field()?.previewStyle?.closeBtnTitle || 'Close'\"\r\n [ngStyle]=\"{\r\n '--close-btn-background': field()?.previewStyle?.closeBtnBackground || 'rgba(255, 255, 255, 0.9)',\r\n '--close-btn-color': field()?.previewStyle?.closeBtnColor || '#000',\r\n '--close-btn-border-radius': field()?.previewStyle?.closeBtnBorderRadius || '50%',\r\n '--close-btn-font-size': field()?.previewStyle?.closeBtnFontSize || '20px',\r\n '--close-btn-font-weight': field()?.previewStyle?.closeBtnFontWeight || 'bold',\r\n '--close-btn-hover-background': field()?.previewStyle?.closeBtnHoverBackground || 'rgba(255, 255, 255, 1)'\r\n }\">×</button>\r\n </div>\r\n \r\n <!-- File title -->\r\n <h3 class=\"file-title pdf-title\"\r\n [ngStyle]=\"{\r\n '--pdf-title-color': field()?.previewStyle?.pdfTitleColor || '#333',\r\n '--pdf-title-font-family': field()?.previewStyle?.pdfTitleFontFamily || 'Mulish',\r\n '--pdf-title-font-size': field()?.previewStyle?.pdfTitleFontSize || '16px',\r\n '--pdf-title-font-weight': field()?.previewStyle?.pdfTitleFontWeight || '600',\r\n '--pdf-title-margin': field()?.previewStyle?.pdfTitleMargin || '0px 20px 10px 20px',\r\n '--pdf-title-padding': field()?.previewStyle?.pdfTitlePadding || '0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <iframe [src]=\"safeFileUrl\" \r\n [title]=\"file()?.name\" \r\n [id]=\"field()?.fieldName + '_pdf_iframe'\"\r\n class=\"pdf-iframe\"\r\n [ngStyle]=\"{\r\n '--iframe-border': field()?.previewStyle?.iframeBorder || 'none',\r\n '--iframe-border-radius': field()?.previewStyle?.iframeBorderRadius || '0',\r\n '--iframe-width': field()?.previewStyle?.iframeWidth || '100%',\r\n '--iframe-height': field()?.previewStyle?.iframeHeight || 'calc(100% - 80px)',\r\n '--iframe-min-height': field()?.previewStyle?.iframeMinHeight || '600px'\r\n }\"></iframe>\r\n </div>\r\n\r\n <!-- Text Preview -->\r\n <div *ngIf=\"isText()\" \r\n class=\"preview-container text-container\"\r\n [id]=\"field()?.fieldName + '_text_container'\"\r\n [ngStyle]=\"{\r\n '--text-container-background': field()?.previewStyle?.textContainerBackground || '#fff',\r\n '--text-container-border-radius': field()?.previewStyle?.textContainerBorderRadius || '8px',\r\n '--text-container-width': field()?.previewStyle?.textContainerWidth || '95vw',\r\n '--text-container-height': field()?.previewStyle?.textContainerHeight || '95vh'\r\n }\">\r\n \r\n <div class=\"text-header\"\r\n [id]=\"field()?.fieldName + '_text_header'\"\r\n [ngStyle]=\"{\r\n '--text-header-background': field()?.previewStyle?.textHeaderBackground || '#f8f9fa',\r\n '--text-header-border-color': field()?.previewStyle?.textHeaderBorderColor || '#dee2e6',\r\n '--text-header-padding': field()?.previewStyle?.textHeaderPadding || '15px 20px'\r\n }\">\r\n \r\n <h3 class=\"file-title\"\r\n [ngStyle]=\"{\r\n '--text-title-color': field()?.previewStyle?.textTitleColor || '#333',\r\n '--text-title-font-family': field()?.previewStyle?.textTitleFontFamily || 'Mulish',\r\n '--text-title-font-size': field()?.previewStyle?.textTitleFontSize || '16px',\r\n '--text-title-font-weight': field()?.previewStyle?.textTitleFontWeight || '600',\r\n '--text-title-margin': field()?.previewStyle?.textTitleMargin || '0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"btn btn-danger\"\r\n [id]=\"field()?.fieldName + '_close_text'\"\r\n [ngStyle]=\"{\r\n '--btn-danger-background': field()?.previewStyle?.btnDangerBackground || '#dc3545',\r\n '--btn-danger-color': field()?.previewStyle?.btnDangerColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.closeText || 'Close' }}</button>\r\n </div>\r\n \r\n <pre class=\"text-content\"\r\n [id]=\"field()?.fieldName + '_text_content'\"\r\n [ngStyle]=\"{\r\n '--text-content-background': field()?.previewStyle?.textContentBackground || '#fff',\r\n '--text-content-color': field()?.previewStyle?.textContentColor || '#333',\r\n '--text-content-font-family': field()?.previewStyle?.textContentFontFamily || 'Consolas, Monaco, Courier New, monospace',\r\n '--text-content-font-size': field()?.previewStyle?.textContentFontSize || '14px',\r\n '--text-content-line-height': field()?.previewStyle?.textContentLineHeight || '1.5',\r\n '--text-content-padding': field()?.previewStyle?.textContentPadding || '20px',\r\n '--text-content-margin': field()?.previewStyle?.textContentMargin || '0'\r\n }\">{{ textContent }}</pre>\r\n </div>\r\n\r\n <!-- Unsupported File -->\r\n <div *ngIf=\"isUnsupported()\" \r\n class=\"preview-container unsupported-container\"\r\n [id]=\"field()?.fieldName + '_unsupported_container'\"\r\n [ngStyle]=\"{\r\n '--unsupported-background': field()?.previewStyle?.unsupportedBackground || '#fff',\r\n '--unsupported-border-radius': field()?.previewStyle?.unsupportedBorderRadius || '8px',\r\n '--unsupported-padding': field()?.previewStyle?.unsupportedPadding || '40px',\r\n '--unsupported-min-width': field()?.previewStyle?.unsupportedMinWidth || '300px'\r\n }\">\r\n \r\n <div class=\"unsupported-content\">\r\n <h3 [ngStyle]=\"{\r\n '--unsupported-title-color': field()?.previewStyle?.unsupportedTitleColor || '#333',\r\n '--unsupported-title-font-family': field()?.previewStyle?.unsupportedTitleFontFamily || 'Mulish',\r\n '--unsupported-title-font-size': field()?.previewStyle?.unsupportedTitleFontSize || '18px',\r\n '--unsupported-title-font-weight': field()?.previewStyle?.unsupportedTitleFontWeight || '600',\r\n '--unsupported-title-margin': field()?.previewStyle?.unsupportedTitleMargin || '0 0 20px 0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <p [ngStyle]=\"{\r\n '--unsupported-text-color': field()?.previewStyle?.unsupportedTextColor || '#666',\r\n '--unsupported-text-font-size': field()?.previewStyle?.unsupportedTextFontSize || '14px',\r\n '--unsupported-text-margin': field()?.previewStyle?.unsupportedTextMargin || '0 0 30px 0'\r\n }\">{{ field()?.previewStyle?.unsupportedMessage || 'Preview not available for this file type' }}</p>\r\n \r\n <div class=\"unsupported-actions\"\r\n [ngStyle]=\"{\r\n '--actions-gap': field()?.previewStyle?.actionsGap || '15px',\r\n '--actions-justify': field()?.previewStyle?.actionsJustify || 'center'\r\n }\">\r\n \r\n <button (click)=\"downloadFile()\" \r\n type=\"button\"\r\n class=\"btn btn-primary\"\r\n [id]=\"field()?.fieldName + '_download'\"\r\n [ngStyle]=\"{\r\n '--btn-primary-background': field()?.previewStyle?.btnPrimaryBackground || '#007bff',\r\n '--btn-primary-color': field()?.previewStyle?.btnPrimaryColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.downloadText || 'Download' }}</button>\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"btn btn-secondary\"\r\n [id]=\"field()?.fieldName + '_close_unsupported'\"\r\n [ngStyle]=\"{\r\n '--btn-secondary-background': field()?.previewStyle?.btnSecondaryBackground || '#6c757d',\r\n '--btn-secondary-color': field()?.previewStyle?.btnSecondaryColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.closeText || 'Close' }}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".file-preview-modal{position:fixed;top:0;left:0;width:var(--modal-width, 100%);height:var(--modal-height, 100%);background:var(--modal-background, rgba(0, 0, 0, .9));z-index:var(--modal-z-index, 10000);display:flex;align-items:center;justify-content:center;overflow:auto}.preview-container{position:relative;max-width:90%;max-height:90%;display:flex;flex-direction:column;align-items:center;background:var(--image-container-background, transparent);border-radius:var(--image-container-border-radius, 8px);padding:var(--image-container-padding, 10px);margin:var(--image-container-margin, 0)}.close-btn{position:absolute;top:0;right:10px;width:40px!important;height:40px!important;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;background:var(--close-btn-background, rgba(255, 255, 255, .9));color:var(--close-btn-color, #000);border-radius:var(--close-btn-border-radius, 50%);font-size:var(--close-btn-font-size, 20px);font-weight:var(--close-btn-font-weight, bold);z-index:1001;box-shadow:1px 0 4px 1px #c7c7c7}.close-btn:hover{background:var(--close-btn-hover-background, rgba(255, 255, 255, 1))}.file-title{color:var(--title-color, #000000);font-family:var(--title-font-family, \"Mulish\");font-size:var(--title-font-size, 18px);font-weight:var(--title-font-weight, 600);margin:var(--title-margin, 0 0 10px 0);padding:var(--title-padding, 0 10px);text-align:center;word-break:break-all}.preview-image{max-width:var(--image-max-width, 100%);max-height:var(--image-max-height, 80vh);object-fit:var(--image-object-fit, contain);border-radius:var(--image-border-radius, 4px);box-shadow:var(--image-box-shadow, 0 4px 20px rgba(0, 0, 0, .3))}.preview-content{width:100%;height:80vh;border:none;border-radius:var(--content-border-radius, 4px)}.text-content{background:var(--text-background, #fff);color:var(--text-color, #000);padding:var(--text-padding, 20px);border-radius:var(--text-border-radius, 4px);max-width:var(--text-max-width, 800px);max-height:var(--text-max-height, 70vh);overflow:auto;white-space:pre-wrap;font-family:var(--text-font-family, \"Courier New, monospace\")}.action-buttons{margin-top:20px;display:flex;gap:10px}.action-btn{padding:var(--btn-padding, 8px 16px);background:var(--btn-background, #007bff);color:var(--btn-color, #fff);border:none;border-radius:var(--btn-border-radius, 4px);cursor:pointer;font-size:var(--btn-font-size, 14px)}.action-btn:hover{background:var(--btn-hover-background, #0056b3)}.unsupported-content{text-align:center;color:var(--unsupported-color, #fff);padding:var(--unsupported-padding, 40px)}.pdf-iframe{width:var(--iframe-width, 100%);height:var(--iframe-height, 80vh);min-height:var(--iframe-min-height, 600px);border:var(--iframe-border, none);border-radius:var(--iframe-border-radius, 0)}.pdf-container{width:var(--pdf-container-width, 95vw);height:var(--pdf-container-height, 95vh);background:var(--pdf-container-background, #fff);border-radius:var(--pdf-container-border-radius, 8px);display:flex;flex-direction:column;overflow:hidden}.pdf-header{background:var(--pdf-header-background, #f8f9fa);border-bottom:1px solid var(--pdf-header-border-color, #dee2e6);padding:var(--pdf-header-padding, 15px 20px);flex-shrink:0}.pdf-actions{display:flex;gap:10px;margin-top:10px}.btn{padding:var(--btn-padding, 8px 16px);border:none;border-radius:var(--btn-border-radius, 4px);cursor:pointer;font-size:var(--btn-font-size, 14px);font-weight:var(--btn-font-weight, 400);text-decoration:none;display:inline-block}.btn-primary{background:var(--btn-primary-background, #007bff);color:var(--btn-primary-color, #fff)}.btn-primary:hover{background:var(--btn-primary-hover-background, #0056b3)}.btn-danger{background:var(--btn-danger-background, #dc3545);color:var(--btn-danger-color, #fff)}.btn-danger:hover{background:var(--btn-danger-hover-background, #c82333)}.pdf-actions-top-right{position:absolute;top:var(--actions-top, 15px);right:var(--actions-right, 15px);display:flex;gap:var(--actions-gap, 10px);z-index:1001}.action-icon-btn{width:40px;height:40px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--icon-btn-border-radius, 50%);font-size:var(--icon-btn-font-size, 16px);transition:background-color .2s ease}.open-new-tab-btn{background:var(--icon-btn-background, rgba(255, 255, 255, .9));color:var(--icon-btn-color, #007bff)}.open-new-tab-btn:hover{background:var(--icon-btn-hover-background, rgba(255, 255, 255, 1))}.pdf-title{color:var(--pdf-title-color, #333);font-family:var(--pdf-title-font-family, \"Mulish\");font-size:var(--pdf-title-font-size, 16px);font-weight:var(--pdf-title-font-weight, 600);margin:var(--pdf-title-margin, 0 20px 10px 20px);padding:var(--pdf-title-padding, 0);text-align:center}.pdf-iframe{width:var(--iframe-width, 100%);height:var(--iframe-height, calc(100% - 80px) );min-height:var(--iframe-min-height, 600px);border:var(--iframe-border, none);border-radius:var(--iframe-border-radius, 0);margin:0 20px 20px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
917
929
|
}
|
|
918
930
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FilePreviewComponent, decorators: [{
|
|
919
931
|
type: Component,
|
|
920
932
|
args: [{ selector: 'lib-file-preview', standalone: true, imports: [CommonModule], template: "<div class=\"file-preview-modal\" \r\n *ngIf=\"field() && field()?.isVisible\"\r\n [id]=\"field()?.fieldName + '_preview'\"\r\n (click)=\"onBackdropClick($event)\"\r\n (keydown.escape)=\"closePreview()\"\r\n [ngStyle]=\"{\r\n '--modal-background': field()?.previewStyle?.modalBackground || 'rgba(0, 0, 0, 0.9)',\r\n '--modal-z-index': field()?.previewStyle?.zIndex || '10000',\r\n '--modal-width': field()?.previewStyle?.width || '100%',\r\n '--modal-height': field()?.previewStyle?.height || '100%'\r\n }\">\r\n \r\n <!-- Image Preview -->\r\n <div *ngIf=\"isImage()\" \r\n class=\"preview-container image-container\"\r\n [id]=\"field()?.fieldName + '_image_container'\"\r\n [ngStyle]=\"{\r\n '--image-container-background': field()?.previewStyle?.imageContainerBackground || 'transparent',\r\n '--image-container-border-radius': field()?.previewStyle?.imageContainerBorderRadius || '8px',\r\n '--image-container-padding': field()?.previewStyle?.imageContainerPadding || '20px',\r\n '--image-container-margin': field()?.previewStyle?.imageContainerMargin || '0'\r\n }\">\r\n \r\n <button class=\"close-btn\" \r\n type=\"button\"\r\n [id]=\"field()?.fieldName + '_close_btn'\"\r\n (click)=\"closePreview()\" \r\n [title]=\"field()?.previewStyle?.closeBtnTitle || 'Close'\"\r\n [ngStyle]=\"{\r\n '--close-btn-background': field()?.previewStyle?.closeBtnBackground || 'rgba(255, 255, 255, 0.9)',\r\n '--close-btn-color': field()?.previewStyle?.closeBtnColor || '#000',\r\n '--close-btn-border-radius': field()?.previewStyle?.closeBtnBorderRadius || '50%',\r\n '--close-btn-font-size': field()?.previewStyle?.closeBtnFontSize || '20px',\r\n '--close-btn-font-weight': field()?.previewStyle?.closeBtnFontWeight || 'bold',\r\n '--close-btn-hover-background': field()?.previewStyle?.closeBtnHoverBackground || 'rgba(255, 255, 255, 1)'\r\n }\">×</button>\r\n \r\n <h3 class=\"file-title\"\r\n [ngStyle]=\"{\r\n '--title-color': field()?.previewStyle?.titleColor || '#fff',\r\n '--title-font-family': field()?.previewStyle?.titleFontFamily || 'Mulish',\r\n '--title-font-size': field()?.previewStyle?.titleFontSize || '18px',\r\n '--title-font-weight': field()?.previewStyle?.titleFontWeight || '600',\r\n '--title-margin': field()?.previewStyle?.titleMargin || '0 0 10px 0',\r\n '--title-padding': field()?.previewStyle?.titlePadding || '0 10px'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <img [src]=\"fileDataUrl\" \r\n [alt]=\"file()?.name\" \r\n [id]=\"field()?.fieldName + '_preview_image'\"\r\n class=\"preview-image\"\r\n [ngStyle]=\"{\r\n '--image-max-width': field()?.previewStyle?.imageMaxWidth || '100%',\r\n '--image-max-height': field()?.previewStyle?.imageMaxHeight || '80vh',\r\n '--image-border-radius': field()?.previewStyle?.imageBorderRadius || '8px',\r\n '--image-box-shadow': field()?.previewStyle?.imageBoxShadow || '0 4px 20px rgba(0,0,0,0.5)',\r\n '--image-object-fit': field()?.previewStyle?.imageObjectFit || 'contain'\r\n }\" />\r\n </div>\r\n\r\n <!-- PDF Preview -->\r\n <div *ngIf=\"isPdf()\" \r\n class=\"preview-container pdf-container\"\r\n [id]=\"field()?.fieldName + '_pdf_container'\"\r\n [ngStyle]=\"{\r\n '--pdf-container-background': field()?.previewStyle?.pdfContainerBackground || '#fff',\r\n '--pdf-container-border-radius': field()?.previewStyle?.pdfContainerBorderRadius || '8px',\r\n '--pdf-container-width': field()?.previewStyle?.pdfContainerWidth || '95vw',\r\n '--pdf-container-height': field()?.previewStyle?.pdfContainerHeight || '95vh'\r\n }\">\r\n \r\n <!-- Top-right action buttons -->\r\n <div class=\"pdf-actions-top-right\"\r\n [ngStyle]=\"{\r\n '--actions-top': field()?.previewStyle?.actionsTop || '15px',\r\n '--actions-right': field()?.previewStyle?.actionsRight || '15px',\r\n '--actions-gap': field()?.previewStyle?.actionsGap || '10px'\r\n }\">\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"action-icon-btn close-btn\"\r\n [id]=\"field()?.fieldName + '_close_pdf'\"\r\n [title]=\"field()?.previewStyle?.closeBtnTitle || 'Close'\"\r\n [ngStyle]=\"{\r\n '--close-btn-background': field()?.previewStyle?.closeBtnBackground || 'rgba(255, 255, 255, 0.9)',\r\n '--close-btn-color': field()?.previewStyle?.closeBtnColor || '#000',\r\n '--close-btn-border-radius': field()?.previewStyle?.closeBtnBorderRadius || '50%',\r\n '--close-btn-font-size': field()?.previewStyle?.closeBtnFontSize || '20px',\r\n '--close-btn-font-weight': field()?.previewStyle?.closeBtnFontWeight || 'bold',\r\n '--close-btn-hover-background': field()?.previewStyle?.closeBtnHoverBackground || 'rgba(255, 255, 255, 1)'\r\n }\">×</button>\r\n </div>\r\n \r\n <!-- File title -->\r\n <h3 class=\"file-title pdf-title\"\r\n [ngStyle]=\"{\r\n '--pdf-title-color': field()?.previewStyle?.pdfTitleColor || '#333',\r\n '--pdf-title-font-family': field()?.previewStyle?.pdfTitleFontFamily || 'Mulish',\r\n '--pdf-title-font-size': field()?.previewStyle?.pdfTitleFontSize || '16px',\r\n '--pdf-title-font-weight': field()?.previewStyle?.pdfTitleFontWeight || '600',\r\n '--pdf-title-margin': field()?.previewStyle?.pdfTitleMargin || '0px 20px 10px 20px',\r\n '--pdf-title-padding': field()?.previewStyle?.pdfTitlePadding || '0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <iframe [src]=\"safeFileUrl\" \r\n [title]=\"file()?.name\" \r\n [id]=\"field()?.fieldName + '_pdf_iframe'\"\r\n class=\"pdf-iframe\"\r\n [ngStyle]=\"{\r\n '--iframe-border': field()?.previewStyle?.iframeBorder || 'none',\r\n '--iframe-border-radius': field()?.previewStyle?.iframeBorderRadius || '0',\r\n '--iframe-width': field()?.previewStyle?.iframeWidth || '100%',\r\n '--iframe-height': field()?.previewStyle?.iframeHeight || 'calc(100% - 80px)',\r\n '--iframe-min-height': field()?.previewStyle?.iframeMinHeight || '600px'\r\n }\"></iframe>\r\n </div>\r\n\r\n <!-- Text Preview -->\r\n <div *ngIf=\"isText()\" \r\n class=\"preview-container text-container\"\r\n [id]=\"field()?.fieldName + '_text_container'\"\r\n [ngStyle]=\"{\r\n '--text-container-background': field()?.previewStyle?.textContainerBackground || '#fff',\r\n '--text-container-border-radius': field()?.previewStyle?.textContainerBorderRadius || '8px',\r\n '--text-container-width': field()?.previewStyle?.textContainerWidth || '95vw',\r\n '--text-container-height': field()?.previewStyle?.textContainerHeight || '95vh'\r\n }\">\r\n \r\n <div class=\"text-header\"\r\n [id]=\"field()?.fieldName + '_text_header'\"\r\n [ngStyle]=\"{\r\n '--text-header-background': field()?.previewStyle?.textHeaderBackground || '#f8f9fa',\r\n '--text-header-border-color': field()?.previewStyle?.textHeaderBorderColor || '#dee2e6',\r\n '--text-header-padding': field()?.previewStyle?.textHeaderPadding || '15px 20px'\r\n }\">\r\n \r\n <h3 class=\"file-title\"\r\n [ngStyle]=\"{\r\n '--text-title-color': field()?.previewStyle?.textTitleColor || '#333',\r\n '--text-title-font-family': field()?.previewStyle?.textTitleFontFamily || 'Mulish',\r\n '--text-title-font-size': field()?.previewStyle?.textTitleFontSize || '16px',\r\n '--text-title-font-weight': field()?.previewStyle?.textTitleFontWeight || '600',\r\n '--text-title-margin': field()?.previewStyle?.textTitleMargin || '0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"btn btn-danger\"\r\n [id]=\"field()?.fieldName + '_close_text'\"\r\n [ngStyle]=\"{\r\n '--btn-danger-background': field()?.previewStyle?.btnDangerBackground || '#dc3545',\r\n '--btn-danger-color': field()?.previewStyle?.btnDangerColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.closeText || 'Close' }}</button>\r\n </div>\r\n \r\n <pre class=\"text-content\"\r\n [id]=\"field()?.fieldName + '_text_content'\"\r\n [ngStyle]=\"{\r\n '--text-content-background': field()?.previewStyle?.textContentBackground || '#fff',\r\n '--text-content-color': field()?.previewStyle?.textContentColor || '#333',\r\n '--text-content-font-family': field()?.previewStyle?.textContentFontFamily || 'Consolas, Monaco, Courier New, monospace',\r\n '--text-content-font-size': field()?.previewStyle?.textContentFontSize || '14px',\r\n '--text-content-line-height': field()?.previewStyle?.textContentLineHeight || '1.5',\r\n '--text-content-padding': field()?.previewStyle?.textContentPadding || '20px',\r\n '--text-content-margin': field()?.previewStyle?.textContentMargin || '0'\r\n }\">{{ textContent }}</pre>\r\n </div>\r\n\r\n <!-- Unsupported File -->\r\n <div *ngIf=\"isUnsupported()\" \r\n class=\"preview-container unsupported-container\"\r\n [id]=\"field()?.fieldName + '_unsupported_container'\"\r\n [ngStyle]=\"{\r\n '--unsupported-background': field()?.previewStyle?.unsupportedBackground || '#fff',\r\n '--unsupported-border-radius': field()?.previewStyle?.unsupportedBorderRadius || '8px',\r\n '--unsupported-padding': field()?.previewStyle?.unsupportedPadding || '40px',\r\n '--unsupported-min-width': field()?.previewStyle?.unsupportedMinWidth || '300px'\r\n }\">\r\n \r\n <div class=\"unsupported-content\">\r\n <h3 [ngStyle]=\"{\r\n '--unsupported-title-color': field()?.previewStyle?.unsupportedTitleColor || '#333',\r\n '--unsupported-title-font-family': field()?.previewStyle?.unsupportedTitleFontFamily || 'Mulish',\r\n '--unsupported-title-font-size': field()?.previewStyle?.unsupportedTitleFontSize || '18px',\r\n '--unsupported-title-font-weight': field()?.previewStyle?.unsupportedTitleFontWeight || '600',\r\n '--unsupported-title-margin': field()?.previewStyle?.unsupportedTitleMargin || '0 0 20px 0'\r\n }\">{{ file()?.name }}</h3>\r\n \r\n <p [ngStyle]=\"{\r\n '--unsupported-text-color': field()?.previewStyle?.unsupportedTextColor || '#666',\r\n '--unsupported-text-font-size': field()?.previewStyle?.unsupportedTextFontSize || '14px',\r\n '--unsupported-text-margin': field()?.previewStyle?.unsupportedTextMargin || '0 0 30px 0'\r\n }\">{{ field()?.previewStyle?.unsupportedMessage || 'Preview not available for this file type' }}</p>\r\n \r\n <div class=\"unsupported-actions\"\r\n [ngStyle]=\"{\r\n '--actions-gap': field()?.previewStyle?.actionsGap || '15px',\r\n '--actions-justify': field()?.previewStyle?.actionsJustify || 'center'\r\n }\">\r\n \r\n <button (click)=\"downloadFile()\" \r\n type=\"button\"\r\n class=\"btn btn-primary\"\r\n [id]=\"field()?.fieldName + '_download'\"\r\n [ngStyle]=\"{\r\n '--btn-primary-background': field()?.previewStyle?.btnPrimaryBackground || '#007bff',\r\n '--btn-primary-color': field()?.previewStyle?.btnPrimaryColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.downloadText || 'Download' }}</button>\r\n \r\n <button (click)=\"closePreview()\" \r\n type=\"button\"\r\n class=\"btn btn-secondary\"\r\n [id]=\"field()?.fieldName + '_close_unsupported'\"\r\n [ngStyle]=\"{\r\n '--btn-secondary-background': field()?.previewStyle?.btnSecondaryBackground || '#6c757d',\r\n '--btn-secondary-color': field()?.previewStyle?.btnSecondaryColor || '#fff',\r\n '--btn-border-radius': field()?.previewStyle?.btnBorderRadius || '4px',\r\n '--btn-padding': field()?.previewStyle?.btnPadding || '8px 16px',\r\n '--btn-font-size': field()?.previewStyle?.btnFontSize || '14px'\r\n }\">{{ field()?.previewStyle?.closeText || 'Close' }}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".file-preview-modal{position:fixed;top:0;left:0;width:var(--modal-width, 100%);height:var(--modal-height, 100%);background:var(--modal-background, rgba(0, 0, 0, .9));z-index:var(--modal-z-index, 10000);display:flex;align-items:center;justify-content:center;overflow:auto}.preview-container{position:relative;max-width:90%;max-height:90%;display:flex;flex-direction:column;align-items:center;background:var(--image-container-background, transparent);border-radius:var(--image-container-border-radius, 8px);padding:var(--image-container-padding, 10px);margin:var(--image-container-margin, 0)}.close-btn{position:absolute;top:0;right:10px;width:40px!important;height:40px!important;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;background:var(--close-btn-background, rgba(255, 255, 255, .9));color:var(--close-btn-color, #000);border-radius:var(--close-btn-border-radius, 50%);font-size:var(--close-btn-font-size, 20px);font-weight:var(--close-btn-font-weight, bold);z-index:1001;box-shadow:1px 0 4px 1px #c7c7c7}.close-btn:hover{background:var(--close-btn-hover-background, rgba(255, 255, 255, 1))}.file-title{color:var(--title-color, #000000);font-family:var(--title-font-family, \"Mulish\");font-size:var(--title-font-size, 18px);font-weight:var(--title-font-weight, 600);margin:var(--title-margin, 0 0 10px 0);padding:var(--title-padding, 0 10px);text-align:center;word-break:break-all}.preview-image{max-width:var(--image-max-width, 100%);max-height:var(--image-max-height, 80vh);object-fit:var(--image-object-fit, contain);border-radius:var(--image-border-radius, 4px);box-shadow:var(--image-box-shadow, 0 4px 20px rgba(0, 0, 0, .3))}.preview-content{width:100%;height:80vh;border:none;border-radius:var(--content-border-radius, 4px)}.text-content{background:var(--text-background, #fff);color:var(--text-color, #000);padding:var(--text-padding, 20px);border-radius:var(--text-border-radius, 4px);max-width:var(--text-max-width, 800px);max-height:var(--text-max-height, 70vh);overflow:auto;white-space:pre-wrap;font-family:var(--text-font-family, \"Courier New, monospace\")}.action-buttons{margin-top:20px;display:flex;gap:10px}.action-btn{padding:var(--btn-padding, 8px 16px);background:var(--btn-background, #007bff);color:var(--btn-color, #fff);border:none;border-radius:var(--btn-border-radius, 4px);cursor:pointer;font-size:var(--btn-font-size, 14px)}.action-btn:hover{background:var(--btn-hover-background, #0056b3)}.unsupported-content{text-align:center;color:var(--unsupported-color, #fff);padding:var(--unsupported-padding, 40px)}.pdf-iframe{width:var(--iframe-width, 100%);height:var(--iframe-height, 80vh);min-height:var(--iframe-min-height, 600px);border:var(--iframe-border, none);border-radius:var(--iframe-border-radius, 0)}.pdf-container{width:var(--pdf-container-width, 95vw);height:var(--pdf-container-height, 95vh);background:var(--pdf-container-background, #fff);border-radius:var(--pdf-container-border-radius, 8px);display:flex;flex-direction:column;overflow:hidden}.pdf-header{background:var(--pdf-header-background, #f8f9fa);border-bottom:1px solid var(--pdf-header-border-color, #dee2e6);padding:var(--pdf-header-padding, 15px 20px);flex-shrink:0}.pdf-actions{display:flex;gap:10px;margin-top:10px}.btn{padding:var(--btn-padding, 8px 16px);border:none;border-radius:var(--btn-border-radius, 4px);cursor:pointer;font-size:var(--btn-font-size, 14px);font-weight:var(--btn-font-weight, 400);text-decoration:none;display:inline-block}.btn-primary{background:var(--btn-primary-background, #007bff);color:var(--btn-primary-color, #fff)}.btn-primary:hover{background:var(--btn-primary-hover-background, #0056b3)}.btn-danger{background:var(--btn-danger-background, #dc3545);color:var(--btn-danger-color, #fff)}.btn-danger:hover{background:var(--btn-danger-hover-background, #c82333)}.pdf-actions-top-right{position:absolute;top:var(--actions-top, 15px);right:var(--actions-right, 15px);display:flex;gap:var(--actions-gap, 10px);z-index:1001}.action-icon-btn{width:40px;height:40px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:var(--icon-btn-border-radius, 50%);font-size:var(--icon-btn-font-size, 16px);transition:background-color .2s ease}.open-new-tab-btn{background:var(--icon-btn-background, rgba(255, 255, 255, .9));color:var(--icon-btn-color, #007bff)}.open-new-tab-btn:hover{background:var(--icon-btn-hover-background, rgba(255, 255, 255, 1))}.pdf-title{color:var(--pdf-title-color, #333);font-family:var(--pdf-title-font-family, \"Mulish\");font-size:var(--pdf-title-font-size, 16px);font-weight:var(--pdf-title-font-weight, 600);margin:var(--pdf-title-margin, 0 20px 10px 20px);padding:var(--pdf-title-padding, 0);text-align:center}.pdf-iframe{width:var(--iframe-width, 100%);height:var(--iframe-height, calc(100% - 80px) );min-height:var(--iframe-min-height, 600px);border:var(--iframe-border, none);border-radius:var(--iframe-border-radius, 0);margin:0 20px 20px}\n"] }]
|
|
921
|
-
}], ctorParameters: () => [{ type: i1$
|
|
933
|
+
}], ctorParameters: () => [{ type: i1$1.DomSanitizer }], propDecorators: { closed: [{
|
|
922
934
|
type: Output
|
|
923
935
|
}] } });
|
|
924
936
|
|
|
@@ -1042,7 +1054,7 @@ class UploadComponent {
|
|
|
1042
1054
|
useExisting: UploadComponent,
|
|
1043
1055
|
multi: true
|
|
1044
1056
|
}
|
|
1045
|
-
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<label class=\"field-lable upload-label\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field()?.label}}</label>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [multiple]=\"field()?.configData?.multiple\"\r\n [accept]=\"field()?.configData?.accept\"\r\n #fileInput\r\n (change)=\"onFileSelected($event)\"\r\n (click)=\"fileInput.value = ''\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"disabled\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [multiple]=\"field()?.configData?.multiple\"\r\n [accept]=\"field()?.configData?.accept\"\r\n #fileInput\r\n (change)=\"onFileSelected($event)\"\r\n (click)=\"fileInput.value = ''\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"disabled\"\r\n />\r\n }\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn\"\r\n (click)=\"triggerFileInput()\"\r\n [ngClass]=\"field()?.label ? 'lightbackground' : 'successBackground'\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [disabled]=\"disabled\"\r\n [ngStyle]=\"{\r\n'--upload-width': field()?.controlStyle?.width ,\r\n'--upload-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--upload-border-color': field()?.controlStyle?.borderColor ,\r\n'--upload-border-width': field()?.controlStyle?.borderWidth ,\r\n'--upload-border-style': field()?.controlStyle?.borderStyle ,\r\n'--upload-background-color': field()?.controlStyle?.background ,\r\n'--upload-focus-border-color': field()?.controlStyle?.focusBorderColor ,\r\n'--upload-focus-background-color': field()?.controlStyle?.focusBackground ,\r\n}\"\r\n >\r\n <ng-container *ngIf=\"field()?.label && !hasFiles(); else fileUploadedTemplate\">\r\n <span class=\"upload-icon\">\r\n <span\r\n ><img [src]=\"field()?.imageUrl\" alt=\"\"/></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.placeHolder }}</span>\r\n </span>\r\n </ng-container>\r\n <ng-template #fileUploadedTemplate>\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\" class=\"uploaded-file d-flex gap-4\" style=\"transform: translate(0px, -3px);\">\r\n <span class=\"mt-2 right-icon\" style=\" white-space: nowrap !important;\r\n overflow: hidden !important;\r\n text-overflow: ellipsis !important;\">\r\n <span><img [src]=\"field()?.imageUrl\" alt=\"\"/></span>\r\n <span [title]=\"file.name\">{{ file.name }}</span>\r\n </span>\r\n <div class=\"mt-2 left-icon\">\r\n <span (click)=\"previewFile(file, i);$event.stopPropagation()\"><img src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\" alt=\"\"/></span>\r\n <span (click)=\"removeFile(i, $event);$event.stopPropagation()\" style=\"cursor: pointer;\">\r\n <img src=\"https://cdn.godigit.com/retail-life/delete-oui.svg\" alt=\"\"/>\r\n </span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </button>\r\n <div class=\"upload-info\" *ngIf=\"field() && field()?.isVisible && field()?.configData?.subText\">{{field()?.configData?.subText}}</div>\r\n", styles: ["*{font-family:mulish!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.upload-label{opacity:1}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , 8px)!important}.lightbackground{border-color:#999;border-width:1px;border-style:dashed;background:#fff;color:#444;font-size:14px;font-weight:700}.lightbackground{border-color:var(--upload-border-color , #999)!important;border-width:var(--upload-border-width , 1px)!important;border-style:var(--upload-border-style , dashed)!important;background:var(--upload-background-color , #ffffff)!important}.successBackground{border-color:var(--upload-focus-border-color , #ddd)!important;background:var(--upload-focus-background-color , #fafafa)!important;color:var(--upload-focus-font-color , #444)!important}.successBackground{border:1px dashed #ddd;background:#fafafa;color:#444;display:flex;justify-content:space-between}.upload-icon{display:flex;justify-content:center;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.right-icon{display:flex;gap:10px;margin-left:.5em}.left-icon{display:flex;gap:15px;margin-right:1em}.upload-info{font-size:10px;font-weight:500;font-family:Mulish!important;letter-spacing:0px;color:#444}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
1057
|
+
], viewQueries: [{ propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "<label class=\"field-lable upload-label\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field()?.label}}</label>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [multiple]=\"field()?.configData?.multiple\"\r\n [accept]=\"field()?.configData?.accept\"\r\n #fileInput\r\n (change)=\"onFileSelected($event)\"\r\n (click)=\"fileInput.value = ''\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"disabled\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [multiple]=\"field()?.configData?.multiple\"\r\n [accept]=\"field()?.configData?.accept\"\r\n #fileInput\r\n (change)=\"onFileSelected($event)\"\r\n (click)=\"fileInput.value = ''\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"disabled\"\r\n />\r\n }\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn\"\r\n (click)=\"triggerFileInput()\"\r\n [ngClass]=\"field()?.label ? 'lightbackground' : 'successBackground'\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [disabled]=\"disabled\"\r\n [ngStyle]=\"{\r\n'--upload-width': field()?.controlStyle?.width ,\r\n'--upload-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--upload-border-color': field()?.controlStyle?.borderColor ,\r\n'--upload-border-width': field()?.controlStyle?.borderWidth ,\r\n'--upload-border-style': field()?.controlStyle?.borderStyle ,\r\n'--upload-background-color': field()?.controlStyle?.background ,\r\n'--upload-focus-border-color': field()?.controlStyle?.focusBorderColor ,\r\n'--upload-focus-background-color': field()?.controlStyle?.focusBackground ,\r\n}\"\r\n >\r\n <ng-container *ngIf=\"field()?.label && !hasFiles(); else fileUploadedTemplate\">\r\n <span class=\"upload-icon\">\r\n <span\r\n ><img [src]=\"field()?.imageUrl\" alt=\"\"/></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.placeHolder }}</span>\r\n </span>\r\n </ng-container>\r\n <ng-template #fileUploadedTemplate>\r\n <div *ngFor=\"let file of uploadedFiles; let i = index\" class=\"uploaded-file d-flex gap-4\" style=\"transform: translate(0px, -3px);\">\r\n <span class=\"mt-2 right-icon\" style=\" white-space: nowrap !important;\r\n overflow: hidden !important;\r\n text-overflow: ellipsis !important;\">\r\n <span><img [src]=\"field()?.imageUrl\" alt=\"\"/></span>\r\n <span [title]=\"file.name\">{{ file.name }}</span>\r\n </span>\r\n <div class=\"mt-2 left-icon\">\r\n <span (click)=\"previewFile(file, i);$event.stopPropagation()\"><img src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\" alt=\"\"/></span>\r\n <span (click)=\"removeFile(i, $event);$event.stopPropagation()\" style=\"cursor: pointer;\">\r\n <img src=\"https://cdn.godigit.com/retail-life/delete-oui.svg\" alt=\"\"/>\r\n </span>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </button>\r\n <div class=\"upload-info\" *ngIf=\"field() && field()?.isVisible && field()?.configData?.subText\">{{field()?.configData?.subText}}</div>\r\n", styles: ["*{font-family:mulish!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.upload-label{opacity:1}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , 8px)!important}.lightbackground{border-color:#999;border-width:1px;border-style:dashed;background:#fff;color:#444;font-size:14px;font-weight:700}.lightbackground{border-color:var(--upload-border-color , #999)!important;border-width:var(--upload-border-width , 1px)!important;border-style:var(--upload-border-style , dashed)!important;background:var(--upload-background-color , #ffffff)!important}.successBackground{border-color:var(--upload-focus-border-color , #ddd)!important;background:var(--upload-focus-background-color , #fafafa)!important;color:var(--upload-focus-font-color , #444)!important}.successBackground{border:1px dashed #ddd;background:#fafafa;color:#444;display:flex;justify-content:space-between}.upload-icon{display:flex;justify-content:center;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.right-icon{display:flex;gap:10px;margin-left:.5em}.left-icon{display:flex;gap:15px;margin-right:1em}.upload-info{font-size:10px;font-weight:500;font-family:Mulish!important;letter-spacing:0px;color:#444}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1046
1058
|
}
|
|
1047
1059
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UploadComponent, decorators: [{
|
|
1048
1060
|
type: Component,
|
|
@@ -1173,7 +1185,7 @@ class DobComponent {
|
|
|
1173
1185
|
deps: []
|
|
1174
1186
|
},
|
|
1175
1187
|
{ provide: MAT_DATE_FORMATS, useValue: MY_DATE_FORMAT }
|
|
1176
|
-
], ngImport: i0, template: "<label\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n class=\"field-lable\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n '--custom-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-font-color': field()?.controlStyle?.color ,\r\n '--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n '--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n '--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n }\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [min]=\"field()?.configData?.min\"\r\n [max]=\"field()?.configData?.max\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onDateChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [min]=\"field()?.configData?.min\"\r\n [max]=\"field()?.configData?.max\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onDateChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\r\n <img\r\n src=\"https://cdn.godigit.com/digitPlusAssets/retail-life-icon/svgicon/date_picker_icon.svg\"\r\n style=\"width: 16px\"\r\n matDatepickerToggleIcon\r\n />\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #picker></mat-datepicker>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"field()?.configData?.isInvalid\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}::ng-deep .mat-calendar-period-button .mdc-button__label{display:flex;flex-direction:row-reverse;align-items:center;gap:10px}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i5.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "ngmodule", type: MomentDateModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1188
|
+
], ngImport: i0, template: "<label\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n class=\"field-lable\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n '--custom-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-font-color': field()?.controlStyle?.color ,\r\n '--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n '--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n '--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n }\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [min]=\"field()?.configData?.min\"\r\n [max]=\"field()?.configData?.max\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onDateChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [min]=\"field()?.configData?.min\"\r\n [max]=\"field()?.configData?.max\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onDateChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\">\r\n <img\r\n src=\"https://cdn.godigit.com/digitPlusAssets/retail-life-icon/svgicon/date_picker_icon.svg\"\r\n style=\"width: 16px\"\r\n matDatepickerToggleIcon\r\n />\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #picker></mat-datepicker>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"field()?.configData?.isInvalid\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}::ng-deep .mat-calendar-period-button .mdc-button__label{display:flex;flex-direction:row-reverse;align-items:center;gap:10px}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i5.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "ngmodule", type: MomentDateModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1177
1189
|
}
|
|
1178
1190
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DobComponent, decorators: [{
|
|
1179
1191
|
type: Component,
|
|
@@ -1242,7 +1254,7 @@ class MobNumberComponent {
|
|
|
1242
1254
|
useExisting: MobNumberComponent,
|
|
1243
1255
|
multi: true
|
|
1244
1256
|
}
|
|
1245
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n<mat-form-field\r\n class=\"w-100 mobile-field\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n '--custom-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-font-color': field()?.controlStyle?.color ,\r\n '--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span *ngIf=\"true\"\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n <span class=\"seperation_line\" *ngIf=\"true\"></span>\r\n </div>\r\n\r\n\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n \r\n <span matSuffix class=\"p-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/edit-icon.svg\" alt=\"\" />\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}*{font-family:mulish!important}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 5px;margin-right:10px;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px);border-radius:6px;border:1px solid #dadada;background:#ececec}.countryCode{gap:4px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.seperation_line{width:1.3px;height:18px;background:#dadada;transform:translate(15px)}.country_code_input{color:var(--Colour-Text-headings, #444);font-size:14px;font-style:normal;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1257
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n<mat-form-field\r\n class=\"w-100 mobile-field\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n '--custom-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-font-color': field()?.controlStyle?.color ,\r\n '--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span *ngIf=\"true\"\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n <span class=\"seperation_line\" *ngIf=\"true\"></span>\r\n </div>\r\n\r\n\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n \r\n <span matSuffix class=\"p-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/edit-icon.svg\" alt=\"\" />\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}*{font-family:mulish!important}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 5px;margin-right:10px;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px);border-radius:6px;border:1px solid #dadada;background:#ececec}.countryCode{gap:4px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.seperation_line{width:1.3px;height:18px;background:#dadada;transform:translate(15px)}.country_code_input{color:var(--Colour-Text-headings, #444);font-size:14px;font-style:normal;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1246
1258
|
}
|
|
1247
1259
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MobNumberComponent, decorators: [{
|
|
1248
1260
|
type: Component,
|
|
@@ -1264,7 +1276,7 @@ class InfoComponent {
|
|
|
1264
1276
|
}
|
|
1265
1277
|
field = input.required();
|
|
1266
1278
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1267
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: InfoComponent, isStandalone: true, selector: "lib-info", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"info-background\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n '--custom-info-bg-color': field()?.controlStyle?.background ,\r\n '--custom-info-border-radius': field()?.controlStyle?.borderRadius,\r\n '--custom-info-border-width': field()?.controlStyle?.borderWidth,\r\n '--custom-info-border-color': field()?.controlStyle?.borderColor,\r\n '--custom-info-border-style': field()?.controlStyle?.borderStyle,\r\n }\">\r\n <span style=\"display: flex; align-items: flex-start; gap: 16px; padding-top: 16px; padding-bottom: 16px;\">\r\n <img\r\n class=\"info-nudge-image mb-1\"\r\n [src]=\"field()?.controlStyle?.nudgeDisplayImage\"\r\n alt=\"\"\r\n />\r\n <span class=\"info-nudge-text\" [ngStyle]=\"{\r\n '--custom-info-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-info-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-info-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-info-font-color': field()?.controlStyle?.color ,\r\n }\">{{ field()?.label }}</span>\r\n </span>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.info-background{background:var(--custom-info-bg-color , #FFFBE5)!important;border-radius:var(--custom-info-border-radius, 8px);line-height:20.08px;padding:12px 16px;border-width:1px solid var(--custom-info-border-width, 1px);border-color:1px solid var(--custom-info-border-color, #FFBB0033);border-style:1px solid var(--custom-info-border-style, solid);color:var(--custom-info-font-color, #444);font-weight:var(--custom-info-font-weight, 600);font-size:var(--custom-info-font-size, 12px)}.info-nudge-image{height:20px;margin-right:4px 10px 0px 0px}.info-nudge-text{font-size:var(--custom-info-font-size, 10px);font-family:var(--custom-info-font-family, \"Mulish\");font-weight:var(--custom-info-font-weight, 400);color:var(--custom-info-font-color, #444)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
1279
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: InfoComponent, isStandalone: true, selector: "lib-info", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"info-background\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n '--custom-info-bg-color': field()?.controlStyle?.background ,\r\n '--custom-info-border-radius': field()?.controlStyle?.borderRadius,\r\n '--custom-info-border-width': field()?.controlStyle?.borderWidth,\r\n '--custom-info-border-color': field()?.controlStyle?.borderColor,\r\n '--custom-info-border-style': field()?.controlStyle?.borderStyle,\r\n }\">\r\n <span style=\"display: flex; align-items: flex-start; gap: 16px; padding-top: 16px; padding-bottom: 16px;\">\r\n <img\r\n class=\"info-nudge-image mb-1\"\r\n [src]=\"field()?.controlStyle?.nudgeDisplayImage\"\r\n alt=\"\"\r\n />\r\n <span class=\"info-nudge-text\" [ngStyle]=\"{\r\n '--custom-info-font-size': field()?.controlStyle?.fontSize ,\r\n '--custom-info-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--custom-info-font-family': field()?.controlStyle?.fontFamily ,\r\n '--custom-info-font-color': field()?.controlStyle?.color ,\r\n }\">{{ field()?.label }}</span>\r\n </span>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.info-background{background:var(--custom-info-bg-color , #FFFBE5)!important;border-radius:var(--custom-info-border-radius, 8px);line-height:20.08px;padding:12px 16px;border-width:1px solid var(--custom-info-border-width, 1px);border-color:1px solid var(--custom-info-border-color, #FFBB0033);border-style:1px solid var(--custom-info-border-style, solid);color:var(--custom-info-font-color, #444);font-weight:var(--custom-info-font-weight, 600);font-size:var(--custom-info-font-size, 12px)}.info-nudge-image{height:20px;margin-right:4px 10px 0px 0px}.info-nudge-text{font-size:var(--custom-info-font-size, 10px);font-family:var(--custom-info-font-family, \"Mulish\");font-weight:var(--custom-info-font-weight, 400);color:var(--custom-info-font-color, #444)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
1268
1280
|
}
|
|
1269
1281
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoComponent, decorators: [{
|
|
1270
1282
|
type: Component,
|
|
@@ -1333,7 +1345,7 @@ class CheckboxComponent {
|
|
|
1333
1345
|
useExisting: CheckboxComponent,
|
|
1334
1346
|
multi: true
|
|
1335
1347
|
}
|
|
1336
|
-
], ngImport: i0, template: "@if(reactiveFormControlobject()) {\r\n<mat-checkbox *ngIf=\"field() && field()?.isVisible\" [name]=\"field()?.fieldName\" [id]=\"field()?.fieldName\"\r\n [disabled]=\"field()?.isDisable\" [required]=\"field()?.validators?.isRequired\" [checked]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\" (change)=\"onCheckboxChange($event)\" [ngStyle]=\"{\r\n '--checkbox-border-radius': field()?.controlStyle?.borderRadius,\r\n '--checkbox-bg-color': field()?.controlStyle?.background,\r\n '--checkbox-border-color': field()?.controlStyle?.borderColor,\r\n '--checkbox-border-color-focus': field()?.controlStyle?.focusBorderColor,\r\n '--checkbox-bg-color-focus': field()?.controlStyle?.focusBackground,\r\n '--checkbox-font-size': field()?.controlStyle?.fontSize,\r\n '--checkbox-font-weight': field()?.controlStyle?.fontWeight,\r\n '--checkbox-font-color': field()?.controlStyle?.color,\r\n '--checkbox-font-family': field()?.controlStyle?.fontFamily,\r\n '--checkbox-border-width': field()?.controlStyle?.borderWidth,\r\n '--checkbox-border-color-hover': field()?.controlStyle?.hoverBorderColor,\r\n '--checkbox-border-color-error': field()?.controlStyle?.errorBorderColor,\r\n '--checkbox-font-color-disabled': field()?.controlStyle?.disableColor,\r\n '--checkbox-bg-color-disabled': field()?.controlStyle?.disableBackground\r\n }\">\r\n {{ field()?.label }}\r\n <span [innerHTML]=\"field()?.configData?.innerHTML\"></span>\r\n <span [appTooltipTemplate]=\"HtmlContent\" arrowPosition=\"left\" tooltipPosition=\"bottom\">\r\n <img [src]=\"field().imageUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n <ng-template #HtmlContent>\r\n <span [innerHTML]=\"field().configData?.tooltipMessage\"></span>\r\n </ng-template>\r\n</mat-checkbox>\r\n}@else {\r\n<mat-checkbox *ngIf=\"field() && field()?.isVisible\" [name]=\"field()?.fieldName\" [id]=\"field()?.fieldName\"\r\n [disabled]=\"field()?.isDisable\" [required]=\"field()?.validators?.isRequired\" [checked]=\"inputValue\"\r\n (change)=\"onCheckboxChange($event)\" [ngStyle]=\"{\r\n '--checkbox-border-radius': field()?.controlStyle?.borderRadius,\r\n '--checkbox-bg-color': field()?.controlStyle?.background,\r\n '--checkbox-border-color': field()?.controlStyle?.borderColor,\r\n '--checkbox-border-color-focus': field()?.controlStyle?.focusBorderColor,\r\n '--checkbox-bg-color-focus': field()?.controlStyle?.focusBackground,\r\n '--checkbox-font-size': field()?.controlStyle?.fontSize,\r\n '--checkbox-font-weight': field()?.controlStyle?.fontWeight,\r\n '--checkbox-font-color': field()?.controlStyle?.color,\r\n '--checkbox-font-family': field()?.controlStyle?.fontFamily,\r\n '--checkbox-border-width': field()?.controlStyle?.borderWidth,\r\n '--checkbox-border-color-hover': field()?.controlStyle?.hoverBorderColor,\r\n '--checkbox-border-color-error': field()?.controlStyle?.errorBorderColor,\r\n '--checkbox-font-color-disabled': field()?.controlStyle?.disableColor,\r\n '--checkbox-bg-color-disabled': field()?.controlStyle?.disableBackground\r\n }\">\r\n {{ field()?.label }}\r\n <span [innerHTML]=\"field()?.configData?.innerHTML\"></span>\r\n</mat-checkbox>\r\n}\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{field()?.validators?.isRequiredMessage}}.\r\n</div>", styles: ["*{font-family:mulish!important}.error-message{color:red}.toggle-img{width:12px;margin-left:8px!important}@media screen and (max-width: 768px){.toggle-img{width:16px}}::ng-deep .mdc-checkbox__background{border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mdc-checkbox__native-control:disabled:checked~.mdc-checkbox__background{background-color:var(--checkbox-bg-color , #ffffff)!important;border-color:#0000}::ng-deep .mdc-checkbox__native-control:disabled:indeterminate~.mdc-checkbox__background{background-color:var(--checkbox-bg-color , #ffffff)!important;border-color:#0000}::ng-deep .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background{border-color:var(--checkbox-border-color-focus, #ffbb00)!important;background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:var(--checkbox-border-color-focus, #ffbb00)!important;background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked:after{color:#fff!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked{background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-indeterminate{background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mat-pseudo-checkbox{border:1px solid #DADADA}::ng-deep .checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}::ng-deep .mat-mdc-checkbox label{font-size:var(--checkbox-font-size , 16px)!important;font-weight:var(--checkbox-font-weight , 700)!important;color:var(--checkbox-font-color , #444)!important;padding:0!important;margin-bottom:2px;font-family:Mulish!important;margin-top:8px}::ng-deep .mat-mdc-checkbox .mdc-checkbox__ripple{display:none}::ng-deep .mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__checkmark{color:#fff!important}::ng-deep .mat-internal-form-field{align-items:flex-start!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
1348
|
+
], ngImport: i0, template: "@if(reactiveFormControlobject()) {\r\n<mat-checkbox *ngIf=\"field() && field()?.isVisible\" [name]=\"field()?.fieldName\" [id]=\"field()?.fieldName\"\r\n [disabled]=\"field()?.isDisable\" [required]=\"field()?.validators?.isRequired\" [checked]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\" (change)=\"onCheckboxChange($event)\" [ngStyle]=\"{\r\n '--checkbox-border-radius': field()?.controlStyle?.borderRadius,\r\n '--checkbox-bg-color': field()?.controlStyle?.background,\r\n '--checkbox-border-color': field()?.controlStyle?.borderColor,\r\n '--checkbox-border-color-focus': field()?.controlStyle?.focusBorderColor,\r\n '--checkbox-bg-color-focus': field()?.controlStyle?.focusBackground,\r\n '--checkbox-font-size': field()?.controlStyle?.fontSize,\r\n '--checkbox-font-weight': field()?.controlStyle?.fontWeight,\r\n '--checkbox-font-color': field()?.controlStyle?.color,\r\n '--checkbox-font-family': field()?.controlStyle?.fontFamily,\r\n '--checkbox-border-width': field()?.controlStyle?.borderWidth,\r\n '--checkbox-border-color-hover': field()?.controlStyle?.hoverBorderColor,\r\n '--checkbox-border-color-error': field()?.controlStyle?.errorBorderColor,\r\n '--checkbox-font-color-disabled': field()?.controlStyle?.disableColor,\r\n '--checkbox-bg-color-disabled': field()?.controlStyle?.disableBackground\r\n }\">\r\n {{ field()?.label }}\r\n <span [innerHTML]=\"field()?.configData?.innerHTML\"></span>\r\n <span [appTooltipTemplate]=\"HtmlContent\" arrowPosition=\"left\" tooltipPosition=\"bottom\">\r\n <img [src]=\"field().imageUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n <ng-template #HtmlContent>\r\n <span [innerHTML]=\"field().configData?.tooltipMessage\"></span>\r\n </ng-template>\r\n</mat-checkbox>\r\n}@else {\r\n<mat-checkbox *ngIf=\"field() && field()?.isVisible\" [name]=\"field()?.fieldName\" [id]=\"field()?.fieldName\"\r\n [disabled]=\"field()?.isDisable\" [required]=\"field()?.validators?.isRequired\" [checked]=\"inputValue\"\r\n (change)=\"onCheckboxChange($event)\" [ngStyle]=\"{\r\n '--checkbox-border-radius': field()?.controlStyle?.borderRadius,\r\n '--checkbox-bg-color': field()?.controlStyle?.background,\r\n '--checkbox-border-color': field()?.controlStyle?.borderColor,\r\n '--checkbox-border-color-focus': field()?.controlStyle?.focusBorderColor,\r\n '--checkbox-bg-color-focus': field()?.controlStyle?.focusBackground,\r\n '--checkbox-font-size': field()?.controlStyle?.fontSize,\r\n '--checkbox-font-weight': field()?.controlStyle?.fontWeight,\r\n '--checkbox-font-color': field()?.controlStyle?.color,\r\n '--checkbox-font-family': field()?.controlStyle?.fontFamily,\r\n '--checkbox-border-width': field()?.controlStyle?.borderWidth,\r\n '--checkbox-border-color-hover': field()?.controlStyle?.hoverBorderColor,\r\n '--checkbox-border-color-error': field()?.controlStyle?.errorBorderColor,\r\n '--checkbox-font-color-disabled': field()?.controlStyle?.disableColor,\r\n '--checkbox-bg-color-disabled': field()?.controlStyle?.disableBackground\r\n }\">\r\n {{ field()?.label }}\r\n <span [innerHTML]=\"field()?.configData?.innerHTML\"></span>\r\n</mat-checkbox>\r\n}\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{field()?.validators?.isRequiredMessage}}.\r\n</div>", styles: ["*{font-family:mulish!important}.error-message{color:red}.toggle-img{width:12px;margin-left:8px!important}@media screen and (max-width: 768px){.toggle-img{width:16px}}::ng-deep .mdc-checkbox__background{border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mdc-checkbox__native-control:disabled:checked~.mdc-checkbox__background{background-color:var(--checkbox-bg-color , #ffffff)!important;border-color:#0000}::ng-deep .mdc-checkbox__native-control:disabled:indeterminate~.mdc-checkbox__background{background-color:var(--checkbox-bg-color , #ffffff)!important;border-color:#0000}::ng-deep .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background{border-color:var(--checkbox-border-color-focus, #ffbb00)!important;background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background{border-color:var(--checkbox-border-color-focus, #ffbb00)!important;background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked:after{color:#fff!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked{background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-indeterminate{background-color:var(--checkbox-bg-color-focus, #ffbb00)!important;border-radius:var(--checkbox-border-radius, 4px)!important}::ng-deep .mat-pseudo-checkbox{border:1px solid #DADADA}::ng-deep .checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}::ng-deep .mat-mdc-checkbox label{font-size:var(--checkbox-font-size , 16px)!important;font-weight:var(--checkbox-font-weight , 700)!important;color:var(--checkbox-font-color , #444)!important;padding:0!important;margin-bottom:2px;font-family:Mulish!important;margin-top:8px}::ng-deep .mat-mdc-checkbox .mdc-checkbox__ripple{display:none}::ng-deep .mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__checkmark{color:#fff!important}::ng-deep .mat-internal-form-field{align-items:flex-start!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: CustomizedTooltipDirective, selector: "[appTooltipTemplate]", inputs: ["appTooltipTemplate"] }] });
|
|
1337
1349
|
}
|
|
1338
1350
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CheckboxComponent, decorators: [{
|
|
1339
1351
|
type: Component,
|
|
@@ -1387,7 +1399,7 @@ class TextareaComponent {
|
|
|
1387
1399
|
useExisting: TextareaComponent,
|
|
1388
1400
|
multi: true
|
|
1389
1401
|
}
|
|
1390
|
-
], ngImport: i0, template: "@if(reactiveFormControlobject()) {\r\n<textarea\r\n[ngStyle]=\"{\r\n '--custom-textarea-width': field()?.controlStyle?.width ,\r\n '--custom-textarea-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-textarea-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-textarea-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-border-width-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-textarea-caret-color': field()?.controlStyle?.caretColor ,\r\n '--custom-textarea-font-color': field()?.controlStyle?.color ,\r\n }\"\r\n*ngIf=\"field() && field()?.isVisible\"\r\n cols=\"40\"\r\n rows=\"3\"\r\n autocomplete=\"nope\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n (input)=\"onTextareaChange($event)\"\r\n (blur)=\"onTextareaBlur($event)\"\r\n [value]=\"textareaValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n></textarea>\r\n}@else {\r\n<textarea\r\n[ngStyle]=\"{\r\n '--custom-textarea-width': field()?.controlStyle?.width ,\r\n '--custom-textarea-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-textarea-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-textarea-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-border-width-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-textarea-caret-color': field()?.controlStyle?.caretColor ,\r\n '--custom-textarea-font-color': field()?.controlStyle?.color ,\r\n }\"\r\n*ngIf=\"field() && field()?.isVisible\"\r\n cols=\"40\"\r\n rows=\"3\"\r\n autocomplete=\"nope\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n (input)=\"onTextareaChange($event)\"\r\n (blur)=\"onTextareaBlur($event)\"\r\n [value]=\"textareaValue\"\r\n></textarea>\r\n}\r\n", styles: ["*{font-family:mulish!important}::ng-deep textarea{width:-webkit-fill-available!important;border:1.5px solid #dddddd!important;border-radius:4px!important;caret-color:#fb0!important;color:#444!important}::ng-deep textarea:focus{outline:none!important;border:1.5px solid #ffbb00!important}::ng-deep textarea:focus-visible{outline:none!important;border:1.5px solid #ffbb00!important}::ng-deep textarea{width:var(--custom-textarea-width, -webkit-fill-available)!important;border-radius:var(--custom-textarea-radius, 4px)!important;caret-color:var(--custom-textarea-caret-color, #ffbb00)!important;color:var(--custom-textarea-font-color, #444444)!important;border-color:var(--custom-textarea-border-color,#dddddd)!important;border-width:var(--custom-textarea-border-width, 1.5px solid)!important}::ng-deep textarea:focus{border-color:var(--custom-textarea-border-color-focus,#dddddd)!important;border-width:var(--custom-textarea-border-width-focus, 1.5px solid)!important}::ng-deep textarea:focus-visible{border-color:var(--custom-textarea-border-color-focus,#dddddd)!important;border-width:var(--custom-textarea-border-width-focus, 1.5px solid)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
1402
|
+
], ngImport: i0, template: "@if(reactiveFormControlobject()) {\r\n<textarea\r\n[ngStyle]=\"{\r\n '--custom-textarea-width': field()?.controlStyle?.width ,\r\n '--custom-textarea-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-textarea-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-textarea-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-border-width-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-textarea-caret-color': field()?.controlStyle?.caretColor ,\r\n '--custom-textarea-font-color': field()?.controlStyle?.color ,\r\n }\"\r\n*ngIf=\"field() && field()?.isVisible\"\r\n cols=\"40\"\r\n rows=\"3\"\r\n autocomplete=\"nope\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n (input)=\"onTextareaChange($event)\"\r\n (blur)=\"onTextareaBlur($event)\"\r\n [value]=\"textareaValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n></textarea>\r\n}@else {\r\n<textarea\r\n[ngStyle]=\"{\r\n '--custom-textarea-width': field()?.controlStyle?.width ,\r\n '--custom-textarea-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-textarea-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-textarea-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-border-width-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-textarea-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-textarea-caret-color': field()?.controlStyle?.caretColor ,\r\n '--custom-textarea-font-color': field()?.controlStyle?.color ,\r\n }\"\r\n*ngIf=\"field() && field()?.isVisible\"\r\n cols=\"40\"\r\n rows=\"3\"\r\n autocomplete=\"nope\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n (input)=\"onTextareaChange($event)\"\r\n (blur)=\"onTextareaBlur($event)\"\r\n [value]=\"textareaValue\"\r\n></textarea>\r\n}\r\n", styles: ["*{font-family:mulish!important}::ng-deep textarea{width:-webkit-fill-available!important;border:1.5px solid #dddddd!important;border-radius:4px!important;caret-color:#fb0!important;color:#444!important}::ng-deep textarea:focus{outline:none!important;border:1.5px solid #ffbb00!important}::ng-deep textarea:focus-visible{outline:none!important;border:1.5px solid #ffbb00!important}::ng-deep textarea{width:var(--custom-textarea-width, -webkit-fill-available)!important;border-radius:var(--custom-textarea-radius, 4px)!important;caret-color:var(--custom-textarea-caret-color, #ffbb00)!important;color:var(--custom-textarea-font-color, #444444)!important;border-color:var(--custom-textarea-border-color,#dddddd)!important;border-width:var(--custom-textarea-border-width, 1.5px solid)!important}::ng-deep textarea:focus{border-color:var(--custom-textarea-border-color-focus,#dddddd)!important;border-width:var(--custom-textarea-border-width-focus, 1.5px solid)!important}::ng-deep textarea:focus-visible{border-color:var(--custom-textarea-border-color-focus,#dddddd)!important;border-width:var(--custom-textarea-border-width-focus, 1.5px solid)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
1391
1403
|
}
|
|
1392
1404
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextareaComponent, decorators: [{
|
|
1393
1405
|
type: Component,
|
|
@@ -1422,7 +1434,7 @@ class TabComponent {
|
|
|
1422
1434
|
this.field().selectedIndex = this.selectedIndex;
|
|
1423
1435
|
}
|
|
1424
1436
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1425
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TabComponent, isStandalone: true, selector: "lib-tab", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectedIndexChange: "selectedIndexChange" }, ngImport: i0, template: "<mat-tab-group *ngIf=\"field() && field()?.isVisible\" class=\"vertical-tab-indicator\"\r\n[ngClass]=\"{'vertical-class': field()?.configData?.isVerticalTab && field()?.configData?.isVerticalTab === 'true'}\"\r\n[ngStyle]=\"{\r\n '--tab-border-color': field()?.controlStyle?.borderColor ,\r\n '--tab-border-width': field()?.controlStyle?.borderWidth,\r\n '--tab-font-size': field()?.controlStyle?.fontSize,\r\n '--tab-font-weight': field()?.controlStyle?.fontWeight,\r\n '--tab-font-color': field()?.controlStyle?.color,\r\n }\"\r\n[(selectedIndex)]=\"selectedIndex\" (selectedIndexChange)=\"onTabChange($event)\">\r\n <mat-tab *ngFor=\"let data of field()?.options; let i = index\">\r\n <ng-template mat-tab-label>\r\n <img [src]=\"data.value\" alt=\"\" class=\"mx-2\">\r\n {{ data.label }}\r\n </ng-template>\r\n <ng-content select=\"tab[i]\"></ng-content>\r\n </mat-tab>\r\n</mat-tab-group>\r\n", styles: ["*{font-family:mulish!important}::ng-deep .mat-mdc-tab.mdc-tab--active .mdc-tab__text-label{font-weight:var(--tab-font-weight, 800)!important}::ng-deep .mdc-tab__text-label{font-size:var(--tab-font-size, 16px)!important;color:var(--tab-font-color, #444)!important}::ng-deep .mat-mdc-tab-group .mdc-tab-indicator__content--underline{border-color:var(--tab-border-color, #FFBB00)!important;border-width:var(--tab-border-width, 3px)!important;border-top-left-radius:6px!important;border-top-right-radius:6px!important}::ng-deep .mat-mdc-tab-label-container{border-bottom:1px solid #dadada!important}::ng-deep .vertical-class .mdc-tab-indicator .mdc-tab-indicator__content{border:none!important}::ng-deep .vertical-class .mat-mdc-tab.mdc-tab--active .mat-mdc-tab-ripple{border-right:var(--tab-border-width, 4px) solid var(--tab-border-color, #ffbb00)!important;box-shadow:0 2px 4px #00000015;border-left:1px solid #DDDDDD;border-top:1px solid #DDDDDD;border-bottom:1px solid #DDDDDD;background:#fff!important}::ng-deep .vertical-class .mdc-tab-indicator__content .mdc-tab-indicator__content--underline{border:none!important}::ng-deep .vertical-class .mat-mdc-tab-labels{display:table-row!important;background:#fafafa!important}\n"], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i2$
|
|
1437
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TabComponent, isStandalone: true, selector: "lib-tab", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { selectedIndexChange: "selectedIndexChange" }, ngImport: i0, template: "<mat-tab-group *ngIf=\"field() && field()?.isVisible\" class=\"vertical-tab-indicator\"\r\n[ngClass]=\"{'vertical-class': field()?.configData?.isVerticalTab && field()?.configData?.isVerticalTab === 'true'}\"\r\n[ngStyle]=\"{\r\n '--tab-border-color': field()?.controlStyle?.borderColor ,\r\n '--tab-border-width': field()?.controlStyle?.borderWidth,\r\n '--tab-font-size': field()?.controlStyle?.fontSize,\r\n '--tab-font-weight': field()?.controlStyle?.fontWeight,\r\n '--tab-font-color': field()?.controlStyle?.color,\r\n }\"\r\n[(selectedIndex)]=\"selectedIndex\" (selectedIndexChange)=\"onTabChange($event)\">\r\n <mat-tab *ngFor=\"let data of field()?.options; let i = index\">\r\n <ng-template mat-tab-label>\r\n <img [src]=\"data.value\" alt=\"\" class=\"mx-2\">\r\n {{ data.label }}\r\n </ng-template>\r\n <ng-content select=\"tab[i]\"></ng-content>\r\n </mat-tab>\r\n</mat-tab-group>\r\n", styles: ["*{font-family:mulish!important}::ng-deep .mat-mdc-tab.mdc-tab--active .mdc-tab__text-label{font-weight:var(--tab-font-weight, 800)!important}::ng-deep .mdc-tab__text-label{font-size:var(--tab-font-size, 16px)!important;color:var(--tab-font-color, #444)!important}::ng-deep .mat-mdc-tab-group .mdc-tab-indicator__content--underline{border-color:var(--tab-border-color, #FFBB00)!important;border-width:var(--tab-border-width, 3px)!important;border-top-left-radius:6px!important;border-top-right-radius:6px!important}::ng-deep .mat-mdc-tab-label-container{border-bottom:1px solid #dadada!important}::ng-deep .vertical-class .mdc-tab-indicator .mdc-tab-indicator__content{border:none!important}::ng-deep .vertical-class .mat-mdc-tab.mdc-tab--active .mat-mdc-tab-ripple{border-right:var(--tab-border-width, 4px) solid var(--tab-border-color, #ffbb00)!important;box-shadow:0 2px 4px #00000015;border-left:1px solid #DDDDDD;border-top:1px solid #DDDDDD;border-bottom:1px solid #DDDDDD;background:#fff!important}::ng-deep .vertical-class .mdc-tab-indicator__content .mdc-tab-indicator__content--underline{border:none!important}::ng-deep .vertical-class .mat-mdc-tab-labels{display:table-row!important;background:#fafafa!important}\n"], dependencies: [{ kind: "ngmodule", type: MatTabsModule }, { kind: "directive", type: i2$3.MatTabLabel, selector: "[mat-tab-label], [matTabLabel]" }, { kind: "component", type: i2$3.MatTab, selector: "mat-tab", inputs: ["disabled", "label", "aria-label", "aria-labelledby", "labelClass", "bodyClass"], exportAs: ["matTab"] }, { kind: "component", type: i2$3.MatTabGroup, selector: "mat-tab-group", inputs: ["color", "fitInkBarToContent", "mat-stretch-tabs", "dynamicHeight", "selectedIndex", "headerPosition", "animationDuration", "contentTabIndex", "disablePagination", "disableRipple", "preserveContent", "backgroundColor", "aria-label", "aria-labelledby"], outputs: ["selectedIndexChange", "focusChange", "animationDone", "selectedTabChange"], exportAs: ["matTabGroup"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
1426
1438
|
}
|
|
1427
1439
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TabComponent, decorators: [{
|
|
1428
1440
|
type: Component,
|
|
@@ -1579,7 +1591,7 @@ class AutocompleteComponent {
|
|
|
1579
1591
|
useExisting: AutocompleteComponent,
|
|
1580
1592
|
multi: true
|
|
1581
1593
|
}
|
|
1582
|
-
], ngImport: i0, template: " <label *ngIf=\"field() && field()?.isVisible && field().isShowLabel\" class=\"field-lable\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n <mat-form-field class=\"w-100 show-arrow\" appearance=\"outline\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [matAutocomplete]=\"auto\"\r\n (blur)=\"onBlur()\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n (input)=\"onInputChangeForReactiveForms($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [matAutocomplete]=\"auto\"\r\n [ngModel]=\"inputValue\"\r\n (ngModelChange)=\"onInputChange($event)\"\r\n (blur)=\"onBlur($event)\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n />\r\n }\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [displayWith]=\"displayFn\" (optionSelected)=\"onOptionSelected($event.option.value)\">\r\n <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n {{ option.label }}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <mat-error>\r\n {{ field().validators.requiredMessage }}\r\n </mat-error>\r\n </mat-form-field>\r\n <div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n </div>\r\n <div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n </div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.custom-dropdown-arrow{color:#666;font-size:18px;cursor:pointer;margin-right:4px;padding:0!important;margin-top:12px!important}.show-arrow{background-image:url(https://d2h44aw7l5xdvz.cloudfront.net/digitPlusAssets/Dropdown_arrow.svg)!important;background-position:calc(100% - 12px) calc(1em - 4px),calc(100% - 15px) calc(1em + 8px),calc(100% - 2.5em) .5em;background-size:10px 10px,5px 5px,1px 1.5em;background-repeat:no-repeat}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:14px!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1594
|
+
], ngImport: i0, template: " <label *ngIf=\"field() && field()?.isVisible && field().isShowLabel\" class=\"field-lable\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n <mat-form-field class=\"w-100 show-arrow\" appearance=\"outline\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [matAutocomplete]=\"auto\"\r\n (blur)=\"onBlur()\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n (input)=\"onInputChangeForReactiveForms($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n type=\"text\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [matAutocomplete]=\"auto\"\r\n [ngModel]=\"inputValue\"\r\n (ngModelChange)=\"onInputChange($event)\"\r\n (blur)=\"onBlur($event)\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n />\r\n }\r\n <mat-autocomplete autoActiveFirstOption #auto=\"matAutocomplete\" [displayWith]=\"displayFn\" (optionSelected)=\"onOptionSelected($event.option.value)\">\r\n <mat-option *ngFor=\"let option of filteredOptions\" [value]=\"option\">\r\n {{ option.label }}\r\n </mat-option>\r\n </mat-autocomplete>\r\n <mat-error>\r\n {{ field().validators.requiredMessage }}\r\n </mat-error>\r\n </mat-form-field>\r\n <div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n </div>\r\n <div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n </div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.custom-dropdown-arrow{color:#666;font-size:18px;cursor:pointer;margin-right:4px;padding:0!important;margin-top:12px!important}.show-arrow{background-image:url(https://d2h44aw7l5xdvz.cloudfront.net/digitPlusAssets/Dropdown_arrow.svg)!important;background-position:calc(100% - 12px) calc(1em - 4px),calc(100% - 15px) calc(1em + 8px),calc(100% - 2.5em) .5em;background-size:10px 10px,5px 5px,1px 1.5em;background-repeat:no-repeat}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:14px!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i5$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i5$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1583
1595
|
}
|
|
1584
1596
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AutocompleteComponent, decorators: [{
|
|
1585
1597
|
type: Component,
|
|
@@ -1624,40 +1636,10 @@ class MultipleSelectComponent {
|
|
|
1624
1636
|
onChange = () => { };
|
|
1625
1637
|
onTouched = () => { };
|
|
1626
1638
|
ngOnInit() {
|
|
1627
|
-
// Initialize
|
|
1628
|
-
if (!this.inputValue) {
|
|
1629
|
-
this.inputValue = [];
|
|
1630
|
-
}
|
|
1631
|
-
if (!this.selectedValues) {
|
|
1632
|
-
this.selectedValues = [];
|
|
1633
|
-
}
|
|
1634
|
-
if (!this.visibleChip) {
|
|
1635
|
-
this.visibleChip = [];
|
|
1636
|
-
}
|
|
1639
|
+
// Initialize inputValue with a default or initial value if needed
|
|
1637
1640
|
}
|
|
1638
1641
|
writeValue(value) {
|
|
1639
|
-
|
|
1640
|
-
if (value !== null && value !== undefined && Array.isArray(value)) {
|
|
1641
|
-
// Create new arrays to trigger change detection
|
|
1642
|
-
this.inputValue = [...value];
|
|
1643
|
-
this.selectedValues = [...value];
|
|
1644
|
-
// Calculate visible chips and remaining count
|
|
1645
|
-
const maxVisible = 2;
|
|
1646
|
-
this.visibleChip = this.selectedValues.slice(0, maxVisible);
|
|
1647
|
-
this.remainingCount = Math.max(0, this.selectedValues.length - maxVisible);
|
|
1648
|
-
console.log('Set values:', {
|
|
1649
|
-
inputValue: this.inputValue,
|
|
1650
|
-
selectedValues: this.selectedValues,
|
|
1651
|
-
visibleChip: this.visibleChip,
|
|
1652
|
-
remainingCount: this.remainingCount
|
|
1653
|
-
});
|
|
1654
|
-
}
|
|
1655
|
-
else {
|
|
1656
|
-
this.inputValue = [];
|
|
1657
|
-
this.selectedValues = [];
|
|
1658
|
-
this.visibleChip = [];
|
|
1659
|
-
this.remainingCount = 0;
|
|
1660
|
-
}
|
|
1642
|
+
this.inputValue = value;
|
|
1661
1643
|
}
|
|
1662
1644
|
registerOnChange(fn) {
|
|
1663
1645
|
this.onChange = fn;
|
|
@@ -1727,7 +1709,7 @@ class MultipleSelectComponent {
|
|
|
1727
1709
|
useExisting: MultipleSelectComponent,
|
|
1728
1710
|
multi: true
|
|
1729
1711
|
}
|
|
1730
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n<mat-form-field\r\n appearance=\"outline\"\r\n class=\"input-full-width full-width w-100 multi-select\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [value]=\"inputValue\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n (selectionChange)=\"selectionChanged($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option.label }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip-row>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-grid>\r\n </mat-select-trigger>\r\n @for (option of field()?.options; track option.label) {\r\n <mat-option [value]=\"option\">\r\n {{ option.label }} <img *ngIf=\"option.image\" [src]=\"option.image\" alt=\"\" style=\"width:20px; height:20px; float: inline-end;\" />\r\n </mat-option>\r\n }\r\n </mat-select>\r\n }@else {\r\n <mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [value]=\"inputValue\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n (selectionChange)=\"selectionChanged($event)\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option.label }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip-row>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-grid>\r\n </mat-select-trigger>\r\n @for (option of field()?.options; track option.label) {\r\n <mat-option [value]=\"option\">\r\n {{ option.label }} <img *ngIf=\"option.image\" [src]=\"option.image\" alt=\"\" style=\"width:20px; height:20px; float: inline-end;\" />\r\n </mat-option>\r\n }\r\n </mat-select>\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{width:100%!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-chip-set .mdc-evolution-chip{background-color:#fff9e5!important}::ng-deep .mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__text-label{font-size:12px!important;font-weight:400!important;color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing{height:12px!important;width:12px!important;font-size:12px!important}::ng-deep .multi-select .mat-mdc-form-field-type-mat-select:not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper{padding-right:0!important}::ng-deep .mat-mdc-standard-chip{--mdc-chip-outline-width: 1px !important;border-radius:18px!important;--mdc-chip-container-shape-radius: 19px !important;--mdc-chip-outline-color: #ffbb00 !important}::ng-deep .multi-select .mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding:9px 0 7px}::ng-deep .multi-select .mat-mdc-select-arrow-wrapper{height:37px}::ng-deep .mat-mdc-chip{height:24px!important}::ng-deep .mat-mdc-optgroup-label{display:contents!important}::ng-deep .multiselect-search .mat-mdc-text-field-wrapper{background:#fff!important}::ng-deep .multiselect-search .mdc-text-field__input{color:#444!important}::ng-deep .multiselect-search .mdc-line-ripple--active{opacity:0!important;transform:none!important}::ng-deep .mdc-line-ripple{opacity:0!important;transform:none!important}::ng-deep .mdc-evolution-chip-set__chips{flex-flow:unset!important;overflow:scroll!important;scrollbar-width:none!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked:after{color:#fff!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-indeterminate{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox{border:1px solid #DADADA}::ng-deep .mat-mdc-option.mdc-list-item.mat-mdc-option-multiple.mdc-list-item--selected{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.material-icons{font-family:Material Icons!important}:host ::ng-deep .mat-mdc-chip-set .mdc-evolution-chip{margin:2px 0 7px 8px}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.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: "directive", type: i3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i6.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i6.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i6.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i6.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1712
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n<mat-form-field\r\n appearance=\"outline\"\r\n class=\"input-full-width full-width w-100 multi-select\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [value]=\"inputValue\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n (selectionChange)=\"selectionChanged($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option.label }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip-row>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-grid>\r\n </mat-select-trigger>\r\n @for (option of field()?.options; track option.label) {\r\n <mat-option [value]=\"option\">\r\n {{ option.label }} <img *ngIf=\"option.image\" [src]=\"option.image\" alt=\"\" style=\"width:20px; height:20px; float: inline-end;\" />\r\n </mat-option>\r\n }\r\n </mat-select>\r\n }@else {\r\n <mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [value]=\"inputValue\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n (selectionChange)=\"selectionChanged($event)\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option.label }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip-row>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-grid>\r\n </mat-select-trigger>\r\n @for (option of field()?.options; track option.label) {\r\n <mat-option [value]=\"option\">\r\n {{ option.label }} <img *ngIf=\"option.image\" [src]=\"option.image\" alt=\"\" style=\"width:20px; height:20px; float: inline-end;\" />\r\n </mat-option>\r\n }\r\n </mat-select>\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{width:100%!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-chip-set .mdc-evolution-chip{background-color:#fff9e5!important}::ng-deep .mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__text-label{font-size:12px!important;font-weight:400!important;color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing{height:12px!important;width:12px!important;font-size:12px!important}::ng-deep .multi-select .mat-mdc-form-field-type-mat-select:not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper{padding-right:0!important}::ng-deep .mat-mdc-standard-chip{--mdc-chip-outline-width: 1px !important;border-radius:18px!important;--mdc-chip-container-shape-radius: 19px !important;--mdc-chip-outline-color: #ffbb00 !important}::ng-deep .multi-select .mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding:9px 0 7px}::ng-deep .multi-select .mat-mdc-select-arrow-wrapper{height:37px}::ng-deep .mat-mdc-chip{height:24px!important}::ng-deep .mat-mdc-optgroup-label{display:contents!important}::ng-deep .multiselect-search .mat-mdc-text-field-wrapper{background:#fff!important}::ng-deep .multiselect-search .mdc-text-field__input{color:#444!important}::ng-deep .multiselect-search .mdc-line-ripple--active{opacity:0!important;transform:none!important}::ng-deep .mdc-line-ripple{opacity:0!important;transform:none!important}::ng-deep .mdc-evolution-chip-set__chips{flex-flow:unset!important;overflow:scroll!important;scrollbar-width:none!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked:after{color:#fff!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-indeterminate{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox{border:1px solid #DADADA}::ng-deep .mat-mdc-option.mdc-list-item.mat-mdc-option-multiple.mdc-list-item--selected{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.material-icons{font-family:Material Icons!important}:host ::ng-deep .mat-mdc-chip-set .mdc-evolution-chip{margin:2px 0 7px 8px}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.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: "directive", type: i3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i6.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i6.MatChipGrid, selector: "mat-chip-grid", inputs: ["disabled", "placeholder", "required", "value", "errorStateMatcher"], outputs: ["change", "valueChange"] }, { kind: "directive", type: i6.MatChipRemove, selector: "[matChipRemove]" }, { kind: "component", type: i6.MatChipRow, selector: "mat-chip-row, [mat-chip-row], mat-basic-chip-row, [mat-basic-chip-row]", inputs: ["editable"], outputs: ["edited"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1731
1713
|
}
|
|
1732
1714
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MultipleSelectComponent, decorators: [{
|
|
1733
1715
|
type: Component,
|
|
@@ -1750,19 +1732,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1750
1732
|
}] } });
|
|
1751
1733
|
|
|
1752
1734
|
class SelectTextboxComponent {
|
|
1735
|
+
masterControlService;
|
|
1753
1736
|
field = input.required();
|
|
1754
1737
|
inputValue = null;
|
|
1755
1738
|
selectValue = null;
|
|
1756
1739
|
reactiveFormControlobject = input();
|
|
1757
1740
|
_onChange = (inputValue) => { };
|
|
1758
1741
|
_unTouched = () => { };
|
|
1742
|
+
constructor(masterControlService) {
|
|
1743
|
+
this.masterControlService = masterControlService;
|
|
1744
|
+
}
|
|
1759
1745
|
writeValue(obj) {
|
|
1760
1746
|
if (obj && typeof obj === 'object') {
|
|
1761
|
-
this.inputValue = obj.textValue || null;
|
|
1747
|
+
this.inputValue = this.field()?.configData?.isComaSeperated ? this.masterControlService.addComasToNumberValues(obj.textValue, true) : (obj.textValue || null);
|
|
1762
1748
|
this.selectValue = obj.selectValue || null;
|
|
1763
1749
|
}
|
|
1764
1750
|
else {
|
|
1765
|
-
this.inputValue = obj;
|
|
1751
|
+
this.inputValue = this.field()?.configData?.isComaSeperated ? this.masterControlService.addComasToNumberValues(obj, true) : (obj || null);
|
|
1752
|
+
;
|
|
1766
1753
|
}
|
|
1767
1754
|
}
|
|
1768
1755
|
;
|
|
@@ -1777,7 +1764,7 @@ class SelectTextboxComponent {
|
|
|
1777
1764
|
setDisabledState(isDisabled) { }
|
|
1778
1765
|
;
|
|
1779
1766
|
onInputChange(event) {
|
|
1780
|
-
this.inputValue = event.target.value;
|
|
1767
|
+
this.inputValue = this.field()?.configData?.isComaSeperated ? this.masterControlService.addComasToNumberValues(event.target.value, true) : event.target.value;
|
|
1781
1768
|
this.emitValue();
|
|
1782
1769
|
}
|
|
1783
1770
|
onSelectChange(event) {
|
|
@@ -1786,7 +1773,7 @@ class SelectTextboxComponent {
|
|
|
1786
1773
|
}
|
|
1787
1774
|
emitValue() {
|
|
1788
1775
|
const value = {
|
|
1789
|
-
textValue: this.inputValue,
|
|
1776
|
+
textValue: this.field()?.configData?.isComaSeperated ? this.masterControlService.addComasToNumberValues(this.inputValue, true) : this.inputValue,
|
|
1790
1777
|
selectValue: this.selectValue
|
|
1791
1778
|
};
|
|
1792
1779
|
this._onChange(value);
|
|
@@ -1817,14 +1804,14 @@ class SelectTextboxComponent {
|
|
|
1817
1804
|
document.body.style.removeProperty('--custom-select-option-border-radius-focus');
|
|
1818
1805
|
}
|
|
1819
1806
|
}
|
|
1820
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectTextboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1807
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectTextboxComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1821
1808
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SelectTextboxComponent, isStandalone: true, selector: "lib-select-textbox", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, reactiveFormControlobject: { classPropertyName: "reactiveFormControlobject", publicName: "reactiveFormControlobject", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
1822
1809
|
{
|
|
1823
1810
|
provide: NG_VALUE_ACCESSOR,
|
|
1824
1811
|
useExisting: SelectTextboxComponent,
|
|
1825
1812
|
multi: true
|
|
1826
1813
|
}
|
|
1827
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 auto-width\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"vertically-align-middle\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n}@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n class=\"vertically-align-middle\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n <span matPrefix class=\"rupee-symbol\">\u20B9</span>\r\n <!-- <span class=\"mx-3 right-amount-text\"> \u20B9 3.50 L </span> -->\r\n <div matSuffix class=\"input-select\">\r\n <!-- <mat-form-field> -->\r\n <mat-select\r\n [value]=\"selectValue\"\r\n [disabled]=\"field()?.configData?.isDisableDropdown\"\r\n (selectionChange)=\"onSelectChange($event)\"\r\n (openedChange)=\"onSelectOpened($event)\">\r\n <mat-option *ngFor=\"let options of field()?.options\" [value]=\"options.value\">\r\n {{ options.label }}\r\n </mat-option>\r\n </mat-select>\r\n <!-- </mat-form-field> -->\r\n </div>\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.input-select{height:30px;background:#f5f5f5;padding:4px 8px;border-radius:0 6px 6px 0;transform:translate(-1px);border-left:1.5px solid #dadada}.input-select,.mat-mdc-select-trigger{bottom:3px;gap:4px}:host ::ng-deep .input-select .mat-mdc-select-arrow{color:#8f8f8f!important}.vertically-align-middle{vertical-align:middle}::ng-deep .auto-width .mat-mdc-form-field-infix{width:auto!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3.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: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1814
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 auto-width\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"vertically-align-middle\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n}@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n class=\"vertically-align-middle\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n <span matPrefix class=\"rupee-symbol\">\u20B9</span>\r\n <div matSuffix class=\"input-select\">\r\n <!-- <mat-form-field> -->\r\n <mat-select\r\n [value]=\"selectValue\"\r\n [disabled]=\"field()?.configData?.isDisableDropdown\"\r\n (selectionChange)=\"onSelectChange($event)\"\r\n (openedChange)=\"onSelectOpened($event)\">\r\n <mat-option *ngFor=\"let options of field()?.options\" [value]=\"options.value\">\r\n {{ options.label }}\r\n </mat-option>\r\n </mat-select>\r\n <!-- </mat-form-field> -->\r\n </div>\r\n <!-- <span matSuffix class=\"mx-3 right-amount-text\"> \u20B9 3.50 L </span> -->\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.input-select{height:30px;background:#f5f5f5;padding:4px 8px;border-radius:0 6px 6px 0;transform:translate(-1px);border-left:1.5px solid #dadada}.input-select,.mat-mdc-select-trigger{bottom:3px;gap:4px}:host ::ng-deep .input-select .mat-mdc-select-arrow{color:#8f8f8f!important}.vertically-align-middle{vertical-align:middle}::ng-deep .auto-width .mat-mdc-form-field-infix{width:auto!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i3.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: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1828
1815
|
}
|
|
1829
1816
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectTextboxComponent, decorators: [{
|
|
1830
1817
|
type: Component,
|
|
@@ -1834,8 +1821,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1834
1821
|
useExisting: SelectTextboxComponent,
|
|
1835
1822
|
multi: true
|
|
1836
1823
|
}
|
|
1837
|
-
], template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 auto-width\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"vertically-align-middle\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n}@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n class=\"vertically-align-middle\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n <span matPrefix class=\"rupee-symbol\">\u20B9</span>\r\n <!-- <span class=\"mx-3 right-amount-text\"> \u20B9 3.50 L </span> -->\r\n <div matSuffix class=\"input-select\">\r\n <!-- <mat-form-field> -->\r\n <mat-select\r\n [value]=\"selectValue\"\r\n [disabled]=\"field()?.configData?.isDisableDropdown\"\r\n (selectionChange)=\"onSelectChange($event)\"\r\n (openedChange)=\"onSelectOpened($event)\">\r\n <mat-option *ngFor=\"let options of field()?.options\" [value]=\"options.value\">\r\n {{ options.label }}\r\n </mat-option>\r\n </mat-select>\r\n <!-- </mat-form-field> -->\r\n </div>\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.input-select{height:30px;background:#f5f5f5;padding:4px 8px;border-radius:0 6px 6px 0;transform:translate(-1px);border-left:1.5px solid #dadada}.input-select,.mat-mdc-select-trigger{bottom:3px;gap:4px}:host ::ng-deep .input-select .mat-mdc-select-arrow{color:#8f8f8f!important}.vertically-align-middle{vertical-align:middle}::ng-deep .auto-width .mat-mdc-form-field-infix{width:auto!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"] }]
|
|
1838
|
-
}] });
|
|
1824
|
+
], template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 auto-width\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"vertically-align-middle\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n}@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n class=\"vertically-align-middle\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n <span matPrefix class=\"rupee-symbol\">\u20B9</span>\r\n <div matSuffix class=\"input-select\">\r\n <!-- <mat-form-field> -->\r\n <mat-select\r\n [value]=\"selectValue\"\r\n [disabled]=\"field()?.configData?.isDisableDropdown\"\r\n (selectionChange)=\"onSelectChange($event)\"\r\n (openedChange)=\"onSelectOpened($event)\">\r\n <mat-option *ngFor=\"let options of field()?.options\" [value]=\"options.value\">\r\n {{ options.label }}\r\n </mat-option>\r\n </mat-select>\r\n <!-- </mat-form-field> -->\r\n </div>\r\n <!-- <span matSuffix class=\"mx-3 right-amount-text\"> \u20B9 3.50 L </span> -->\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.input-select{height:30px;background:#f5f5f5;padding:4px 8px;border-radius:0 6px 6px 0;transform:translate(-1px);border-left:1.5px solid #dadada}.input-select,.mat-mdc-select-trigger{bottom:3px;gap:4px}:host ::ng-deep .input-select .mat-mdc-select-arrow{color:#8f8f8f!important}.vertically-align-middle{vertical-align:middle}::ng-deep .auto-width .mat-mdc-form-field-infix{width:auto!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"] }]
|
|
1825
|
+
}], ctorParameters: () => [{ type: MasterControlService }] });
|
|
1839
1826
|
|
|
1840
1827
|
class OtpTextboxComponent {
|
|
1841
1828
|
constructor() { }
|
|
@@ -1872,7 +1859,7 @@ class OtpTextboxComponent {
|
|
|
1872
1859
|
useExisting: OtpTextboxComponent,
|
|
1873
1860
|
multi: true
|
|
1874
1861
|
}
|
|
1875
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field class=\"w-100\" appearance=\"outline\" [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n <div matSuffix class=\"get-otp mx-2\">\r\n <span class=\"mt-2\">Get OTP</span>\r\n </div>\r\n <div matSuffix class=\"verity-otp mx-2\" *ngIf=\"false\">\r\n <span class=\"mx-1\">Verify</span>\r\n </div>\r\n <span matSuffix class=\"mx-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\" />\r\n </span>\r\n</mat-form-field>\r\n<div >\r\n <span class=\"checkbox-tag\">Tag as:</span>\r\n <span *ngFor=\"let options of field()?.options\" class=\"checkbox\">\r\n <mat-checkbox class=\"optional-checkbox\">\r\n {{options.label}}\r\n </mat-checkbox>\r\n </span>\r\n</div>\r\n\r\n", styles: [".field-lable{font-size:.625rem;font-weight:700!important;color:#444!important;margin-bottom:0!important}.get-otp{padding:4px 8px 6px 12px;background:#fb0;color:#444;font-weight:600;font-size:12px;border-radius:24px;height:24px;width:71px;display:inline-flex}.error-message{color:red}.verity-otp{border-radius:24px;border:1px solid #444;background:#fff;padding:13px 8px 8px;width:58px;height:28px;font-size:12px;letter-spacing:0;font-weight:700;color:#444}.checkbox-tag{font-size:10px;font-weight:700;color:#444;margin-right:5px}*{font-family:mulish!important}.checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}.optional-checkbox.mat-mdc-checkbox label{font-size:10px!important;font-weight:700!important;color:#444!important;padding:0!important;margin-bottom:2px}.optional-checkbox .mdc-checkbox{flex:0 0 12px!important}.optional-checkbox,.mdc-checkbox__background{transform:translate(-2px,-1px)}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1862
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field class=\"w-100\" appearance=\"outline\" [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n <div matSuffix class=\"get-otp mx-2\">\r\n <span class=\"mt-2\">Get OTP</span>\r\n </div>\r\n <div matSuffix class=\"verity-otp mx-2\" *ngIf=\"false\">\r\n <span class=\"mx-1\">Verify</span>\r\n </div>\r\n <span matSuffix class=\"mx-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\" />\r\n </span>\r\n</mat-form-field>\r\n<div >\r\n <span class=\"checkbox-tag\">Tag as:</span>\r\n <span *ngFor=\"let options of field()?.options\" class=\"checkbox\">\r\n <mat-checkbox class=\"optional-checkbox\">\r\n {{options.label}}\r\n </mat-checkbox>\r\n </span>\r\n</div>\r\n\r\n", styles: [".field-lable{font-size:.625rem;font-weight:700!important;color:#444!important;margin-bottom:0!important}.get-otp{padding:4px 8px 6px 12px;background:#fb0;color:#444;font-weight:600;font-size:12px;border-radius:24px;height:24px;width:71px;display:inline-flex}.error-message{color:red}.verity-otp{border-radius:24px;border:1px solid #444;background:#fff;padding:13px 8px 8px;width:58px;height:28px;font-size:12px;letter-spacing:0;font-weight:700;color:#444}.checkbox-tag{font-size:10px;font-weight:700;color:#444;margin-right:5px}*{font-family:mulish!important}.checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}.optional-checkbox.mat-mdc-checkbox label{font-size:10px!important;font-weight:700!important;color:#444!important;padding:0!important;margin-bottom:2px}.optional-checkbox .mdc-checkbox{flex:0 0 12px!important}.optional-checkbox,.mdc-checkbox__background{transform:translate(-2px,-1px)}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
1876
1863
|
}
|
|
1877
1864
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtpTextboxComponent, decorators: [{
|
|
1878
1865
|
type: Component,
|
|
@@ -2082,7 +2069,7 @@ class AmountTextboxComponent {
|
|
|
2082
2069
|
useExisting: AmountTextboxComponent,
|
|
2083
2070
|
multi: true
|
|
2084
2071
|
}
|
|
2085
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\"\r\n >{{ field().label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n <mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n<input\r\n matInput\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (keydown)=\"onKeyDown($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"getDisplayValue()\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (keydown)=\"onKeyDown($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"getDisplayValue()\"\r\n />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n <span matPrefix class=\"rupee-symbol px-2\">\u20B9</span>\r\n <span matSuffix class=\"me-2 right-amount-text\">{{ getFormattedAmount() }}</span>\r\n </mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}*{font-family:mulish!important}.right-amount-text{font-weight:600;font-size:10px;color:#444;background:#f5f5f5;border-radius:2px;padding:5.5px 6px 4px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:.75rem!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.rupee-symbol{color:#444;font-size:12px;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2072
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\"\r\n >{{ field().label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n <mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n<input\r\n matInput\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (keydown)=\"onKeyDown($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"getDisplayValue()\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (keydown)=\"onKeyDown($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"getDisplayValue()\"\r\n />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n <span matPrefix class=\"rupee-symbol px-2\">\u20B9</span>\r\n <span matSuffix class=\"me-2 right-amount-text\">{{ getFormattedAmount() }}</span>\r\n </mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}*{font-family:mulish!important}.right-amount-text{font-weight:600;font-size:10px;color:#444;background:#f5f5f5;border-radius:2px;padding:5.5px 6px 4px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:.75rem!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.rupee-symbol{color:#444;font-size:12px;font-weight:400}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2086
2073
|
}
|
|
2087
2074
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AmountTextboxComponent, decorators: [{
|
|
2088
2075
|
type: Component,
|
|
@@ -2136,7 +2123,7 @@ class SuffixTextboxComponent {
|
|
|
2136
2123
|
useExisting: SuffixTextboxComponent,
|
|
2137
2124
|
multi: true
|
|
2138
2125
|
}
|
|
2139
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span>\r\n <span [appTooltipTemplate]=\"HtmlContent\" arrowPosition=\"left\" tooltipPosition=\"bottom\">\r\n <img [src]=\"field().configData?.labelIconUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n <ng-template #HtmlContent>\r\n <span [innerHTML]=\"field().configData?.tooltipMessage\"></span>\r\n </ng-template>\r\n</label>\r\n<mat-form-field class=\"w-100\" appearance=\"outline\" [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input matInput autocomplete=\"none\" [type]=\"field()?.controlType\" [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\" [placeholder]=\"field()?.placeHolder\" [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\" [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\" [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\" (blur)=\"onInputBlur()\" [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\" />\r\n }@else {\r\n <input matInput autocomplete=\"none\" [type]=\"field()?.controlType\" [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\" [placeholder]=\"field()?.placeHolder\" [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\" [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\" [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\" (blur)=\"onInputBlur()\" [value]=\"inputValue\" />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n <span matSuffix class=\"mx-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\" />\r\n </span>\r\n <span matSuffix class=\"mx-3 right-input-text\" *ngIf=\"field().configData?.suffix\"> {{field().configData?.suffix}}\r\n </span>\r\n</mat-form-field>\r\n<div *ngIf=\"field().configData?.isShowTagAs\">\r\n <span class=\"checkbox-tag\">Tag as:</span>\r\n <span *ngFor=\"let option of field()?.options\" class=\"checkbox\">\r\n <mat-checkbox class=\"optional-checkbox\">\r\n {{ option.label }}\r\n </mat-checkbox>\r\n </span>\r\n</div>\r\n<div *ngIf=\"field().configData?.infoMessage\">\r\n <span class=\"below-input-text\">{{field().configData?.infoMessage}}</span>\r\n</div>", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.right-input-text{font-weight:400;font-size:12px;color:#696969}.error-message{color:red}.checkbox-tag{font-size:10px;font-weight:700;color:#444;margin-right:5px}.checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}*{font-family:mulish!important}.optional-checkbox.mat-mdc-checkbox label{font-size:10px!important;font-weight:700!important;color:#444!important;padding:0!important;margin-bottom:2px}.toggle-img{width:12px;margin-left:8px!important}.optional-checkbox .mdc-checkbox{flex:0 0 12px!important}.optional-checkbox,.mdc-checkbox__background{transform:translate(-2px,-1px)}.below-input-text{font-weight:400;font-size:12px;color:#444;font-family:Mulish}@media screen and (max-width: 768px){.toggle-img{width:16px}}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important;font-size:12px!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.ms-1{width:12px!important;height:12px!important}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: CustomizedTooltipDirective, selector: "[appTooltipTemplate]", inputs: ["appTooltipTemplate"] }] });
|
|
2126
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\">{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span>\r\n <span [appTooltipTemplate]=\"HtmlContent\" arrowPosition=\"left\" tooltipPosition=\"bottom\">\r\n <img [src]=\"field().configData?.labelIconUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n <ng-template #HtmlContent>\r\n <span [innerHTML]=\"field().configData?.tooltipMessage\"></span>\r\n </ng-template>\r\n</label>\r\n<mat-form-field class=\"w-100\" appearance=\"outline\" [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input matInput autocomplete=\"none\" [type]=\"field()?.controlType\" [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\" [placeholder]=\"field()?.placeHolder\" [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\" [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\" [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\" (blur)=\"onInputBlur()\" [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\" />\r\n }@else {\r\n <input matInput autocomplete=\"none\" [type]=\"field()?.controlType\" [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\" [placeholder]=\"field()?.placeHolder\" [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\" [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\" [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\" (blur)=\"onInputBlur()\" [value]=\"inputValue\" />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n <span matSuffix class=\"mx-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\" />\r\n </span>\r\n <span matSuffix class=\"mx-3 right-input-text\" *ngIf=\"field().configData?.suffix\"> {{field().configData?.suffix}}\r\n </span>\r\n</mat-form-field>\r\n<div *ngIf=\"field().configData?.isShowTagAs\">\r\n <span class=\"checkbox-tag\">Tag as:</span>\r\n <span *ngFor=\"let option of field()?.options\" class=\"checkbox\">\r\n <mat-checkbox class=\"optional-checkbox\">\r\n {{ option.label }}\r\n </mat-checkbox>\r\n </span>\r\n</div>\r\n<div *ngIf=\"field().configData?.infoMessage\">\r\n <span class=\"below-input-text\">{{field().configData?.infoMessage}}</span>\r\n</div>", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.right-input-text{font-weight:400;font-size:12px;color:#696969}.error-message{color:red}.checkbox-tag{font-size:10px;font-weight:700;color:#444;margin-right:5px}.checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}*{font-family:mulish!important}.optional-checkbox.mat-mdc-checkbox label{font-size:10px!important;font-weight:700!important;color:#444!important;padding:0!important;margin-bottom:2px}.toggle-img{width:12px;margin-left:8px!important}.optional-checkbox .mdc-checkbox{flex:0 0 12px!important}.optional-checkbox,.mdc-checkbox__background{transform:translate(-2px,-1px)}.below-input-text{font-weight:400;font-size:12px;color:#444;font-family:Mulish}@media screen and (max-width: 768px){.toggle-img{width:16px}}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important;font-size:12px!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.ms-1{width:12px!important;height:12px!important}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: CustomizedTooltipDirective, selector: "[appTooltipTemplate]", inputs: ["appTooltipTemplate"] }] });
|
|
2140
2127
|
}
|
|
2141
2128
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuffixTextboxComponent, decorators: [{
|
|
2142
2129
|
type: Component,
|
|
@@ -2191,7 +2178,7 @@ class OtpMobNumberComponent {
|
|
|
2191
2178
|
useExisting: OtpMobNumberComponent,
|
|
2192
2179
|
multi: true
|
|
2193
2180
|
}
|
|
2194
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 mobile-field\"\r\n appearance=\"outline\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </div>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n \r\n <div matSuffix class=\"get-otp mx-2\">\r\n <span class=\"mt-2\">Get OTP</span>\r\n </div>\r\n <div matSuffix class=\"verity-otp mx-2\" *ngIf=\"false\">\r\n <span class=\"mx-1\">Verify</span>\r\n </div>\r\n <span matSuffix class=\"mx-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\" />\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<span class=\"success-text\" *ngIf=\"false\">Phone Number Verified</span>\r\n<span class=\"success-text\">\r\n <img src=\"https://cdn.godigit.com/retail-life/otp-circle-oui.svg\" alt=\"\" />\r\n OTP Sent\r\n</span>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 6px 10px 0;border-right:1px solid #dddddd;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px)}.countryCode{gap:4px}.get-otp{padding:4px 8px 6px 12px;background:#fb0;color:#444;font-weight:600;font-size:12px;border-radius:24px;height:24px;width:71px;display:inline-flex}*{font-family:mulish!important}.verity-otp{border-radius:24px;border:1px solid #444;background:#fff;padding:13px 8px 8px;width:58px;height:28px;font-size:12px;letter-spacing:0;font-weight:700;color:#444}.success-text{font-weight:500;color:#169f7d}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2181
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 mobile-field\"\r\n appearance=\"outline\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </div>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n \r\n <div matSuffix class=\"get-otp mx-2\">\r\n <span class=\"mt-2\">Get OTP</span>\r\n </div>\r\n <div matSuffix class=\"verity-otp mx-2\" *ngIf=\"false\">\r\n <span class=\"mx-1\">Verify</span>\r\n </div>\r\n <span matSuffix class=\"mx-3\" *ngIf=\"false\">\r\n <img src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\" />\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<span class=\"success-text\" *ngIf=\"false\">Phone Number Verified</span>\r\n<span class=\"success-text\">\r\n <img src=\"https://cdn.godigit.com/retail-life/otp-circle-oui.svg\" alt=\"\" />\r\n OTP Sent\r\n</span>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 6px 10px 0;border-right:1px solid #dddddd;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px)}.countryCode{gap:4px}.get-otp{padding:4px 8px 6px 12px;background:#fb0;color:#444;font-weight:600;font-size:12px;border-radius:24px;height:24px;width:71px;display:inline-flex}*{font-family:mulish!important}.verity-otp{border-radius:24px;border:1px solid #444;background:#fff;padding:13px 8px 8px;width:58px;height:28px;font-size:12px;letter-spacing:0;font-weight:700;color:#444}.success-text{font-weight:500;color:#169f7d}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2195
2182
|
}
|
|
2196
2183
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtpMobNumberComponent, decorators: [{
|
|
2197
2184
|
type: Component,
|
|
@@ -2244,7 +2231,7 @@ class TagMobNumberComponent {
|
|
|
2244
2231
|
useExisting: TagMobNumberComponent,
|
|
2245
2232
|
multi: true
|
|
2246
2233
|
}
|
|
2247
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 mobile-field\"\r\n appearance=\"outline\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </div>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div>\r\n <span class=\"checkbox-tag\">Tag as:</span>\r\n <span *ngFor=\"let option of field()?.options\" class=\"checkbox\">\r\n <mat-checkbox class=\"optional-checkbox\">\r\n {{ option.label }}\r\n </mat-checkbox>\r\n </span>\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}.error-message{color:red}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 6px 10px 0;border-right:1px solid #dddddd;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px)}.countryCode{gap:4px}*{font-family:mulish!important}.checkbox-tag{font-size:10px;font-weight:700;color:#444;margin-right:5px}.checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}.optional-checkbox.mat-mdc-checkbox label{font-size:10px!important;font-weight:700!important;color:#444!important;padding:0!important;margin-bottom:2px}.optional-checkbox .mdc-checkbox{flex:0 0 12px!important}.optional-checkbox,.mdc-checkbox__background{transform:translate(-2px,-1px)}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2234
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 mobile-field\"\r\n appearance=\"outline\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </div>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n autocomplete=\"none\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div>\r\n <span class=\"checkbox-tag\">Tag as:</span>\r\n <span *ngFor=\"let option of field()?.options\" class=\"checkbox\">\r\n <mat-checkbox class=\"optional-checkbox\">\r\n {{ option.label }}\r\n </mat-checkbox>\r\n </span>\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}.error-message{color:red}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 6px 10px 0;border-right:1px solid #dddddd;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px)}.countryCode{gap:4px}*{font-family:mulish!important}.checkbox-tag{font-size:10px;font-weight:700;color:#444;margin-right:5px}.checkbox{padding:4px 8px 3px 0;background:#f5f5f5;border-radius:4px;margin-right:8px}.optional-checkbox.mat-mdc-checkbox label{font-size:10px!important;font-weight:700!important;color:#444!important;padding:0!important;margin-bottom:2px}.optional-checkbox .mdc-checkbox{flex:0 0 12px!important}.optional-checkbox,.mdc-checkbox__background{transform:translate(-2px,-1px)}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i4$2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2248
2235
|
}
|
|
2249
2236
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TagMobNumberComponent, decorators: [{
|
|
2250
2237
|
type: Component,
|
|
@@ -2341,7 +2328,7 @@ class AgeDateComponent {
|
|
|
2341
2328
|
useExisting: AgeDateComponent,
|
|
2342
2329
|
multi: true
|
|
2343
2330
|
},
|
|
2344
|
-
], ngImport: i0, template: "<label *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\" class=\"field-lable\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else{\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <span matSuffix class=\"right-date-text\">\r\n {{field()?.configData?.age ? field()?.configData?.age : 33}}yrs\r\n </span>\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\" *ngIf=\"false\">\r\n <img\r\n src=\"https://cdn.godigit.com/digitPlusAssets/retail-life-icon/svgicon/date_picker_icon.svg\"\r\n style=\"width: 16px\"\r\n matDatepickerToggleIcon\r\n />\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #picker></mat-datepicker>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0}.right-date-text{padding:4px 8px;border-radius:4px;font-weight:600;font-size:12px;color:#444;background:#f5f5f5;margin-right:7px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important;font-size:12px!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type:
|
|
2331
|
+
], ngImport: i0, template: "<label *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\" class=\"field-lable\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else{\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n [matDatepicker]=\"picker\"\r\n (keyup)=\"dateDivisionFormat($event)\"\r\n [disabled]=\"field()?.isDisable\"\r\n (dateChange)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <span matSuffix class=\"right-date-text\">\r\n {{field()?.configData?.age ? field()?.configData?.age : 33}}yrs\r\n </span>\r\n <mat-datepicker-toggle matSuffix [for]=\"picker\" *ngIf=\"false\">\r\n <img\r\n src=\"https://cdn.godigit.com/digitPlusAssets/retail-life-icon/svgicon/date_picker_icon.svg\"\r\n style=\"width: 16px\"\r\n matDatepickerToggleIcon\r\n />\r\n </mat-datepicker-toggle>\r\n <mat-datepicker #picker></mat-datepicker>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0}.right-date-text{padding:4px 8px;border-radius:4px;font-weight:600;font-size:12px;color:#444;background:#f5f5f5;margin-right:7px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important;font-size:12px!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i5.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i5.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i5.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "directive", type: i5.MatDatepickerToggleIcon, selector: "[matDatepickerToggleIcon]" }, { kind: "ngmodule", type: MomentDateModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2345
2332
|
}
|
|
2346
2333
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AgeDateComponent, decorators: [{
|
|
2347
2334
|
type: Component,
|
|
@@ -2383,7 +2370,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2383
2370
|
class AdditionButtonComponent {
|
|
2384
2371
|
field = input.required();
|
|
2385
2372
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AdditionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2386
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AdditionButtonComponent, isStandalone: true, selector: "lib-addition-button", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<Button class=\"additional-button\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"\r\n{\r\n '--button-border': field()?.controlStyle?.borderWidth ,\r\n '--button-width': field()?.controlStyle?.width ,\r\n '--button-font-size': field()?.controlStyle?.fontSize ,\r\n '--button-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--button-background': field()?.controlStyle?.background ,\r\n '--button-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--button-text-color': field()?.controlStyle?.color ,\r\n}\">\r\n <span class=\"additional-button-text\">\r\n <img\r\n class=\"additional-button-img\"\r\n [src]=\"field()?.imageUrl\"\r\n />\r\n <span\r\n ><u>{{ field()?.label }}</u></span\r\n >\r\n </span>\r\n</Button>\r\n", styles: [".additional-button{background:none!important;border:none!important}.additional-button-text{font-size:12px;font-weight:700;color:var(--button-text-color, #444)!important}.additional-button-img{height:12px;width:12px;margin-bottom:2px}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2373
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AdditionButtonComponent, isStandalone: true, selector: "lib-addition-button", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<Button class=\"additional-button\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"\r\n{\r\n '--button-border': field()?.controlStyle?.borderWidth ,\r\n '--button-width': field()?.controlStyle?.width ,\r\n '--button-font-size': field()?.controlStyle?.fontSize ,\r\n '--button-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--button-background': field()?.controlStyle?.background ,\r\n '--button-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--button-text-color': field()?.controlStyle?.color ,\r\n}\">\r\n <span class=\"additional-button-text\">\r\n <img\r\n class=\"additional-button-img\"\r\n [src]=\"field()?.imageUrl\"\r\n />\r\n <span\r\n ><u>{{ field()?.label }}</u></span\r\n >\r\n </span>\r\n</Button>\r\n", styles: [".additional-button{background:none!important;border:none!important}.additional-button-text{font-size:12px;font-weight:700;color:var(--button-text-color, #444)!important}.additional-button-img{height:12px;width:12px;margin-bottom:2px}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2387
2374
|
}
|
|
2388
2375
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AdditionButtonComponent, decorators: [{
|
|
2389
2376
|
type: Component,
|
|
@@ -2429,7 +2416,7 @@ class InfoTextboxComponent {
|
|
|
2429
2416
|
useExisting: InfoTextboxComponent,
|
|
2430
2417
|
multi: true
|
|
2431
2418
|
}
|
|
2432
|
-
], ngImport: i0, template: "<label class=\"field-lable info-label\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}\r\n <!-- <span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n > -->\r\n <span style=\"justify-content: end;\">\r\n <img class=\"mx-1\" *ngIf=\"field()?.configData?.imageURL\" [src]=\"field()?.configData?.imageURL\" alt=\"\">\r\n <u style=\"cursor: pointer;\" (click)=\"handleWhereToFindClick()\">{{field()?.configData?.infoMsg}}</u></span>\r\n </label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n<input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n \r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.info-label{display:flex;justify-content:space-between}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2419
|
+
], ngImport: i0, template: "<label class=\"field-lable info-label\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}\r\n <!-- <span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n > -->\r\n <span style=\"justify-content: end;\">\r\n <img class=\"mx-1\" *ngIf=\"field()?.configData?.imageURL\" [src]=\"field()?.configData?.imageURL\" alt=\"\">\r\n <u style=\"cursor: pointer;\" (click)=\"handleWhereToFindClick()\">{{field()?.configData?.infoMsg}}</u></span>\r\n </label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n<input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n \r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.info-label{display:flex;justify-content:space-between}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2433
2420
|
}
|
|
2434
2421
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoTextboxComponent, decorators: [{
|
|
2435
2422
|
type: Component,
|
|
@@ -2489,7 +2476,7 @@ class TextboxWithImageComponent {
|
|
|
2489
2476
|
useExisting: TextboxWithImageComponent,
|
|
2490
2477
|
multi: true
|
|
2491
2478
|
}
|
|
2492
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n<input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n}@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n \r\n <span matSuffix class=\"mx-3\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]='field().imageUrl' alt=\"\" />\r\n <!-- \"https://cdn.godigit.com/retail-life/location.svg\" -->\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type:
|
|
2479
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n<input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n}@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n />\r\n}\r\n \r\n <span matSuffix class=\"mx-3\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]='field().imageUrl' alt=\"\" />\r\n <!-- \"https://cdn.godigit.com/retail-life/location.svg\" -->\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2493
2480
|
}
|
|
2494
2481
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxWithImageComponent, decorators: [{
|
|
2495
2482
|
type: Component,
|
|
@@ -2541,7 +2528,7 @@ class EmailWithDomainComponent {
|
|
|
2541
2528
|
useExisting: EmailWithDomainComponent,
|
|
2542
2529
|
multi: true
|
|
2543
2530
|
}
|
|
2544
|
-
], ngImport: i0, template: "<label *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\" class=\"field-lable\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n <mat-form-field class=\"w-100\" appearance=\"outline\" [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"email-left-side\"\r\n [name]=\"field()?.fieldName + '_1'\"\r\n [id]=\"field()?.fieldName + '_1'\"\r\n [type]=\"field()?.controlType\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"field()?.isDisable\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"email-left-side\"\r\n [name]=\"field()?.fieldName + '_1'\"\r\n [id]=\"field()?.fieldName + '_1'\"\r\n [type]=\"field()?.controlType\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"field()?.isDisable\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <span class=\"email-between\">@</span>\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [name]=\"field()?.fieldName + '_2'\"\r\n [id]=\"field()?.fieldName + '_2'\"\r\n placeholder=\"domain.com\"\r\n class=\"email-right-side\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"field()?.isDisable\"\r\n />\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n </mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.email-left-side{width:40%!important;display:inline-block!important}.email-right-side{width:50%!important;display:inline-block!important}.email-between{padding:0 8px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2531
|
+
], ngImport: i0, template: "<label *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\" class=\"field-lable\">{{field()?.label}}<span style=\"color: red;\" *ngIf=\"field() && field()?.validators?.isRequired\">*</span></label>\r\n <mat-form-field class=\"w-100\" appearance=\"outline\" [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\">\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"email-left-side\"\r\n [name]=\"field()?.fieldName + '_1'\"\r\n [id]=\"field()?.fieldName + '_1'\"\r\n [type]=\"field()?.controlType\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"field()?.isDisable\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n class=\"email-left-side\"\r\n [name]=\"field()?.fieldName + '_1'\"\r\n [id]=\"field()?.fieldName + '_1'\"\r\n [type]=\"field()?.controlType\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"field()?.isDisable\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n <span class=\"email-between\">@</span>\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [name]=\"field()?.fieldName + '_2'\"\r\n [id]=\"field()?.fieldName + '_2'\"\r\n placeholder=\"domain.com\"\r\n class=\"email-right-side\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [disabled]=\"field()?.isDisable\"\r\n />\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n </mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.email-left-side{width:40%!important;display:inline-block!important}.email-right-side{width:50%!important;display:inline-block!important}.email-between{padding:0 8px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2545
2532
|
}
|
|
2546
2533
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EmailWithDomainComponent, decorators: [{
|
|
2547
2534
|
type: Component,
|
|
@@ -2557,7 +2544,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2557
2544
|
class ImageUploadComponent {
|
|
2558
2545
|
field = input.required();
|
|
2559
2546
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2560
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ImageUploadComponent, isStandalone: true, selector: "lib-image-upload", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "\r\n<label class=\"field-lable upload-label\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field()?.label}}</label>\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n #fileInput\r\n (click)=\"(fileInput.value)\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n />\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn\"\r\n (click)=\"fileInput.click()\"\r\n [ngClass]=\"field()?.label ? 'lightbackground' : 'successBackground'\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--upload-width': field()?.controlStyle?.width ,\r\n'--upload-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--upload-border-color': field()?.controlStyle?.borderColor ,\r\n'--upload-border-width': field()?.controlStyle?.borderWidth ,\r\n'--upload-border-style': field()?.controlStyle?.borderStyle ,\r\n'--upload-background-color': field()?.controlStyle?.background ,\r\n'--upload-focus-border-color': field()?.controlStyle?.focusBorderColor ,\r\n'--upload-focus-background-color': field()?.controlStyle?.focusBackground ,\r\n}\"\r\n >\r\n <ng-container *ngIf=\"field()?.label; else policyHolderPanFileNotEmpty\">\r\n <span class=\"upload-icon\">\r\n <span\r\n ><img\r\n src=\"https://cdn.godigit.com/retail-life/Upload_Icon.svg\"\r\n alt=\"\"\r\n class=\"mb-1\"\r\n /></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.label }}</span>\r\n </span>\r\n </ng-container>\r\n <ng-template #policyHolderPanFileNotEmpty>\r\n <span class=\"mt-2 right-icon\">\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/Tickmark.svg\" alt=\"\"\r\n /></span>\r\n <span title=\"uploaded file\">uploaded file</span>\r\n </span>\r\n <div class=\"mt-2 left-icon\">\r\n <span\r\n ><img\r\n src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\"\r\n alt=\"\"\r\n /></span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/delete-oui.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </ng-template>\r\n </button>\r\n", styles: ["*{font-family:mulish!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.upload-label{opacity:0}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , 8px)!important}.lightbackground{border-color:#999;border-width:1px;border-style:dashed;background:#fff;color:#444;font-size:14px;font-weight:700}.lightbackground{border-color:var(--upload-border-color , #999)!important;border-width:var(--upload-border-width , 1px)!important;border-style:var(--upload-border-style , dashed)!important;background:var(--upload-background-color , #ffffff)!important}.successBackground{border-color:var(--upload-focus-border-color , #ddd)!important;background:var(--upload-focus-background-color , #fafafa)!important;color:var(--upload-focus-font-color , #444)!important}.upload-icon{display:flex;justify-content:center;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.right-icon{display:flex;gap:10px;margin-left:.5em}.left-icon{display:flex;gap:15px;margin-right:1em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2547
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ImageUploadComponent, isStandalone: true, selector: "lib-image-upload", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "\r\n<label class=\"field-lable upload-label\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field()?.label}}</label>\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n #fileInput\r\n (click)=\"(fileInput.value)\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n />\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn\"\r\n (click)=\"fileInput.click()\"\r\n [ngClass]=\"field()?.label ? 'lightbackground' : 'successBackground'\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--upload-width': field()?.controlStyle?.width ,\r\n'--upload-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--upload-border-color': field()?.controlStyle?.borderColor ,\r\n'--upload-border-width': field()?.controlStyle?.borderWidth ,\r\n'--upload-border-style': field()?.controlStyle?.borderStyle ,\r\n'--upload-background-color': field()?.controlStyle?.background ,\r\n'--upload-focus-border-color': field()?.controlStyle?.focusBorderColor ,\r\n'--upload-focus-background-color': field()?.controlStyle?.focusBackground ,\r\n}\"\r\n >\r\n <ng-container *ngIf=\"field()?.label; else policyHolderPanFileNotEmpty\">\r\n <span class=\"upload-icon\">\r\n <span\r\n ><img\r\n src=\"https://cdn.godigit.com/retail-life/Upload_Icon.svg\"\r\n alt=\"\"\r\n class=\"mb-1\"\r\n /></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.label }}</span>\r\n </span>\r\n </ng-container>\r\n <ng-template #policyHolderPanFileNotEmpty>\r\n <span class=\"mt-2 right-icon\">\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/Tickmark.svg\" alt=\"\"\r\n /></span>\r\n <span title=\"uploaded file\">uploaded file</span>\r\n </span>\r\n <div class=\"mt-2 left-icon\">\r\n <span\r\n ><img\r\n src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\"\r\n alt=\"\"\r\n /></span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/delete-oui.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </ng-template>\r\n </button>\r\n", styles: ["*{font-family:mulish!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.upload-label{opacity:0}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , 8px)!important}.lightbackground{border-color:#999;border-width:1px;border-style:dashed;background:#fff;color:#444;font-size:14px;font-weight:700}.lightbackground{border-color:var(--upload-border-color , #999)!important;border-width:var(--upload-border-width , 1px)!important;border-style:var(--upload-border-style , dashed)!important;background:var(--upload-background-color , #ffffff)!important}.successBackground{border-color:var(--upload-focus-border-color , #ddd)!important;background:var(--upload-focus-background-color , #fafafa)!important;color:var(--upload-focus-font-color , #444)!important}.upload-icon{display:flex;justify-content:center;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.right-icon{display:flex;gap:10px;margin-left:.5em}.left-icon{display:flex;gap:15px;margin-right:1em}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
2561
2548
|
}
|
|
2562
2549
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageUploadComponent, decorators: [{
|
|
2563
2550
|
type: Component,
|
|
@@ -2570,7 +2557,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2570
2557
|
class DownloadDocumentComponent {
|
|
2571
2558
|
field = input.required();
|
|
2572
2559
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DownloadDocumentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2573
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: DownloadDocumentComponent, isStandalone: true, selector: "lib-download-document", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<label class=\"field-lable upload-label\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field()?.label}}</label>\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n #fileInput\r\n (click)=\"(fileInput.value)\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n />\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn lightbackground\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--upload-width': field()?.controlStyle?.width ,\r\n'--upload-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--upload-border-color': field()?.controlStyle?.borderColor ,\r\n'--upload-border-width': field()?.controlStyle?.borderWidth ,\r\n'--upload-border-style': field()?.controlStyle?.borderStyle ,\r\n'--upload-background-color': field()?.controlStyle?.background ,\r\n'--upload-focus-border-color': field()?.controlStyle?.focusBorderColor ,\r\n'--upload-focus-background-color': field()?.controlStyle?.focusBackground ,\r\n}\"\r\n >\r\n <span class=\"upload-icon\">\r\n <span\r\n ><img\r\n src=\"https://cdn.godigit.com/retail-life/Download_Icon.svg\"\r\n alt=\"\"\r\n class=\"mb-1\"\r\n /></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.label }}</span>\r\n </span>\r\n </button>\r\n", styles: ["*{font-family:mulish!important}.upload-label{opacity:0}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , 8px)!important}.lightbackground{border-color:#999;border-width:1px;border-style:dashed;background:#fff;color:#444;font-size:14px;font-weight:700}.lightbackground{border-color:var(--upload-border-color , #999)!important;border-width:var(--upload-border-width , 1px)!important;border-style:var(--upload-border-style , dashed)!important;background:var(--upload-background-color , #ffffff)!important}.upload-icon{display:flex;justify-content:center;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2560
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: DownloadDocumentComponent, isStandalone: true, selector: "lib-download-document", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<label class=\"field-lable upload-label\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field()?.label}}</label>\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n #fileInput\r\n (click)=\"(fileInput.value)\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n />\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn lightbackground\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--upload-width': field()?.controlStyle?.width ,\r\n'--upload-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--upload-border-color': field()?.controlStyle?.borderColor ,\r\n'--upload-border-width': field()?.controlStyle?.borderWidth ,\r\n'--upload-border-style': field()?.controlStyle?.borderStyle ,\r\n'--upload-background-color': field()?.controlStyle?.background ,\r\n'--upload-focus-border-color': field()?.controlStyle?.focusBorderColor ,\r\n'--upload-focus-background-color': field()?.controlStyle?.focusBackground ,\r\n}\"\r\n >\r\n <span class=\"upload-icon\">\r\n <span\r\n ><img\r\n src=\"https://cdn.godigit.com/retail-life/Download_Icon.svg\"\r\n alt=\"\"\r\n class=\"mb-1\"\r\n /></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.label }}</span>\r\n </span>\r\n </button>\r\n", styles: ["*{font-family:mulish!important}.upload-label{opacity:0}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , 8px)!important}.lightbackground{border-color:#999;border-width:1px;border-style:dashed;background:#fff;color:#444;font-size:14px;font-weight:700}.lightbackground{border-color:var(--upload-border-color , #999)!important;border-width:var(--upload-border-width , 1px)!important;border-style:var(--upload-border-style , dashed)!important;background:var(--upload-background-color , #ffffff)!important}.upload-icon{display:flex;justify-content:center;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
2574
2561
|
}
|
|
2575
2562
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DownloadDocumentComponent, decorators: [{
|
|
2576
2563
|
type: Component,
|
|
@@ -2583,7 +2570,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2583
2570
|
class AddDocumentComponent {
|
|
2584
2571
|
field = input.required();
|
|
2585
2572
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddDocumentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2586
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AddDocumentComponent, isStandalone: true, selector: "lib-add-document", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field().label}}</label>\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n #fileInput\r\n (click)=\"(fileInput.value)\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n />\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn add-document-btn\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--add-doc-border-color': field()?.controlStyle?.borderColor ,\r\n'--add-doc-border-width': field()?.controlStyle?.borderWidth ,\r\n'--add-doc-border-style': field()?.controlStyle?.borderStyle ,\r\n'--add-doc-background': field()?.controlStyle?.background \r\n}\"\r\n >\r\n <span class=\"add-icon\">\r\n <span\r\n ><img class=\"mb-1\" src=\"https://cdn.godigit.com/retail-life/add.svg\"></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.label }}</span>\r\n <span class=\"light-font\">(optional)</span>\r\n </span>\r\n </button>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important;opacity:0}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , .5rem)!important}.add-document-btn{border:1px dashed #999;background:#fff;color:#444}.add-document-btn{border-color:var(--add-doc-border-color , #999);border-width:var(--add-doc-border-width , 1px);border-style:var(--add-doc-border-style , dashed);background:var(--add-doc-background , #ffffff);color:var(--add-doc-font-color , #444)}.add-icon{display:flex;justify-content:start;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.light-font{color:#b4b4b4}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2573
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AddDocumentComponent, isStandalone: true, selector: "lib-add-document", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\">{{field().label}}</label>\r\n <input\r\n hidden\r\n [type]=\"field()?.controlType\"\r\n #fileInput\r\n (click)=\"(fileInput.value)\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n />\r\n <button\r\n type=\"button\"\r\n class=\"upload-btn add-document-btn\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--add-doc-border-color': field()?.controlStyle?.borderColor ,\r\n'--add-doc-border-width': field()?.controlStyle?.borderWidth ,\r\n'--add-doc-border-style': field()?.controlStyle?.borderStyle ,\r\n'--add-doc-background': field()?.controlStyle?.background \r\n}\"\r\n >\r\n <span class=\"add-icon\">\r\n <span\r\n ><img class=\"mb-1\" src=\"https://cdn.godigit.com/retail-life/add.svg\"></span>\r\n <span class=\"upload-text\" [ngStyle]=\"{\r\n'--upload-font-color': field()?.controlStyle?.color ,\r\n'--upload-font-size': field()?.controlStyle?.fontSize ,\r\n'--upload-font-weight': field()?.controlStyle?.fontWeight,\r\n'--upload-focus-font-color': field()?.controlStyle?.focusColor ,\r\n}\">{{ field()?.label }}</span>\r\n <span class=\"light-font\">(optional)</span>\r\n </span>\r\n </button>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important;opacity:0}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:.5rem}.upload-btn{width:var(--upload-width , 100%)!important;border-radius:var(--upload-border-radius , .5rem)!important}.add-document-btn{border:1px dashed #999;background:#fff;color:#444}.add-document-btn{border-color:var(--add-doc-border-color , #999);border-width:var(--add-doc-border-width , 1px);border-style:var(--add-doc-border-style , dashed);background:var(--add-doc-background , #ffffff);color:var(--add-doc-font-color , #444)}.add-icon{display:flex;justify-content:start;gap:7px}.upload-text{color:#444!important;font-weight:700!important;font-size:14px!important}.upload-text{color:var(--upload-font-color , #444)!important;font-size:var( --upload-font-size , 14px)!important;font-weight:var(--upload-font-weight , 700)!important}.light-font{color:#b4b4b4}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
2587
2574
|
}
|
|
2588
2575
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddDocumentComponent, decorators: [{
|
|
2589
2576
|
type: Component,
|
|
@@ -2596,7 +2583,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2596
2583
|
class HyperlinkComponent {
|
|
2597
2584
|
field = input.required();
|
|
2598
2585
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HyperlinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2599
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: HyperlinkComponent, isStandalone: true, selector: "lib-hyperlink", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<u *ngIf=\"field() && field()?.isVisible\" class=\"hyperlink\" [ngStyle]=\"{\r\n'--hyperlink-font-color': field()?.controlStyle?.color,\r\n'--hyperlink-font-size': field()?.controlStyle?.fontSize,\r\n'--hyperlink-font-weight': field()?.controlStyle?.fontWeight\r\n}\">\r\n <a href=\"Hyper_link\" *ngIf=\"field()?.label && field()?.isShowLabel\">{{field()?.label}}</a></u\r\n>\r\n<img *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n", styles: ["*{font-family:mulish!important}.hyperlink{font-weight:700;font-size:12px;color:#fb0}.hyperlink{font-size:var(--hyperlink-font-size, 12px)!important;font-weight:var(--hyperlink-font-weight, 700)!important}.hyperlink a{color:#fb0!important}.hyperlink a{color:var(--hyperlink-font-color, #ffbb00)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2586
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: HyperlinkComponent, isStandalone: true, selector: "lib-hyperlink", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<u *ngIf=\"field() && field()?.isVisible\" class=\"hyperlink\" [ngStyle]=\"{\r\n'--hyperlink-font-color': field()?.controlStyle?.color,\r\n'--hyperlink-font-size': field()?.controlStyle?.fontSize,\r\n'--hyperlink-font-weight': field()?.controlStyle?.fontWeight\r\n}\">\r\n <a href=\"Hyper_link\" *ngIf=\"field()?.label && field()?.isShowLabel\">{{field()?.label}}</a></u\r\n>\r\n<img *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n", styles: ["*{font-family:mulish!important}.hyperlink{font-weight:700;font-size:12px;color:#fb0}.hyperlink{font-size:var(--hyperlink-font-size, 12px)!important;font-weight:var(--hyperlink-font-weight, 700)!important}.hyperlink a{color:#fb0!important}.hyperlink a{color:var(--hyperlink-font-color, #ffbb00)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2600
2587
|
}
|
|
2601
2588
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HyperlinkComponent, decorators: [{
|
|
2602
2589
|
type: Component,
|
|
@@ -2651,7 +2638,7 @@ class TextboxWithUnderscoreComponent {
|
|
|
2651
2638
|
useExisting: TextboxWithUnderscoreComponent,
|
|
2652
2639
|
multi: true
|
|
2653
2640
|
}
|
|
2654
|
-
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 hyphen-input\"\r\n appearance=\"outline\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.hyphen-input{letter-spacing:5px!important}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2641
|
+
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 hyphen-input\"\r\n appearance=\"outline\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.hyphen-input{letter-spacing:5px!important}.error-message{color:red}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2655
2642
|
}
|
|
2656
2643
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxWithUnderscoreComponent, decorators: [{
|
|
2657
2644
|
type: Component,
|
|
@@ -2713,7 +2700,7 @@ class UnderscoreMobNumberComponent {
|
|
|
2713
2700
|
useExisting: UnderscoreMobNumberComponent,
|
|
2714
2701
|
multi: true
|
|
2715
2702
|
}
|
|
2716
|
-
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 mobile-field hyphen-input\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </div>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n />\r\n }\r\n\r\n <span matSuffix class=\"p-3\">\r\n <img src=\"https://cdn.godigit.com/retail-life/edit-icon.svg\" alt=\"\" />\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}.error-message{color:red}.hyphen-input{letter-spacing:5px!important}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 6px 10px 0;border-right:1px solid #dddddd;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px)}.countryCode{gap:4px}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2703
|
+
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100 mobile-field hyphen-input\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n <div matTextPrefix class=\"prefix_alternate_mobile primary\">\r\n <div class=\"d-flex countryCode\">\r\n <span class=\"country_code_input\"> {{ CountryCode }} </span>\r\n <span\r\n ><img src=\"https://cdn.godigit.com/retail-life/down-arrow.svg\" alt=\"\"\r\n /></span>\r\n </div>\r\n </div>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [placeholder]=\"getUnderscorePlaceholder()\"\r\n (keyup)=\"changeFormat($event)\"\r\n />\r\n }\r\n\r\n <span matSuffix class=\"p-3\">\r\n <img src=\"https://cdn.godigit.com/retail-life/edit-icon.svg\" alt=\"\" />\r\n </span>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.mobile-field .mat-mdc-form-field:not(.mat-form-field-disabled) .mat-mdc-floating-label.mdc-floating-label{transform:var(--mat-mdc-form-field-label-transform, translateY(-50%) translateX(calc(1 * (61.625px + var(--mat-mdc-form-field-label-offset-x, 0px)))))!important}.error-message{color:red}.hyphen-input{letter-spacing:5px!important}.prefix_alternate_mobile{font-size:12px;font-weight:400;color:#8f8f8f;padding:10px 6px 10px 0;border-right:1px solid #dddddd;height:20px;width:auto;display:flex;justify-content:center;align-items:center;position:relative;cursor:pointer;transform:translate(-6px)}.countryCode{gap:4px}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "directive", type: i2$1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: i2$1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2717
2704
|
}
|
|
2718
2705
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnderscoreMobNumberComponent, decorators: [{
|
|
2719
2706
|
type: Component,
|
|
@@ -2729,7 +2716,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2729
2716
|
class IconButtonComponent {
|
|
2730
2717
|
field = input.required();
|
|
2731
2718
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2732
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: IconButtonComponent, isStandalone: true, selector: "lib-icon-button", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<Button\r\nclass=\"icon-button\"\r\n*ngIf=\"field() && field()?.isVisible\"\r\n[ngStyle]=\"\r\n{\r\n '--icon-button-border-width': field()?.controlStyle?.borderWidth ,\r\n '--icon-button-border-style': field()?.controlStyle?.borderStyle ,\r\n '--icon-button-border-color': field()?.controlStyle?.borderColor ,\r\n '--icon-button-width': field()?.controlStyle?.width ,\r\n '--icon-button-background': field()?.controlStyle?.background ,\r\n '--icon-button-border-radius': field()?.controlStyle?.borderRadius ,\r\n}\"\r\n>\r\n<span>\r\n<img [src]=\"field()?.imageUrl ? field()?.imageUrl : 'https://cdn.godigit.com/retail-life/Download_Icon.svg'\"/>\r\n</span>\r\n</Button>\r\n", styles: ["*{font-family:mulish!important}.icon-button{border-width:1px;border-color:#444;border-style:solid;background:#fff;border-radius:8px;width:48px;height:48px}.icon-button{border-width:var(--icon-button-border-width , 1px);border-color:var(--icon-button-border-color , #444);border-style:var(--icon-button-border-style , solid);background:var(--icon-button-background ,#fff);border-radius:var(--icon-button-border-radius , 8px);width:var(--icon-button-width , 48px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2719
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: IconButtonComponent, isStandalone: true, selector: "lib-icon-button", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<Button\r\nclass=\"icon-button\"\r\n*ngIf=\"field() && field()?.isVisible\"\r\n[ngStyle]=\"\r\n{\r\n '--icon-button-border-width': field()?.controlStyle?.borderWidth ,\r\n '--icon-button-border-style': field()?.controlStyle?.borderStyle ,\r\n '--icon-button-border-color': field()?.controlStyle?.borderColor ,\r\n '--icon-button-width': field()?.controlStyle?.width ,\r\n '--icon-button-background': field()?.controlStyle?.background ,\r\n '--icon-button-border-radius': field()?.controlStyle?.borderRadius ,\r\n}\"\r\n>\r\n<span>\r\n<img [src]=\"field()?.imageUrl ? field()?.imageUrl : 'https://cdn.godigit.com/retail-life/Download_Icon.svg'\"/>\r\n</span>\r\n</Button>\r\n", styles: ["*{font-family:mulish!important}.icon-button{border-width:1px;border-color:#444;border-style:solid;background:#fff;border-radius:8px;width:48px;height:48px}.icon-button{border-width:var(--icon-button-border-width , 1px);border-color:var(--icon-button-border-color , #444);border-style:var(--icon-button-border-style , solid);background:var(--icon-button-background ,#fff);border-radius:var(--icon-button-border-radius , 8px);width:var(--icon-button-width , 48px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2733
2720
|
}
|
|
2734
2721
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IconButtonComponent, decorators: [{
|
|
2735
2722
|
type: Component,
|
|
@@ -2739,7 +2726,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2739
2726
|
class ImageComponent {
|
|
2740
2727
|
field = input.required();
|
|
2741
2728
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2742
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ImageComponent, isStandalone: true, selector: "lib-image", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\">\r\n <img [src]=\"field()['imageUrl']\" class=\"image-width\" [ngStyle]=\"{'--image-width' : field()?.controlStyle?.width}\"/>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.image-width{width:var(--image-width , 100%);height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2729
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ImageComponent, isStandalone: true, selector: "lib-image", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\">\r\n <img [src]=\"field()['imageUrl']\" class=\"image-width\" [ngStyle]=\"{'--image-width' : field()?.controlStyle?.width}\"/>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.image-width{width:var(--image-width , 100%);height:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2743
2730
|
}
|
|
2744
2731
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageComponent, decorators: [{
|
|
2745
2732
|
type: Component,
|
|
@@ -2757,7 +2744,7 @@ class StepperComponent {
|
|
|
2757
2744
|
this.field().editStepper = this.field().configData.stepperData ? this.field().configData.stepperData : this.masterSharedService?.configData?.stepper?.stepperData;
|
|
2758
2745
|
}
|
|
2759
2746
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2760
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: StepperComponent, isStandalone: true, selector: "lib-stepper", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\">\r\n <mat-stepper #stepperHeader>\r\n <ng-container *ngFor=\"let steps of field().editStepper; let i = index\">\r\n <mat-step>\r\n <ng-template matStepLabel>\r\n <img\r\n class=\"step-img\"\r\n [src]=\"steps.imgIconUrl\"\r\n alt=\"\"\r\n />\r\n <span class=\"step-label mx-2\">{{steps?.displayLabel}}</span>\r\n </ng-template>\r\n </mat-step>\r\n </ng-container>\r\n </mat-stepper>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.step-img{width:24px;position:relative;bottom:1px}.step-label{color:#444;font-size:14px;font-weight:600}::ng-deep .mat-step-icon{display:none}::ng-deep .mat-horizontal-stepper-header-container{background:#fff!important}::ng-deep .mat-stepper-horizontal-line{border-top:1px dashed!important}::ng-deep .mat-horizontal-content-container{display:none}\n"], dependencies: [{ kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$
|
|
2747
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: StepperComponent, isStandalone: true, selector: "lib-stepper", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\">\r\n <mat-stepper #stepperHeader>\r\n <ng-container *ngFor=\"let steps of field().editStepper; let i = index\">\r\n <mat-step>\r\n <ng-template matStepLabel>\r\n <img\r\n class=\"step-img\"\r\n [src]=\"steps.imgIconUrl\"\r\n alt=\"\"\r\n />\r\n <span class=\"step-label mx-2\">{{steps?.displayLabel}}</span>\r\n </ng-template>\r\n </mat-step>\r\n </ng-container>\r\n </mat-stepper>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.step-img{width:24px;position:relative;bottom:1px}.step-label{color:#444;font-size:14px;font-weight:600}::ng-deep .mat-step-icon{display:none}::ng-deep .mat-horizontal-stepper-header-container{background:#fff!important}::ng-deep .mat-stepper-horizontal-line{border-top:1px dashed!important}::ng-deep .mat-horizontal-content-container{display:none}\n"], dependencies: [{ kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$4.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i2$4.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i2$4.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
2761
2748
|
}
|
|
2762
2749
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperComponent, decorators: [{
|
|
2763
2750
|
type: Component,
|
|
@@ -2789,7 +2776,7 @@ class CardComponent {
|
|
|
2789
2776
|
this.cardDetailsClicked.emit(passcardData);
|
|
2790
2777
|
}
|
|
2791
2778
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2792
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: CardComponent, isStandalone: true, selector: "lib-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { cardDetailsClicked: "cardDetailsClicked" }, ngImport: i0, template: "<div class=\"grid-container-card\" *ngIf=\"field() && field()?.isVisible\">\r\n <div class=\"endorsement-card\" [ngStyle]=\"{\r\n '--card-border-color': field()?.controlStyle?.borderColor ,\r\n '--card-border-width': field()?.controlStyle?.borderWidth ,\r\n '--card-border-style': field()?.controlStyle?.borderStyle ,\r\n '--card-border-radius': field()?.controlStyle?.borderRadius \r\n }\" *ngFor=\"let policyDetails of field().cardDetails; let i = index\" (click)=\"activeCard(policyDetails)\">\r\n <p class=\"m-0 card-label\" [ngStyle]=\"{\r\n '--card-font-size': field()?.controlStyle?.fontSize ,\r\n '--card-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--card-font-color': field()?.controlStyle?.color ,}\">{{policyDetails?.policyHolderName}}</p>\r\n <hr class=\"m-0 hr-line mt-1\" />\r\n <div class=\"d-flex gap-2 mt-1\">\r\n <span>\r\n <img src=\"https://cdn.godigit.com/retail-life/Endorsement-add-ons.svg\" alt=\"\" />\r\n </span>\r\n <span>\r\n <p class=\"m-0 card-label\">{{policyDetails?.policyType}}</p>\r\n <span class=\"below-card-text\">{{policyDetails?.policyNumber}}</span>\r\n </span>\r\n </div>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.endorsement-card{max-height:94px;border-color:var(--card-border-color , #dadada);border-width:var(--card-border-width , 1.5px);border-style:var(--card-border-style , solid);border-radius:var(--card-border-radius , .5rem);padding:12px;max-width:220px;cursor:pointer;transition:border-color .3s ease}.card-label{font-size:var(--card-font-size , 14px);font-weight:var(--card-font-weight , 600);color:var(--card-font-color , #444)}.hr-line{border-top:1px dashed #DADADA!important;opacity:initial;border-image:repeating-linear-gradient(to right,#DADADA 0 6px,transparent 0px 10px) 1 stretch}.card-label{font-size:14px;font-weight:600;color:#444}.below-card-text{font-size:12px;color:#696969;font-weight:600}.grid-container-card{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:20px!important;padding:20px!important}.endorsement-card.active{border-color:#fb0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2779
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: CardComponent, isStandalone: true, selector: "lib-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { cardDetailsClicked: "cardDetailsClicked" }, ngImport: i0, template: "<div class=\"grid-container-card\" *ngIf=\"field() && field()?.isVisible\">\r\n <div class=\"endorsement-card\" [ngStyle]=\"{\r\n '--card-border-color': field()?.controlStyle?.borderColor ,\r\n '--card-border-width': field()?.controlStyle?.borderWidth ,\r\n '--card-border-style': field()?.controlStyle?.borderStyle ,\r\n '--card-border-radius': field()?.controlStyle?.borderRadius \r\n }\" *ngFor=\"let policyDetails of field().cardDetails; let i = index\" (click)=\"activeCard(policyDetails)\">\r\n <p class=\"m-0 card-label\" [ngStyle]=\"{\r\n '--card-font-size': field()?.controlStyle?.fontSize ,\r\n '--card-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--card-font-color': field()?.controlStyle?.color ,}\">{{policyDetails?.policyHolderName}}</p>\r\n <hr class=\"m-0 hr-line mt-1\" />\r\n <div class=\"d-flex gap-2 mt-1\">\r\n <span>\r\n <img src=\"https://cdn.godigit.com/retail-life/Endorsement-add-ons.svg\" alt=\"\" />\r\n </span>\r\n <span>\r\n <p class=\"m-0 card-label\">{{policyDetails?.policyType}}</p>\r\n <span class=\"below-card-text\">{{policyDetails?.policyNumber}}</span>\r\n </span>\r\n </div>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.endorsement-card{max-height:94px;border-color:var(--card-border-color , #dadada);border-width:var(--card-border-width , 1.5px);border-style:var(--card-border-style , solid);border-radius:var(--card-border-radius , .5rem);padding:12px;max-width:220px;cursor:pointer;transition:border-color .3s ease}.card-label{font-size:var(--card-font-size , 14px);font-weight:var(--card-font-weight , 600);color:var(--card-font-color , #444)}.hr-line{border-top:1px dashed #DADADA!important;opacity:initial;border-image:repeating-linear-gradient(to right,#DADADA 0 6px,transparent 0px 10px) 1 stretch}.card-label{font-size:14px;font-weight:600;color:#444}.below-card-text{font-size:12px;color:#696969;font-weight:600}.grid-container-card{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:20px!important;padding:20px!important}.endorsement-card.active{border-color:#fb0}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2793
2780
|
}
|
|
2794
2781
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardComponent, decorators: [{
|
|
2795
2782
|
type: Component,
|
|
@@ -2801,7 +2788,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2801
2788
|
class HrLineComponent {
|
|
2802
2789
|
field = input.required();
|
|
2803
2790
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HrLineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2804
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: HrLineComponent, isStandalone: true, selector: "lib-hr-line", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\r\n <div class=\"hr-with-text\" [ngStyle]=\"{\r\n '--hr-line-border-width': field()?.controlStyle?.borderWidth,\r\n '--hr-line-border-color': field()?.controlStyle?.borderColor,\r\n '--hr-line-border-style': field()?.controlStyle?.borderStyle\r\n}\">\r\n <span class=\"hr-text\" [ngStyle]=\"{\r\n '--hr-text-color': field()?.controlStyle?.color,\r\n '--hr-text-weight': field()?.controlStyle?.fontWeight,\r\n '--hr-text-size': field()?.controlStyle?.fontSize\r\n}\"\r\n*ngIf=\"field()?.configData?.hrText\">{{field()?.configData?.hrText}}</span>\r\n</div>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.hr-with-text{display:flex;align-items:center;text-align:center;margin:16px 0}.hr-with-text:before{content:\"\";flex:1;border-style:var(--hr-line-border-style, dashed)!important;border-width:var(--hr-line-border-width, 1px)!important;border-color:var(--hr-line-border-color, #ddd)!important}.hr-with-text:after{content:\"\";flex:1;border-style:var(--hr-line-border-style, dashed)!important;border-width:var(--hr-line-border-width, 1px)!important;border-color:var(--hr-line-border-color, #ddd)!important}.hr-text{padding:0 15px;background:transparent;color:var(--hr-text-color , #666);font-weight:var(--hr-text-weight , 500);white-space:nowrap;font-size:var(--hr-text-size , 12px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2791
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: HrLineComponent, isStandalone: true, selector: "lib-hr-line", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"\">\r\n <div class=\"hr-with-text\" [ngStyle]=\"{\r\n '--hr-line-border-width': field()?.controlStyle?.borderWidth,\r\n '--hr-line-border-color': field()?.controlStyle?.borderColor,\r\n '--hr-line-border-style': field()?.controlStyle?.borderStyle\r\n}\">\r\n <span class=\"hr-text\" [ngStyle]=\"{\r\n '--hr-text-color': field()?.controlStyle?.color,\r\n '--hr-text-weight': field()?.controlStyle?.fontWeight,\r\n '--hr-text-size': field()?.controlStyle?.fontSize\r\n}\"\r\n*ngIf=\"field()?.configData?.hrText\">{{field()?.configData?.hrText}}</span>\r\n</div>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.hr-with-text{display:flex;align-items:center;text-align:center;margin:16px 0}.hr-with-text:before{content:\"\";flex:1;border-style:var(--hr-line-border-style, dashed)!important;border-width:var(--hr-line-border-width, 1px)!important;border-color:var(--hr-line-border-color, #ddd)!important}.hr-with-text:after{content:\"\";flex:1;border-style:var(--hr-line-border-style, dashed)!important;border-width:var(--hr-line-border-width, 1px)!important;border-color:var(--hr-line-border-color, #ddd)!important}.hr-text{padding:0 15px;background:transparent;color:var(--hr-text-color , #666);font-weight:var(--hr-text-weight , 500);white-space:nowrap;font-size:var(--hr-text-size , 12px)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2805
2792
|
}
|
|
2806
2793
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HrLineComponent, decorators: [{
|
|
2807
2794
|
type: Component,
|
|
@@ -2896,7 +2883,7 @@ class SearchMultiSelectComponent {
|
|
|
2896
2883
|
useExisting: SearchMultiSelectComponent,
|
|
2897
2884
|
multi: true
|
|
2898
2885
|
}
|
|
2899
|
-
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n appearance=\"outline\"\r\n class=\"input-full-width full-width w-100 multi-select\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n<mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [(value)]=\"selectedValues\"\r\n (selectionChange)=\"onSelectionChange()\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-listbox>\r\n @for (option of visibleChip; track option) {\r\n <mat-chip [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-listbox>\r\n </mat-select-trigger>\r\n <div class=\"select-container\">\r\n <mat-optgroup>\r\n <mat-form-field\r\n class=\"input-full-width full-width w-100 multiselect-search\"\r\n >\r\n <input\r\n matInput\r\n #search\r\n autocomplete=\"off\"\r\n placeholder=\"Search\"\r\n [(ngModel)]=\"searchText\"\r\n (ngModelChange)=\"filterOptions()\"\r\n />\r\n </mat-form-field>\r\n </mat-optgroup>\r\n @for (option of filteredOptions; track option.label) {\r\n <mat-option [value]=\"option.label\" autoActiveFirstOption>\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </div>\r\n </mat-select>\r\n}@else {\r\n <mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [(value)]=\"selectedValues\"\r\n (selectionChange)=\"onSelectionChange()\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-listbox>\r\n @for (option of visibleChip; track option) {\r\n <mat-chip [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-listbox>\r\n </mat-select-trigger>\r\n <div class=\"select-container\">\r\n <mat-optgroup>\r\n <mat-form-field\r\n class=\"input-full-width full-width w-100 multiselect-search\"\r\n >\r\n <input\r\n matInput\r\n #search\r\n autocomplete=\"off\"\r\n placeholder=\"Search\"\r\n [(ngModel)]=\"searchText\"\r\n (ngModelChange)=\"filterOptions()\"\r\n />\r\n </mat-form-field>\r\n </mat-optgroup>\r\n @for (option of filteredOptions; track option.label) {\r\n <mat-option [value]=\"option.label\" autoActiveFirstOption>\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </div>\r\n </mat-select>\r\n}\r\n \r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-chip-set .mdc-evolution-chip{background-color:#fff9e5!important}::ng-deep .mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__text-label{font-size:12px!important;font-weight:400!important;color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing{height:12px!important;width:12px!important;font-size:12px!important}::ng-deep .multi-select .mat-mdc-form-field-type-mat-select:not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper{padding-right:0!important}::ng-deep .mat-mdc-standard-chip{--mdc-chip-outline-width: 1px !important;border-radius:18px!important;--mdc-chip-container-shape-radius: 19px !important;--mdc-chip-outline-color: #ffbb00 !important}::ng-deep .multi-select .mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding:9px 0 7px}::ng-deep .multi-select .mat-mdc-select-arrow-wrapper{height:37px}::ng-deep .mat-mdc-chip{height:24px!important}::ng-deep .mat-mdc-optgroup-label{display:contents!important}::ng-deep .multiselect-search .mat-mdc-text-field-wrapper{background:#fff!important}::ng-deep .multiselect-search .mdc-text-field__input{color:#444!important}::ng-deep .multiselect-search .mdc-line-ripple--active{opacity:0!important;transform:none!important}::ng-deep .mdc-line-ripple{opacity:0!important;transform:none!important}::ng-deep .mdc-evolution-chip-set__chips{flex-flow:unset!important;overflow:scroll!important;scrollbar-width:none!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked:after{color:#fff!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-indeterminate{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox{border:1px solid #DADADA}::ng-deep .mat-mdc-option.mdc-list-item.mat-mdc-option-multiple.mdc-list-item--selected{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}.select-container{background:#fff}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.material-icons{font-family:Material Icons!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.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: "directive", type: i3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4$1.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i6.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i6.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "directive", type: i6.MatChipRemove, selector: "[matChipRemove]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2886
|
+
], ngImport: i0, template: "<label class=\"field-lable\" *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n appearance=\"outline\"\r\n class=\"input-full-width full-width w-100 multi-select\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n '--custom-border-color': field()?.controlStyle?.borderColor ,\r\n '--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n '--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--custom-bg-color': field()?.controlStyle?.background ,\r\n '--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n '--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n '--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n '--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n '--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n '--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n '--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n }\"\r\n>\r\n@if(reactiveFormControlobject()) {\r\n<mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [(value)]=\"selectedValues\"\r\n (selectionChange)=\"onSelectionChange()\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-listbox>\r\n @for (option of visibleChip; track option) {\r\n <mat-chip [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-listbox>\r\n </mat-select-trigger>\r\n <div class=\"select-container\">\r\n <mat-optgroup>\r\n <mat-form-field\r\n class=\"input-full-width full-width w-100 multiselect-search\"\r\n >\r\n <input\r\n matInput\r\n #search\r\n autocomplete=\"off\"\r\n placeholder=\"Search\"\r\n [(ngModel)]=\"searchText\"\r\n (ngModelChange)=\"filterOptions()\"\r\n />\r\n </mat-form-field>\r\n </mat-optgroup>\r\n @for (option of filteredOptions; track option.label) {\r\n <mat-option [value]=\"option.label\" autoActiveFirstOption>\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </div>\r\n </mat-select>\r\n}@else {\r\n <mat-select\r\n multiple\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\r\n [(value)]=\"selectedValues\"\r\n (selectionChange)=\"onSelectionChange()\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [disabled]=\"field()?.isDisable\"\r\n (openedChange)=\"onSelectOpened($event)\"\r\n [value]=\"inputValue\"\r\n >\r\n <mat-select-trigger>\r\n <mat-chip-listbox>\r\n @for (option of visibleChip; track option) {\r\n <mat-chip [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\r\n <mat-icon matChipRemove>close</mat-icon>\r\n </mat-chip>\r\n }\r\n <mat-chip *ngIf=\"remainingCount > 0\"> +{{ remainingCount }} </mat-chip>\r\n </mat-chip-listbox>\r\n </mat-select-trigger>\r\n <div class=\"select-container\">\r\n <mat-optgroup>\r\n <mat-form-field\r\n class=\"input-full-width full-width w-100 multiselect-search\"\r\n >\r\n <input\r\n matInput\r\n #search\r\n autocomplete=\"off\"\r\n placeholder=\"Search\"\r\n [(ngModel)]=\"searchText\"\r\n (ngModelChange)=\"filterOptions()\"\r\n />\r\n </mat-form-field>\r\n </mat-optgroup>\r\n @for (option of filteredOptions; track option.label) {\r\n <mat-option [value]=\"option.label\" autoActiveFirstOption>\r\n {{ option.label }}\r\n </mat-option>\r\n }\r\n </div>\r\n </mat-select>\r\n}\r\n \r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.requiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}::ng-deep .mat-mdc-select-arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-mdc-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-arrow svg{display:none!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{background:#fff!important}::ng-deep div.mat-mdc-select-panel{background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item{background:#fff!important;color:#444!important;font-weight:400}::ng-deep .mat-mdc-form-field.mat-focused .mat-mdc-select-arrow{color:#fb0!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item{background:var(--custom-select-option-background-color, #fff)!important;color:var(--custom-select-option-font-color, #444)!important;font-weight:var(--custom-select-option-font-weight, 400)!important}::ng-deep .mat-mdc-option:focus.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option.mat-mdc-option-active.mdc-list-item{background:var(--custom-select-option-background-color-focus, #fffaeb)!important;color:var(--custom-select-option-font-color-focus, #444)!important;font-weight:var(--custom-select-option-font-weight-focus, 600)!important;border-left:var(--custom-select-option-border-left-focus, 4px solid #fb0)!important;border-radius:var(--custom-select-option-border-radius-focus, 3px)!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 12px)!important}::ng-deep .cdk-overlay-pane:not(.mat-mdc-select-panel-above) div.mat-mdc-select-panel{padding:0!important;background:#fafafa!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:12px!important}::ng-deep .mat-mdc-form-field.mat-focused.mat-primary .mat-select-arrow{color:#fb0}::ng-deep .mat-mdc-select-panel-above div.mat-mdc-select-panel{padding:0!important}::ng-deep .mat-mdc-optgroup-label{background:#f5f5f5;color:#444;font-weight:800}::ng-deep .mat-mdc-autocomplete-panel.mat-mdc-autocomplete-visible{padding:0!important;background:#fff!important}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple){background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600!important;color:#444!important;border-radius:3px}::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text{color:unset!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox-minimal{display:none!important}::ng-deep .mat-mdc-chip-set .mdc-evolution-chip{background-color:#fff9e5!important}::ng-deep .mat-mdc-standard-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__text-label{font-size:12px!important;font-weight:400!important;color:#444!important}::ng-deep .mat-mdc-standard-chip .mdc-evolution-chip__icon--trailing{height:12px!important;width:12px!important;font-size:12px!important}::ng-deep .multi-select .mat-mdc-form-field-type-mat-select:not(.mat-form-field-disabled) .mat-mdc-text-field-wrapper{padding-right:0!important}::ng-deep .mat-mdc-standard-chip{--mdc-chip-outline-width: 1px !important;border-radius:18px!important;--mdc-chip-container-shape-radius: 19px !important;--mdc-chip-outline-color: #ffbb00 !important}::ng-deep .multi-select .mdc-text-field--outlined .mat-mdc-form-field-infix,.mdc-text-field--no-label .mat-mdc-form-field-infix{padding:9px 0 7px}::ng-deep .multi-select .mat-mdc-select-arrow-wrapper{height:37px}::ng-deep .mat-mdc-chip{height:24px!important}::ng-deep .mat-mdc-optgroup-label{display:contents!important}::ng-deep .multiselect-search .mat-mdc-text-field-wrapper{background:#fff!important}::ng-deep .multiselect-search .mdc-text-field__input{color:#444!important}::ng-deep .multiselect-search .mdc-line-ripple--active{opacity:0!important;transform:none!important}::ng-deep .mdc-line-ripple{opacity:0!important;transform:none!important}::ng-deep .mdc-evolution-chip-set__chips{flex-flow:unset!important;overflow:scroll!important;scrollbar-width:none!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked:after{color:#fff!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-checked{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-pseudo-checkbox-full.mat-pseudo-checkbox-indeterminate{background-color:#fb0!important;border-radius:4px!important}::ng-deep .mat-mdc-option .mat-pseudo-checkbox{border:1px solid #DADADA}::ng-deep .mat-mdc-option.mdc-list-item.mat-mdc-option-multiple.mdc-list-item--selected{background:#fffaeb!important;border-left:4px solid #fb0;font-weight:600;color:#444!important;border-radius:3px}.select-container{background:#fff}::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{color:#8f8f8f!important;font-size:12px!important;vertical-align:sub}*{font-family:mulish!important}.material-icons{font-family:Material Icons!important}@media screen and (max-width: 768px){::ng-deep .mat-mdc-form-field .mat-mdc-select-placeholder{font-size:14px!important}::ng-deep .mat-mdc-option .mdc-list-item__primary-text{font-size:var(--custom-font-size, 14px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{font-size:14px!important}}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "component", type: i3.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: "directive", type: i3.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i4$1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "component", type: i4$1.MatOptgroup, selector: "mat-optgroup", inputs: ["label", "disabled"], exportAs: ["matOptgroup"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatChipsModule }, { kind: "component", type: i6.MatChip, selector: "mat-basic-chip, [mat-basic-chip], mat-chip, [mat-chip]", inputs: ["role", "id", "aria-label", "aria-description", "value", "color", "removable", "highlighted", "disableRipple", "disabled"], outputs: ["removed", "destroyed"], exportAs: ["matChip"] }, { kind: "component", type: i6.MatChipListbox, selector: "mat-chip-listbox", inputs: ["multiple", "aria-orientation", "selectable", "compareWith", "required", "hideSingleSelectionIndicator", "value"], outputs: ["change"] }, { kind: "directive", type: i6.MatChipRemove, selector: "[matChipRemove]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2900
2887
|
}
|
|
2901
2888
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchMultiSelectComponent, decorators: [{
|
|
2902
2889
|
type: Component,
|
|
@@ -2952,7 +2939,7 @@ class SubscriptTextboxComponent {
|
|
|
2952
2939
|
useExisting: SubscriptTextboxComponent,
|
|
2953
2940
|
multi: true
|
|
2954
2941
|
}
|
|
2955
|
-
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n\r\n <p class=\"years-text\" *ngIf=\"inputValue\">Years</p>\r\n <p class=\"textbox-subscript\">till 2026</p>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div>\r\n <span class=\"below-input-text\">{{field()?.configData?.subscriptText}}</span>\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}*{font-family:mulish!important}.years-text{position:absolute;left:5%;bottom:5px;font-size:14px}.error-message{color:red}.below-input-text{font-weight:400;font-size:12px;color:#444;font-family:Mulish}.textbox-subscript{color:#8f8f8f;font-size:14px;font-weight:400;position:absolute;left:15%;bottom:5px}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type:
|
|
2942
|
+
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n\r\n <p class=\"years-text\" *ngIf=\"inputValue\">Years</p>\r\n <p class=\"textbox-subscript\">till 2026</p>\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div>\r\n <span class=\"below-input-text\">{{field()?.configData?.subscriptText}}</span>\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}*{font-family:mulish!important}.years-text{position:absolute;left:5%;bottom:5px;font-size:14px}.error-message{color:red}.below-input-text{font-weight:400;font-size:12px;color:#444;font-family:Mulish}.textbox-subscript{color:#8f8f8f;font-size:14px;font-weight:400;position:absolute;left:15%;bottom:5px}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
2956
2943
|
}
|
|
2957
2944
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SubscriptTextboxComponent, decorators: [{
|
|
2958
2945
|
type: Component,
|
|
@@ -2973,7 +2960,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2973
2960
|
class LabelComponent {
|
|
2974
2961
|
field = input.required();
|
|
2975
2962
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2976
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LabelComponent, isStandalone: true, selector: "lib-label", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field()?.isVisible\">\r\n<span class=\"master-label\" [ngStyle]=\"{\r\n'--master-heading-font-color': field()?.controlStyle?.color,\r\n'--master-heading-font-size': field()?.controlStyle?.fontSize,\r\n'--master-heading-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}</span>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.master-label{font-weight:400;font-size:14px;color:#000}.master-label{color:var(--master-heading-font-color, #000000)!important;font-size:var(--master-heading-font-size, 14px)!important;font-weight:var(--master-heading-font-weight, 400)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2963
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LabelComponent, isStandalone: true, selector: "lib-label", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field()?.isVisible\">\r\n<span class=\"master-label\" [ngStyle]=\"{\r\n'--master-heading-font-color': field()?.controlStyle?.color,\r\n'--master-heading-font-size': field()?.controlStyle?.fontSize,\r\n'--master-heading-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}</span>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.master-label{font-weight:400;font-size:14px;color:#000}.master-label{color:var(--master-heading-font-color, #000000)!important;font-size:var(--master-heading-font-size, 14px)!important;font-weight:var(--master-heading-font-weight, 400)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2977
2964
|
}
|
|
2978
2965
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelComponent, decorators: [{
|
|
2979
2966
|
type: Component,
|
|
@@ -2983,7 +2970,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2983
2970
|
class SubHeaderComponent {
|
|
2984
2971
|
field = input.required();
|
|
2985
2972
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SubHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2986
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: SubHeaderComponent, isStandalone: true, selector: "lib-sub-header", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div>\r\n <span class=\"sub-heading\" [ngStyle]=\"{\r\n'--sub-heading-font-color': field()?.controlStyle?.color,\r\n'--sub-heading-font-size': field()?.controlStyle?.fontSize,\r\n'--sub-heading-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}\r\n<img [src]=\"field()?.imageUrl\" *ngIf=\"field()?.imageUrl\" alt=\"\">\r\n</span>\r\n</div>", styles: ["*{font-family:mulish!important}.sub-heading{font-weight:700;font-size:16px;color:#000}.sub-heading{color:var(--sub-heading-font-color, #000000)!important;font-size:var(--sub-heading-font-size, 16px)!important;font-weight:var(--sub-heading-font-weight, 700)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2973
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: SubHeaderComponent, isStandalone: true, selector: "lib-sub-header", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div>\r\n <span class=\"sub-heading\" [ngStyle]=\"{\r\n'--sub-heading-font-color': field()?.controlStyle?.color,\r\n'--sub-heading-font-size': field()?.controlStyle?.fontSize,\r\n'--sub-heading-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}\r\n<img [src]=\"field()?.imageUrl\" *ngIf=\"field()?.imageUrl\" alt=\"\">\r\n</span>\r\n</div>", styles: ["*{font-family:mulish!important}.sub-heading{font-weight:700;font-size:16px;color:#000}.sub-heading{color:var(--sub-heading-font-color, #000000)!important;font-size:var(--sub-heading-font-size, 16px)!important;font-weight:var(--sub-heading-font-weight, 700)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2987
2974
|
}
|
|
2988
2975
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SubHeaderComponent, decorators: [{
|
|
2989
2976
|
type: Component,
|
|
@@ -2993,7 +2980,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2993
2980
|
class HeaderComponent {
|
|
2994
2981
|
field = input.required();
|
|
2995
2982
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2996
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: HeaderComponent, isStandalone: true, selector: "lib-header", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div>\r\n <span class=\"heading\" [ngStyle]=\"{\r\n'--heading-font-color': field()?.controlStyle?.color,\r\n'--heading-font-size': field()?.controlStyle?.fontSize,\r\n'--heading-font-weight': field()?.controlStyle?.fontWeight\r\n}\">\r\n {{field()?.label}}\r\n </span>\r\n</div>", styles: ["*{font-family:mulish!important}.heading{font-weight:800;font-size:24px;color:#000}.heading{color:var(--heading-font-color, #000000)!important;font-size:var(--heading-font-size, 24px)!important;font-weight:var(--heading-font-weight, 800)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
2983
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: HeaderComponent, isStandalone: true, selector: "lib-header", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div>\r\n <span class=\"heading\" [ngStyle]=\"{\r\n'--heading-font-color': field()?.controlStyle?.color,\r\n'--heading-font-size': field()?.controlStyle?.fontSize,\r\n'--heading-font-weight': field()?.controlStyle?.fontWeight\r\n}\">\r\n {{field()?.label}}\r\n </span>\r\n</div>", styles: ["*{font-family:mulish!important}.heading{font-weight:800;font-size:24px;color:#000}.heading{color:var(--heading-font-color, #000000)!important;font-size:var(--heading-font-size, 24px)!important;font-weight:var(--heading-font-weight, 800)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2997
2984
|
}
|
|
2998
2985
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
2999
2986
|
type: Component,
|
|
@@ -3088,7 +3075,7 @@ class TableComponent {
|
|
|
3088
3075
|
this.actionItemClicked.emit(emitOBJ);
|
|
3089
3076
|
}
|
|
3090
3077
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3091
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TableComponent, isStandalone: true, selector: "lib-table", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionItemClicked: "actionItemClicked", tablePaginationClicked: "tablePaginationClicked" }, host: { listeners: { "document:keydown.escape": "onEscKey($event)" } }, ngImport: i0, template: "<div class=\"styled-table-container\">\r\n <ng-container *ngIf=\"field()?.tableData?.tdData && field()?.tableData?.tdData.length > 0\">\r\n <table *ngIf=\"field()?.tableData?.columnlength && field()?.tableData?.rowlength\" class=\"styled-table\">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"field()?.tableData?.showCheckBox\"></th>\r\n <th *ngFor=\"let header of field().tableData?.tableHeaders; let i = index; trackBy: trackByIndex\">\r\n <ng-container>{{ header?.columnName }}</ng-container>\r\n </th>\r\n <th *ngIf=\"field()?.tableData?.showActions\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let row of field()?.tableData?.tdData;let rowIndex = index\">\r\n <td *ngIf=\"field()?.tableData?.showCheckBox\"><input type=\"checkbox\"></td>\r\n <td *ngFor=\"let cell of row\">{{ cell }}</td>\r\n <td *ngIf=\"field()?.tableData?.showActions\">\r\n <button class=\"action-btn\" (click)=\"openActionsPopup($event, rowIndex)\" [disabled]=\"readonly()\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <ng-container *ngIf=\"field()?.tableData?.showPagination\">\r\n <mat-paginator class=\"custom-paginator\" [length]=\"field()?.tableData?.totalItems\"\r\n [pageSize]=\"field()?.tableData?.paginationSize\" [pageSizeOptions]=\"[5, 10, 25, 100]\"\r\n (page)=\"pageChanged($event)\" aria-label=\"Select page\">\r\n </mat-paginator>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"field()?.tableData?.tdData && field()?.tableData?.tdData.length === 0\">\r\n <div class=\"tableEmptyData\">\r\n <p class=\"tableemptyDataMessage\">No matching records found for the given search input.</p>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div *ngIf=\"showActionsPopup\" class=\"actions-popup-backdrop\" (click)=\"closeActionsPopup()\">\r\n <div class=\"actions-popup-menu\" [ngStyle]=\"{'top.px': popupPosition.top, 'left.px': popupPosition.left}\"\r\n (click)=\"$event.stopPropagation()\">\r\n <div class=\"makeArrow\" [ngStyle]=\"{'left.px': popupPosition.left+25}\"></div>\r\n <ul>\r\n <li *ngFor=\"let actionData of field().tableData?.userSelectedOptions[selectedRow];let actionIndex = index\"\r\n [matTooltip]=\"actionData?.displayTitle\" matTooltipPosition=\"above\"\r\n (click)=\"actionClicked(actionData,actionIndex)\">\r\n <mat-icon>{{actionData?.matIconName}}</mat-icon>\r\n {{actionData?.displayTitle}}\r\n </li>\r\n </ul>\r\n </div>\r\n</div>", styles: [".styled-table{width:100%;margin:16px 0;font-size:1em;box-shadow:0 0 8px #0000001a}*{font-family:mulish!important}.styled-table th,.styled-table td{border:none;padding:8px 12px;text-align:left}.styled-table thead tr{background-color:#444;color:#fff}.styled-table tbody tr:nth-child(2n){background-color:#f3f3f3}.styled-table tbody tr:hover{background-color:#e0f7fa}.custom_input{width:100%;border:none;background:transparent;font-weight:700;color:#fff}.styled-table th:first-child{border-top-left-radius:8px}.styled-table th:last-child{border-top-right-radius:8px}.popup-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0000004d;display:flex;align-items:center;justify-content:center;z-index:1000}.action-btn{background:none;border:none;cursor:pointer;padding:0}.actions-popup-backdrop{position:fixed;inset:0;background:transparent;z-index:1000}.actions-popup-menu{position:absolute;min-width:260px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000002e;padding:0;z-index:1001;color:#333;font-family:inherit;border:1px solid #DDDDDD}.actions-popup-menu ul{list-style:none;margin:0;padding:0 0 8px}.actions-popup-menu li{display:flex;align-items:center;padding:10px 20px;cursor:pointer;font-size:15px;transition:background .2s;border-bottom:1px dashed #DADADA}.actions-popup-menu li mat-icon{margin-right:12px;font-size:20px}.actions-popup-menu li.selected,.actions-popup-menu li:hover{background:#fff6d1;color:#222}.styled-table-container{max-width:100%;overflow-x:auto;max-height:400px;overflow-y:auto}.makeArrow{width:0;height:0;border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:16px solid #fff;border-right:none;position:absolute;top:10px}:host ::ng-deep .custom-paginator .mdc-text-field--outlined .mdc-notched-outline{display:none!important}.material-icons{font-family:Material Icons!important}.tableEmptyData{width:100%;height:50px;text-align:center;background:#faebd7}.tableemptyDataMessage{position:relative;top:14px;font-size:16px;font-weight:600;color:olive}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3078
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TableComponent, isStandalone: true, selector: "lib-table", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionItemClicked: "actionItemClicked", tablePaginationClicked: "tablePaginationClicked" }, host: { listeners: { "document:keydown.escape": "onEscKey($event)" } }, ngImport: i0, template: "<div class=\"styled-table-container\">\r\n <ng-container *ngIf=\"field()?.tableData?.tdData && field()?.tableData?.tdData.length > 0\">\r\n <table *ngIf=\"field()?.tableData?.columnlength && field()?.tableData?.rowlength\" class=\"styled-table\">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"field()?.tableData?.showCheckBox\"></th>\r\n <th *ngFor=\"let header of field().tableData?.tableHeaders; let i = index; trackBy: trackByIndex\">\r\n <ng-container>{{ header?.columnName }}</ng-container>\r\n </th>\r\n <th *ngIf=\"field()?.tableData?.showActions\">Action</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let row of field()?.tableData?.tdData;let rowIndex = index\">\r\n <td *ngIf=\"field()?.tableData?.showCheckBox\"><input type=\"checkbox\"></td>\r\n <td *ngFor=\"let cell of row\">{{ cell }}</td>\r\n <td *ngIf=\"field()?.tableData?.showActions\">\r\n <button class=\"action-btn\" (click)=\"openActionsPopup($event, rowIndex)\" [disabled]=\"readonly()\">\r\n <mat-icon>more_vert</mat-icon>\r\n </button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <ng-container *ngIf=\"field()?.tableData?.showPagination\">\r\n <mat-paginator class=\"custom-paginator\" [length]=\"field()?.tableData?.totalItems\"\r\n [pageSize]=\"field()?.tableData?.paginationSize\" [pageSizeOptions]=\"[5, 10, 25, 100]\"\r\n (page)=\"pageChanged($event)\" aria-label=\"Select page\">\r\n </mat-paginator>\r\n </ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"field()?.tableData?.tdData && field()?.tableData?.tdData.length === 0\">\r\n <div class=\"tableEmptyData\">\r\n <p class=\"tableemptyDataMessage\">No matching records found for the given search input.</p>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<div *ngIf=\"showActionsPopup\" class=\"actions-popup-backdrop\" (click)=\"closeActionsPopup()\">\r\n <div class=\"actions-popup-menu\" [ngStyle]=\"{'top.px': popupPosition.top, 'left.px': popupPosition.left}\"\r\n (click)=\"$event.stopPropagation()\">\r\n <div class=\"makeArrow\" [ngStyle]=\"{'left.px': popupPosition.left+25}\"></div>\r\n <ul>\r\n <li *ngFor=\"let actionData of field().tableData?.userSelectedOptions[selectedRow];let actionIndex = index\"\r\n [matTooltip]=\"actionData?.displayTitle\" matTooltipPosition=\"above\"\r\n (click)=\"actionClicked(actionData,actionIndex)\">\r\n <mat-icon>{{actionData?.matIconName}}</mat-icon>\r\n {{actionData?.displayTitle}}\r\n </li>\r\n </ul>\r\n </div>\r\n</div>", styles: [".styled-table{width:100%;margin:16px 0;font-size:1em;box-shadow:0 0 8px #0000001a}*{font-family:mulish!important}.styled-table th,.styled-table td{border:none;padding:8px 12px;text-align:left}.styled-table thead tr{background-color:#444;color:#fff}.styled-table tbody tr:nth-child(2n){background-color:#f3f3f3}.styled-table tbody tr:hover{background-color:#e0f7fa}.custom_input{width:100%;border:none;background:transparent;font-weight:700;color:#fff}.styled-table th:first-child{border-top-left-radius:8px}.styled-table th:last-child{border-top-right-radius:8px}.popup-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0000004d;display:flex;align-items:center;justify-content:center;z-index:1000}.action-btn{background:none;border:none;cursor:pointer;padding:0}.actions-popup-backdrop{position:fixed;inset:0;background:transparent;z-index:1000}.actions-popup-menu{position:absolute;min-width:260px;background:#fff;border-radius:12px;box-shadow:0 4px 24px #0000002e;padding:0;z-index:1001;color:#333;font-family:inherit;border:1px solid #DDDDDD}.actions-popup-menu ul{list-style:none;margin:0;padding:0 0 8px}.actions-popup-menu li{display:flex;align-items:center;padding:10px 20px;cursor:pointer;font-size:15px;transition:background .2s;border-bottom:1px dashed #DADADA}.actions-popup-menu li mat-icon{margin-right:12px;font-size:20px}.actions-popup-menu li.selected,.actions-popup-menu li:hover{background:#fff6d1;color:#222}.styled-table-container{max-width:100%;overflow-x:auto;max-height:400px;overflow-y:auto}.makeArrow{width:0;height:0;border-top:12px solid transparent;border-bottom:12px solid transparent;border-left:16px solid #fff;border-right:none;position:absolute;top:10px}:host ::ng-deep .custom-paginator .mdc-text-field--outlined .mdc-notched-outline{display:none!important}.material-icons{font-family:Material Icons!important}.tableEmptyData{width:100%;height:50px;text-align:center;background:#faebd7}.tableemptyDataMessage{position:relative;top:14px;font-size:16px;font-weight:600;color:olive}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i7.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i5$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }] });
|
|
3092
3079
|
}
|
|
3093
3080
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TableComponent, decorators: [{
|
|
3094
3081
|
type: Component,
|
|
@@ -3134,7 +3121,7 @@ class TextboxWithTextComponent {
|
|
|
3134
3121
|
useExisting: TextboxWithTextComponent,
|
|
3135
3122
|
multi: true,
|
|
3136
3123
|
},
|
|
3137
|
-
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div>\r\n <span class=\"below-input-text\">{{field()?.configData?.subscriptText}}</span>\r\n <span [innerHTML]=\"field()?.configData?.innerHTML\"></span>\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.below-input-text{font-weight:400;font-size:12px;color:#444;font-family:Mulish}.error-message{color:red}.innerSubscriptText{font-weight:800;font-size:12px;color:#fb0!important;font-family:Mulish}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.hyperlink{font-weight:700;font-size:12px;color:#fb0}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type:
|
|
3124
|
+
], ngImport: i0, template: "<label\r\n class=\"field-lable\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >{{ field()?.label\r\n }}<span style=\"color: red\" *ngIf=\"field() && field()?.validators?.isRequired\"\r\n >*</span\r\n ></label\r\n>\r\n<mat-form-field\r\n class=\"w-100\"\r\n appearance=\"outline\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"{\r\n'--custom-border-color': field()?.controlStyle?.borderColor ,\r\n'--custom-border-width': field()?.controlStyle?.borderWidth ,\r\n'--custom-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--custom-bg-color': field()?.controlStyle?.background ,\r\n'--custom-border-color-focus': field()?.controlStyle?.focusBorderColor ,\r\n'--custom-border-width-focus': field()?.controlStyle?.focusBorderWidth ,\r\n'--custom-bg-color-focus': field()?.controlStyle?.focusBackground ,\r\n'--custom-border-color-hover': field()?.controlStyle?.hoverBorderColor ,\r\n'--custom-border-width-hover': field()?.controlStyle?.hoverBorderWidth ,\r\n'--custom-border-color-error': field()?.controlStyle?.errorBorderColor ,\r\n'--custom-border-width-error': field()?.controlStyle?.errorBorderWidth ,\r\n'--custom-font-size': field()?.controlStyle?.fontSize ,\r\n'--custom-font-weight': field()?.controlStyle?.fontWeight ,\r\n'--custom-font-family': field()?.controlStyle?.fontFamily ,\r\n'--custom-font-color': field()?.controlStyle?.color ,\r\n'--custom-caret-color': field()?.controlStyle?.caretColor ,\r\n'--custom-font-color-disabled' : field()?.controlStyle?.disableColor ,\r\n'--custom-bg-color-disabled' : field()?.controlStyle?.disableBackground ,\r\n}\"\r\n>\r\n @if(reactiveFormControlobject()) {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n />\r\n }@else {\r\n <input\r\n matInput\r\n autocomplete=\"none\"\r\n [type]=\"field()?.controlType\"\r\n [name]=\"field()?.fieldName\"\r\n [id]=\"field()?.fieldName\"\r\n [placeholder]=\"field()?.placeHolder\"\r\n [maxLength]=\"field()?.validators?.maxLength\"\r\n [minLength]=\"field()?.validators?.minLength\"\r\n [disabled]=\"field()?.isDisable\"\r\n [required]=\"field()?.validators?.isRequired\"\r\n [pattern]=\"field()?.validators?.pattern\"\r\n (input)=\"onInputChange($event)\"\r\n (blur)=\"onInputBlur()\"\r\n [value]=\"inputValue\"\r\n />\r\n }\r\n\r\n <mat-error *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}\r\n </mat-error>\r\n</mat-form-field>\r\n<div>\r\n <span class=\"below-input-text\">{{field()?.configData?.subscriptText}}</span>\r\n <span [innerHTML]=\"field()?.configData?.innerHTML\"></span>\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.isRequiredMessage }}.\r\n</div>\r\n<div class=\"error-message\" *ngIf=\"false\">\r\n {{ field()?.validators?.patternMessage }}.\r\n</div>\r\n", styles: [".field-lable{font-size:12px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.below-input-text{font-weight:400;font-size:12px;color:#444;font-family:Mulish}.error-message{color:red}.innerSubscriptText{font-weight:800;font-size:12px;color:#fb0!important;font-family:Mulish}*{font-family:mulish!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 4px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:var(--custom-border-color-hover, #ffbb00)!important;border-width:var(--custom-border-width-hover, 1.5px)!important}::ng-deep .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color, #dddddd)!important;border-width:var(--custom-border-width, 1.5px)!important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-text-field__input{caret-color:var(--custom-caret-color, #ffbb00)!important;font-size:12px!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important;color:var(--custom-font-color, #444444)!important}::ng-deep .mat-form-field-invalid .mdc-text-field--outlined .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field.mat-form-field-disabled{background:var(--custom-bg-color-disabled, #ECECEC)!important}::ng-deep .mdc-text-field--outlined.mdc-text-field--disabled .mdc-text-field__input{color:var(--custom-font-color-disabled, #999999)!important}::ng-deep .mdc-label{color:var(--custom-font-color, #444)!important;font-size:var(--custom-font-size, 16px)!important;font-weight:var(--custom-font-weight, 400)!important;font-family:var(--custom-font-family, \"Mulish\")!important}::placeholder{color:#8f8f8f!important;font-size:12px!important}::ng-deep .mat-mdc-form-field-hint-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error-wrapper{padding:0!important}::ng-deep .mat-mdc-form-field-error{color:#e00!important;font-size:12px;font-weight:500;font-family:Mulish!important;letter-spacing:0}::ng-deep .mdc-text-field--outlined{--mdc-outlined-text-field-container-shape: var(--custom-border-radius , 4px) !important}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--invalid .mat-mdc-notch-piece{border-color:var(--custom-border-color-error, red)!important;border-width:var(--custom-border-width-error, 1.5px)!important}::ng-deep .mat-mdc-form-field-subscript-wrapper{display:none!important}.hyperlink{font-weight:700;font-size:12px;color:#fb0}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i2.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i2$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i2$1.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.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: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
|
|
3138
3125
|
}
|
|
3139
3126
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxWithTextComponent, decorators: [{
|
|
3140
3127
|
type: Component,
|
|
@@ -3157,7 +3144,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3157
3144
|
class DiscountComponent {
|
|
3158
3145
|
field = input.required();
|
|
3159
3146
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3160
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: DiscountComponent, isStandalone: true, selector: "lib-discount", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<p\r\n class=\"discount-label b2-bold px-1\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\"\r\n>\r\n {{ field()?.label }}\r\n</p>\r\n<div \r\nclass=\"discount-card\" \r\n*ngIf=\"field() && field()?.isVisible\"\r\n[ngStyle]=\"\r\n{\r\n '--discount-border-width': field()?.controlStyle?.borderWidth,\r\n '--discount-card-width': field()?.controlStyle?.width ,\r\n '--discount-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--discount-border-color': field()?.controlStyle?.borderColor ,\r\n}\"\r\n>\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <img\r\n src=\"https://cdn.godigit.com/retail-life/discount-img-lib.svg\"\r\n alt=\"\"\r\n class=\"mx-1\"\r\n />\r\n <span class=\"h2-extrabold\">5% </span>\r\n <span class=\"b3-regular\">off</span>\r\n </div>\r\n <div>\r\n <button class=\"apply-btn\">\r\n <span class=\"my-1\">\r\n Apply\r\n <img\r\n src=\"https://cdn.godigit.com/retail-life/arrow_forward_lib.svg\"\r\n alt=\"\"\r\n />\r\n </span>\r\n </button>\r\n </div>\r\n <div *ngIf=\"false\">\r\n <button class=\"remove-btn\">\r\n <span> Remove x </span>\r\n </button>\r\n </div>\r\n </div>\r\n <div>\r\n <p class=\"b2-bold m-0\">Good Health Discount</p>\r\n <p class=\"b3-regular\">\r\n Get extra 5% discount for keeping a healthy lifestyle!\r\n </p>\r\n </div>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.discount-label{color:#ecaf07;background:#fffbe5}.discount-card{max-height:100px;max-width:346px;border:1px solid #ECECEC;box-shadow:0 2px 15px 2px #e3e6ec99;border-radius:.5rem;padding:12px 16px;letter-spacing:0px}.discount-card{max-width:var(--discount-card-width, 346px)!important;border-radius:var(--discount-border-radius, .5rem)!important;border-color:var(--discount-border-color, #ECECEC)!important;border-width:var(--discount-border-width, 1px)!important}.h2-extrabold{font-size:20px;font-weight:800;color:#444}.b3-regular{font-weight:400;font-size:12px;color:#444}.apply-btn{background:#fb0;max-width:78px;max-height:24px;border-radius:32px;padding:0 12px 4px;border:1px solid #ffbb00;font-size:12px;font-weight:700;color:#000}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3147
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: DiscountComponent, isStandalone: true, selector: "lib-discount", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<p\r\n class=\"discount-label b2-bold px-1\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.isShowLabel\"\r\n>\r\n {{ field()?.label }}\r\n</p>\r\n<div \r\nclass=\"discount-card\" \r\n*ngIf=\"field() && field()?.isVisible\"\r\n[ngStyle]=\"\r\n{\r\n '--discount-border-width': field()?.controlStyle?.borderWidth,\r\n '--discount-card-width': field()?.controlStyle?.width ,\r\n '--discount-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--discount-border-color': field()?.controlStyle?.borderColor ,\r\n}\"\r\n>\r\n <div class=\"d-flex justify-content-between\">\r\n <div>\r\n <img\r\n src=\"https://cdn.godigit.com/retail-life/discount-img-lib.svg\"\r\n alt=\"\"\r\n class=\"mx-1\"\r\n />\r\n <span class=\"h2-extrabold\">5% </span>\r\n <span class=\"b3-regular\">off</span>\r\n </div>\r\n <div>\r\n <button class=\"apply-btn\">\r\n <span class=\"my-1\">\r\n Apply\r\n <img\r\n src=\"https://cdn.godigit.com/retail-life/arrow_forward_lib.svg\"\r\n alt=\"\"\r\n />\r\n </span>\r\n </button>\r\n </div>\r\n <div *ngIf=\"false\">\r\n <button class=\"remove-btn\">\r\n <span> Remove x </span>\r\n </button>\r\n </div>\r\n </div>\r\n <div>\r\n <p class=\"b2-bold m-0\">Good Health Discount</p>\r\n <p class=\"b3-regular\">\r\n Get extra 5% discount for keeping a healthy lifestyle!\r\n </p>\r\n </div>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.discount-label{color:#ecaf07;background:#fffbe5}.discount-card{max-height:100px;max-width:346px;border:1px solid #ECECEC;box-shadow:0 2px 15px 2px #e3e6ec99;border-radius:.5rem;padding:12px 16px;letter-spacing:0px}.discount-card{max-width:var(--discount-card-width, 346px)!important;border-radius:var(--discount-border-radius, .5rem)!important;border-color:var(--discount-border-color, #ECECEC)!important;border-width:var(--discount-border-width, 1px)!important}.h2-extrabold{font-size:20px;font-weight:800;color:#444}.b3-regular{font-weight:400;font-size:12px;color:#444}.apply-btn{background:#fb0;max-width:78px;max-height:24px;border-radius:32px;padding:0 12px 4px;border:1px solid #ffbb00;font-size:12px;font-weight:700;color:#000}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3161
3148
|
}
|
|
3162
3149
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountComponent, decorators: [{
|
|
3163
3150
|
type: Component,
|
|
@@ -3167,7 +3154,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3167
3154
|
class BenefitCardComponent {
|
|
3168
3155
|
field = input.required();
|
|
3169
3156
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BenefitCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3170
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: BenefitCardComponent, isStandalone: true, selector: "lib-benefit-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"benefit-card\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"\r\n{\r\n '--benefit-border-width': field()?.controlStyle?.borderWidth,\r\n '--benefit-card-width': field()?.controlStyle?.width ,\r\n '--benefit-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--benefit-border-color': field()?.controlStyle?.borderColor ,\r\n}\"\r\n>\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"b1-bold\" *ngIf=\"field()?.isShowLabel\">{{ field()?.label }}</span>\r\n <button class=\"add-card-button\">+ Add</button>\r\n <button class=\"remove-card-button\" *ngIf=\"false\">x Remove</button>\r\n </div>\r\n <div class=\"mt-2\">\r\n <img\r\n src=\"https://cdn.godigit.com/retail-life/tabler_wheelchair.png\"\r\n alt=\"\"\r\n />\r\n <span class=\"b3-regular mx-2\">Policy Continuance Benefit on Death</span>\r\n <img src=\"https://cdn.godigit.com/retail-life/info-button-lib.svg\" alt=\"\" />\r\n </div>\r\n</div>\r\n", styles: [".benefit-card{max-width:380px;max-height:92px;border:1px solid #dadada;padding:16px;border-radius:.5rem}.benefit-card{max-width:var(--benefit-card-width, 380px)!important;border-radius:var(--benefit-border-radius, .5rem)!important;border-color:var(--benefit-border-color, #dadada)!important;border-width:var(--benefit-border-width, 1px)!important}.b1-bold{font-size:16px;font-weight:700;color:#444}.add-card-button{width:72px;max-height:24px;border-radius:32px;border:1px solid #ffbb00;padding:0 6px 6px;font-weight:700;font-size:12px;background:#fb0}.remove-card-button{width:84px;max-height:24px;padding:0 6px 6px;border-radius:24px;border:.8px solid #444;background:#fff;font-weight:700;font-size:12px}.b3-regular{font-weight:400;font-size:12px;color:#444}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3157
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: BenefitCardComponent, isStandalone: true, selector: "lib-benefit-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"benefit-card\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"\r\n{\r\n '--benefit-border-width': field()?.controlStyle?.borderWidth,\r\n '--benefit-card-width': field()?.controlStyle?.width ,\r\n '--benefit-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--benefit-border-color': field()?.controlStyle?.borderColor ,\r\n}\"\r\n>\r\n <div class=\"d-flex justify-content-between\">\r\n <span class=\"b1-bold\" *ngIf=\"field()?.isShowLabel\">{{ field()?.label }}</span>\r\n <button class=\"add-card-button\">+ Add</button>\r\n <button class=\"remove-card-button\" *ngIf=\"false\">x Remove</button>\r\n </div>\r\n <div class=\"mt-2\">\r\n <img\r\n src=\"https://cdn.godigit.com/retail-life/tabler_wheelchair.png\"\r\n alt=\"\"\r\n />\r\n <span class=\"b3-regular mx-2\">Policy Continuance Benefit on Death</span>\r\n <img src=\"https://cdn.godigit.com/retail-life/info-button-lib.svg\" alt=\"\" />\r\n </div>\r\n</div>\r\n", styles: [".benefit-card{max-width:380px;max-height:92px;border:1px solid #dadada;padding:16px;border-radius:.5rem}.benefit-card{max-width:var(--benefit-card-width, 380px)!important;border-radius:var(--benefit-border-radius, .5rem)!important;border-color:var(--benefit-border-color, #dadada)!important;border-width:var(--benefit-border-width, 1px)!important}.b1-bold{font-size:16px;font-weight:700;color:#444}.add-card-button{width:72px;max-height:24px;border-radius:32px;border:1px solid #ffbb00;padding:0 6px 6px;font-weight:700;font-size:12px;background:#fb0}.remove-card-button{width:84px;max-height:24px;padding:0 6px 6px;border-radius:24px;border:.8px solid #444;background:#fff;font-weight:700;font-size:12px}.b3-regular{font-weight:400;font-size:12px;color:#444}*{font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3171
3158
|
}
|
|
3172
3159
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BenefitCardComponent, decorators: [{
|
|
3173
3160
|
type: Component,
|
|
@@ -3177,7 +3164,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3177
3164
|
class LoaderComponent {
|
|
3178
3165
|
field = input.required();
|
|
3179
3166
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3180
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LoaderComponent, isStandalone: true, selector: "lib-loader", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"loader-overlay\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"field()?.configData?.loaderCSS\"\r\n>\r\n <div\r\n class=\"loader-card\"\r\n [ngStyle]=\"field()?.configData?.cardCSS\"\r\n >\r\n <ng-container *ngIf=\"field()?.configData?.imageURL; else defaultLoader\">\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n [ngStyle]=\"field()?.configData?.imageCSS\"\r\n alt=\"Loader\"\r\n />\r\n <div\r\n class=\"loader-text\"\r\n [ngStyle]=\"field()?.configData?.textCSS\"\r\n >\r\n {{ field()?.configData?.text }}\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultLoader>\r\n <div class=\"loader\">\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n </div>\r\n <div\r\n class=\"loader-text\"\r\n [ngStyle]=\"field()?.configData?.textCSS\"\r\n >\r\n {{ field()?.configData?.text }}\r\n </div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n", styles: [".loading{position:fixed;z-index:10000;height:2em;width:2em;overflow:show;margin:auto;inset:0}.loading:before{content:\"\";display:block;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0000004d}.loading:not(:required){font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.loading:not(:required):after{content:\"\";display:block;font-size:10px;width:1em;height:1em;margin-top:-.5em;-webkit-animation:spinner 1.5s infinite linear;-moz-animation:spinner 1.5s infinite linear;-ms-animation:spinner 1.5s infinite linear;-o-animation:spinner 1.5s infinite linear;animation:spinner 1.5s infinite linear;border-radius:.5em;-webkit-box-shadow:rgba(0,0,0,.75) 1.5em 0 0 0,rgba(0,0,0,.75) 1.1em 1.1em 0 0,rgba(0,0,0,.75) 0 1.5em 0 0,rgba(0,0,0,.75) -1.1em 1.1em 0 0,rgba(0,0,0,.5) -1.5em 0 0 0,rgba(0,0,0,.5) -1.1em -1.1em 0 0,rgba(0,0,0,.75) 0 -1.5em 0 0,rgba(0,0,0,.75) 1.1em -1.1em 0 0;box-shadow:#000000bf 1.5em 0,#000000bf 1.1em 1.1em,#000000bf 0 1.5em,#000000bf -1.1em 1.1em,#000000bf -1.5em 0,#000000bf -1.1em -1.1em,#000000bf 0 -1.5em,#000000bf 1.1em -1.1em}@-webkit-keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3167
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LoaderComponent, isStandalone: true, selector: "lib-loader", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"loader-overlay\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n [ngStyle]=\"field()?.configData?.loaderCSS\"\r\n>\r\n <div\r\n class=\"loader-card\"\r\n [ngStyle]=\"field()?.configData?.cardCSS\"\r\n >\r\n <ng-container *ngIf=\"field()?.configData?.imageURL; else defaultLoader\">\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n [ngStyle]=\"field()?.configData?.imageCSS\"\r\n alt=\"Loader\"\r\n />\r\n <div\r\n class=\"loader-text\"\r\n [ngStyle]=\"field()?.configData?.textCSS\"\r\n >\r\n {{ field()?.configData?.text }}\r\n </div>\r\n </ng-container>\r\n <ng-template #defaultLoader>\r\n <div class=\"loader\">\r\n <span></span>\r\n <span></span>\r\n <span></span>\r\n </div>\r\n <div\r\n class=\"loader-text\"\r\n [ngStyle]=\"field()?.configData?.textCSS\"\r\n >\r\n {{ field()?.configData?.text }}\r\n </div>\r\n </ng-template>\r\n </div>\r\n</div>\r\n", styles: [".loading{position:fixed;z-index:10000;height:2em;width:2em;overflow:show;margin:auto;inset:0}.loading:before{content:\"\";display:block;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0000004d}.loading:not(:required){font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.loading:not(:required):after{content:\"\";display:block;font-size:10px;width:1em;height:1em;margin-top:-.5em;-webkit-animation:spinner 1.5s infinite linear;-moz-animation:spinner 1.5s infinite linear;-ms-animation:spinner 1.5s infinite linear;-o-animation:spinner 1.5s infinite linear;animation:spinner 1.5s infinite linear;border-radius:.5em;-webkit-box-shadow:rgba(0,0,0,.75) 1.5em 0 0 0,rgba(0,0,0,.75) 1.1em 1.1em 0 0,rgba(0,0,0,.75) 0 1.5em 0 0,rgba(0,0,0,.75) -1.1em 1.1em 0 0,rgba(0,0,0,.5) -1.5em 0 0 0,rgba(0,0,0,.5) -1.1em -1.1em 0 0,rgba(0,0,0,.75) 0 -1.5em 0 0,rgba(0,0,0,.75) 1.1em -1.1em 0 0;box-shadow:#000000bf 1.5em 0,#000000bf 1.1em 1.1em,#000000bf 0 1.5em,#000000bf -1.1em 1.1em,#000000bf -1.5em 0,#000000bf -1.1em -1.1em,#000000bf 0 -1.5em,#000000bf 1.1em -1.1em}@-webkit-keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spinner{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);-o-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3181
3168
|
}
|
|
3182
3169
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LoaderComponent, decorators: [{
|
|
3183
3170
|
type: Component,
|
|
@@ -3193,7 +3180,7 @@ class WarningSnackbarComponent {
|
|
|
3193
3180
|
this.warningObj = this.masterService.snackbars.find((item) => item.type === 'Warning');
|
|
3194
3181
|
}
|
|
3195
3182
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WarningSnackbarComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3196
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: WarningSnackbarComponent, isStandalone: true, selector: "lib-warning-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: [".cross{width:9.86px;height:9.86px;cursor:pointer}.warning-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:var(--Colours-Primary-100, #FFFBE5);border:1px solid var(--colours-primary-20020, #FFBB0033);box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px}.toaster-img{height:24px;width:24px}.toaster-label{font-size:14px;font-weight:700;color:#444}.toaster-msg{font-weight:400;font-size:12px;color:#444;line-height:0px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3183
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: WarningSnackbarComponent, isStandalone: true, selector: "lib-warning-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: [".cross{width:9.86px;height:9.86px;cursor:pointer}.warning-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:var(--Colours-Primary-100, #FFFBE5);border:1px solid var(--colours-primary-20020, #FFBB0033);box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px}.toaster-img{height:24px;width:24px}.toaster-label{font-size:14px;font-weight:700;color:#444}.toaster-msg{font-weight:400;font-size:12px;color:#444;line-height:0px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3197
3184
|
}
|
|
3198
3185
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WarningSnackbarComponent, decorators: [{
|
|
3199
3186
|
type: Component,
|
|
@@ -3209,7 +3196,7 @@ class SuccessSnackbarComponent {
|
|
|
3209
3196
|
this.successObj = this.masterService.snackbars.find((item) => item.type === 'Success');
|
|
3210
3197
|
}
|
|
3211
3198
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuccessSnackbarComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3212
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: SuccessSnackbarComponent, isStandalone: true, selector: "lib-success-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.cross{width:9.86px;height:9.86px;cursor:pointer}.toaster-img{height:24px;width:24px}.toaster-label{font-size:14px;font-weight:700;color:#444}.toaster-msg{font-weight:400;font-size:12px;color:#444;line-height:0px}.success-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:var(--Colours-Success-100, #E6F7F3);border:1px solid var(--Colours-Success-200, #CEF0E8);box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3199
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: SuccessSnackbarComponent, isStandalone: true, selector: "lib-success-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.cross{width:9.86px;height:9.86px;cursor:pointer}.toaster-img{height:24px;width:24px}.toaster-label{font-size:14px;font-weight:700;color:#444}.toaster-msg{font-weight:400;font-size:12px;color:#444;line-height:0px}.success-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:var(--Colours-Success-100, #E6F7F3);border:1px solid var(--Colours-Success-200, #CEF0E8);box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3213
3200
|
}
|
|
3214
3201
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuccessSnackbarComponent, decorators: [{
|
|
3215
3202
|
type: Component,
|
|
@@ -3225,7 +3212,7 @@ class NeutralSnackbarComponent {
|
|
|
3225
3212
|
this.neutralObj = this.masterService.snackbars.find((item) => item.type === 'Neutral');
|
|
3226
3213
|
}
|
|
3227
3214
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NeutralSnackbarComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3228
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: NeutralSnackbarComponent, isStandalone: true, selector: "lib-neutral-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.neutral-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:#444;box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px;color:#fff!important}.neutral-image{height:14.67px}.neutral-toaster-label{font-size:14px;font-weight:700;color:#fff}.neutral-toaster-msg{font-weight:400;font-size:12px;color:#fff;line-height:0px}.cross{width:9.86px;height:9.86px;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3215
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: NeutralSnackbarComponent, isStandalone: true, selector: "lib-neutral-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.neutral-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:#444;box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px;color:#fff!important}.neutral-image{height:14.67px}.neutral-toaster-label{font-size:14px;font-weight:700;color:#fff}.neutral-toaster-msg{font-weight:400;font-size:12px;color:#fff;line-height:0px}.cross{width:9.86px;height:9.86px;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3229
3216
|
}
|
|
3230
3217
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NeutralSnackbarComponent, decorators: [{
|
|
3231
3218
|
type: Component,
|
|
@@ -3241,7 +3228,7 @@ class ErrorSnackbarComponent {
|
|
|
3241
3228
|
this.errorObj = this.masterService.snackbars.find((item) => item.type === 'Error');
|
|
3242
3229
|
}
|
|
3243
3230
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ErrorSnackbarComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3244
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ErrorSnackbarComponent, isStandalone: true, selector: "lib-error-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.error-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:var(--Colours-Error-100, #FDE5E5);border:1px solid var(--Colours-Error-200, #FCCCCC);box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px}.cross{width:9.86px;height:9.86px;cursor:pointer}.mat-mdc-snack-bar-container .mat-mdc-snackbar-surface{background-color:#444!important;color:#f5f5f5!important}.toaster-label{font-size:14px;font-weight:700;color:#444}.toaster-img{height:24px;width:24px}.toaster-msg{font-weight:400;font-size:12px;color:#444;line-height:0px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3231
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ErrorSnackbarComponent, isStandalone: true, selector: "lib-error-snackbar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div [ngClass]=\"field()?.configData?.toasterCSS\">\r\n <div class=\"d-flex justify-content-between\">\r\n <div class=\"d-flex gap-3\">\r\n <span>\r\n <img\r\n [src]=\"field()?.configData?.imageURL\"\r\n alt=\"\"\r\n class=\"mt-1\"\r\n [ngClass]=\"field()?.configData?.imageCSS\"\r\n />\r\n </span>\r\n <span class=\"mb-2\">\r\n <p class=\"mb-2\" [ngClass]=\"field()?.configData?.labelCSS\">{{field()?.configData?.labelText}}</p>\r\n <p class=\"m-0\" [ngClass]=\"field()?.configData?.messageCSS\">{{field()?.configData?.messageText}}</p>\r\n </span>\r\n </div>\r\n <div >\r\n <img class=\"cross\" [ngClass]=\"field()?.configData?.closeIconCSS\" [src]=\"field()?.configData?.closeIconImageURL\" alt=\"\">\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.error-snackbar-card{max-height:58px;max-width:400px;border-radius:8px;background:var(--Colours-Error-100, #FDE5E5);border:1px solid var(--Colours-Error-200, #FCCCCC);box-shadow:0 2px 15px 2px #e3e6ec99;padding:10px 16px}.cross{width:9.86px;height:9.86px;cursor:pointer}.mat-mdc-snack-bar-container .mat-mdc-snackbar-surface{background-color:#444!important;color:#f5f5f5!important}.toaster-label{font-size:14px;font-weight:700;color:#444}.toaster-img{height:24px;width:24px}.toaster-msg{font-weight:400;font-size:12px;color:#444;line-height:0px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
|
|
3245
3232
|
}
|
|
3246
3233
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ErrorSnackbarComponent, decorators: [{
|
|
3247
3234
|
type: Component,
|
|
@@ -3251,7 +3238,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3251
3238
|
class GreyLabelComponent {
|
|
3252
3239
|
field = input.required();
|
|
3253
3240
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GreyLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3254
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: GreyLabelComponent, isStandalone: true, selector: "lib-grey-label", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field()?.isVisible\">\r\n <span class=\"bold-label\" [ngStyle]=\"{\r\n'--master-bold-label-font-color': field()?.controlStyle?.color,\r\n'--master-bold-label-font-size': field()?.controlStyle?.fontSize,\r\n'--master-bold-label-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}</span>\r\n</div>", styles: ["*{font-family:mulish!important}.bold-label{color:var(--master-bold-label-font-color, #000000)!important;font-size:var(--master-bold-label-font-size, 12px)!important;font-weight:var(--master-bold-label-font-weight, 600)!important}.bold-label{color:#000;font-size:.875rem;font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3241
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: GreyLabelComponent, isStandalone: true, selector: "lib-grey-label", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field()?.isVisible\">\r\n <span class=\"bold-label\" [ngStyle]=\"{\r\n'--master-bold-label-font-color': field()?.controlStyle?.color,\r\n'--master-bold-label-font-size': field()?.controlStyle?.fontSize,\r\n'--master-bold-label-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}</span>\r\n</div>", styles: ["*{font-family:mulish!important}.bold-label{color:var(--master-bold-label-font-color, #000000)!important;font-size:var(--master-bold-label-font-size, 12px)!important;font-weight:var(--master-bold-label-font-weight, 600)!important}.bold-label{color:#000;font-size:.875rem;font-weight:600}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3255
3242
|
}
|
|
3256
3243
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GreyLabelComponent, decorators: [{
|
|
3257
3244
|
type: Component,
|
|
@@ -3277,13 +3264,13 @@ class IframeComponent {
|
|
|
3277
3264
|
}
|
|
3278
3265
|
return iframeUrl;
|
|
3279
3266
|
}
|
|
3280
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IframeComponent, deps: [{ token: i1$
|
|
3281
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: IframeComponent, isStandalone: true, selector: "lib-iframe", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field().imageUrl\">\r\n <iframe [id]=\"field().fieldName\" width=\"100%\" height=\"500px\" style=\"border: none\"></iframe>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3267
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IframeComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
|
|
3268
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: IframeComponent, isStandalone: true, selector: "lib-iframe", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field().imageUrl\">\r\n <iframe [id]=\"field().fieldName\" width=\"100%\" height=\"500px\" style=\"border: none\"></iframe>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
3282
3269
|
}
|
|
3283
3270
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: IframeComponent, decorators: [{
|
|
3284
3271
|
type: Component,
|
|
3285
3272
|
args: [{ selector: 'lib-iframe', standalone: true, imports: [CommonModule], template: "<div *ngIf=\"field().imageUrl\">\r\n <iframe [id]=\"field().fieldName\" width=\"100%\" height=\"500px\" style=\"border: none\"></iframe>\r\n</div>\r\n" }]
|
|
3286
|
-
}], ctorParameters: () => [{ type: i1$
|
|
3273
|
+
}], ctorParameters: () => [{ type: i1$1.DomSanitizer }] });
|
|
3287
3274
|
|
|
3288
3275
|
class ToggleButtonComponent {
|
|
3289
3276
|
reactiveFormControlobject = input();
|
|
@@ -3323,7 +3310,7 @@ class ToggleButtonComponent {
|
|
|
3323
3310
|
useExisting: ToggleButtonComponent,
|
|
3324
3311
|
multi: true,
|
|
3325
3312
|
},
|
|
3326
|
-
], ngImport: i0, template: "<div style=\"position: relative\" [ngClass]=\"field()?.cssClass\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-button-toggle-group [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\" name=\"fontStyle\" class=\"custom-mat-toggle\" aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\" [value]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\" [formControl]=\"reactiveFormControlobject()\">\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\">\r\n <img *ngIf=\"data.imgUrl && !data.tooltipText\" [src]=\"data.imgUrl\" alt=\"\" class=\"toggle-img mx-1\" />\r\n\r\n {{ data.label }}\r\n <span [appTooltipTemplate]=\"currentTooltip\" arrowPosition=\"left\" tooltipPosition=\"bottom\"\r\n *ngIf=\"data.imgUrl && data.tooltipText\">\r\n <img [src]=\"data.imgUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n\r\n <!-- \u2705 Single template that uses current data -->\r\n <ng-template #currentTooltip>\r\n <span [innerHTML]=\"data.tooltipText\"></span>\r\n </ng-template>\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img class=\"green-card-img\" *ngIf=\"data.topImage\" [src]=\"data.topImage\" alt=\"\" />\r\n <span>{{ data.toggleTopText }}</span>\r\n </span>\r\n </div>\r\n }\r\n </mat-button-toggle-group>\r\n }@else {\r\n <mat-button-toggle-group [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\" name=\"fontStyle\" class=\"custom-mat-toggle\" aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\" [(ngModel)]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\">\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\">\r\n {{ data.label }}\r\n <!-- <span [appTooltipTemplate]=\"currentTooltip\" arrowPosition=\"left\" tooltipPosition=\"bottom\"\r\n *ngIf=\"data.imgUrl && data.tooltipText\">\r\n <img [src]=\"data.imgUrl\" />\r\n </span> -->\r\n\r\n <!-- \u2705 Single template that uses current data -->\r\n <!-- <ng-template #currentTooltip>\r\n <span [innerHTML]=\"data.tooltipText\"></span>\r\n </ng-template> -->\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img class=\"green-card-img\" *ngIf=\"data.topImage\" [src]=\"data.topImage\" alt=\"\" />\r\n <span>{{ data.toggleTopText }}</span>\r\n </span>\r\n </div>\r\n }\r\n </mat-button-toggle-group>\r\n }\r\n</div>", styles: [":host ::ng-deep .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border:none}:host ::ng-deep .mat-button-toggle-standalone,.mat-button-toggle-group{border-radius:50px}:host ::ng-deep .mat-button-toggle-appearance-standard .mat-button-toggle-label-content{height:32px!important;transform:translateY(-9px);font-size:12px;font-weight:400;color:#444;letter-spacing:1px}:host ::ng-deep .mat-button-toggle-checked .mat-button-toggle-button{background:#fff!important;border-radius:50px!important;box-shadow:0 0 15px #00000014!important;height:32px;padding:0 24px;border:1px solid #ffbb00}:host ::ng-deep .mat-button-toggle-button{padding:0 24px}:host ::ng-deep .mat-button-toggle-checked .mat-button-toggle-label-content{font-weight:600!important;letter-spacing:1px}:host ::ng-deep .mat-button-toggle .mat-pseudo-checkbox{display:none}:host ::ng-deep .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.mat-button-toggle-group-appearance-standard{border:1px solid #ddd!important;background:#f5f5f5!important;height:33px}:host ::ng-deep .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border:none!important}:host ::ng-deep .mat-button-toggle-appearance-standard.mat-button-toggle-checked{background:#f5f5f5!important;border-radius:50px}.toggle-img{width:12px}:host ::ng-deep .mat-button-toggle-standalone,.mat-button-toggle-group{overflow:unset!important}.second-box{position:relative;top:-4px}.top-green-card{font-size:10px;font-weight:800;color:#fff;background:#169f7d;border-top-left-radius:999px;border-top-right-radius:999px;position:absolute;right:3em;padding:2px 16px 2px 12px;transform:translate(5px,-19px);z-index:99999;height:18px}.green-card-img{width:14.86px;margin-bottom:6px}:host ::ng-deep .mat-button-toggle-button{width:var(--toggle-button-width , 100%)!important}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$
|
|
3313
|
+
], ngImport: i0, template: "<div style=\"position: relative\" [ngClass]=\"field()?.cssClass\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-button-toggle-group [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\" name=\"fontStyle\" class=\"custom-mat-toggle\" aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\" [value]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\" [formControl]=\"reactiveFormControlobject()\">\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\">\r\n <img *ngIf=\"data.imgUrl && !data.tooltipText\" [src]=\"data.imgUrl\" alt=\"\" class=\"toggle-img mx-1\" />\r\n\r\n {{ data.label }}\r\n <span [appTooltipTemplate]=\"currentTooltip\" arrowPosition=\"left\" tooltipPosition=\"bottom\"\r\n *ngIf=\"data.imgUrl && data.tooltipText\">\r\n <img [src]=\"data.imgUrl\" class=\"toggle-img mx-1\" />\r\n </span>\r\n\r\n <!-- \u2705 Single template that uses current data -->\r\n <ng-template #currentTooltip>\r\n <span [innerHTML]=\"data.tooltipText\"></span>\r\n </ng-template>\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img class=\"green-card-img\" *ngIf=\"data.topImage\" [src]=\"data.topImage\" alt=\"\" />\r\n <span>{{ data.toggleTopText }}</span>\r\n </span>\r\n </div>\r\n }\r\n </mat-button-toggle-group>\r\n }@else {\r\n <mat-button-toggle-group [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\" name=\"fontStyle\" class=\"custom-mat-toggle\" aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\" [(ngModel)]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\">\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\">\r\n {{ data.label }}\r\n <!-- <span [appTooltipTemplate]=\"currentTooltip\" arrowPosition=\"left\" tooltipPosition=\"bottom\"\r\n *ngIf=\"data.imgUrl && data.tooltipText\">\r\n <img [src]=\"data.imgUrl\" />\r\n </span> -->\r\n\r\n <!-- \u2705 Single template that uses current data -->\r\n <!-- <ng-template #currentTooltip>\r\n <span [innerHTML]=\"data.tooltipText\"></span>\r\n </ng-template> -->\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img class=\"green-card-img\" *ngIf=\"data.topImage\" [src]=\"data.topImage\" alt=\"\" />\r\n <span>{{ data.toggleTopText }}</span>\r\n </span>\r\n </div>\r\n }\r\n </mat-button-toggle-group>\r\n }\r\n</div>", styles: [":host ::ng-deep .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border:none}:host ::ng-deep .mat-button-toggle-standalone,.mat-button-toggle-group{border-radius:50px}:host ::ng-deep .mat-button-toggle-appearance-standard .mat-button-toggle-label-content{height:32px!important;transform:translateY(-9px);font-size:12px;font-weight:400;color:#444;letter-spacing:1px}:host ::ng-deep .mat-button-toggle-checked .mat-button-toggle-button{background:#fff!important;border-radius:50px!important;box-shadow:0 0 15px #00000014!important;height:32px;padding:0 24px;border:1px solid #ffbb00}:host ::ng-deep .mat-button-toggle-button{padding:0 24px}:host ::ng-deep .mat-button-toggle-checked .mat-button-toggle-label-content{font-weight:600!important;letter-spacing:1px}:host ::ng-deep .mat-button-toggle .mat-pseudo-checkbox{display:none}:host ::ng-deep .mat-button-toggle-standalone.mat-button-toggle-appearance-standard,.mat-button-toggle-group-appearance-standard{border:1px solid #ddd!important;background:#f5f5f5!important;height:33px}:host ::ng-deep .mat-button-toggle-group-appearance-standard .mat-button-toggle-appearance-standard+.mat-button-toggle-appearance-standard{border:none!important}:host ::ng-deep .mat-button-toggle-appearance-standard.mat-button-toggle-checked{background:#f5f5f5!important;border-radius:50px}.toggle-img{width:12px}:host ::ng-deep .mat-button-toggle-standalone,.mat-button-toggle-group{overflow:unset!important}.second-box{position:relative;top:-4px}.top-green-card{font-size:10px;font-weight:800;color:#fff;background:#169f7d;border-top-left-radius:999px;border-top-right-radius:999px;position:absolute;right:3em;padding:2px 16px 2px 12px;transform:translate(5px,-19px);z-index:99999;height:18px}.green-card-img{width:14.86px;margin-bottom:6px}:host ::ng-deep .mat-button-toggle-button{width:var(--toggle-button-width , 100%)!important}\n"], dependencies: [{ kind: "ngmodule", type: MatButtonToggleModule }, { kind: "directive", type: i1$2.MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: i1$2.MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: CustomizedTooltipDirective, selector: "[appTooltipTemplate]", inputs: ["appTooltipTemplate"] }] });
|
|
3327
3314
|
}
|
|
3328
3315
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToggleButtonComponent, decorators: [{
|
|
3329
3316
|
type: Component,
|
|
@@ -3348,7 +3335,7 @@ class PayGetCardComponent {
|
|
|
3348
3335
|
years = '2030';
|
|
3349
3336
|
frequency = 'month';
|
|
3350
3337
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PayGetCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3351
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: PayGetCardComponent, isStandalone: true, selector: "lib-pay-get-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, payAmount: { classPropertyName: "payAmount", publicName: "payAmount", isSignal: false, isRequired: false, transformFunction: null }, premiumAmount: { classPropertyName: "premiumAmount", publicName: "premiumAmount", isSignal: false, isRequired: false, transformFunction: null }, ptValue: { classPropertyName: "ptValue", publicName: "ptValue", isSignal: false, isRequired: false, transformFunction: null }, years: { classPropertyName: "years", publicName: "years", isSignal: false, isRequired: false, transformFunction: null }, frequency: { classPropertyName: "frequency", publicName: "frequency", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"d-flex justify-content-between pay-card\"\r\n [ngStyle]=\"{\r\n'--pay-card-border-color': field()?.controlStyle?.borderColor ,\r\n'--pay-card-border-width': field()?.controlStyle?.borderWidth ,\r\n'--pay-card-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--pay-card-bg-color': field()?.controlStyle?.background ,\r\n'--pay-card-width': field()?.controlStyle?.width ,\r\n }\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n>\r\n <div class=\"text-center mx-2\">\r\n <span class=\"bold-label\">{{ field()?.placeHolder || 'Pay' }}</span> <br />\r\n <span class=\"grey-label\">{{payAmount}}</span>\r\n </div>\r\n <div class=\"premium-card\">\r\n <span class=\"light-label\"><b class=\"bold-label\">{{premiumAmount}}</b>/ {{frequency}}</span>\r\n <br />\r\n <span class=\"grey-label\">for {{ptValue}} years (till {{years}})</span>\r\n </div>\r\n</div>\r\n", styles: [".pay-card{max-width:var(--pay-card-width , 100%)!important;max-height:62px;border:1px solid #f5f5f5;border-radius:var(--pay-card-border-radius , 8px)!important;background-color:var(--pay-card-bg-color , #f5f5f5)!important;padding:2px 4px 10px 10px;border-color:var(--pay-card-border-color , #f5f5f5)!important;border-width:var(--pay-card-border-width , none)!important}.grey-label{font-size:12px;font-weight:700;color:#696969;line-height:16px}.bold-label{font-size:.875rem;font-weight:700;line-height:20px;color:#444}.light-label{font-size:12px;font-weight:400;line-height:16px;color:#000}.premium-card{background:#fff;padding:0 6px 6px;height:54px;width:187px;border-radius:4px;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3338
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: PayGetCardComponent, isStandalone: true, selector: "lib-pay-get-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, payAmount: { classPropertyName: "payAmount", publicName: "payAmount", isSignal: false, isRequired: false, transformFunction: null }, premiumAmount: { classPropertyName: "premiumAmount", publicName: "premiumAmount", isSignal: false, isRequired: false, transformFunction: null }, ptValue: { classPropertyName: "ptValue", publicName: "ptValue", isSignal: false, isRequired: false, transformFunction: null }, years: { classPropertyName: "years", publicName: "years", isSignal: false, isRequired: false, transformFunction: null }, frequency: { classPropertyName: "frequency", publicName: "frequency", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\r\n class=\"d-flex justify-content-between pay-card\"\r\n [ngStyle]=\"{\r\n'--pay-card-border-color': field()?.controlStyle?.borderColor ,\r\n'--pay-card-border-width': field()?.controlStyle?.borderWidth ,\r\n'--pay-card-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--pay-card-bg-color': field()?.controlStyle?.background ,\r\n'--pay-card-width': field()?.controlStyle?.width ,\r\n }\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n>\r\n <div class=\"text-center mx-2\">\r\n <span class=\"bold-label\">{{ field()?.placeHolder || 'Pay' }}</span> <br />\r\n <span class=\"grey-label\">{{payAmount}}</span>\r\n </div>\r\n <div class=\"premium-card\">\r\n <span class=\"light-label\"><b class=\"bold-label\">{{premiumAmount}}</b>/ {{frequency}}</span>\r\n <br />\r\n <span class=\"grey-label\">for {{ptValue}} years (till {{years}})</span>\r\n </div>\r\n</div>\r\n", styles: [".pay-card{max-width:var(--pay-card-width , 100%)!important;max-height:62px;border:1px solid #f5f5f5;border-radius:var(--pay-card-border-radius , 8px)!important;background-color:var(--pay-card-bg-color , #f5f5f5)!important;padding:2px 4px 10px 10px;border-color:var(--pay-card-border-color , #f5f5f5)!important;border-width:var(--pay-card-border-width , none)!important}.grey-label{font-size:12px;font-weight:700;color:#696969;line-height:16px}.bold-label{font-size:.875rem;font-weight:700;line-height:20px;color:#444}.light-label{font-size:12px;font-weight:400;line-height:16px;color:#000}.premium-card{background:#fff;padding:0 6px 6px;height:54px;width:187px;border-radius:4px;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3352
3339
|
}
|
|
3353
3340
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PayGetCardComponent, decorators: [{
|
|
3354
3341
|
type: Component,
|
|
@@ -3370,7 +3357,7 @@ class InBuiltBenefitComponent {
|
|
|
3370
3357
|
premiumAmount = '₹1,00,000';
|
|
3371
3358
|
premiumAmountShort = '1L';
|
|
3372
3359
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InBuiltBenefitComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3373
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: InBuiltBenefitComponent, isStandalone: true, selector: "lib-in-built-benefit", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, premiumAmount: { classPropertyName: "premiumAmount", publicName: "premiumAmount", isSignal: false, isRequired: false, transformFunction: null }, premiumAmountShort: { classPropertyName: "premiumAmountShort", publicName: "premiumAmountShort", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"d-flex in-built-card\"\r\n [ngStyle]=\"{\r\n'--inbuilt-card-border-color': field()?.controlStyle?.borderColor ,\r\n'--inbuilt-card-border-width': field()?.controlStyle?.borderWidth ,\r\n'--inbuilt-card-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--inbuilt-card-bg-color': field()?.controlStyle?.background ,\r\n'--inbuilt-card-width': field()?.controlStyle?.width ,\r\n }\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n>\r\n <p class=\"w-100 top-box\">\r\n <span class=\"top-benefit-card\">In-built Benefit</span>\r\n </p>\r\n <div>\r\n <span class=\"premium-header\">Return of Premium</span> <br />\r\n <span class=\"benefit-text normal-text\"\r\n >Customer can get their premiums back on\r\n <b class=\"bold-text\"\r\n >diagnosis of Critical Illness (CI) or Total and Permanent Disability\r\n (TPD) before the age of 80.</b\r\n ></span\r\n >\r\n <br />\r\n <span class=\"premium\"\r\n ><b>{{ premiumAmount }}</b> ({{ premiumAmountShort }})</span\r\n >\r\n </div>\r\n <div class=\"m-auto\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]=\"field().imageUrl\" alt=\"\" />\r\n </div>\r\n</div>\r\n", styles: [".in-built-card{max-width:var(--inbuilt-card-width, 100%)!important;min-height:114px;border-radius:var(--inbuilt-card-border-radius, 12px)!important;border:1px solid #0bb68b;border-color:var(--inbuilt-card-border-color, #0bb68b)!important;border-width:var(--inbuilt-card-border-width, 1px)!important;background:var(--inbuilt-card-bg-color, #e6f7f3)!important;padding:12px 16px;position:relative}.premium-header{font-size:14px;font-weight:700;letter-spacing:0px;line-height:18px;color:#444}.benefit-text{font-size:12px;color:#696969;font-weight:700;letter-spacing:0%;line-height:16px}.premium{font-size:12px;padding:4px 16px;border-radius:4px;height:24px;width:113px;background:#fff;color:#444}.normal-text{font-weight:400}.bold-text{font-weight:700}.top-benefit-card{border-radius:25px;background:#fff;border:1px solid #ececec;height:26px;width:114px;padding:0 6px 5px 12px;font-size:12px;font-weight:400;color:#444;letter-spacing:0%;position:absolute;transform:translate(-6em,-2.2em)}.top-box{position:absolute;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3360
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: InBuiltBenefitComponent, isStandalone: true, selector: "lib-in-built-benefit", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, premiumAmount: { classPropertyName: "premiumAmount", publicName: "premiumAmount", isSignal: false, isRequired: false, transformFunction: null }, premiumAmountShort: { classPropertyName: "premiumAmountShort", publicName: "premiumAmountShort", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"d-flex in-built-card\"\r\n [ngStyle]=\"{\r\n'--inbuilt-card-border-color': field()?.controlStyle?.borderColor ,\r\n'--inbuilt-card-border-width': field()?.controlStyle?.borderWidth ,\r\n'--inbuilt-card-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--inbuilt-card-bg-color': field()?.controlStyle?.background ,\r\n'--inbuilt-card-width': field()?.controlStyle?.width ,\r\n }\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n>\r\n <p class=\"w-100 top-box\">\r\n <span class=\"top-benefit-card\">In-built Benefit</span>\r\n </p>\r\n <div>\r\n <span class=\"premium-header\">Return of Premium</span> <br />\r\n <span class=\"benefit-text normal-text\"\r\n >Customer can get their premiums back on\r\n <b class=\"bold-text\"\r\n >diagnosis of Critical Illness (CI) or Total and Permanent Disability\r\n (TPD) before the age of 80.</b\r\n ></span\r\n >\r\n <br />\r\n <span class=\"premium\"\r\n ><b>{{ premiumAmount }}</b> ({{ premiumAmountShort }})</span\r\n >\r\n </div>\r\n <div class=\"m-auto\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]=\"field().imageUrl\" alt=\"\" />\r\n </div>\r\n</div>\r\n", styles: [".in-built-card{max-width:var(--inbuilt-card-width, 100%)!important;min-height:114px;border-radius:var(--inbuilt-card-border-radius, 12px)!important;border:1px solid #0bb68b;border-color:var(--inbuilt-card-border-color, #0bb68b)!important;border-width:var(--inbuilt-card-border-width, 1px)!important;background:var(--inbuilt-card-bg-color, #e6f7f3)!important;padding:12px 16px;position:relative}.premium-header{font-size:14px;font-weight:700;letter-spacing:0px;line-height:18px;color:#444}.benefit-text{font-size:12px;color:#696969;font-weight:700;letter-spacing:0%;line-height:16px}.premium{font-size:12px;padding:4px 16px;border-radius:4px;height:24px;width:113px;background:#fff;color:#444}.normal-text{font-weight:400}.bold-text{font-weight:700}.top-benefit-card{border-radius:25px;background:#fff;border:1px solid #ececec;height:26px;width:114px;padding:0 6px 5px 12px;font-size:12px;font-weight:400;color:#444;letter-spacing:0%;position:absolute;transform:translate(-6em,-2.2em)}.top-box{position:absolute;text-align:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3374
3361
|
}
|
|
3375
3362
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InBuiltBenefitComponent, decorators: [{
|
|
3376
3363
|
type: Component,
|
|
@@ -3384,7 +3371,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3384
3371
|
class OtherBenefitsComponent {
|
|
3385
3372
|
field = input.required();
|
|
3386
3373
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtherBenefitsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3387
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: OtherBenefitsComponent, isStandalone: true, selector: "lib-other-benefits", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"other-benefit-card d-flex gap-2\"\r\n [ngStyle]=\"{\r\n'--other-benefit-color-border-color': field()?.controlStyle?.borderColor ,\r\n'--other-benefit-color-border-width': field()?.controlStyle?.borderWidth ,\r\n'--other-benefit-color-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--other-benefit-color-bg-color': field()?.controlStyle?.background\r\n }\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n>\r\n <p class=\"w-100 top-box\">\r\n <span class=\"top-benefit-card\">Other Benefit</span>\r\n </p>\r\n @for (data of field()?.configData?.otherBenefits; track $index) {\r\n <div class=\"sub-benefit-card\">\r\n <div class=\"d-flex gap-2\">\r\n <img [src]=\"data.imageUrl\" alt=\"\" />\r\n <span class=\"header-txt\">{{ data.headerText }}</span>\r\n </div>\r\n <span [innerHTML]=\"data.htmlInnerText\"></span>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".other-benefit-card{min-height:142px;border:1px solid #dadada;padding:20px 16px;position:relative;border-color:var(--other-benefit-border-color, #dadada)!important;border-width:var(--other-benefit-border-width, 1px)!important;background:var(--other-benefit-bg-color, #fff)!important;border-radius:.75rem}.top-benefit-card{border-radius:25px;background:#fff;border:1px solid #ececec;height:26px;width:114px;padding:0 6px 5px 12px;font-size:12px;font-weight:400;color:#444;letter-spacing:0%;position:absolute;transform:translate(-6em,-2.7em)}.top-box{position:absolute;text-align:center}.sub-benefit-card{min-height:110px;min-width:194px;padding:12px;border-radius:.75rem}.sub-benefit-card:not(:last-child){border-right:1px solid #dddddd}::ng-deep .premium{font-size:12px;background:#fff;color:#696969}::ng-deep .tax-benefit-txt{font-size:12px;font-weight:400;line-height:16px;color:#696969;letter-spacing:0px}.header-txt{font-size:14px;font-weight:700;color:#444;line-height:18px;letter-spacing:0px}::ng-deep .annuity-rate-txt{font-size:12px!important;font-weight:700!important;line-height:16px!important;color:#696969!important;letter-spacing:0px!important}::ng-deep .normal-txt{font-size:12px!important;font-weight:400!important;line-height:16px!important;letter-spacing:0px!important}::ng-deep .db-txt{font-size:12px!important;letter-spacing:0px!important;line-height:16px!important;color:#696969!important}::ng-deep .bold-txt{font-weight:700!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3374
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: OtherBenefitsComponent, isStandalone: true, selector: "lib-other-benefits", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"other-benefit-card d-flex gap-2\"\r\n [ngStyle]=\"{\r\n'--other-benefit-color-border-color': field()?.controlStyle?.borderColor ,\r\n'--other-benefit-color-border-width': field()?.controlStyle?.borderWidth ,\r\n'--other-benefit-color-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--other-benefit-color-bg-color': field()?.controlStyle?.background\r\n }\"\r\n *ngIf=\"field() && field()?.isVisible\"\r\n>\r\n <p class=\"w-100 top-box\">\r\n <span class=\"top-benefit-card\">Other Benefit</span>\r\n </p>\r\n @for (data of field()?.configData?.otherBenefits; track $index) {\r\n <div class=\"sub-benefit-card\">\r\n <div class=\"d-flex gap-2\">\r\n <img [src]=\"data.imageUrl\" alt=\"\" />\r\n <span class=\"header-txt\">{{ data.headerText }}</span>\r\n </div>\r\n <span [innerHTML]=\"data.htmlInnerText\"></span>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".other-benefit-card{min-height:142px;border:1px solid #dadada;padding:20px 16px;position:relative;border-color:var(--other-benefit-border-color, #dadada)!important;border-width:var(--other-benefit-border-width, 1px)!important;background:var(--other-benefit-bg-color, #fff)!important;border-radius:.75rem}.top-benefit-card{border-radius:25px;background:#fff;border:1px solid #ececec;height:26px;width:114px;padding:0 6px 5px 12px;font-size:12px;font-weight:400;color:#444;letter-spacing:0%;position:absolute;transform:translate(-6em,-2.7em)}.top-box{position:absolute;text-align:center}.sub-benefit-card{min-height:110px;min-width:194px;padding:12px;border-radius:.75rem}.sub-benefit-card:not(:last-child){border-right:1px solid #dddddd}::ng-deep .premium{font-size:12px;background:#fff;color:#696969}::ng-deep .tax-benefit-txt{font-size:12px;font-weight:400;line-height:16px;color:#696969;letter-spacing:0px}.header-txt{font-size:14px;font-weight:700;color:#444;line-height:18px;letter-spacing:0px}::ng-deep .annuity-rate-txt{font-size:12px!important;font-weight:700!important;line-height:16px!important;color:#696969!important;letter-spacing:0px!important}::ng-deep .normal-txt{font-size:12px!important;font-weight:400!important;line-height:16px!important;letter-spacing:0px!important}::ng-deep .db-txt{font-size:12px!important;letter-spacing:0px!important;line-height:16px!important;color:#696969!important}::ng-deep .bold-txt{font-weight:700!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3388
3375
|
}
|
|
3389
3376
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtherBenefitsComponent, decorators: [{
|
|
3390
3377
|
type: Component,
|
|
@@ -3395,7 +3382,7 @@ class AnnuityRateLogoComponent {
|
|
|
3395
3382
|
field = input.required();
|
|
3396
3383
|
ratePercent = '7%';
|
|
3397
3384
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AnnuityRateLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3398
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AnnuityRateLogoComponent, isStandalone: true, selector: "lib-annuity-rate-logo", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, ratePercent: { classPropertyName: "ratePercent", publicName: "ratePercent", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\">\r\n <span class=\"annuity-box\">\r\n <span class=\"annuity-percent\">{{ ratePercent }}</span>\r\n <img src=\"https://cdn.godigit.com/retail-life/annuity-rate.svg\" alt=\"\" />\r\n </span>\r\n</div>\r\n", styles: [".annuity-percent{position:absolute;font-weight:900;font-size:12px;transform:translate(31px,17px)}.annuity-box{position:relative}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3385
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AnnuityRateLogoComponent, isStandalone: true, selector: "lib-annuity-rate-logo", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, ratePercent: { classPropertyName: "ratePercent", publicName: "ratePercent", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\">\r\n <span class=\"annuity-box\">\r\n <span class=\"annuity-percent\">{{ ratePercent }}</span>\r\n <img src=\"https://cdn.godigit.com/retail-life/annuity-rate.svg\" alt=\"\" />\r\n </span>\r\n</div>\r\n", styles: [".annuity-percent{position:absolute;font-weight:900;font-size:12px;transform:translate(31px,17px)}.annuity-box{position:relative}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
3399
3386
|
}
|
|
3400
3387
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AnnuityRateLogoComponent, decorators: [{
|
|
3401
3388
|
type: Component,
|
|
@@ -3407,7 +3394,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3407
3394
|
class DiscountV2Component {
|
|
3408
3395
|
field = input.required();
|
|
3409
3396
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3410
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: DiscountV2Component, isStandalone: true, selector: "lib-discount-v2", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"px-3 py-2 discount-card-v2\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"\r\n{\r\n '--discount-design-border-width': field()?.controlStyle?.borderWidth,\r\n '--discount-design-border-color': field()?.controlStyle?.borderColor ,\r\n '--discount-design-border-style': field()?.controlStyle?.borderStyle ,\r\n '--discount-design-width': field()?.controlStyle?.width ,\r\n '--discount-design-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--discount-design-bg': field()?.controlStyle?.background ,\r\n}\">\r\n<div *ngIf=\"field()?.imageUrl\" class=\"mb-3\">\r\n <img [src]='field().imageUrl' alt=\"\">\r\n</div>\r\n <div class=\"mb-2 discount-heading\" [ngStyle]=\"\r\n{\r\n '--discount-heading-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--discount-heading-font-size': field()?.controlStyle?.fontSize ,\r\n '--discount-heading-font-color': field()?.controlStyle?.color\r\n}\">{{field()?.label}}</div>\r\n <div class=\"sticky-bottom-btn\">\r\n <!-- <button class=\"px-2 mt-1 discount-btn-remove\"><div>Remove</div> <mat-icon class=\"pt-1 remove-btn-cross\">close</mat-icon></button> -->\r\n <button class=\"px-2 mt-1 discount-btn-apply\"><div>Applied</div><img class=\"check-circle\" src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\"></button>\r\n </div>\r\n</div>\r\n\r\n", styles: [".discount-card-v2{border-width:var(--discount-design-border-width , 1px);border-color:var(--discount-design-border-color , #0BB68B);border-style:var(--discount-design-border-style , solid);width:var(--discount-design-width , 100%);border-radius:var(--discount-design-border-radius , .5rem);box-shadow:0 2px 15px 2px #e3e6ec99;background:var(--discount-design-bg , #fff);height:128px!important;display:flex;flex-direction:column;position:relative}.sticky-bottom-btn{margin-top:auto}.discount-heading{font-weight:var(--discount-heading-font-weight , 700);font-size:var(--discount-heading-font-size , 12px);color:var(--discount-heading-font-color , #444)}.discount-btn-remove{border-radius:32px;border:1px solid #EE0000;background-color:#fff;font-size:12px;font-weight:700;color:#e00;display:flex;align-items:center;background:#fff}.discount-btn-apply{border-radius:25px;border:1px solid #DEF1E7;background-color:#def1e7;font-size:12px;font-weight:600;color:#169f7d;display:flex;align-items:center}.remove-btn-cross{font-size:12.5px!important;height:auto}.check-circle{width:12px}*{font-family:Mulish!important}.material-icons{font-family:Material Icons!important}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3397
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: DiscountV2Component, isStandalone: true, selector: "lib-discount-v2", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"px-3 py-2 discount-card-v2\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"\r\n{\r\n '--discount-design-border-width': field()?.controlStyle?.borderWidth,\r\n '--discount-design-border-color': field()?.controlStyle?.borderColor ,\r\n '--discount-design-border-style': field()?.controlStyle?.borderStyle ,\r\n '--discount-design-width': field()?.controlStyle?.width ,\r\n '--discount-design-border-radius': field()?.controlStyle?.borderRadius ,\r\n '--discount-design-bg': field()?.controlStyle?.background ,\r\n}\">\r\n<div *ngIf=\"field()?.imageUrl\" class=\"mb-3\">\r\n <img [src]='field().imageUrl' alt=\"\">\r\n</div>\r\n <div class=\"mb-2 discount-heading\" [ngStyle]=\"\r\n{\r\n '--discount-heading-font-weight': field()?.controlStyle?.fontWeight ,\r\n '--discount-heading-font-size': field()?.controlStyle?.fontSize ,\r\n '--discount-heading-font-color': field()?.controlStyle?.color\r\n}\">{{field()?.label}}</div>\r\n <div class=\"sticky-bottom-btn\">\r\n <!-- <button class=\"px-2 mt-1 discount-btn-remove\"><div>Remove</div> <mat-icon class=\"pt-1 remove-btn-cross\">close</mat-icon></button> -->\r\n <button class=\"px-2 mt-1 discount-btn-apply\"><div>Applied</div><img class=\"check-circle\" src=\"https://cdn.godigit.com/retail-life/check-circle-ou.svg\" alt=\"\"></button>\r\n </div>\r\n</div>\r\n\r\n", styles: [".discount-card-v2{border-width:var(--discount-design-border-width , 1px);border-color:var(--discount-design-border-color , #0BB68B);border-style:var(--discount-design-border-style , solid);width:var(--discount-design-width , 100%);border-radius:var(--discount-design-border-radius , .5rem);box-shadow:0 2px 15px 2px #e3e6ec99;background:var(--discount-design-bg , #fff);height:128px!important;display:flex;flex-direction:column;position:relative}.sticky-bottom-btn{margin-top:auto}.discount-heading{font-weight:var(--discount-heading-font-weight , 700);font-size:var(--discount-heading-font-size , 12px);color:var(--discount-heading-font-color , #444)}.discount-btn-remove{border-radius:32px;border:1px solid #EE0000;background-color:#fff;font-size:12px;font-weight:700;color:#e00;display:flex;align-items:center;background:#fff}.discount-btn-apply{border-radius:25px;border:1px solid #DEF1E7;background-color:#def1e7;font-size:12px;font-weight:600;color:#169f7d;display:flex;align-items:center}.remove-btn-cross{font-size:12.5px!important;height:auto}.check-circle{width:12px}*{font-family:Mulish!important}.material-icons{font-family:Material Icons!important}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3411
3398
|
}
|
|
3412
3399
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountV2Component, decorators: [{
|
|
3413
3400
|
type: Component,
|
|
@@ -3418,7 +3405,7 @@ class LabelValueCardComponent {
|
|
|
3418
3405
|
field = input.required();
|
|
3419
3406
|
ngOnInit() { }
|
|
3420
3407
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelValueCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3421
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LabelValueCardComponent, isStandalone: true, selector: "lib-label-value-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"labelValueCard\" *ngIf=\"field() && field()?.isVisible\">\r\n <div class=\"labelHead\">\r\n <span class=\"master-labelValue\" [ngStyle]=\"{\r\n '--master-heading-font-color': field()?.controlStyle?.color,\r\n '--master-heading-font-size': field()?.controlStyle?.fontSize,\r\n '--master-heading-font-weight': field()?.controlStyle?.fontWeight\r\n }\">{{field()?.label}}</span>\r\n </div>\r\n <div class=\"labelValue\">\r\n <span>{{field()?.placeHolder}}</span>\r\n <span matSuffix class=\"mx-3\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]='field().imageUrl' alt=\"\" />\r\n </span>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.master-labelValue{font-weight:400;font-size:14px;color:#000}.master-labelValue{color:var(--master-heading-font-color, #000000)!important;font-size:var(--master-heading-font-size, 14px)!important;font-weight:var(--master-heading-font-weight, 400)!important}.labelValueCard{display:flex;flex-direction:column}.labelHead{font-size:14px;font-weight:400;color:#444;line-height:20px}.labelValue{font-size:16px;font-weight:700;color:#444;line-height:20px;position:relative;top:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
3408
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LabelValueCardComponent, isStandalone: true, selector: "lib-label-value-card", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"labelValueCard\" *ngIf=\"field() && field()?.isVisible\">\r\n <div class=\"labelHead\">\r\n <span class=\"master-labelValue\" [ngStyle]=\"{\r\n '--master-heading-font-color': field()?.controlStyle?.color,\r\n '--master-heading-font-size': field()?.controlStyle?.fontSize,\r\n '--master-heading-font-weight': field()?.controlStyle?.fontWeight\r\n }\">{{field()?.label}}</span>\r\n </div>\r\n <div class=\"labelValue\">\r\n <span>{{field()?.placeHolder}}</span>\r\n <span matSuffix class=\"mx-3\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]='field().imageUrl' alt=\"\" />\r\n </span>\r\n </div>\r\n</div>", styles: ["*{font-family:mulish!important}.master-labelValue{font-weight:400;font-size:14px;color:#000}.master-labelValue{color:var(--master-heading-font-color, #000000)!important;font-size:var(--master-heading-font-size, 14px)!important;font-weight:var(--master-heading-font-weight, 400)!important}.labelValueCard{display:flex;flex-direction:column}.labelHead{font-size:14px;font-weight:400;color:#444;line-height:20px}.labelValue{font-size:16px;font-weight:700;color:#444;line-height:20px;position:relative;top:8px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
3422
3409
|
}
|
|
3423
3410
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelValueCardComponent, decorators: [{
|
|
3424
3411
|
type: Component,
|
|
@@ -3464,7 +3451,7 @@ class MasterService {
|
|
|
3464
3451
|
url += `&lang=ENG`;
|
|
3465
3452
|
return this.http.get(url, { headers: this.getCommonHeaders(configData) });
|
|
3466
3453
|
}
|
|
3467
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterService, deps: [{ token: i1$
|
|
3454
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterService, deps: [{ token: i1$3.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
3468
3455
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterService, providedIn: 'root' });
|
|
3469
3456
|
}
|
|
3470
3457
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterService, decorators: [{
|
|
@@ -3472,7 +3459,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
3472
3459
|
args: [{
|
|
3473
3460
|
providedIn: 'root'
|
|
3474
3461
|
}]
|
|
3475
|
-
}], ctorParameters: () => [{ type: i1$
|
|
3462
|
+
}], ctorParameters: () => [{ type: i1$3.HttpClient }] });
|
|
3476
3463
|
|
|
3477
3464
|
class MedialQuestionsComponent {
|
|
3478
3465
|
ngZone;
|
|
@@ -5741,7 +5728,7 @@ class MedialQuestionsComponent {
|
|
|
5741
5728
|
this.removeSubQuestionValues();
|
|
5742
5729
|
}
|
|
5743
5730
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MedialQuestionsComponent, deps: [{ token: i0.NgZone }, { token: MasterService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5744
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MedialQuestionsComponent, isStandalone: true, selector: "lib-medial-questions", inputs: { medialQuestionResponse: { classPropertyName: "medialQuestionResponse", publicName: "medialQuestionResponse", isSignal: true, isRequired: false, transformFunction: null }, personUWOpenQuoteResponse: { classPropertyName: "personUWOpenQuoteResponse", publicName: "personUWOpenQuoteResponse", isSignal: true, isRequired: false, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "addressInput", first: true, predicate: ["addressInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\r\n<div *ngFor=\"let section of questionList\">\r\n <div\r\n *ngIf=\"\r\n !checkIfValueIsEmpty(section['questions']) &&\r\n section['showSection']\r\n \"\r\n class=\"card p-3 mb-4\"\r\n id=\"personUwMedicalQuestions\"\r\n >\r\n <h6 class=\"page-title bold-label\">\r\n {{ getTitleCase(section[\"sectionName\"]) }}\r\n </h6>\r\n <lib-hr-line [field]=\"horizontalLineObj\" />\r\n <div *ngFor=\"let questions of section['questions']\">\r\n <!-- <div *ngIf=\"questions['questionType'] === 'IMAGE TEXT'\">\r\n <img [src]=\"questions['sampleS3Link']\" class=\"d-block mx-auto\" [alt]=\"questions['title']\">\r\n <h3 [innerHTML]=\"questions['questionText']\"></h3>\r\n </div> -->\r\n\r\n <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'FREE TEXT' &&\r\n questions['cammundaQuestionCode'] !== 'QHT' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <!-- <label class=\"field-lable d-block\"\r\n >{{ questions[\"questionText\"] }}\r\n <span\r\n *ngIf=\"\r\n questions.optionalQuestion === 'N'\r\n \"\r\n style=\"color: #ee0000\"\r\n >*</span\r\n >\r\n </label> -->\r\n <div class=\"col-12 px-0 my-1\">\r\n <lib-textbox [(ngModel)]=\"personUwAnswers[questions.questionId]\" [field]=\"questions['field']\" (blur)=\"removeSubQuestionValues()\" />\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'HEIGHTINPUT' &&\r\n questions['cammundaQuestionCode'] === 'QHTF' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <label class=\"card-topic d-block field-lable\"\r\n >Height\r\n <span\r\n style=\"color: #ee0000\"\r\n >*</span\r\n >\r\n </label>\r\n <div\r\n class=\"col-auto px-0 my-0 py-0 heightinput\"\r\n\r\n >\r\n <div class=\"row col-12 my-1\" *ngIf=\"personUwAnswers['medicalQuestionsHeightUnit'] === 'CM'\">\r\n <div class=\"col-7 py-0 heightInputs\">\r\n <lib-textbox [(ngModel)]=\"personUwAnswers['medicalQuestionsHeightInput']\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"medQuestionObj['QHT']['field']\" />\r\n </div>\r\n <div class=\"col-5\">\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionsHeightUnit']\" [field]=\"medQuestionObj['heightObjectTypes']\" (ngModelChange)=\"checkAndUpdateHeightUnit()\" />\r\n </div>\r\n </div>\r\n <div\r\n class=\"row\"\r\n *ngIf=\"\r\n personUwAnswers[\r\n 'medicalQuestionsHeightUnit'\r\n ] === 'FEET'\r\n \"\r\n >\r\n <div class=\"col-4 py-0 my-1\">\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionFeetInput']\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"medQuestionObj['QHTF']['field']\" />\r\n </div>\r\n <div class=\"col-4 py-0 my-1\">\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionsInchesInput']\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"medQuestionObj['QHTI']['field']\" />\r\n </div>\r\n <div\r\n class=\"col-4 py-0 my-1\"\r\n >\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionsHeightUnit']\" [field]=\"medQuestionObj['heightObjectTypes']\" (ngModelChange)=\"checkAndUpdateHeightUnit()\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"row mt-0 pt-0\"\r\n *ngIf=\"\r\n questions['questionType'] === 'MAP' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n\r\n\r\n <div class=\"map-container\">\r\n <div class=\"address-search-container mb-3\">\r\n\r\n <div class=\"row mb-3\">\r\n <div class=\"col-6\">\r\n <label class=\"form-label card-topic\">Longitude</label>\r\n <input\r\n type=\"number\"\r\n class=\"form-control\"\r\n [(ngModel)]=\"longitude\"\r\n placeholder=\"Enter longitude\"\r\n step=\"any\"\r\n readonly\r\n >\r\n </div>\r\n <div class=\"col-6\">\r\n <label class=\"form-label card-topic\">Latitude</label>\r\n <input\r\n type=\"number\"\r\n class=\"form-control\"\r\n [(ngModel)]=\"latitude\"\r\n placeholder=\"Enter latitude\"\r\n step=\"any\"\r\n readonly\r\n >\r\n </div>\r\n </div>\r\n\r\n <input\r\n #addressInput\r\n type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Search for address\"\r\n (keyup)=\"onAddressInputKeyup($event)\"\r\n (focus)=\"showDropdown = true\"\r\n (blur)=\"onInputBlur()\"\r\n autocomplete=\"off\"\r\n >\r\n <div\r\n *ngIf=\"showDropdown && addressSuggestions.length > 0\"\r\n class=\"autocomplete-dropdown position-absolute w-100 mt-1\"\r\n style=\"z-index: 1000; max-height: 200px; overflow-y: auto; background: white; border: 1px solid #ccc; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);\"\r\n >\r\n <div\r\n *ngFor=\"let suggestion of addressSuggestions; let i = index\"\r\n class=\"dropdown-item p-2\"\r\n style=\"cursor: pointer; border-bottom: 1px solid #eee;\"\r\n (mousedown)=\"selectAddress(suggestion)\"\r\n (mouseenter)=\"hoveredIndex = i\"\r\n [class.bg-light]=\"hoveredIndex === i\"\r\n >\r\n <div class=\"fw-bold\">{{ suggestion.main_text }}</div>\r\n <small class=\"text-muted\">{{ suggestion.secondary_text }}</small>\r\n </div>\r\n </div>\r\n <small class=\"text-muted\">Start typing to search for addresses</small>\r\n </div>\r\n <google-map [center]=\"center\" [zoom]=\"zoom\">\r\n <map-marker [position]=\"currentCoordinates\"></map-marker>\r\n </google-map>\r\n </div>\r\n </div>\r\n\r\n\r\n <div\r\n *ngIf=\"\r\n (questions['questionType'] === 'RADIO BUTTON' ||\r\n questions['questionType'] === 'ADDMORE') &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-radio [(ngModel)]=\"personUwAnswers[questions.questionId]\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"questions['field']\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'CHECKBOX' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-multiple-select [(ngModel)]=\"personUwAnswers[questions.questionId]\" (ngModelChange)=\"valueChangeForMultiselect(questions)\" [field]=\"questions['field']\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'DECLARATION' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-checkbox [(ngModel)]=\"personUwAnswers[questions.questionId]\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"questions['field']\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'DROPDOWN' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-select [(ngModel)]=\"personUwAnswers[questions.questionId]\" [field]=\"questions['field']\" (ngModelChange)=\"removeSubQuestionValues()\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'CALENDAR' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-dob [(ngModel)]=\"personUwAnswers[questions.questionId]\" [field]=\"questions['field']\" (ngModelChange)=\"removeSubQuestionValues()\" />\r\n </div>\r\n\r\n <!-- <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'HEIGHTINPUT' &&\r\n questions['cammundaQuestionCode'] === 'QHTF' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n </div> -->\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'DOCUPLOAD' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-upload [field]=\"questions['field']\" (filePreview)=\"onDocumentFilePreview($event)\" />\r\n <lib-file-preview\r\n *ngIf=\"previewFile\"\r\n [field]=\"questions['field']\"\r\n [file]=\"previewFile\"\r\n (closed)=\"closeFilePreview()\">\r\n </lib-file-preview>\r\n </div>\r\n\r\n\r\n <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'PASSPORT_UPLOAD' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <!-- pending -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n", styles: [".map-container{width:100%;position:relative}.address-search-container{position:relative}.address-search-container input{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;box-sizing:border-box}.address-search-container input:focus{outline:none;border-color:#4285f4;box-shadow:0 0 0 2px #4285f433}.pac-container{z-index:10000!important;border-radius:4px;border:1px solid #ddd;box-shadow:0 2px 6px #0000004d}.pac-item{padding:10px;border-bottom:1px solid #eee;cursor:pointer}.pac-item:hover{background-color:#f5f5f5}.selected-address{padding:8px;background-color:#f8f9fa;border-radius:4px;border-left:3px solid #28a745}.map-container ::ng-deep google-map>div{height:400px!important;width:auto!important}.medicalQues{font-size:12px;font-style:normal;font-weight:400;line-height:normal}.heightinput{border:2px solid #fb0;padding:10px;border-radius:4px;width:fit-content}.heightInputs{display:flex;align-items:center;gap:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: TextboxComponent, selector: "lib-textbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: RadioComponent, selector: "lib-radio", inputs: ["reactiveFormControlobject", "field"], outputs: ["change"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: SelectComponent, selector: "lib-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange", "infoClick"] }, { kind: "component", type: DobComponent, selector: "lib-dob", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur", "valueChange", "dateSelected", "invalidDate"] }, { kind: "component", type: UploadComponent, selector: "lib-upload", inputs: ["documentUploaderField", "field", "reactiveFormControlobject"], outputs: ["filesChanged", "fileRemoved", "filePreview"] }, { kind: "component", type: MultipleSelectComponent, selector: "lib-multiple-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: GoogleMapsModule }, { kind: "component", type: i4$4.GoogleMap, selector: "google-map", inputs: ["height", "width", "mapId", "mapTypeId", "center", "zoom", "options"], outputs: ["mapInitialized", "authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }, { kind: "directive", type: i4$4.MapMarker, selector: "map-marker", inputs: ["title", "position", "label", "clickable", "options", "icon", "visible"], outputs: ["animationChanged", "mapClick", "clickableChanged", "cursorChanged", "mapDblclick", "mapDrag", "mapDragend", "draggableChanged", "mapDragstart", "flatChanged", "iconChanged", "mapMousedown", "mapMouseout", "mapMouseover", "mapMouseup", "positionChanged", "mapRightclick", "shapeChanged", "titleChanged", "visibleChanged", "zindexChanged", "markerInitialized"], exportAs: ["mapMarker"] }, { kind: "component", type: HrLineComponent, selector: "lib-hr-line", inputs: ["field"] }, { kind: "component", type: FilePreviewComponent, selector: "lib-file-preview", inputs: ["field", "file"], outputs: ["closed"] }] });
|
|
5731
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MedialQuestionsComponent, isStandalone: true, selector: "lib-medial-questions", inputs: { medialQuestionResponse: { classPropertyName: "medialQuestionResponse", publicName: "medialQuestionResponse", isSignal: true, isRequired: false, transformFunction: null }, personUWOpenQuoteResponse: { classPropertyName: "personUWOpenQuoteResponse", publicName: "personUWOpenQuoteResponse", isSignal: true, isRequired: false, transformFunction: null }, field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, viewQueries: [{ propertyName: "addressInput", first: true, predicate: ["addressInput"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\r\n<div *ngFor=\"let section of questionList\">\r\n <div\r\n *ngIf=\"\r\n !checkIfValueIsEmpty(section['questions']) &&\r\n section['showSection']\r\n \"\r\n class=\"card p-3 mb-4\"\r\n id=\"personUwMedicalQuestions\"\r\n >\r\n <h6 class=\"page-title bold-label\">\r\n {{ getTitleCase(section[\"sectionName\"]) }}\r\n </h6>\r\n <lib-hr-line [field]=\"horizontalLineObj\" />\r\n <div *ngFor=\"let questions of section['questions']\">\r\n <!-- <div *ngIf=\"questions['questionType'] === 'IMAGE TEXT'\">\r\n <img [src]=\"questions['sampleS3Link']\" class=\"d-block mx-auto\" [alt]=\"questions['title']\">\r\n <h3 [innerHTML]=\"questions['questionText']\"></h3>\r\n </div> -->\r\n\r\n <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'FREE TEXT' &&\r\n questions['cammundaQuestionCode'] !== 'QHT' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <!-- <label class=\"field-lable d-block\"\r\n >{{ questions[\"questionText\"] }}\r\n <span\r\n *ngIf=\"\r\n questions.optionalQuestion === 'N'\r\n \"\r\n style=\"color: #ee0000\"\r\n >*</span\r\n >\r\n </label> -->\r\n <div class=\"col-12 px-0 my-1\">\r\n <lib-textbox [(ngModel)]=\"personUwAnswers[questions.questionId]\" [field]=\"questions['field']\" (blur)=\"removeSubQuestionValues()\" />\r\n </div>\r\n </div>\r\n\r\n <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'HEIGHTINPUT' &&\r\n questions['cammundaQuestionCode'] === 'QHTF' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <label class=\"card-topic d-block field-lable\"\r\n >Height\r\n <span\r\n style=\"color: #ee0000\"\r\n >*</span\r\n >\r\n </label>\r\n <div\r\n class=\"col-auto px-0 my-0 py-0 heightinput\"\r\n\r\n >\r\n <div class=\"row col-12 my-1\" *ngIf=\"personUwAnswers['medicalQuestionsHeightUnit'] === 'CM'\">\r\n <div class=\"col-7 py-0 heightInputs\">\r\n <lib-textbox [(ngModel)]=\"personUwAnswers['medicalQuestionsHeightInput']\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"medQuestionObj['QHT']['field']\" />\r\n </div>\r\n <div class=\"col-5\">\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionsHeightUnit']\" [field]=\"medQuestionObj['heightObjectTypes']\" (ngModelChange)=\"checkAndUpdateHeightUnit()\" />\r\n </div>\r\n </div>\r\n <div\r\n class=\"row\"\r\n *ngIf=\"\r\n personUwAnswers[\r\n 'medicalQuestionsHeightUnit'\r\n ] === 'FEET'\r\n \"\r\n >\r\n <div class=\"col-4 py-0 my-1\">\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionFeetInput']\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"medQuestionObj['QHTF']['field']\" />\r\n </div>\r\n <div class=\"col-4 py-0 my-1\">\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionsInchesInput']\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"medQuestionObj['QHTI']['field']\" />\r\n </div>\r\n <div\r\n class=\"col-4 py-0 my-1\"\r\n >\r\n <lib-select [(ngModel)]=\"personUwAnswers['medicalQuestionsHeightUnit']\" [field]=\"medQuestionObj['heightObjectTypes']\" (ngModelChange)=\"checkAndUpdateHeightUnit()\" />\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div\r\n class=\"row mt-0 pt-0\"\r\n *ngIf=\"\r\n questions['questionType'] === 'MAP' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n\r\n\r\n <div class=\"map-container\">\r\n <div class=\"address-search-container mb-3\">\r\n\r\n <div class=\"row mb-3\">\r\n <div class=\"col-6\">\r\n <label class=\"form-label card-topic\">Longitude</label>\r\n <input\r\n type=\"number\"\r\n class=\"form-control\"\r\n [(ngModel)]=\"longitude\"\r\n placeholder=\"Enter longitude\"\r\n step=\"any\"\r\n readonly\r\n >\r\n </div>\r\n <div class=\"col-6\">\r\n <label class=\"form-label card-topic\">Latitude</label>\r\n <input\r\n type=\"number\"\r\n class=\"form-control\"\r\n [(ngModel)]=\"latitude\"\r\n placeholder=\"Enter latitude\"\r\n step=\"any\"\r\n readonly\r\n >\r\n </div>\r\n </div>\r\n\r\n <input\r\n #addressInput\r\n type=\"text\"\r\n class=\"form-control\"\r\n placeholder=\"Search for address\"\r\n (keyup)=\"onAddressInputKeyup($event)\"\r\n (focus)=\"showDropdown = true\"\r\n (blur)=\"onInputBlur()\"\r\n autocomplete=\"off\"\r\n >\r\n <div\r\n *ngIf=\"showDropdown && addressSuggestions.length > 0\"\r\n class=\"autocomplete-dropdown position-absolute w-100 mt-1\"\r\n style=\"z-index: 1000; max-height: 200px; overflow-y: auto; background: white; border: 1px solid #ccc; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.1);\"\r\n >\r\n <div\r\n *ngFor=\"let suggestion of addressSuggestions; let i = index\"\r\n class=\"dropdown-item p-2\"\r\n style=\"cursor: pointer; border-bottom: 1px solid #eee;\"\r\n (mousedown)=\"selectAddress(suggestion)\"\r\n (mouseenter)=\"hoveredIndex = i\"\r\n [class.bg-light]=\"hoveredIndex === i\"\r\n >\r\n <div class=\"fw-bold\">{{ suggestion.main_text }}</div>\r\n <small class=\"text-muted\">{{ suggestion.secondary_text }}</small>\r\n </div>\r\n </div>\r\n <small class=\"text-muted\">Start typing to search for addresses</small>\r\n </div>\r\n <google-map [center]=\"center\" [zoom]=\"zoom\">\r\n <map-marker [position]=\"currentCoordinates\"></map-marker>\r\n </google-map>\r\n </div>\r\n </div>\r\n\r\n\r\n <div\r\n *ngIf=\"\r\n (questions['questionType'] === 'RADIO BUTTON' ||\r\n questions['questionType'] === 'ADDMORE') &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-radio [(ngModel)]=\"personUwAnswers[questions.questionId]\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"questions['field']\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'CHECKBOX' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-multiple-select [(ngModel)]=\"personUwAnswers[questions.questionId]\" (ngModelChange)=\"valueChangeForMultiselect(questions)\" [field]=\"questions['field']\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'DECLARATION' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-checkbox [(ngModel)]=\"personUwAnswers[questions.questionId]\" (ngModelChange)=\"removeSubQuestionValues()\" [field]=\"questions['field']\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'DROPDOWN' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-select [(ngModel)]=\"personUwAnswers[questions.questionId]\" [field]=\"questions['field']\" (ngModelChange)=\"removeSubQuestionValues()\" />\r\n </div>\r\n\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'CALENDAR' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-dob [(ngModel)]=\"personUwAnswers[questions.questionId]\" [field]=\"questions['field']\" (ngModelChange)=\"removeSubQuestionValues()\" />\r\n </div>\r\n\r\n <!-- <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'HEIGHTINPUT' &&\r\n questions['cammundaQuestionCode'] === 'QHTF' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n </div> -->\r\n <div\r\n class=\"my-1\"\r\n *ngIf=\"\r\n questions['questionType'] === 'DOCUPLOAD' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <lib-upload [field]=\"questions['field']\" (filePreview)=\"onDocumentFilePreview($event)\" />\r\n <lib-file-preview\r\n *ngIf=\"previewFile\"\r\n [field]=\"questions['field']\"\r\n [file]=\"previewFile\"\r\n (closed)=\"closeFilePreview()\">\r\n </lib-file-preview>\r\n </div>\r\n\r\n\r\n <div\r\n class=\"\"\r\n *ngIf=\"\r\n questions['questionType'] === 'PASSPORT_UPLOAD' &&\r\n questions['isShowQuestionInUI']\r\n \"\r\n >\r\n <!-- pending -->\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n", styles: [".map-container{width:100%;position:relative}.address-search-container{position:relative}.address-search-container input{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;box-sizing:border-box}.address-search-container input:focus{outline:none;border-color:#4285f4;box-shadow:0 0 0 2px #4285f433}.pac-container{z-index:10000!important;border-radius:4px;border:1px solid #ddd;box-shadow:0 2px 6px #0000004d}.pac-item{padding:10px;border-bottom:1px solid #eee;cursor:pointer}.pac-item:hover{background-color:#f5f5f5}.selected-address{padding:8px;background-color:#f8f9fa;border-radius:4px;border-left:3px solid #28a745}.map-container ::ng-deep google-map>div{height:400px!important;width:auto!important}.medicalQues{font-size:12px;font-style:normal;font-weight:400;line-height:normal}.heightinput{border:2px solid #fb0;padding:10px;border-radius:4px;width:fit-content}.heightInputs{display:flex;align-items:center;gap:10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.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: i4.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: TextboxComponent, selector: "lib-textbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: RadioComponent, selector: "lib-radio", inputs: ["reactiveFormControlobject", "field"], outputs: ["change"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: SelectComponent, selector: "lib-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange", "infoClick"] }, { kind: "component", type: DobComponent, selector: "lib-dob", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur", "valueChange", "dateSelected", "invalidDate"] }, { kind: "component", type: UploadComponent, selector: "lib-upload", inputs: ["documentUploaderField", "field", "reactiveFormControlobject"], outputs: ["filesChanged", "fileRemoved", "filePreview"] }, { kind: "component", type: MultipleSelectComponent, selector: "lib-multiple-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange"] }, { kind: "ngmodule", type: GoogleMapsModule }, { kind: "component", type: i4$4.GoogleMap, selector: "google-map", inputs: ["height", "width", "mapId", "mapTypeId", "center", "zoom", "options"], outputs: ["mapInitialized", "authFailure", "boundsChanged", "centerChanged", "mapClick", "mapDblclick", "mapDrag", "mapDragend", "mapDragstart", "headingChanged", "idle", "maptypeidChanged", "mapMousemove", "mapMouseout", "mapMouseover", "projectionChanged", "mapRightclick", "tilesloaded", "tiltChanged", "zoomChanged"], exportAs: ["googleMap"] }, { kind: "directive", type: i4$4.MapMarker, selector: "map-marker", inputs: ["title", "position", "label", "clickable", "options", "icon", "visible"], outputs: ["animationChanged", "mapClick", "clickableChanged", "cursorChanged", "mapDblclick", "mapDrag", "mapDragend", "draggableChanged", "mapDragstart", "flatChanged", "iconChanged", "mapMousedown", "mapMouseout", "mapMouseover", "mapMouseup", "positionChanged", "mapRightclick", "shapeChanged", "titleChanged", "visibleChanged", "zindexChanged", "markerInitialized"], exportAs: ["mapMarker"] }, { kind: "component", type: HrLineComponent, selector: "lib-hr-line", inputs: ["field"] }, { kind: "component", type: FilePreviewComponent, selector: "lib-file-preview", inputs: ["field", "file"], outputs: ["closed"] }] });
|
|
5745
5732
|
}
|
|
5746
5733
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MedialQuestionsComponent, decorators: [{
|
|
5747
5734
|
type: Component,
|
|
@@ -5768,7 +5755,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
5768
5755
|
class PageNudgeComponent {
|
|
5769
5756
|
field = input.required();
|
|
5770
5757
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PageNudgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5771
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: PageNudgeComponent, isStandalone: true, selector: "lib-page-nudge", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"nudge-container\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n'--page-nudge-width': field()?.controlStyle?.borderColor ,\r\n'--page-nudge-height': field()?.controlStyle?.borderWidth ,\r\n'--page-nudge-bg': field()?.controlStyle?.borderRadius ,\r\n'--page-nudge-border-radius': field()?.controlStyle?.background ,\r\n'--page-nudge-border-width': field()?.controlStyle?.focusBorderColor ,\r\n'--page-nudge-border-color': field()?.controlStyle?.focusBorderWidth ,\r\n'--page-nudge-border-style': field()?.controlStyle?.focusBackground\r\n}\">\r\n {{ field()?.label }}\r\n <div class=\"page-fold\"></div>\r\n <div class=\"page-fold-below\"></div>\r\n</div>", styles: [".nudge-container{width:var(--page-nudge-width , auto)!important;height:var(--page-nudge-height , auto);opacity:1;padding:16px;background:var(--page-nudge-bg , #F5F5F5);border-radius:var(--page-nudge-border-radius , 4px);border-width:var(--page-nudge-border-width , 1px);border-color:var(--page-nudge-border-color , #DDDDDD);border-style:var(--page-nudge-border-style , solid);position:relative}.page-fold{width:0;height:0;border-top:12px solid transparent;border-right:12px solid #DDD;border-bottom:12px solid transparent;position:absolute;right:6px;transform:rotate(45deg);bottom:0}.page-fold-below{width:0;height:0;border-top:16px solid transparent;border-left:15px solid #ffffff;border-bottom:15px solid transparent;position:absolute;right:-4px;transform:rotate(45deg);bottom:-12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
5758
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: PageNudgeComponent, isStandalone: true, selector: "lib-page-nudge", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"nudge-container\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n'--page-nudge-width': field()?.controlStyle?.borderColor ,\r\n'--page-nudge-height': field()?.controlStyle?.borderWidth ,\r\n'--page-nudge-bg': field()?.controlStyle?.borderRadius ,\r\n'--page-nudge-border-radius': field()?.controlStyle?.background ,\r\n'--page-nudge-border-width': field()?.controlStyle?.focusBorderColor ,\r\n'--page-nudge-border-color': field()?.controlStyle?.focusBorderWidth ,\r\n'--page-nudge-border-style': field()?.controlStyle?.focusBackground\r\n}\">\r\n {{ field()?.label }}\r\n <div class=\"page-fold\"></div>\r\n <div class=\"page-fold-below\"></div>\r\n</div>", styles: [".nudge-container{width:var(--page-nudge-width , auto)!important;height:var(--page-nudge-height , auto);opacity:1;padding:16px;background:var(--page-nudge-bg , #F5F5F5);border-radius:var(--page-nudge-border-radius , 4px);border-width:var(--page-nudge-border-width , 1px);border-color:var(--page-nudge-border-color , #DDDDDD);border-style:var(--page-nudge-border-style , solid);position:relative}.page-fold{width:0;height:0;border-top:12px solid transparent;border-right:12px solid #DDD;border-bottom:12px solid transparent;position:absolute;right:6px;transform:rotate(45deg);bottom:0}.page-fold-below{width:0;height:0;border-top:16px solid transparent;border-left:15px solid #ffffff;border-bottom:15px solid transparent;position:absolute;right:-4px;transform:rotate(45deg);bottom:-12px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5772
5759
|
}
|
|
5773
5760
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PageNudgeComponent, decorators: [{
|
|
5774
5761
|
type: Component,
|
|
@@ -5778,7 +5765,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
5778
5765
|
class ProgressBarComponent {
|
|
5779
5766
|
field = input.required();
|
|
5780
5767
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5781
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ProgressBarComponent, isStandalone: true, selector: "lib-progress-bar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-progress-bar mode=\"determinate\" [value]=\"field()?.value\" [ngStyle]=\"{\r\n'--progress-bar-background-color': field()?.controlStyle?.background ,\r\n'--progress-bar-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--progress-bar-border-color': field()?.controlStyle?.color ,\r\n'--progress-bar-width': field()?.controlStyle?.width ,\r\n'--progress-bar-height': field()?.controlStyle?.height ,\r\n}\"></mat-progress-bar>", styles: ["::ng-deep .mdc-linear-progress__buffer-bar{background-color:var(--progress-bar-background-color , #EAEAEA)!important;border-radius:var(--progress-bar-border-radius , 84px)!important}::ng-deep .mdc-linear-progress__bar-inner{border-color:var(--progress-bar-border-color , #ffbb00)!important;border-top-width:var(--progress-bar-height , 4px)!important}::ng-deep .mdc-linear-progress{width:var(--progress-bar-width , 100%)!important;height:var(--progress-bar-height , 4px)!important}::ng-deep .mdc-linear-progress__buffer{height:var(--progress-bar-height , 4px)!important}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$
|
|
5768
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: ProgressBarComponent, isStandalone: true, selector: "lib-progress-bar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-progress-bar mode=\"determinate\" [value]=\"field()?.value\" [ngStyle]=\"{\r\n'--progress-bar-background-color': field()?.controlStyle?.background ,\r\n'--progress-bar-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--progress-bar-border-color': field()?.controlStyle?.color ,\r\n'--progress-bar-width': field()?.controlStyle?.width ,\r\n'--progress-bar-height': field()?.controlStyle?.height ,\r\n}\"></mat-progress-bar>", styles: ["::ng-deep .mdc-linear-progress__buffer-bar{background-color:var(--progress-bar-background-color , #EAEAEA)!important;border-radius:var(--progress-bar-border-radius , 84px)!important}::ng-deep .mdc-linear-progress__bar-inner{border-color:var(--progress-bar-border-color , #ffbb00)!important;border-top-width:var(--progress-bar-height , 4px)!important}::ng-deep .mdc-linear-progress{width:var(--progress-bar-width , 100%)!important;height:var(--progress-bar-height , 4px)!important}::ng-deep .mdc-linear-progress__buffer{height:var(--progress-bar-height , 4px)!important}\n"], dependencies: [{ kind: "ngmodule", type: MatProgressBarModule }, { kind: "component", type: i1$4.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5782
5769
|
}
|
|
5783
5770
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProgressBarComponent, decorators: [{
|
|
5784
5771
|
type: Component,
|
|
@@ -5803,7 +5790,7 @@ class AccordianComponent {
|
|
|
5803
5790
|
}
|
|
5804
5791
|
}
|
|
5805
5792
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccordianComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5806
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AccordianComponent, isStandalone: true, selector: "lib-accordian", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-accordion \r\n [multi]=\"true\" \r\n [hideToggle]=\"false\"\r\n [displayMode]=\"'default'\"\r\n [togglePosition]=\"'after'\" [ngStyle]=\"{\r\n'--acc-font-color': field()?.controlStyle?.color ,\r\n'--acc-bg-color': field()?.controlStyle?.background ,\r\n'--acc-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--acc-border-width': field()?.controlStyle?.borderWidth ,\r\n'--acc-border-style': field()?.controlStyle?.borderStyle ,\r\n'--acc-border-color': field()?.controlStyle?.borderColor ,\r\n'--acc-font-size': field()?.controlStyle?.fontSize ,\r\n'--acc-font-weight': field()?.controlStyle?.fontWeight \r\n}\">\r\n \r\n <mat-expansion-panel \r\n [expanded]=\"false\"\r\n [disabled]=\"false\"\r\n [hideToggle]=\"false\"\r\n (opened)=\"onPanelOpened()\"\r\n (closed)=\"onPanelClosed()\"\r\n (expandedChange)=\"onExpandedChange($event)\">\r\n \r\n <mat-expansion-panel-header \r\n [collapsedHeight]=\"'48px'\"\r\n [expandedHeight]=\"'64px'\">\r\n \r\n <mat-panel-title>\r\n <span class=\"triangle-icon\" *ngIf=\"field()?.configData?.showLeftArrowIndicator && field()?.configData?.showLeftArrowIndicator === 'true'\"></span>\r\n {{ field()?.label}}\r\n </mat-panel-title>\r\n \r\n <mat-panel-description>\r\n <!-- This is a description of the panel -->\r\n </mat-panel-description>\r\n \r\n </mat-expansion-panel-header>\r\n \r\n <!-- Panel Content -->\r\n <div>\r\n {{ field()?.configData?.accordianContent}}\r\n </div>\r\n \r\n <!-- Action Buttons -->\r\n <!-- <mat-action-row>\r\n <button mat-button color=\"primary\">Save</button>\r\n <button mat-button color=\"warn\">Cancel</button>\r\n </mat-action-row> -->\r\n \r\n </mat-expansion-panel>\r\n</mat-accordion>", styles: ["::ng-deep .mat-expansion-panel{color:var(--acc-font-color , #444)!important;font-size:var(--acc-font-size , 12px)!important;border-radius:var(--acc-border-radius , 8px)!important;border-width:var(--acc-border-width , 0px)!important;border-style:var(--acc-border-style , solid)!important;border-color:var(--acc-border-color , #ffbb00)!important;background:var(--acc-bg-color , #f5f5f5)!important}::ng-deep .mat-expansion-panel-header-title{font-family:Mulish;font-weight:var(--acc-font-weight , 700)!important;font-size:var(--acc-font-size , 12px);color:var(--acc-font-color , #444)!important}::ng-deep .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none!important}::ng-deep .mat-expansion-indicator svg{fill:#1c1b1f!important}::ng-deep .mat-expansion-panel-content{font-size:var(--acc-font-size , 12px)!important}.triangle-icon{display:inline-block;width:0;height:0;border-style:solid;border-width:4px 0 4px 7px;border-color:transparent transparent transparent #ffbb00;margin-right:8px;transition:transform .3s ease}::ng-deep .mat-expansion-panel-header.mat-expanded .triangle-icon{transform:rotate(90deg)}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i1$
|
|
5793
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AccordianComponent, isStandalone: true, selector: "lib-accordian", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<mat-accordion \r\n [multi]=\"true\" \r\n [hideToggle]=\"false\"\r\n [displayMode]=\"'default'\"\r\n [togglePosition]=\"'after'\" [ngStyle]=\"{\r\n'--acc-font-color': field()?.controlStyle?.color ,\r\n'--acc-bg-color': field()?.controlStyle?.background ,\r\n'--acc-border-radius': field()?.controlStyle?.borderRadius ,\r\n'--acc-border-width': field()?.controlStyle?.borderWidth ,\r\n'--acc-border-style': field()?.controlStyle?.borderStyle ,\r\n'--acc-border-color': field()?.controlStyle?.borderColor ,\r\n'--acc-font-size': field()?.controlStyle?.fontSize ,\r\n'--acc-font-weight': field()?.controlStyle?.fontWeight \r\n}\">\r\n \r\n <mat-expansion-panel \r\n [expanded]=\"false\"\r\n [disabled]=\"false\"\r\n [hideToggle]=\"false\"\r\n (opened)=\"onPanelOpened()\"\r\n (closed)=\"onPanelClosed()\"\r\n (expandedChange)=\"onExpandedChange($event)\">\r\n \r\n <mat-expansion-panel-header \r\n [collapsedHeight]=\"'48px'\"\r\n [expandedHeight]=\"'64px'\">\r\n \r\n <mat-panel-title>\r\n <span class=\"triangle-icon\" *ngIf=\"field()?.configData?.showLeftArrowIndicator && field()?.configData?.showLeftArrowIndicator === 'true'\"></span>\r\n {{ field()?.label}}\r\n </mat-panel-title>\r\n \r\n <mat-panel-description>\r\n <!-- This is a description of the panel -->\r\n </mat-panel-description>\r\n \r\n </mat-expansion-panel-header>\r\n \r\n <!-- Panel Content -->\r\n <div>\r\n {{ field()?.configData?.accordianContent}}\r\n </div>\r\n \r\n <!-- Action Buttons -->\r\n <!-- <mat-action-row>\r\n <button mat-button color=\"primary\">Save</button>\r\n <button mat-button color=\"warn\">Cancel</button>\r\n </mat-action-row> -->\r\n \r\n </mat-expansion-panel>\r\n</mat-accordion>", styles: ["::ng-deep .mat-expansion-panel{color:var(--acc-font-color , #444)!important;font-size:var(--acc-font-size , 12px)!important;border-radius:var(--acc-border-radius , 8px)!important;border-width:var(--acc-border-width , 0px)!important;border-style:var(--acc-border-style , solid)!important;border-color:var(--acc-border-color , #ffbb00)!important;background:var(--acc-bg-color , #f5f5f5)!important}::ng-deep .mat-expansion-panel-header-title{font-family:Mulish;font-weight:var(--acc-font-weight , 700)!important;font-size:var(--acc-font-size , 12px);color:var(--acc-font-color , #444)!important}::ng-deep .mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:none!important}::ng-deep .mat-expansion-indicator svg{fill:#1c1b1f!important}::ng-deep .mat-expansion-panel-content{font-size:var(--acc-font-size , 12px)!important}.triangle-icon{display:inline-block;width:0;height:0;border-style:solid;border-width:4px 0 4px 7px;border-color:transparent transparent transparent #ffbb00;margin-right:8px;transition:transform .3s ease}::ng-deep .mat-expansion-panel-header.mat-expanded .triangle-icon{transform:rotate(90deg)}\n"], dependencies: [{ kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i1$5.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i1$5.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i1$5.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i1$5.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i1$5.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5807
5794
|
}
|
|
5808
5795
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AccordianComponent, decorators: [{
|
|
5809
5796
|
type: Component,
|
|
@@ -5826,7 +5813,7 @@ class MiscellaneousInfoBarComponent {
|
|
|
5826
5813
|
}
|
|
5827
5814
|
];
|
|
5828
5815
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MiscellaneousInfoBarComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5829
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MiscellaneousInfoBarComponent, isStandalone: true, selector: "lib-miscellaneous-info-bar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, details: { classPropertyName: "details", publicName: "details", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"misc-info-background\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n '--custom-info-bg-color': field()?.controlStyle?.background ,\r\n '--custom-info-border-radius': field()?.controlStyle?.borderRadius,\r\n '--custom-info-border-width': field()?.controlStyle?.borderWidth,\r\n '--custom-info-border-color': field()?.controlStyle?.borderColor,\r\n '--custom-info-border-style': field()?.controlStyle?.borderStyle,\r\n }\">\r\n <span>\r\n <img\r\n class=\"misc-info-nudge-image mb-1\"\r\n [src]=\"field()?.configData?.prefixImageUrl\"\r\n alt=\"\"\r\n />\r\n <span *ngFor=\"let inp of details ; let i = index\">\r\n <span class=\"ms-3 misc-info-label px-2\" [ngStyle]=\"{\r\n '--misc-info-font-size-label': field()?.controlStyle?.fontSize ,\r\n '--misc-info-font-weight-label': field()?.controlStyle?.fontWeight ,\r\n '--misc-info-font-color-label': field()?.controlStyle?.color ,\r\n }\"\r\n [ngClass]=\"{'show-divider': field()?.configData?.showDivider && field()?.configData?.showDivider === 'true' && i!=0}\"\r\n >{{inp?.label}}</span>\r\n <span class=\"misc-info-value\" [ngStyle]=\"{\r\n '--misc-info-font-size-value': field()?.configData?.valueFontSize ,\r\n '--misc-info-font-weight-value': field()?.configData?.valueFontWeight ,\r\n '--misc-info-font-color-value': field()?.configData?.valueFontColor ,\r\n }\">{{inp?.value}}</span>\r\n </span>\r\n <img\r\n class=\"misc-info-nudge-image mb-1 float-end\"\r\n [src]=\"field()?.configData?.suffixImageUrl\"\r\n alt=\"\"\r\n />\r\n </span>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.misc-info-background{background:var(--custom-info-bg-color , #F5F5F5)!important;border-radius:var(--custom-info-border-radius, 8px);line-height:20.08px;padding:12px 16px;border-width:var(--custom-info-border-width, 1px);border-color:var(--custom-info-border-color, #F5F5F5);border-style:var(--custom-info-border-style, solid);color:var(--custom-info-font-color, #444);font-weight:var(--custom-info-font-weight, 600);font-size:var(--custom-info-font-size, 12px)}.misc-info-nudge-image{width:25px}.misc-info-label{font-size:var(--misc-info-font-size-label, 12px);font-weight:var(--misc-info-font-weight-label, 400);color:var(--misc-info-font-color-label, #444);border-left:0px solid var(--misc-info-font-color-label, #444)}.show-divider{border-left:1px solid var(--misc-info-font-color-label, #444)!important}.misc-info-value{font-size:var(--misc-info-font-size-value, 12px);font-weight:var(--misc-info-font-weight-value, 600);color:var(--misc-info-font-color-value, #444)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
5816
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MiscellaneousInfoBarComponent, isStandalone: true, selector: "lib-miscellaneous-info-bar", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, details: { classPropertyName: "details", publicName: "details", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"misc-info-background\" *ngIf=\"field() && field()?.isVisible\" [ngStyle]=\"{\r\n '--custom-info-bg-color': field()?.controlStyle?.background ,\r\n '--custom-info-border-radius': field()?.controlStyle?.borderRadius,\r\n '--custom-info-border-width': field()?.controlStyle?.borderWidth,\r\n '--custom-info-border-color': field()?.controlStyle?.borderColor,\r\n '--custom-info-border-style': field()?.controlStyle?.borderStyle,\r\n }\">\r\n <span>\r\n <img\r\n class=\"misc-info-nudge-image mb-1\"\r\n [src]=\"field()?.configData?.prefixImageUrl\"\r\n alt=\"\"\r\n />\r\n <span *ngFor=\"let inp of details ; let i = index\">\r\n <span class=\"ms-3 misc-info-label px-2\" [ngStyle]=\"{\r\n '--misc-info-font-size-label': field()?.controlStyle?.fontSize ,\r\n '--misc-info-font-weight-label': field()?.controlStyle?.fontWeight ,\r\n '--misc-info-font-color-label': field()?.controlStyle?.color ,\r\n }\"\r\n [ngClass]=\"{'show-divider': field()?.configData?.showDivider && field()?.configData?.showDivider === 'true' && i!=0}\"\r\n >{{inp?.label}}</span>\r\n <span class=\"misc-info-value\" [ngStyle]=\"{\r\n '--misc-info-font-size-value': field()?.configData?.valueFontSize ,\r\n '--misc-info-font-weight-value': field()?.configData?.valueFontWeight ,\r\n '--misc-info-font-color-value': field()?.configData?.valueFontColor ,\r\n }\">{{inp?.value}}</span>\r\n </span>\r\n <img\r\n class=\"misc-info-nudge-image mb-1 float-end\"\r\n [src]=\"field()?.configData?.suffixImageUrl\"\r\n alt=\"\"\r\n />\r\n </span>\r\n</div>\r\n", styles: ["*{font-family:mulish!important}.misc-info-background{background:var(--custom-info-bg-color , #F5F5F5)!important;border-radius:var(--custom-info-border-radius, 8px);line-height:20.08px;padding:12px 16px;border-width:var(--custom-info-border-width, 1px);border-color:var(--custom-info-border-color, #F5F5F5);border-style:var(--custom-info-border-style, solid);color:var(--custom-info-font-color, #444);font-weight:var(--custom-info-font-weight, 600);font-size:var(--custom-info-font-size, 12px)}.misc-info-nudge-image{width:25px}.misc-info-label{font-size:var(--misc-info-font-size-label, 12px);font-weight:var(--misc-info-font-weight-label, 400);color:var(--misc-info-font-color-label, #444);border-left:0px solid var(--misc-info-font-color-label, #444)}.show-divider{border-left:1px solid var(--misc-info-font-color-label, #444)!important}.misc-info-value{font-size:var(--misc-info-font-size-value, 12px);font-weight:var(--misc-info-font-weight-value, 600);color:var(--misc-info-font-color-value, #444)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5830
5817
|
}
|
|
5831
5818
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MiscellaneousInfoBarComponent, decorators: [{
|
|
5832
5819
|
type: Component,
|
|
@@ -5838,7 +5825,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
5838
5825
|
class PlainTextComponent {
|
|
5839
5826
|
field = input.required();
|
|
5840
5827
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PlainTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5841
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: PlainTextComponent, isStandalone: true, selector: "lib-plain-text", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"plain-text\" [ngStyle]=\"{\r\n'--plain-text-width': field()?.controlStyle?.width ,\r\n'--plain-text-font-size': field()?.controlStyle?.fontSize ,\r\n'--plain-text-font-color': field()?.controlStyle?.color ,\r\n'--plain-text-font-weight': field()?.controlStyle?.fontWeight \r\n }\">{{field()?.label}}</div>\r\n", styles: [".plain-text{width:var(--plain-text-width, 100%);font-size:var(--plain-text-font-size, 400);color:var(--plain-text-font-color, #444);font-weight:var(--plain-text-font-weight, 400);font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
5828
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: PlainTextComponent, isStandalone: true, selector: "lib-plain-text", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"plain-text\" [ngStyle]=\"{\r\n'--plain-text-width': field()?.controlStyle?.width ,\r\n'--plain-text-font-size': field()?.controlStyle?.fontSize ,\r\n'--plain-text-font-color': field()?.controlStyle?.color ,\r\n'--plain-text-font-weight': field()?.controlStyle?.fontWeight \r\n }\">{{field()?.label}}</div>\r\n", styles: [".plain-text{width:var(--plain-text-width, 100%);font-size:var(--plain-text-font-size, 400);color:var(--plain-text-font-color, #444);font-weight:var(--plain-text-font-weight, 400);font-family:mulish!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
5842
5829
|
}
|
|
5843
5830
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PlainTextComponent, decorators: [{
|
|
5844
5831
|
type: Component,
|
|
@@ -5897,7 +5884,7 @@ class MenuComponent {
|
|
|
5897
5884
|
this.showProfileMenu = !this.showProfileMenu;
|
|
5898
5885
|
}
|
|
5899
5886
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5900
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MenuComponent, isStandalone: true, selector: "lib-menu", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\r\n (click)=\"toggleProfileMenu()\"\r\n class=\"menu-container d-flex align-items-center\"\r\n role=\"button\"\r\n>\r\n<!-- [src]=\"field()?.configData?.prefixImage\" -->\r\n <img\r\n [src]=\"field()?.configData?.prefixImage\"\r\n alt=\"Profile\"\r\n class=\"rounded-circle me-2\"\r\n width=\"36\"\r\n height=\"36\"\r\n />\r\n <span class=\"menu-main-text ps-1 pe-2\">{{field()?.configData?.maintext}}</span>\r\n <span *ngIf=\"field()?.configData?.isShowDropdownArrow\" class=\"arrow\"></span>\r\n</div>\r\n\r\n<div\r\n *ngIf=\"showProfileMenu\"\r\n class=\"profile-menu top-100 end-0 bg-white border border-warning rounded-3 shadow-sm mt-2\"\r\n>\r\n <div class=\"profile-menu-caret\"></div>\r\n <ul class=\"list-unstyled m-0 py-2\">\r\n <li\r\n class=\"px-3 py-2 text-nowrap\"\r\n *ngFor=\"let singleOption of field()?.options\"\r\n >\r\n {{singleOption['label']}}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".menu-container{display:flex;justify-content:space-between;align-items:center;background:#f5f5f5;padding:6px 12px;border:1px solid #F5F5F5;border-radius:25px}.profile-menu-caret{position:relative;top:-11px;right:-50%;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:11px solid #fa0;z-index:1}.profile-menu-caret:after{content:\"\";position:absolute;left:-9.8px;top:1.7px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #fff;z-index:2}.arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}.menu-main-text{font-size:16px;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
5887
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MenuComponent, isStandalone: true, selector: "lib-menu", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div\r\n (click)=\"toggleProfileMenu()\"\r\n class=\"menu-container d-flex align-items-center\"\r\n role=\"button\"\r\n>\r\n<!-- [src]=\"field()?.configData?.prefixImage\" -->\r\n <img\r\n [src]=\"field()?.configData?.prefixImage\"\r\n alt=\"Profile\"\r\n class=\"rounded-circle me-2\"\r\n width=\"36\"\r\n height=\"36\"\r\n />\r\n <span class=\"menu-main-text ps-1 pe-2\">{{field()?.configData?.maintext}}</span>\r\n <span *ngIf=\"field()?.configData?.isShowDropdownArrow\" class=\"arrow\"></span>\r\n</div>\r\n\r\n<div\r\n *ngIf=\"showProfileMenu\"\r\n class=\"profile-menu top-100 end-0 bg-white border border-warning rounded-3 shadow-sm mt-2\"\r\n>\r\n <div class=\"profile-menu-caret\"></div>\r\n <ul class=\"list-unstyled m-0 py-2\">\r\n <li\r\n class=\"px-3 py-2 text-nowrap\"\r\n *ngFor=\"let singleOption of field()?.options\"\r\n >\r\n {{singleOption['label']}}\r\n </li>\r\n </ul>\r\n</div>\r\n", styles: [".menu-container{display:flex;justify-content:space-between;align-items:center;background:#f5f5f5;padding:6px 12px;border:1px solid #F5F5F5;border-radius:25px}.profile-menu-caret{position:relative;top:-11px;right:-50%;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:11px solid #fa0;z-index:1}.profile-menu-caret:after{content:\"\";position:absolute;left:-9.8px;top:1.7px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #fff;z-index:2}.arrow{border-style:solid!important;border-width:0 2px 2px 0!important;border-right:2px solid!important;content:\"\"!important;display:inline-block!important;padding:3px!important;transform:rotate(45deg)!important;vertical-align:middle!important;width:unset!important;height:unset!important;color:#444!important}.menu-main-text{font-size:16px;font-weight:700}\n"], dependencies: [{ kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "ngmodule", type: MatInputModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: MatOptionModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }] });
|
|
5901
5888
|
}
|
|
5902
5889
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MenuComponent, decorators: [{
|
|
5903
5890
|
type: Component,
|
|
@@ -6138,7 +6125,7 @@ class StepperWIthArrowComponent {
|
|
|
6138
6125
|
}
|
|
6139
6126
|
}
|
|
6140
6127
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperWIthArrowComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6141
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: StepperWIthArrowComponent, isStandalone: true, selector: "lib-stepper-with-arrow", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, currentStepValue: { classPropertyName: "currentStepValue", publicName: "currentStepValue", isSignal: true, isRequired: false, transformFunction: null }, autoProgress: { classPropertyName: "autoProgress", publicName: "autoProgress", isSignal: true, isRequired: false, transformFunction: null }, autoProgressDelay: { classPropertyName: "autoProgressDelay", publicName: "autoProgressDelay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedStep: "selectedStep" }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\" style=\"zoom: 0.85;\">\r\n <mat-stepper #stepperHeader>\r\n <ng-container *ngFor=\"let steps of field().editStepper; let i = index\">\r\n <mat-step \r\n *ngIf=\"steps.isDisplay !== false\"\r\n [completed]=\"false\"\r\n [optional]=\"false\">\r\n <ng-template matStepLabel>\r\n <div \r\n class=\"step-container\"\r\n [class.step-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.step-active]=\"isStepActive(i)\"\r\n [class.step-completed]=\"isStepCompleted(i)\"\r\n [class.step-collapsed]=\"!shouldShowLabel(i)\"\r\n (click)=\"onStepClick(steps, i)\">\r\n <span \r\n class=\"step-circle\"\r\n [class.circle-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.circle-active]=\"isStepActive(i)\"\r\n [class.circle-completed]=\"isStepCompleted(i)\">\r\n {{i + 1}}\r\n </span>\r\n <span \r\n class=\"step-label mx-2\"\r\n [class.label-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.label-active]=\"isStepActive(i)\"\r\n [class.label-completed]=\"isStepCompleted(i)\"\r\n [class.label-hidden]=\"!shouldShowLabel(i)\">\r\n {{steps?.displayLabel}}\r\n </span>\r\n <span \r\n class=\"arrow\" \r\n [class.arrow-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.arrow-active]=\"isStepActive(i)\"\r\n [class.arrow-completed]=\"isStepCompleted(i)\"\r\n *ngIf=\"i < field().editStepper.length - 1\">\r\n </span>\r\n </div>\r\n </ng-template>\r\n </mat-step>\r\n </ng-container>\r\n </mat-stepper>\r\n</div>", styles: ["*{font-family:mulish!important}.step-container{display:flex;align-items:center;cursor:pointer;padding:4px 8px;border-radius:6px;border:none;transition:all .3s ease}.step-container:hover:not(.step-disabled){background-color:#f5f5f5}.step-container.step-selected{border:none}.step-container.step-disabled{cursor:not-allowed;opacity:.6}.step-container.step-collapsed{padding:4px;justify-content:center}.step-circle{width:24px;height:24px;min-width:24px;min-height:24px;border-radius:50%;background:#0bb68b;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;margin-right:8px;transition:all .3s ease;flex-shrink:0;box-sizing:border-box}.step-circle.circle-disabled{background:#ececec;border:.5px solid #DADADA;color:#8f8f8f}.step-circle.circle-selected{background:#0a9c75}.step-circle.circle-completed{background:#0a9c75;color:#fff}.step-label{color:#444!important;font-size:13px!important;font-weight:700!important;transition:color .3s ease!important}.step-label.label-disabled{color:#999}.step-label.label-selected{color:#444;font-weight:700}.step-label.label-hidden{display:none}.step-label.label-active{color:#0bb68b;font-weight:700}.step-label.label-completed{color:#0a9c75;font-weight:600}.arrow{border:solid #8F8F8F;border-width:0 2px 2px 0;display:inline-block;padding:3px;transform:rotate(315deg);margin-left:12px;transition:border-color .3s ease}.arrow.arrow-disabled{border-color:#8f8f8f}.arrow.arrow-hidden{display:none}.arrow.arrow-active,.arrow.arrow-completed{border-color:#8f8f8f}::ng-deep .mat-step-icon{display:none}::ng-deep .mat-horizontal-stepper-header-container{background:#fff!important}::ng-deep .mat-stepper-horizontal-line{border-top:1px dashed!important;display:none}::ng-deep .mat-horizontal-content-container{display:none}::ng-deep .mat-horizontal-stepper-header{padding:0 8px!important}::ng-deep .mat-step-header.step-disabled .mat-step-label{pointer-events:none}::ng-deep .mat-step-header{max-height:fit-content!important}\n"], dependencies: [{ kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$
|
|
6128
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: StepperWIthArrowComponent, isStandalone: true, selector: "lib-stepper-with-arrow", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, currentStepValue: { classPropertyName: "currentStepValue", publicName: "currentStepValue", isSignal: true, isRequired: false, transformFunction: null }, autoProgress: { classPropertyName: "autoProgress", publicName: "autoProgress", isSignal: true, isRequired: false, transformFunction: null }, autoProgressDelay: { classPropertyName: "autoProgressDelay", publicName: "autoProgressDelay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedStep: "selectedStep" }, ngImport: i0, template: "<div *ngIf=\"field() && field()?.isVisible\" style=\"zoom: 0.85;\">\r\n <mat-stepper #stepperHeader>\r\n <ng-container *ngFor=\"let steps of field().editStepper; let i = index\">\r\n <mat-step \r\n *ngIf=\"steps.isDisplay !== false\"\r\n [completed]=\"false\"\r\n [optional]=\"false\">\r\n <ng-template matStepLabel>\r\n <div \r\n class=\"step-container\"\r\n [class.step-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.step-active]=\"isStepActive(i)\"\r\n [class.step-completed]=\"isStepCompleted(i)\"\r\n [class.step-collapsed]=\"!shouldShowLabel(i)\"\r\n (click)=\"onStepClick(steps, i)\">\r\n <span \r\n class=\"step-circle\"\r\n [class.circle-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.circle-active]=\"isStepActive(i)\"\r\n [class.circle-completed]=\"isStepCompleted(i)\">\r\n {{i + 1}}\r\n </span>\r\n <span \r\n class=\"step-label mx-2\"\r\n [class.label-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.label-active]=\"isStepActive(i)\"\r\n [class.label-completed]=\"isStepCompleted(i)\"\r\n [class.label-hidden]=\"!shouldShowLabel(i)\">\r\n {{steps?.displayLabel}}\r\n </span>\r\n <span \r\n class=\"arrow\" \r\n [class.arrow-disabled]=\"shouldShowAsDisabled(steps, i)\"\r\n [class.arrow-active]=\"isStepActive(i)\"\r\n [class.arrow-completed]=\"isStepCompleted(i)\"\r\n *ngIf=\"i < field().editStepper.length - 1\">\r\n </span>\r\n </div>\r\n </ng-template>\r\n </mat-step>\r\n </ng-container>\r\n </mat-stepper>\r\n</div>", styles: ["*{font-family:mulish!important}.step-container{display:flex;align-items:center;cursor:pointer;padding:4px 8px;border-radius:6px;border:none;transition:all .3s ease}.step-container:hover:not(.step-disabled){background-color:#f5f5f5}.step-container.step-selected{border:none}.step-container.step-disabled{cursor:not-allowed;opacity:.6}.step-container.step-collapsed{padding:4px;justify-content:center}.step-circle{width:24px;height:24px;min-width:24px;min-height:24px;border-radius:50%;background:#0bb68b;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;margin-right:8px;transition:all .3s ease;flex-shrink:0;box-sizing:border-box}.step-circle.circle-disabled{background:#ececec;border:.5px solid #DADADA;color:#8f8f8f}.step-circle.circle-selected{background:#0a9c75}.step-circle.circle-completed{background:#0a9c75;color:#fff}.step-label{color:#444!important;font-size:13px!important;font-weight:700!important;transition:color .3s ease!important}.step-label.label-disabled{color:#999}.step-label.label-selected{color:#444;font-weight:700}.step-label.label-hidden{display:none}.step-label.label-active{color:#0bb68b;font-weight:700}.step-label.label-completed{color:#0a9c75;font-weight:600}.arrow{border:solid #8F8F8F;border-width:0 2px 2px 0;display:inline-block;padding:3px;transform:rotate(315deg);margin-left:12px;transition:border-color .3s ease}.arrow.arrow-disabled{border-color:#8f8f8f}.arrow.arrow-hidden{display:none}.arrow.arrow-active,.arrow.arrow-completed{border-color:#8f8f8f}::ng-deep .mat-step-icon{display:none}::ng-deep .mat-horizontal-stepper-header-container{background:#fff!important}::ng-deep .mat-stepper-horizontal-line{border-top:1px dashed!important;display:none}::ng-deep .mat-horizontal-content-container{display:none}::ng-deep .mat-horizontal-stepper-header{padding:0 8px!important}::ng-deep .mat-step-header.step-disabled .mat-step-label{pointer-events:none}::ng-deep .mat-step-header{max-height:fit-content!important}\n"], dependencies: [{ kind: "ngmodule", type: MatStepperModule }, { kind: "component", type: i2$4.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i2$4.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i2$4.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["disableRipple", "color", "labelPosition", "headerPosition", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6142
6129
|
}
|
|
6143
6130
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: StepperWIthArrowComponent, decorators: [{
|
|
6144
6131
|
type: Component,
|
|
@@ -6148,7 +6135,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
6148
6135
|
class LabelWithImageComponent {
|
|
6149
6136
|
field = input.required();
|
|
6150
6137
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelWithImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6151
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LabelWithImageComponent, isStandalone: true, selector: "lib-label-with-image", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field()?.isVisible\" class=\"d-flex gap-2\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n <span class=\"bold-label\" [ngStyle]=\"{\r\n'--master-bold-label-font-color': field()?.controlStyle?.color,\r\n'--master-bold-label-font-size': field()?.controlStyle?.fontSize,\r\n'--master-bold-label-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}</span>\r\n</div>", styles: ["*{font-family:mulish!important}.master-label{font-weight:400;font-size:14px;color:#000}.master-label{color:var(--master-heading-font-color, #000000)!important;font-size:var(--master-heading-font-size, 14px)!important;font-weight:var(--master-heading-font-weight, 400)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
6138
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: LabelWithImageComponent, isStandalone: true, selector: "lib-label-with-image", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div *ngIf=\"field()?.isVisible\" class=\"d-flex gap-2\">\r\n <img *ngIf=\"field()?.imageUrl\" [src]=\"field()?.imageUrl\" alt=\"\">\r\n <span class=\"bold-label\" [ngStyle]=\"{\r\n'--master-bold-label-font-color': field()?.controlStyle?.color,\r\n'--master-bold-label-font-size': field()?.controlStyle?.fontSize,\r\n'--master-bold-label-font-weight': field()?.controlStyle?.fontWeight\r\n}\">{{field()?.label}}</span>\r\n</div>", styles: ["*{font-family:mulish!important}.master-label{font-weight:400;font-size:14px;color:#000}.master-label{color:var(--master-heading-font-color, #000000)!important;font-size:var(--master-heading-font-size, 14px)!important;font-weight:var(--master-heading-font-weight, 400)!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
6152
6139
|
}
|
|
6153
6140
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LabelWithImageComponent, decorators: [{
|
|
6154
6141
|
type: Component,
|
|
@@ -6178,7 +6165,7 @@ class TopHeaderComponent {
|
|
|
6178
6165
|
this.configData = this.field();
|
|
6179
6166
|
}
|
|
6180
6167
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TopHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6181
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TopHeaderComponent, isStandalone: true, selector: "lib-top-header", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<header class=\"sticky-top bg-white shadow-sm\">\r\n <div class=\"container-fluid mx-auto p-0\">\r\n <div class=\"header row align-items-center\">\r\n <div class=\"col-11\">\r\n <a href=\"/\" class=\"d-flex align-items-center gap-3 fixMargin\">\r\n <img\r\n [src]=\"configData.configData.logoUrl\"\r\n class=\"logo\"\r\n height=\"32\"\r\n alt=\"Logo\"\r\n />\r\n </a>\r\n </div>\r\n <div class=\"col-1 d-flex justify-content-end align-items-center p-1 position-relative\">\r\n <div class=\"me-3 position-relative notification-icon\" role=\"button\" *ngIf=\"configData.configData.notificationBellVisible=='true'\">\r\n <img\r\n [src]=\"configData.configData.notificationImageUrl\"\r\n alt=\"Notifications\"\r\n width=\"28\"\r\n height=\"28\"\r\n />\r\n <span \r\n class=\"position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger\"\r\n >\r\n {{configData.configData.notificationCount}}\r\n </span>\r\n </div>\r\n <div\r\n (mouseenter)=\"showProfileMenu=true\"\r\n class=\"profile-icon d-flex align-items-center rounded-pill bg-light\"\r\n role=\"button\" *ngIf=\"configData.configData.UserProfileVisible=='true'\"\r\n >\r\n <img\r\n [src]=\"configData.configData.imageUrl\"\r\n alt=\"Profile\"\r\n class=\"rounded-circle me-2\"\r\n width=\"36\"\r\n height=\"36\"\r\n />\r\n <span class=\"fw-medium\">{{configData.configData.userProfileText}}</span>\r\n </div>\r\n <div\r\n *ngIf=\"showProfileMenu\"\r\n class=\"profile-menu position-absolute top-100 end-0 bg-white border border-warning rounded-3 shadow-sm mt-2\" (mouseenter)=\"showProfileMenu=true\" (mouseleave)=\"showProfileMenu=false\"\r\n >\r\n <div class=\"profile-menu-caret\"></div>\r\n \r\n <ul class=\"list-unstyled m-0 py-2\">\r\n <li class=\"px-3 py-2 text-nowrap\" *ngFor=\"let item of configData.options || []\">\r\n {{ item.label || 'No label' }}\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n</header>", styles: [".header{background:#fff;box-shadow:0 2px 4px #00000014;height:59px;margin:0;padding:0 40px}.logo{width:64px;height:32px}.profile-menu-caret{position:absolute;top:-11px;right:16px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:11px solid #fa0;z-index:1}.profile-menu-caret:after{content:\"\";position:absolute;left:-9.8px;top:1.7px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #fff;z-index:2}.my_templates{white-space:nowrap}ul li{cursor:pointer}.fixMargin{width:68px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
6168
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: TopHeaderComponent, isStandalone: true, selector: "lib-top-header", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<header class=\"sticky-top bg-white shadow-sm\">\r\n <div class=\"container-fluid mx-auto p-0\">\r\n <div class=\"header row align-items-center\">\r\n <div class=\"col-11\">\r\n <a href=\"/\" class=\"d-flex align-items-center gap-3 fixMargin\">\r\n <img\r\n [src]=\"configData.configData.logoUrl\"\r\n class=\"logo\"\r\n height=\"32\"\r\n alt=\"Logo\"\r\n />\r\n </a>\r\n </div>\r\n <div class=\"col-1 d-flex justify-content-end align-items-center p-1 position-relative\">\r\n <div class=\"me-3 position-relative notification-icon\" role=\"button\" *ngIf=\"configData.configData.notificationBellVisible=='true'\">\r\n <img\r\n [src]=\"configData.configData.notificationImageUrl\"\r\n alt=\"Notifications\"\r\n width=\"28\"\r\n height=\"28\"\r\n />\r\n <span \r\n class=\"position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger\"\r\n >\r\n {{configData.configData.notificationCount}}\r\n </span>\r\n </div>\r\n <div\r\n (mouseenter)=\"showProfileMenu=true\"\r\n class=\"profile-icon d-flex align-items-center rounded-pill bg-light\"\r\n role=\"button\" *ngIf=\"configData.configData.UserProfileVisible=='true'\"\r\n >\r\n <img\r\n [src]=\"configData.configData.imageUrl\"\r\n alt=\"Profile\"\r\n class=\"rounded-circle me-2\"\r\n width=\"36\"\r\n height=\"36\"\r\n />\r\n <span class=\"fw-medium\">{{configData.configData.userProfileText}}</span>\r\n </div>\r\n <div\r\n *ngIf=\"showProfileMenu\"\r\n class=\"profile-menu position-absolute top-100 end-0 bg-white border border-warning rounded-3 shadow-sm mt-2\" (mouseenter)=\"showProfileMenu=true\" (mouseleave)=\"showProfileMenu=false\"\r\n >\r\n <div class=\"profile-menu-caret\"></div>\r\n \r\n <ul class=\"list-unstyled m-0 py-2\">\r\n <li class=\"px-3 py-2 text-nowrap\" *ngFor=\"let item of configData.options || []\">\r\n {{ item.label || 'No label' }}\r\n </li>\r\n </ul>\r\n </div>\r\n \r\n </div>\r\n </div>\r\n </div>\r\n</header>", styles: [".header{background:#fff;box-shadow:0 2px 4px #00000014;height:59px;margin:0;padding:0 40px}.logo{width:64px;height:32px}.profile-menu-caret{position:absolute;top:-11px;right:16px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:11px solid #fa0;z-index:1}.profile-menu-caret:after{content:\"\";position:absolute;left:-9.8px;top:1.7px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:10px solid #fff;z-index:2}.my_templates{white-space:nowrap}ul li{cursor:pointer}.fixMargin{width:68px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6182
6169
|
}
|
|
6183
6170
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TopHeaderComponent, decorators: [{
|
|
6184
6171
|
type: Component,
|
|
@@ -6207,7 +6194,7 @@ class FooterWithButtonsComponent {
|
|
|
6207
6194
|
this.configData = this.field();
|
|
6208
6195
|
}
|
|
6209
6196
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FooterWithButtonsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6210
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: FooterWithButtonsComponent, isStandalone: true, selector: "lib-footer-with-buttons", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "\r\n<footer class=\"custom-footer\" \r\n[ngStyle]=\"{\r\n 'margin-left': configData.configData.margin,\r\n 'margin-right': configData.configData.margin\r\n }\"\r\n>\r\n <div class=\"container\">\r\n <div class=\"footer-buttons d-flex justify-content-center gap-3 py-3\">\r\n <button class=\"btn update-btn\" *ngFor=\"let button of configData.options\">{{button.label}}</button>\r\n </div>\r\n </div>\r\n</footer>\r\n", styles: [":host .custom-footer{background-color:#fff;border-radius:15px 15px 0 0;box-shadow:0 -4px 12px #0000001a;border-top:1px solid #e0e0e0;position:fixed;right:0;bottom:0;left:0;z-index:1030}.footer-buttons{display:flex;justify-content:center;gap:1rem}.footer-buttons:has(:nth-child(2)){justify-content:space-between}.footer-buttons:has(:nth-child(3)){justify-content:space-between}.update-btn{background:#fb0;color:#1a1a1a;border-radius:8px;font-weight:600;padding:8px 16px;transition:background .2s;cursor:pointer}.update-btn:hover{background:#fc0;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
6197
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: FooterWithButtonsComponent, isStandalone: true, selector: "lib-footer-with-buttons", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "\r\n<footer class=\"custom-footer\" \r\n[ngStyle]=\"{\r\n 'margin-left': configData.configData.margin,\r\n 'margin-right': configData.configData.margin\r\n }\"\r\n>\r\n <div class=\"container\">\r\n <div class=\"footer-buttons d-flex justify-content-center gap-3 py-3\">\r\n <button class=\"btn update-btn\" *ngFor=\"let button of configData.options\">{{button.label}}</button>\r\n </div>\r\n </div>\r\n</footer>\r\n", styles: [":host .custom-footer{background-color:#fff;border-radius:15px 15px 0 0;box-shadow:0 -4px 12px #0000001a;border-top:1px solid #e0e0e0;position:fixed;right:0;bottom:0;left:0;z-index:1030}.footer-buttons{display:flex;justify-content:center;gap:1rem}.footer-buttons:has(:nth-child(2)){justify-content:space-between}.footer-buttons:has(:nth-child(3)){justify-content:space-between}.update-btn{background:#fb0;color:#1a1a1a;border-radius:8px;font-weight:600;padding:8px 16px;transition:background .2s;cursor:pointer}.update-btn:hover{background:#fc0;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
6211
6198
|
}
|
|
6212
6199
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FooterWithButtonsComponent, decorators: [{
|
|
6213
6200
|
type: Component,
|
|
@@ -6222,7 +6209,7 @@ class MotorGlowPlanDetailsComponent {
|
|
|
6222
6209
|
this.editPlanClick.emit();
|
|
6223
6210
|
}
|
|
6224
6211
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MotorGlowPlanDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6225
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MotorGlowPlanDetailsComponent, isStandalone: true, selector: "lib-motor-glow-plan-details", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { editPlanClick: "editPlanClick" }, ngImport: i0, template: "<div class=\"yellow-background\" *ngIf=\"field().isVisible\">\r\n <div class=\"row\" style=\"padding-bottom: 16px;\">\r\n <div class=\"col-6\" style=\"padding-bottom: 8px;\">\r\n <span class=\"label-font\">Sum Assured</span>\r\n </div>\r\n <div class=\"col-6 d-flex justify-content-end\" (click)=\"onEditPlanClicked()\">\r\n <span class=\"label-font\">Edit plan <span> <img style=\"height: 12px; width: 12px; transform: translate(2px, -2px);\" src=\"https://cdn.godigit.com/digitPlusAssets/retail-life-icon/svgicon/edit-icon.svg\" alt=\"edit icon\"> </span></span>\r\n </div>\r\n <div class=\"col-12\">\r\n <span class=\"value-font\">{{field()?.configData?.sumAssuedValue ? field()?.configData?.sumAssuedValue : '25' }}</span>\r\n </div>\r\n </div>\r\n <div class=\"row\" style=\"padding-bottom: 16px;\">\r\n <div class=\"col-12\" style=\"padding-bottom: 8px;\"><span class=\"label-font\">Policy Term (PT)</span></div>\r\n <div class=\"col-12 value-font\"><span>{{field()?.configData?.ptYears ? field()?.configData?.ptYears : '5' }} yrs <span class=\"year-label\">(Till {{field()?.configData?.ptValidTill ? field()?.configData?.ptValidTill : '2029' }})</span></span></div>\r\n\r\n </div>\r\n <div class=\"row\" style=\"padding-bottom: 16px;\">\r\n <div class=\"col-12\" style=\"padding-bottom: 8px;\"><span class=\"label-font\">Premium</span></div>\r\n <div class=\"col-12\"><span class=\"premium-color\">\u20B9 {{field()?.configData?.premiumAmount ? field()?.configData?.premiumAmount : '12,025' }}/ {{field()?.configData?.premiumFrequency ? field()?.configData?.premiumFrequency : 'year' }}</span></div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-12\"> <span class=\"eligibility-font\">Eligible for maximum Sum Assured of \u20B9{{field()?.configData?.maxSAValue ? field()?.configData?.maxSAValue : '25' }} Lakh.</span></div>\r\n </div>\r\n\r\n</div>\r\n", styles: [".yellow-background{background-color:#fb03;padding:16px;border-radius:8px}.label-font{color:#444;font-family:Mulish!important;letter-spacing:0px;font-size:12px;font-weight:700;line-height:16px}.value-font{font-size:14px;font-weight:700;font-family:Mulish!important;letter-spacing:0px;color:#444}.eligibility-font{color:#444;font-size:12px;font-family:Mulish!important;letter-spacing:0px;font-weight:400;line-height:16px}.premium-color{color:#169f7d;font-family:Mulish!important;letter-spacing:0px;font-weight:700;line-height:20px;font-size:14px}.year-label{color:#8f8f8f;font-family:Mulish!important;letter-spacing:0px;font-weight:400;line-height:20px;font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
6212
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: MotorGlowPlanDetailsComponent, isStandalone: true, selector: "lib-motor-glow-plan-details", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, outputs: { editPlanClick: "editPlanClick" }, ngImport: i0, template: "<div class=\"yellow-background\" *ngIf=\"field().isVisible\">\r\n <div class=\"row\" style=\"padding-bottom: 16px;\">\r\n <div class=\"col-6\" style=\"padding-bottom: 8px;\">\r\n <span class=\"label-font\">Sum Assured</span>\r\n </div>\r\n <div class=\"col-6 d-flex justify-content-end\" (click)=\"onEditPlanClicked()\">\r\n <span class=\"label-font\">Edit plan <span> <img style=\"height: 12px; width: 12px; transform: translate(2px, -2px);\" src=\"https://cdn.godigit.com/digitPlusAssets/retail-life-icon/svgicon/edit-icon.svg\" alt=\"edit icon\"> </span></span>\r\n </div>\r\n <div class=\"col-12\">\r\n <span class=\"value-font\">{{field()?.configData?.sumAssuedValue ? field()?.configData?.sumAssuedValue : '25' }}</span>\r\n </div>\r\n </div>\r\n <div class=\"row\" style=\"padding-bottom: 16px;\">\r\n <div class=\"col-12\" style=\"padding-bottom: 8px;\"><span class=\"label-font\">Policy Term (PT)</span></div>\r\n <div class=\"col-12 value-font\"><span>{{field()?.configData?.ptYears ? field()?.configData?.ptYears : '5' }} yrs <span class=\"year-label\">(Till {{field()?.configData?.ptValidTill ? field()?.configData?.ptValidTill : '2029' }})</span></span></div>\r\n\r\n </div>\r\n <div class=\"row\" style=\"padding-bottom: 16px;\">\r\n <div class=\"col-12\" style=\"padding-bottom: 8px;\"><span class=\"label-font\">Premium</span></div>\r\n <div class=\"col-12\"><span class=\"premium-color\">\u20B9 {{field()?.configData?.premiumAmount ? field()?.configData?.premiumAmount : '12,025' }}/ {{field()?.configData?.premiumFrequency ? field()?.configData?.premiumFrequency : 'year' }}</span></div>\r\n </div>\r\n <div class=\"row\">\r\n <div class=\"col-12\"> <span class=\"eligibility-font\">Eligible for maximum Sum Assured of \u20B9{{field()?.configData?.maxSAValue ? field()?.configData?.maxSAValue : '25' }} Lakh.</span></div>\r\n </div>\r\n\r\n</div>\r\n", styles: [".yellow-background{background-color:#fb03;padding:16px;border-radius:8px}.label-font{color:#444;font-family:Mulish!important;letter-spacing:0px;font-size:12px;font-weight:700;line-height:16px}.value-font{font-size:14px;font-weight:700;font-family:Mulish!important;letter-spacing:0px;color:#444}.eligibility-font{color:#444;font-size:12px;font-family:Mulish!important;letter-spacing:0px;font-weight:400;line-height:16px}.premium-color{color:#169f7d;font-family:Mulish!important;letter-spacing:0px;font-weight:700;line-height:20px;font-size:14px}.year-label{color:#8f8f8f;font-family:Mulish!important;letter-spacing:0px;font-weight:400;line-height:20px;font-size:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6226
6213
|
}
|
|
6227
6214
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MotorGlowPlanDetailsComponent, decorators: [{
|
|
6228
6215
|
type: Component,
|
|
@@ -6248,9 +6235,12 @@ class AnnuityPremiumCalculatorComponent {
|
|
|
6248
6235
|
onCalcualteButtonClick = new EventEmitter();
|
|
6249
6236
|
onGenerateSummaryClick = new EventEmitter();
|
|
6250
6237
|
onAnnuityPremiumChange = new EventEmitter();
|
|
6238
|
+
onMinimumPremiumValueChange = new EventEmitter();
|
|
6239
|
+
onAutioDebitValueChange = new EventEmitter();
|
|
6251
6240
|
validations = {
|
|
6252
6241
|
ispremiumEntry: false
|
|
6253
6242
|
};
|
|
6243
|
+
isEnableAutoDebit = false;
|
|
6254
6244
|
annuityPremiumToggleObj = {
|
|
6255
6245
|
controlType: 'toggle',
|
|
6256
6246
|
fieldName: 'annuityPremiumToggle',
|
|
@@ -6418,7 +6408,7 @@ class AnnuityPremiumCalculatorComponent {
|
|
|
6418
6408
|
style: null,
|
|
6419
6409
|
imageUrl: null,
|
|
6420
6410
|
configData: {
|
|
6421
|
-
|
|
6411
|
+
isComaSeperated: true,
|
|
6422
6412
|
},
|
|
6423
6413
|
metaDataObj: null,
|
|
6424
6414
|
isShowLabel: true,
|
|
@@ -6516,7 +6506,7 @@ class AnnuityPremiumCalculatorComponent {
|
|
|
6516
6506
|
style: null,
|
|
6517
6507
|
imageUrl: null,
|
|
6518
6508
|
configData: {
|
|
6519
|
-
|
|
6509
|
+
isComaSeperated: true,
|
|
6520
6510
|
},
|
|
6521
6511
|
metaDataObj: null,
|
|
6522
6512
|
isShowLabel: true,
|
|
@@ -6873,6 +6863,14 @@ class AnnuityPremiumCalculatorComponent {
|
|
|
6873
6863
|
this.generateSummaryObj['isDisable'] = this.premiumDetails()?.generateSummary['isDisable'];
|
|
6874
6864
|
}
|
|
6875
6865
|
}
|
|
6866
|
+
if (!this.masterService.checkIfValueIsEmpty(this.premiumDetails()?.autoPayOption)) {
|
|
6867
|
+
if (!this.masterService.checkIfValueIsEmpty(this.premiumDetails()?.autoPayOption['isVisible'])) {
|
|
6868
|
+
this.enableAutoDebitObj['isVisible'] = this.premiumDetails()?.autoPayOption['isVisible'];
|
|
6869
|
+
}
|
|
6870
|
+
if (!this.masterService.checkIfValueIsEmpty(this.premiumDetails()?.autoPayOption['isVisible'])) {
|
|
6871
|
+
this.isEnableAutoDebit = this.premiumDetails()?.autoPayOption['isEnableAutoDebit'];
|
|
6872
|
+
}
|
|
6873
|
+
}
|
|
6876
6874
|
}
|
|
6877
6875
|
}
|
|
6878
6876
|
calculateButtonClicked() {
|
|
@@ -6893,6 +6891,13 @@ class AnnuityPremiumCalculatorComponent {
|
|
|
6893
6891
|
}
|
|
6894
6892
|
this.onAnnuityPremiumChange.emit(value);
|
|
6895
6893
|
}
|
|
6894
|
+
onMinPremiumValueChange(value) {
|
|
6895
|
+
this.minimumAnnuityPayoutObj = value;
|
|
6896
|
+
this.onMinimumPremiumValueChange.emit(value);
|
|
6897
|
+
}
|
|
6898
|
+
onEnableAutoDebitValueChange(event) {
|
|
6899
|
+
this.onAutioDebitValueChange.emit(event);
|
|
6900
|
+
}
|
|
6896
6901
|
annualIncomefocusOut() {
|
|
6897
6902
|
this.validations.ispremiumEntry = false;
|
|
6898
6903
|
if (this.masterService.checkIfValueIsEmpty(this.annuityPremium['textValue'])) {
|
|
@@ -6900,7 +6905,7 @@ class AnnuityPremiumCalculatorComponent {
|
|
|
6900
6905
|
}
|
|
6901
6906
|
}
|
|
6902
6907
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AnnuityPremiumCalculatorComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6903
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AnnuityPremiumCalculatorComponent, isStandalone: true, selector: "lib-annuity-premium-calculator", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, premiumDetails: { classPropertyName: "premiumDetails", publicName: "premiumDetails", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCalcualteButtonClick: "onCalcualteButtonClick", onGenerateSummaryClick: "onGenerateSummaryClick", onAnnuityPremiumChange: "onAnnuityPremiumChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"card px-3\" style=\"padding: 16px;\">\r\n <div class=\"row\">\r\n <h4 class=\"card-main-title\"><span style=\"margin-right: 12px;\"><img src=\"https://cdn.godigit.com/retail-life/calculator.svg\" alt=\"annuity calculator\"></span>Here's your Premium to Annuity Calculator</h4>\r\n </div>\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"card pb-4 px-4\" style=\"border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;\">\r\n <!-- <div class=\"custom-grid-template\">\r\n\r\n </div> -->\r\n\r\n <div class=\"row mx-auto\" style=\"transform: translate(0px, -58%);\">\r\n <lib-toggle class=\"col-auto\" [field]=\"annuityPremiumToggleObj\" />\r\n </div>\r\n <!-- </div> -->\r\n <div class=\"custom-grid-template\">\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"annuityPremiumObj\" [(ngModel)]=\"annuityPremium\" (ngModelChange)=\"onAnnuityPremiumValueChange($event)\" />\r\n <div class=\"error-message\" *ngIf=\"validations.ispremiumEntry\">\r\n Enter Premium\r\n </div>\r\n </div>\r\n <div class=\"mt-3 d-flex justify-content-center align-items-center\" style=\"display: flex; align-items: flex-end; transform: translate(0px, 6px);\">\r\n <lib-icon-button [field]=\"interchangeButtonObj\" />\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"minimumAnnuityPayoutObj\" [(ngModel)]=\"minumumAnnuityPayout\" />\r\n </div>\r\n </div>\r\n <!-- <div class=\"vertical-line\"></div> -->\r\n <div class=\"custom-grid-template\">\r\n <div>\r\n <lib-toggle [field]=\"enableAutoDebitObj\" />\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"card py-3 mb-4 border-top-0\" style=\"border-top-left-radius: 0px; border-top-right-radius: 0px;\">\r\n <div class=\"mx-4\">\r\n <lib-button [field]=\"recalculateButton\" (click)=\"calculateButtonClicked()\" />\r\n </div>\r\n </div>\r\n\r\n <div>\r\n <lib-button [field]=\"generateSummaryObj\" (click)=\"generateSummaryClicked()\" />\r\n </div>\r\n</div>\r\n", styles: [".card-main-title{font-size:16px;font-family:Mulish!important;letter-spacing:0px!important;font-weight:800;line-height:24px;padding-bottom:16px}.col-5-5{flex:0 0 auto;max-width:44.16666667%}.custom-grid-template{display:grid;grid-template-columns:4fr .5fr 4fr}.vertical-line{border-left:2px solid #ccc;height:100px;margin:0 10px}.error-message{font-size:12px;font-weight:500;color:#e00;letter-spacing:0px}\n"], dependencies: [{ kind: "component", type: ToggleComponent, selector: "lib-toggle", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: SelectTextboxComponent, selector: "lib-select-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["field"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["field"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
6908
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: AnnuityPremiumCalculatorComponent, isStandalone: true, selector: "lib-annuity-premium-calculator", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, premiumDetails: { classPropertyName: "premiumDetails", publicName: "premiumDetails", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onCalcualteButtonClick: "onCalcualteButtonClick", onGenerateSummaryClick: "onGenerateSummaryClick", onAnnuityPremiumChange: "onAnnuityPremiumChange", onMinimumPremiumValueChange: "onMinimumPremiumValueChange", onAutioDebitValueChange: "onAutioDebitValueChange" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"card px-3\" style=\"padding: 16px;\">\r\n <div class=\"row\">\r\n <h4 class=\"card-main-title\"><span style=\"margin-right: 12px;\"><img src=\"https://cdn.godigit.com/retail-life/calculator.svg\" alt=\"annuity calculator\"></span>Here's your Premium to Annuity Calculator</h4>\r\n </div>\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"card pb-4 px-4\" style=\"border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;\">\r\n <!-- <div class=\"custom-grid-template\">\r\n\r\n </div> -->\r\n\r\n <div class=\"row mx-auto\" style=\"transform: translate(0px, -58%);\">\r\n <lib-toggle class=\"col-auto\" [field]=\"annuityPremiumToggleObj\" />\r\n </div>\r\n <!-- </div> -->\r\n <div class=\"custom-grid-template\">\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"annuityPremiumObj\" [(ngModel)]=\"annuityPremium\" (ngModelChange)=\"onAnnuityPremiumValueChange($event)\" />\r\n <div class=\"error-message\" *ngIf=\"validations.ispremiumEntry\">\r\n Enter Premium\r\n </div>\r\n </div>\r\n <div class=\"mt-3 d-flex justify-content-center align-items-center\" style=\"display: flex; align-items: flex-end; transform: translate(0px, 6px);\">\r\n <lib-icon-button [field]=\"interchangeButtonObj\" />\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"minimumAnnuityPayoutObj\" [(ngModel)]=\"minumumAnnuityPayout\" (ngModelChange)=\"onMinPremiumValueChange($event)\" />\r\n </div>\r\n </div>\r\n <!-- <div class=\"vertical-line\"></div> -->\r\n <div class=\"custom-grid-template\">\r\n <div>\r\n <lib-toggle [field]=\"enableAutoDebitObj\" [(ngModel)]=\"isEnableAutoDebit\" (ngModelChange)=\"onEnableAutoDebitValueChange($event)\" />\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"card py-3 mb-4 border-top-0\" style=\"border-top-left-radius: 0px; border-top-right-radius: 0px;\">\r\n <div class=\"mx-4\">\r\n <lib-button [field]=\"recalculateButton\" (click)=\"calculateButtonClicked()\" />\r\n </div>\r\n </div>\r\n\r\n <div>\r\n <lib-button [field]=\"generateSummaryObj\" (click)=\"generateSummaryClicked()\" />\r\n </div>\r\n</div>\r\n", styles: [".card-main-title{font-size:16px;font-family:Mulish!important;letter-spacing:0px!important;font-weight:800;line-height:24px;padding-bottom:16px}.col-5-5{flex:0 0 auto;max-width:44.16666667%}.custom-grid-template{display:grid;grid-template-columns:4fr .5fr 4fr}.vertical-line{border-left:2px solid #ccc;height:100px;margin:0 10px}.error-message{font-size:12px;font-weight:500;color:#e00;letter-spacing:0px}\n"], dependencies: [{ kind: "component", type: ToggleComponent, selector: "lib-toggle", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: SelectTextboxComponent, selector: "lib-select-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["field"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["field"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
6904
6909
|
}
|
|
6905
6910
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AnnuityPremiumCalculatorComponent, decorators: [{
|
|
6906
6911
|
type: Component,
|
|
@@ -6911,13 +6916,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
6911
6916
|
IconButtonComponent,
|
|
6912
6917
|
CommonModule,
|
|
6913
6918
|
FormsModule
|
|
6914
|
-
], template: "<div class=\"card px-3\" style=\"padding: 16px;\">\r\n <div class=\"row\">\r\n <h4 class=\"card-main-title\"><span style=\"margin-right: 12px;\"><img src=\"https://cdn.godigit.com/retail-life/calculator.svg\" alt=\"annuity calculator\"></span>Here's your Premium to Annuity Calculator</h4>\r\n </div>\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"card pb-4 px-4\" style=\"border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;\">\r\n <!-- <div class=\"custom-grid-template\">\r\n\r\n </div> -->\r\n\r\n <div class=\"row mx-auto\" style=\"transform: translate(0px, -58%);\">\r\n <lib-toggle class=\"col-auto\" [field]=\"annuityPremiumToggleObj\" />\r\n </div>\r\n <!-- </div> -->\r\n <div class=\"custom-grid-template\">\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"annuityPremiumObj\" [(ngModel)]=\"annuityPremium\" (ngModelChange)=\"onAnnuityPremiumValueChange($event)\" />\r\n <div class=\"error-message\" *ngIf=\"validations.ispremiumEntry\">\r\n Enter Premium\r\n </div>\r\n </div>\r\n <div class=\"mt-3 d-flex justify-content-center align-items-center\" style=\"display: flex; align-items: flex-end; transform: translate(0px, 6px);\">\r\n <lib-icon-button [field]=\"interchangeButtonObj\" />\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"minimumAnnuityPayoutObj\" [(ngModel)]=\"minumumAnnuityPayout\" />\r\n </div>\r\n </div>\r\n <!-- <div class=\"vertical-line\"></div> -->\r\n <div class=\"custom-grid-template\">\r\n <div>\r\n <lib-toggle [field]=\"enableAutoDebitObj\" />\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"card py-3 mb-4 border-top-0\" style=\"border-top-left-radius: 0px; border-top-right-radius: 0px;\">\r\n <div class=\"mx-4\">\r\n <lib-button [field]=\"recalculateButton\" (click)=\"calculateButtonClicked()\" />\r\n </div>\r\n </div>\r\n\r\n <div>\r\n <lib-button [field]=\"generateSummaryObj\" (click)=\"generateSummaryClicked()\" />\r\n </div>\r\n</div>\r\n", styles: [".card-main-title{font-size:16px;font-family:Mulish!important;letter-spacing:0px!important;font-weight:800;line-height:24px;padding-bottom:16px}.col-5-5{flex:0 0 auto;max-width:44.16666667%}.custom-grid-template{display:grid;grid-template-columns:4fr .5fr 4fr}.vertical-line{border-left:2px solid #ccc;height:100px;margin:0 10px}.error-message{font-size:12px;font-weight:500;color:#e00;letter-spacing:0px}\n"] }]
|
|
6919
|
+
], template: "<div class=\"card px-3\" style=\"padding: 16px;\">\r\n <div class=\"row\">\r\n <h4 class=\"card-main-title\"><span style=\"margin-right: 12px;\"><img src=\"https://cdn.godigit.com/retail-life/calculator.svg\" alt=\"annuity calculator\"></span>Here's your Premium to Annuity Calculator</h4>\r\n </div>\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"card pb-4 px-4\" style=\"border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;\">\r\n <!-- <div class=\"custom-grid-template\">\r\n\r\n </div> -->\r\n\r\n <div class=\"row mx-auto\" style=\"transform: translate(0px, -58%);\">\r\n <lib-toggle class=\"col-auto\" [field]=\"annuityPremiumToggleObj\" />\r\n </div>\r\n <!-- </div> -->\r\n <div class=\"custom-grid-template\">\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"annuityPremiumObj\" [(ngModel)]=\"annuityPremium\" (ngModelChange)=\"onAnnuityPremiumValueChange($event)\" />\r\n <div class=\"error-message\" *ngIf=\"validations.ispremiumEntry\">\r\n Enter Premium\r\n </div>\r\n </div>\r\n <div class=\"mt-3 d-flex justify-content-center align-items-center\" style=\"display: flex; align-items: flex-end; transform: translate(0px, 6px);\">\r\n <lib-icon-button [field]=\"interchangeButtonObj\" />\r\n </div>\r\n <div class=\"d-flex flex-column\">\r\n <lib-select-textbox [field]=\"minimumAnnuityPayoutObj\" [(ngModel)]=\"minumumAnnuityPayout\" (ngModelChange)=\"onMinPremiumValueChange($event)\" />\r\n </div>\r\n </div>\r\n <!-- <div class=\"vertical-line\"></div> -->\r\n <div class=\"custom-grid-template\">\r\n <div>\r\n <lib-toggle [field]=\"enableAutoDebitObj\" [(ngModel)]=\"isEnableAutoDebit\" (ngModelChange)=\"onEnableAutoDebitValueChange($event)\" />\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <div class=\"card py-3 mb-4 border-top-0\" style=\"border-top-left-radius: 0px; border-top-right-radius: 0px;\">\r\n <div class=\"mx-4\">\r\n <lib-button [field]=\"recalculateButton\" (click)=\"calculateButtonClicked()\" />\r\n </div>\r\n </div>\r\n\r\n <div>\r\n <lib-button [field]=\"generateSummaryObj\" (click)=\"generateSummaryClicked()\" />\r\n </div>\r\n</div>\r\n", styles: [".card-main-title{font-size:16px;font-family:Mulish!important;letter-spacing:0px!important;font-weight:800;line-height:24px;padding-bottom:16px}.col-5-5{flex:0 0 auto;max-width:44.16666667%}.custom-grid-template{display:grid;grid-template-columns:4fr .5fr 4fr}.vertical-line{border-left:2px solid #ccc;height:100px;margin:0 10px}.error-message{font-size:12px;font-weight:500;color:#e00;letter-spacing:0px}\n"] }]
|
|
6915
6920
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { onCalcualteButtonClick: [{
|
|
6916
6921
|
type: Output
|
|
6917
6922
|
}], onGenerateSummaryClick: [{
|
|
6918
6923
|
type: Output
|
|
6919
6924
|
}], onAnnuityPremiumChange: [{
|
|
6920
6925
|
type: Output
|
|
6926
|
+
}], onMinimumPremiumValueChange: [{
|
|
6927
|
+
type: Output
|
|
6928
|
+
}], onAutioDebitValueChange: [{
|
|
6929
|
+
type: Output
|
|
6921
6930
|
}] } });
|
|
6922
6931
|
|
|
6923
6932
|
class FooterDesignComponent {
|
|
@@ -6927,7 +6936,7 @@ class FooterDesignComponent {
|
|
|
6927
6936
|
this.progress = Math.min(100, Math.max(0, value));
|
|
6928
6937
|
}
|
|
6929
6938
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FooterDesignComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6930
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: FooterDesignComponent, isStandalone: true, selector: "lib-footer-design", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"progress-container\" *ngIf=\"field() && field()?.isVisible\">\r\n <div class=\"circular-progress-wrapper\">\r\n <div class=\"circular-progress\"\r\n [style.--progress]=\"field()?.configData?.Progressbar\"\r\n [class.medium-progress]=\"field()?.configData?.Progressbar >= 25 && field()?.configData?.Progressbar < 50\"\r\n [class.high-progress]=\"field()?.configData?.Progressbar >= 50\">\r\n <div class=\"progress-value\">{{ field()?.configData?.Progressbar }}%</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-content\">\r\n <h2 class=\"main-heading\" [innerHTML]=\"field()?.configData?.Progressbarmsg\"></h2>\r\n <h2 class=\"main-heading1\">{{ field()?.configData?.GrossPremium }}</h2>\r\n </div>\r\n</div>\r\n", styles: [".progress-container{display:flex;align-items:center;gap:12px;height:48px;width:auto;box-sizing:border-box}.circular-progress-wrapper{position:relative;width:48px;height:48px;flex-shrink:0}.circular-progress{width:55px;height:55px;border-radius:50%;background:conic-gradient(#ff5252 0% calc(var(--progress) * 1%),#ececec calc(var(--progress) * 1%) 100%);display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 4px 10px #0000001a}.circular-progress.medium-progress{background:conic-gradient(#fb0 0% calc(var(--progress) * 1%),#e0e0e0 calc(var(--progress) * 1%) 100%)}.circular-progress.high-progress{background:conic-gradient(#4caf50 0% calc(var(--progress) * 1%),#e0e0e0 calc(var(--progress) * 1%) 100%)}.circular-progress:before{content:\"\";position:absolute;width:48px;height:48px;border-radius:50%;background:#ececec}.progress-value{position:relative;z-index:1;font-size:10px;font-weight:700;color:#444}.text-content{display:flex;flex-direction:column;height:48px;justify-content:center;margin-left:7px;row-gap:5px}.main-heading,.main-heading1{margin:0;font-size:10px;color:#222;font-weight:400;line-height:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1
|
|
6939
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: FooterDesignComponent, isStandalone: true, selector: "lib-footer-design", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"progress-container\" *ngIf=\"field() && field()?.isVisible\">\r\n <div class=\"circular-progress-wrapper\">\r\n <div class=\"circular-progress\"\r\n [style.--progress]=\"field()?.configData?.Progressbar\"\r\n [class.medium-progress]=\"field()?.configData?.Progressbar >= 25 && field()?.configData?.Progressbar < 50\"\r\n [class.high-progress]=\"field()?.configData?.Progressbar >= 50\">\r\n <div class=\"progress-value\">{{ field()?.configData?.Progressbar }}%</div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"text-content\">\r\n <h2 class=\"main-heading\" [innerHTML]=\"field()?.configData?.Progressbarmsg\"></h2>\r\n <h2 class=\"main-heading1\">{{ field()?.configData?.GrossPremium }}</h2>\r\n </div>\r\n</div>\r\n", styles: [".progress-container{display:flex;align-items:center;gap:12px;height:48px;width:auto;box-sizing:border-box}.circular-progress-wrapper{position:relative;width:48px;height:48px;flex-shrink:0}.circular-progress{width:55px;height:55px;border-radius:50%;background:conic-gradient(#ff5252 0% calc(var(--progress) * 1%),#ececec calc(var(--progress) * 1%) 100%);display:flex;align-items:center;justify-content:center;position:relative;box-shadow:0 4px 10px #0000001a}.circular-progress.medium-progress{background:conic-gradient(#fb0 0% calc(var(--progress) * 1%),#e0e0e0 calc(var(--progress) * 1%) 100%)}.circular-progress.high-progress{background:conic-gradient(#4caf50 0% calc(var(--progress) * 1%),#e0e0e0 calc(var(--progress) * 1%) 100%)}.circular-progress:before{content:\"\";position:absolute;width:48px;height:48px;border-radius:50%;background:#ececec}.progress-value{position:relative;z-index:1;font-size:10px;font-weight:700;color:#444}.text-content{display:flex;flex-direction:column;height:48px;justify-content:center;margin-left:7px;row-gap:5px}.main-heading,.main-heading1{margin:0;font-size:10px;color:#222;font-weight:400;line-height:14px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
6931
6940
|
}
|
|
6932
6941
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FooterDesignComponent, decorators: [{
|
|
6933
6942
|
type: Component,
|
|
@@ -6939,7 +6948,7 @@ class MasterControlComponent {
|
|
|
6939
6948
|
formGroup = new FormGroup({});
|
|
6940
6949
|
constructor() { }
|
|
6941
6950
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6942
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MasterControlComponent, isStandalone: true, selector: "lib-master-control", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@switch (field()?.controlType) {\r\n @case ('top-header') {\r\n <lib-top-header [field]=\"field()\" />\r\n }\r\n @case ('footer') {\r\n <lib-footer [field]=\"field()\" />\r\n }\r\n @case('footer-buttons')\r\n {\r\n <lib-footer-with-buttons [field]=\"field()\"></lib-footer-with-buttons>\r\n }\r\n @case('text') {\r\n <lib-textbox [field]=\"field()\"></lib-textbox>\r\n }\r\n @case('select') {\r\n <lib-select [field]=\"field()\"/>\r\n }\r\n\r\n @case('radio') {\r\n <lib-radio [field]=\"field()\" />\r\n }\r\n\r\n @case('toggle') {\r\n <lib-toggle [field]=\"field()\" />\r\n }\r\n\r\n @case('file') {\r\n <lib-upload [field]=\"field()\" />\r\n }\r\n\r\n @case('date') {\r\n <lib-dob [field]=\"field()\" />\r\n }\r\n\r\n @case('mobileNumber') {\r\n <lib-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case('info') {\r\n <lib-info [field]=\"field()\" />\r\n }\r\n\r\n @case('checkbox') {\r\n <lib-checkbox [field]=\"field()\" />\r\n }\r\n\r\n @case('textarea') {\r\n <lib-textarea [field]=\"field()\" />\r\n }\r\n\r\n @case ('button') {\r\n <lib-button [field]=\"field()\" />\r\n }\r\n\r\n @case ('tab') {\r\n <lib-tab [field]=\"field()\" />\r\n }\r\n\r\n @case ('autocomplete') {\r\n <lib-autocomplete [field]=\"field()\" />\r\n }\r\n\r\n @case ('multipleSelect') {\r\n <lib-multiple-select [field]=\"field()\" />\r\n }\r\n\r\n @case ('textboxWithSelect') {\r\n <lib-select-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('otpTextbox') {\r\n <lib-otp-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('amountTextbox') {\r\n <lib-amount-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('suffixTextbox') {\r\n <lib-suffix-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('otpMobNumber') {\r\n <lib-otp-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case ('tagMobNumber') {\r\n <lib-tag-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case ('dateWithAge') {\r\n <lib-age-date [field]=\"field()\" />\r\n }\r\n\r\n @case ('additionButton') {\r\n <lib-addition-button [field]=\"field()\" />\r\n }\r\n\r\n @case ('infoTextbox') {\r\n <lib-info-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('textboxWithImage') {\r\n <lib-textbox-with-image [field]=\"field()\" />\r\n }\r\n\r\n @case ('emailWithDomain') {\r\n <lib-email-with-domain [field]=\"field()\" />\r\n }\r\n\r\n @case ('imageUpload') {\r\n <lib-image-upload [field]=\"field()\" />\r\n }\r\n\r\n @case ('downloadDocument') {\r\n <lib-download-document [field]=\"field()\" />\r\n }\r\n\r\n @case ('addDocument') {\r\n <lib-add-document [field]=\"field()\" />\r\n }\r\n\r\n @case ('hyperlink') {\r\n <lib-hyperlink [field]=\"field()\" />\r\n }\r\n\r\n @case ('textboxWithUnderscore') {\r\n <lib-textbox-with-underscore [field]=\"field()\" />\r\n }\r\n\r\n @case ('underscoreMobNumber') {\r\n <lib-underscore-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case ('downloadIconButton') {\r\n <lib-icon-button [field]=\"field()\" />\r\n }\r\n\r\n @case ('image') {\r\n <lib-image [field]=\"field()\" />\r\n }\r\n @case ('stepper') {\r\n <lib-stepper [field]=\"field()\" />\r\n }\r\n @case ('card') {\r\n <lib-card [field]=\"field()\" />\r\n }\r\n @case ('hrLine') {\r\n <lib-hr-line [field]=\"field()\" />\r\n }\r\n @case ('searchMultiSelect') {\r\n <lib-search-multi-select [field]=\"field()\" />\r\n }\r\n @case ('subscriptTextbox') {\r\n <lib-subscript-textbox [field]=\"field()\" />\r\n }\r\n @case ('label') {\r\n <lib-label [field]=\"field()\" />\r\n }\r\n @case ('subHeading') {\r\n <lib-sub-header [field]=\"field()\" />\r\n }\r\n @case ('heading') {\r\n <lib-header [field]=\"field()\" />\r\n }\r\n @case ('table') {\r\n <lib-table [field]=\"field()\" />\r\n }\r\n @case ('textboxWithText') {\r\n <lib-textbox-with-text [field]=\"field()\" />\r\n }\r\n @case ('loader') {\r\n <lib-loader [field]=\"field()\" />\r\n }\r\n @case ('discount') {\r\n <lib-discount [field]=\"field()\" />\r\n }\r\n @case ('optionalBenefitCard') {\r\n <lib-benefit-card [field]=\"field()\" />\r\n }\r\n @case ('errorSnackbar') {\r\n <lib-error-snackbar [field]=\"field()\" />\r\n }\r\n @case ('warningSnackbar') {\r\n <lib-warning-snackbar [field]=\"field()\" />\r\n }\r\n @case ('successSnackbar') {\r\n <lib-success-snackbar [field]=\"field()\" />\r\n }\r\n @case ('neutralSnackbar') {\r\n <lib-neutral-snackbar [field]=\"field()\" />\r\n }\r\n @case ('boldLabel') {\r\n <lib-grey-label [field]=\"field()\" />\r\n }\r\n @case ('iframe') {\r\n <lib-iframe [field]=\"field()\" />\r\n }\r\n @case ('toggleButton') {\r\n <lib-toggle-button [field]=\"field()\" />\r\n }\r\n @case ('payGetCard') {\r\n <lib-pay-get-card [field]=\"field()\" />\r\n }\r\n @case ('inBuiltBenefit') {\r\n <lib-in-built-benefit [field]=\"field()\" />\r\n }\r\n @case ('otherBenefit') {\r\n <lib-other-benefits [field]=\"field()\" />\r\n }\r\n @case ('annuityRateLogo') {\r\n <lib-annuity-rate-logo [field]=\"field()\" />\r\n }\r\n @case ('discountAnnuity') {\r\n <lib-discount-v2 [field]=\"field()\" />\r\n }\r\n @case ('labelValue'){\r\n <lib-label-value-card [field]=\"field()\" />\r\n }\r\n @case ('medicalQuestions'){\r\n <lib-medial-questions [field]=\"field()\" />\r\n }\r\n @case ('nudge'){\r\n <lib-page-nudge [field]=\"field()\"/>\r\n }\r\n @case ('progressBar'){\r\n <lib-progress-bar [field]=\"field()\"/>\r\n }\r\n @case ('accordian'){\r\n <lib-accordian [field]=\"field()\"/>\r\n }\r\n @case ('miscInfo'){\r\n <lib-miscellaneous-info-bar [field]=\"field()\"/>\r\n }\r\n @case ('plainText'){\r\n <lib-plain-text [field]=\"field()\"/>\r\n }\r\n @case ('menu'){\r\n <lib-menu [field]=\"field()\" />\r\n }\r\n @case ('stepperWithArrow') {\r\n <lib-stepper-with-arrow [field]=\"field()\" />\r\n }\r\n @case ('labelWithImage') {\r\n <lib-label-with-image [field]=\"field()\" />\r\n }\r\n @case ('motorGlowPlanDetails') {\r\n <lib-motor-glow-plan-details [field]=\"field()\" />\r\n }\r\n @case ('premiumToAnnuityCalculator') {\r\n <lib-annuity-premium-calculator [field]=\"field()\" />\r\n } @case ('footerProgressBar') {\r\n <lib-footer-design [field]=\"field()\" />\r\n }\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: TextboxComponent, selector: "lib-textbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: SelectComponent, selector: "lib-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange", "infoClick"] }, { kind: "component", type: RadioComponent, selector: "lib-radio", inputs: ["reactiveFormControlobject", "field"], outputs: ["change"] }, { kind: "component", type: ToggleComponent, selector: "lib-toggle", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: UploadComponent, selector: "lib-upload", inputs: ["documentUploaderField", "field", "reactiveFormControlobject"], outputs: ["filesChanged", "fileRemoved", "filePreview"] }, { kind: "component", type: DobComponent, selector: "lib-dob", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur", "valueChange", "dateSelected", "invalidDate"] }, { kind: "component", type: MobNumberComponent, selector: "lib-mob-number", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: InfoComponent, selector: "lib-info", inputs: ["field"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["field"] }, { kind: "component", type: TabComponent, selector: "lib-tab", inputs: ["field"], outputs: ["selectedIndexChange"] }, { kind: "component", type: AutocompleteComponent, selector: "lib-autocomplete", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur", "selectionChanged", "valueChanged", "optionSelected"] }, { kind: "component", type: MultipleSelectComponent, selector: "lib-multiple-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange"] }, { kind: "component", type: SelectTextboxComponent, selector: "lib-select-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: OtpTextboxComponent, selector: "lib-otp-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: AmountTextboxComponent, selector: "lib-amount-textbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: SuffixTextboxComponent, selector: "lib-suffix-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: OtpMobNumberComponent, selector: "lib-otp-mob-number", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: TagMobNumberComponent, selector: "lib-tag-mob-number", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: AgeDateComponent, selector: "lib-age-date", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: AdditionButtonComponent, selector: "lib-addition-button", inputs: ["field"] }, { kind: "component", type: InfoTextboxComponent, selector: "lib-info-textbox", inputs: ["field", "reactiveFormControlobject", "fields"], outputs: ["infoClick"] }, { kind: "component", type: TextboxWithImageComponent, selector: "lib-textbox-with-image", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: EmailWithDomainComponent, selector: "lib-email-with-domain", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: ImageUploadComponent, selector: "lib-image-upload", inputs: ["field"] }, { kind: "component", type: DownloadDocumentComponent, selector: "lib-download-document", inputs: ["field"] }, { kind: "component", type: AddDocumentComponent, selector: "lib-add-document", inputs: ["field"] }, { kind: "component", type: HyperlinkComponent, selector: "lib-hyperlink", inputs: ["field"] }, { kind: "component", type: TextboxWithUnderscoreComponent, selector: "lib-textbox-with-underscore", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: UnderscoreMobNumberComponent, selector: "lib-underscore-mob-number", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["field"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: ImageComponent, selector: "lib-image", inputs: ["field"] }, { kind: "component", type: StepperComponent, selector: "lib-stepper", inputs: ["field"] }, { kind: "component", type: CardComponent, selector: "lib-card", inputs: ["field"], outputs: ["cardDetailsClicked"] }, { kind: "component", type: HrLineComponent, selector: "lib-hr-line", inputs: ["field"] }, { kind: "component", type: SearchMultiSelectComponent, selector: "lib-search-multi-select", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: SubscriptTextboxComponent, selector: "lib-subscript-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: LabelComponent, selector: "lib-label", inputs: ["field"] }, { kind: "component", type: SubHeaderComponent, selector: "lib-sub-header", inputs: ["field"] }, { kind: "component", type: HeaderComponent, selector: "lib-header", inputs: ["field"] }, { kind: "component", type: TextboxWithTextComponent, selector: "lib-textbox-with-text", inputs: ["reactiveFormControlobject", "field"], outputs: ["blur"] }, { kind: "component", type: DiscountComponent, selector: "lib-discount", inputs: ["field"] }, { kind: "component", type: BenefitCardComponent, selector: "lib-benefit-card", inputs: ["field"] }, { kind: "component", type: TableComponent, selector: "lib-table", inputs: ["field", "readonly"], outputs: ["actionItemClicked", "tablePaginationClicked"] }, { kind: "component", type: LoaderComponent, selector: "lib-loader", inputs: ["field"] }, { kind: "component", type: WarningSnackbarComponent, selector: "lib-warning-snackbar", inputs: ["field"] }, { kind: "component", type: SuccessSnackbarComponent, selector: "lib-success-snackbar", inputs: ["field"] }, { kind: "component", type: NeutralSnackbarComponent, selector: "lib-neutral-snackbar", inputs: ["field"] }, { kind: "component", type: ErrorSnackbarComponent, selector: "lib-error-snackbar", inputs: ["field"] }, { kind: "component", type: GreyLabelComponent, selector: "lib-grey-label", inputs: ["field"] }, { kind: "component", type: IframeComponent, selector: "lib-iframe", inputs: ["field"] }, { kind: "component", type: ToggleButtonComponent, selector: "lib-toggle-button", inputs: ["reactiveFormControlobject", "field"], outputs: ["selectionChanged", "change"] }, { kind: "component", type: PayGetCardComponent, selector: "lib-pay-get-card", inputs: ["field", "payAmount", "premiumAmount", "ptValue", "years", "frequency"] }, { kind: "component", type: InBuiltBenefitComponent, selector: "lib-in-built-benefit", inputs: ["field", "premiumAmount", "premiumAmountShort"] }, { kind: "component", type: OtherBenefitsComponent, selector: "lib-other-benefits", inputs: ["field"] }, { kind: "component", type: AnnuityRateLogoComponent, selector: "lib-annuity-rate-logo", inputs: ["field", "ratePercent"] }, { kind: "component", type: DiscountV2Component, selector: "lib-discount-v2", inputs: ["field"] }, { kind: "component", type: LabelValueCardComponent, selector: "lib-label-value-card", inputs: ["field"] }, { kind: "component", type: MedialQuestionsComponent, selector: "lib-medial-questions", inputs: ["medialQuestionResponse", "personUWOpenQuoteResponse", "field"] }, { kind: "component", type: PageNudgeComponent, selector: "lib-page-nudge", inputs: ["field"] }, { kind: "component", type: ProgressBarComponent, selector: "lib-progress-bar", inputs: ["field"] }, { kind: "component", type: AccordianComponent, selector: "lib-accordian", inputs: ["field"] }, { kind: "component", type: MiscellaneousInfoBarComponent, selector: "lib-miscellaneous-info-bar", inputs: ["field", "details"] }, { kind: "component", type: PlainTextComponent, selector: "lib-plain-text", inputs: ["field"] }, { kind: "component", type: MenuComponent, selector: "lib-menu", inputs: ["field"] }, { kind: "component", type: StepperWIthArrowComponent, selector: "lib-stepper-with-arrow", inputs: ["field", "currentStepValue", "autoProgress", "autoProgressDelay"], outputs: ["selectedStep"] }, { kind: "component", type: LabelWithImageComponent, selector: "lib-label-with-image", inputs: ["field"] }, { kind: "component", type: TopHeaderComponent, selector: "lib-top-header", inputs: ["field"] }, { kind: "component", type: FooterComponent, selector: "lib-footer", inputs: ["field"] }, { kind: "component", type: FooterWithButtonsComponent, selector: "lib-footer-with-buttons", inputs: ["field"] }, { kind: "component", type: MotorGlowPlanDetailsComponent, selector: "lib-motor-glow-plan-details", inputs: ["field"], outputs: ["editPlanClick"] }, { kind: "component", type: AnnuityPremiumCalculatorComponent, selector: "lib-annuity-premium-calculator", inputs: ["field", "premiumDetails"], outputs: ["onCalcualteButtonClick", "onGenerateSummaryClick", "onAnnuityPremiumChange"] }, { kind: "component", type: FooterDesignComponent, selector: "lib-footer-design", inputs: ["field"] }] });
|
|
6951
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: MasterControlComponent, isStandalone: true, selector: "lib-master-control", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, formGroup: { classPropertyName: "formGroup", publicName: "formGroup", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "@switch (field()?.controlType) {\r\n @case ('top-header') {\r\n <lib-top-header [field]=\"field()\" />\r\n }\r\n @case ('footer') {\r\n <lib-footer [field]=\"field()\" />\r\n }\r\n @case('footer-buttons')\r\n {\r\n <lib-footer-with-buttons [field]=\"field()\"></lib-footer-with-buttons>\r\n }\r\n @case('text') {\r\n <lib-textbox [field]=\"field()\"></lib-textbox>\r\n }\r\n @case('select') {\r\n <lib-select [field]=\"field()\"/>\r\n }\r\n\r\n @case('radio') {\r\n <lib-radio [field]=\"field()\" />\r\n }\r\n\r\n @case('toggle') {\r\n <lib-toggle [field]=\"field()\" />\r\n }\r\n\r\n @case('file') {\r\n <lib-upload [field]=\"field()\" />\r\n }\r\n\r\n @case('date') {\r\n <lib-dob [field]=\"field()\" />\r\n }\r\n\r\n @case('mobileNumber') {\r\n <lib-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case('info') {\r\n <lib-info [field]=\"field()\" />\r\n }\r\n\r\n @case('checkbox') {\r\n <lib-checkbox [field]=\"field()\" />\r\n }\r\n\r\n @case('textarea') {\r\n <lib-textarea [field]=\"field()\" />\r\n }\r\n\r\n @case ('button') {\r\n <lib-button [field]=\"field()\" />\r\n }\r\n\r\n @case ('tab') {\r\n <lib-tab [field]=\"field()\" />\r\n }\r\n\r\n @case ('autocomplete') {\r\n <lib-autocomplete [field]=\"field()\" />\r\n }\r\n\r\n @case ('multipleSelect') {\r\n <lib-multiple-select [field]=\"field()\" />\r\n }\r\n\r\n @case ('textboxWithSelect') {\r\n <lib-select-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('otpTextbox') {\r\n <lib-otp-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('amountTextbox') {\r\n <lib-amount-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('suffixTextbox') {\r\n <lib-suffix-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('otpMobNumber') {\r\n <lib-otp-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case ('tagMobNumber') {\r\n <lib-tag-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case ('dateWithAge') {\r\n <lib-age-date [field]=\"field()\" />\r\n }\r\n\r\n @case ('additionButton') {\r\n <lib-addition-button [field]=\"field()\" />\r\n }\r\n\r\n @case ('infoTextbox') {\r\n <lib-info-textbox [field]=\"field()\" />\r\n }\r\n\r\n @case ('textboxWithImage') {\r\n <lib-textbox-with-image [field]=\"field()\" />\r\n }\r\n\r\n @case ('emailWithDomain') {\r\n <lib-email-with-domain [field]=\"field()\" />\r\n }\r\n\r\n @case ('imageUpload') {\r\n <lib-image-upload [field]=\"field()\" />\r\n }\r\n\r\n @case ('downloadDocument') {\r\n <lib-download-document [field]=\"field()\" />\r\n }\r\n\r\n @case ('addDocument') {\r\n <lib-add-document [field]=\"field()\" />\r\n }\r\n\r\n @case ('hyperlink') {\r\n <lib-hyperlink [field]=\"field()\" />\r\n }\r\n\r\n @case ('textboxWithUnderscore') {\r\n <lib-textbox-with-underscore [field]=\"field()\" />\r\n }\r\n\r\n @case ('underscoreMobNumber') {\r\n <lib-underscore-mob-number [field]=\"field()\" />\r\n }\r\n\r\n @case ('downloadIconButton') {\r\n <lib-icon-button [field]=\"field()\" />\r\n }\r\n\r\n @case ('image') {\r\n <lib-image [field]=\"field()\" />\r\n }\r\n @case ('stepper') {\r\n <lib-stepper [field]=\"field()\" />\r\n }\r\n @case ('card') {\r\n <lib-card [field]=\"field()\" />\r\n }\r\n @case ('hrLine') {\r\n <lib-hr-line [field]=\"field()\" />\r\n }\r\n @case ('searchMultiSelect') {\r\n <lib-search-multi-select [field]=\"field()\" />\r\n }\r\n @case ('subscriptTextbox') {\r\n <lib-subscript-textbox [field]=\"field()\" />\r\n }\r\n @case ('label') {\r\n <lib-label [field]=\"field()\" />\r\n }\r\n @case ('subHeading') {\r\n <lib-sub-header [field]=\"field()\" />\r\n }\r\n @case ('heading') {\r\n <lib-header [field]=\"field()\" />\r\n }\r\n @case ('table') {\r\n <lib-table [field]=\"field()\" />\r\n }\r\n @case ('textboxWithText') {\r\n <lib-textbox-with-text [field]=\"field()\" />\r\n }\r\n @case ('loader') {\r\n <lib-loader [field]=\"field()\" />\r\n }\r\n @case ('discount') {\r\n <lib-discount [field]=\"field()\" />\r\n }\r\n @case ('optionalBenefitCard') {\r\n <lib-benefit-card [field]=\"field()\" />\r\n }\r\n @case ('errorSnackbar') {\r\n <lib-error-snackbar [field]=\"field()\" />\r\n }\r\n @case ('warningSnackbar') {\r\n <lib-warning-snackbar [field]=\"field()\" />\r\n }\r\n @case ('successSnackbar') {\r\n <lib-success-snackbar [field]=\"field()\" />\r\n }\r\n @case ('neutralSnackbar') {\r\n <lib-neutral-snackbar [field]=\"field()\" />\r\n }\r\n @case ('boldLabel') {\r\n <lib-grey-label [field]=\"field()\" />\r\n }\r\n @case ('iframe') {\r\n <lib-iframe [field]=\"field()\" />\r\n }\r\n @case ('toggleButton') {\r\n <lib-toggle-button [field]=\"field()\" />\r\n }\r\n @case ('payGetCard') {\r\n <lib-pay-get-card [field]=\"field()\" />\r\n }\r\n @case ('inBuiltBenefit') {\r\n <lib-in-built-benefit [field]=\"field()\" />\r\n }\r\n @case ('otherBenefit') {\r\n <lib-other-benefits [field]=\"field()\" />\r\n }\r\n @case ('annuityRateLogo') {\r\n <lib-annuity-rate-logo [field]=\"field()\" />\r\n }\r\n @case ('discountAnnuity') {\r\n <lib-discount-v2 [field]=\"field()\" />\r\n }\r\n @case ('labelValue'){\r\n <lib-label-value-card [field]=\"field()\" />\r\n }\r\n @case ('medicalQuestions'){\r\n <lib-medial-questions [field]=\"field()\" />\r\n }\r\n @case ('nudge'){\r\n <lib-page-nudge [field]=\"field()\"/>\r\n }\r\n @case ('progressBar'){\r\n <lib-progress-bar [field]=\"field()\"/>\r\n }\r\n @case ('accordian'){\r\n <lib-accordian [field]=\"field()\"/>\r\n }\r\n @case ('miscInfo'){\r\n <lib-miscellaneous-info-bar [field]=\"field()\"/>\r\n }\r\n @case ('plainText'){\r\n <lib-plain-text [field]=\"field()\"/>\r\n }\r\n @case ('menu'){\r\n <lib-menu [field]=\"field()\" />\r\n }\r\n @case ('stepperWithArrow') {\r\n <lib-stepper-with-arrow [field]=\"field()\" />\r\n }\r\n @case ('labelWithImage') {\r\n <lib-label-with-image [field]=\"field()\" />\r\n }\r\n @case ('motorGlowPlanDetails') {\r\n <lib-motor-glow-plan-details [field]=\"field()\" />\r\n }\r\n @case ('premiumToAnnuityCalculator') {\r\n <lib-annuity-premium-calculator [field]=\"field()\" />\r\n } @case ('footerProgressBar') {\r\n <lib-footer-design [field]=\"field()\" />\r\n }\r\n}\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "component", type: TextboxComponent, selector: "lib-textbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: SelectComponent, selector: "lib-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange", "infoClick"] }, { kind: "component", type: RadioComponent, selector: "lib-radio", inputs: ["reactiveFormControlobject", "field"], outputs: ["change"] }, { kind: "component", type: ToggleComponent, selector: "lib-toggle", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: UploadComponent, selector: "lib-upload", inputs: ["documentUploaderField", "field", "reactiveFormControlobject"], outputs: ["filesChanged", "fileRemoved", "filePreview"] }, { kind: "component", type: DobComponent, selector: "lib-dob", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur", "valueChange", "dateSelected", "invalidDate"] }, { kind: "component", type: MobNumberComponent, selector: "lib-mob-number", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: InfoComponent, selector: "lib-info", inputs: ["field"] }, { kind: "component", type: CheckboxComponent, selector: "lib-checkbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["change"] }, { kind: "component", type: TextareaComponent, selector: "lib-textarea", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: ButtonComponent, selector: "lib-button", inputs: ["field"] }, { kind: "component", type: TabComponent, selector: "lib-tab", inputs: ["field"], outputs: ["selectedIndexChange"] }, { kind: "component", type: AutocompleteComponent, selector: "lib-autocomplete", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur", "selectionChanged", "valueChanged", "optionSelected"] }, { kind: "component", type: MultipleSelectComponent, selector: "lib-multiple-select", inputs: ["field", "reactiveFormControlobject"], outputs: ["selectionChange"] }, { kind: "component", type: SelectTextboxComponent, selector: "lib-select-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: OtpTextboxComponent, selector: "lib-otp-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: AmountTextboxComponent, selector: "lib-amount-textbox", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: SuffixTextboxComponent, selector: "lib-suffix-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: OtpMobNumberComponent, selector: "lib-otp-mob-number", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: TagMobNumberComponent, selector: "lib-tag-mob-number", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: AgeDateComponent, selector: "lib-age-date", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: AdditionButtonComponent, selector: "lib-addition-button", inputs: ["field"] }, { kind: "component", type: InfoTextboxComponent, selector: "lib-info-textbox", inputs: ["field", "reactiveFormControlobject", "fields"], outputs: ["infoClick"] }, { kind: "component", type: TextboxWithImageComponent, selector: "lib-textbox-with-image", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { kind: "component", type: EmailWithDomainComponent, selector: "lib-email-with-domain", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: ImageUploadComponent, selector: "lib-image-upload", inputs: ["field"] }, { kind: "component", type: DownloadDocumentComponent, selector: "lib-download-document", inputs: ["field"] }, { kind: "component", type: AddDocumentComponent, selector: "lib-add-document", inputs: ["field"] }, { kind: "component", type: HyperlinkComponent, selector: "lib-hyperlink", inputs: ["field"] }, { kind: "component", type: TextboxWithUnderscoreComponent, selector: "lib-textbox-with-underscore", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: UnderscoreMobNumberComponent, selector: "lib-underscore-mob-number", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: IconButtonComponent, selector: "lib-icon-button", inputs: ["field"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: ImageComponent, selector: "lib-image", inputs: ["field"] }, { kind: "component", type: StepperComponent, selector: "lib-stepper", inputs: ["field"] }, { kind: "component", type: CardComponent, selector: "lib-card", inputs: ["field"], outputs: ["cardDetailsClicked"] }, { kind: "component", type: HrLineComponent, selector: "lib-hr-line", inputs: ["field"] }, { kind: "component", type: SearchMultiSelectComponent, selector: "lib-search-multi-select", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: SubscriptTextboxComponent, selector: "lib-subscript-textbox", inputs: ["field", "reactiveFormControlobject"] }, { kind: "component", type: LabelComponent, selector: "lib-label", inputs: ["field"] }, { kind: "component", type: SubHeaderComponent, selector: "lib-sub-header", inputs: ["field"] }, { kind: "component", type: HeaderComponent, selector: "lib-header", inputs: ["field"] }, { kind: "component", type: TextboxWithTextComponent, selector: "lib-textbox-with-text", inputs: ["reactiveFormControlobject", "field"], outputs: ["blur"] }, { kind: "component", type: DiscountComponent, selector: "lib-discount", inputs: ["field"] }, { kind: "component", type: BenefitCardComponent, selector: "lib-benefit-card", inputs: ["field"] }, { kind: "component", type: TableComponent, selector: "lib-table", inputs: ["field", "readonly"], outputs: ["actionItemClicked", "tablePaginationClicked"] }, { kind: "component", type: LoaderComponent, selector: "lib-loader", inputs: ["field"] }, { kind: "component", type: WarningSnackbarComponent, selector: "lib-warning-snackbar", inputs: ["field"] }, { kind: "component", type: SuccessSnackbarComponent, selector: "lib-success-snackbar", inputs: ["field"] }, { kind: "component", type: NeutralSnackbarComponent, selector: "lib-neutral-snackbar", inputs: ["field"] }, { kind: "component", type: ErrorSnackbarComponent, selector: "lib-error-snackbar", inputs: ["field"] }, { kind: "component", type: GreyLabelComponent, selector: "lib-grey-label", inputs: ["field"] }, { kind: "component", type: IframeComponent, selector: "lib-iframe", inputs: ["field"] }, { kind: "component", type: ToggleButtonComponent, selector: "lib-toggle-button", inputs: ["reactiveFormControlobject", "field"], outputs: ["selectionChanged", "change"] }, { kind: "component", type: PayGetCardComponent, selector: "lib-pay-get-card", inputs: ["field", "payAmount", "premiumAmount", "ptValue", "years", "frequency"] }, { kind: "component", type: InBuiltBenefitComponent, selector: "lib-in-built-benefit", inputs: ["field", "premiumAmount", "premiumAmountShort"] }, { kind: "component", type: OtherBenefitsComponent, selector: "lib-other-benefits", inputs: ["field"] }, { kind: "component", type: AnnuityRateLogoComponent, selector: "lib-annuity-rate-logo", inputs: ["field", "ratePercent"] }, { kind: "component", type: DiscountV2Component, selector: "lib-discount-v2", inputs: ["field"] }, { kind: "component", type: LabelValueCardComponent, selector: "lib-label-value-card", inputs: ["field"] }, { kind: "component", type: MedialQuestionsComponent, selector: "lib-medial-questions", inputs: ["medialQuestionResponse", "personUWOpenQuoteResponse", "field"] }, { kind: "component", type: PageNudgeComponent, selector: "lib-page-nudge", inputs: ["field"] }, { kind: "component", type: ProgressBarComponent, selector: "lib-progress-bar", inputs: ["field"] }, { kind: "component", type: AccordianComponent, selector: "lib-accordian", inputs: ["field"] }, { kind: "component", type: MiscellaneousInfoBarComponent, selector: "lib-miscellaneous-info-bar", inputs: ["field", "details"] }, { kind: "component", type: PlainTextComponent, selector: "lib-plain-text", inputs: ["field"] }, { kind: "component", type: MenuComponent, selector: "lib-menu", inputs: ["field"] }, { kind: "component", type: StepperWIthArrowComponent, selector: "lib-stepper-with-arrow", inputs: ["field", "currentStepValue", "autoProgress", "autoProgressDelay"], outputs: ["selectedStep"] }, { kind: "component", type: LabelWithImageComponent, selector: "lib-label-with-image", inputs: ["field"] }, { kind: "component", type: TopHeaderComponent, selector: "lib-top-header", inputs: ["field"] }, { kind: "component", type: FooterComponent, selector: "lib-footer", inputs: ["field"] }, { kind: "component", type: FooterWithButtonsComponent, selector: "lib-footer-with-buttons", inputs: ["field"] }, { kind: "component", type: MotorGlowPlanDetailsComponent, selector: "lib-motor-glow-plan-details", inputs: ["field"], outputs: ["editPlanClick"] }, { kind: "component", type: AnnuityPremiumCalculatorComponent, selector: "lib-annuity-premium-calculator", inputs: ["field", "premiumDetails"], outputs: ["onCalcualteButtonClick", "onGenerateSummaryClick", "onAnnuityPremiumChange", "onMinimumPremiumValueChange", "onAutioDebitValueChange"] }, { kind: "component", type: FooterDesignComponent, selector: "lib-footer-design", inputs: ["field"] }] });
|
|
6943
6952
|
}
|
|
6944
6953
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterControlComponent, decorators: [{
|
|
6945
6954
|
type: Component,
|