master-control 0.2.68 → 0.2.69
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/add-document/add-document.component.mjs +3 -3
- package/esm2022/lib/age-date/age-date.component.mjs +3 -3
- package/esm2022/lib/amount-textbox/amount-textbox.component.mjs +3 -3
- package/esm2022/lib/benefit-card/benefit-card.component.mjs +3 -3
- package/esm2022/lib/card/card.component.mjs +3 -3
- package/esm2022/lib/discount/discount.component.mjs +3 -3
- package/esm2022/lib/discount-v2/discount-v2.component.mjs +3 -3
- package/esm2022/lib/dob/dob.component.mjs +5 -7
- package/esm2022/lib/download-document/download-document.component.mjs +3 -3
- package/esm2022/lib/email-with-domain/email-with-domain.component.mjs +3 -3
- package/esm2022/lib/grey-label/grey-label.component.mjs +3 -3
- package/esm2022/lib/image-upload/image-upload.component.mjs +3 -3
- package/esm2022/lib/info/info.component.mjs +2 -2
- package/esm2022/lib/info-textbox/info-textbox.component.mjs +15 -6
- package/esm2022/lib/master-control.component.mjs +2 -2
- package/esm2022/lib/mob-number/mob-number.component.mjs +3 -3
- package/esm2022/lib/multiple-select/multiple-select.component.mjs +3 -3
- package/esm2022/lib/other-benefits/other-benefits.component.mjs +3 -3
- package/esm2022/lib/otp-mob-number/otp-mob-number.component.mjs +3 -3
- package/esm2022/lib/otp-textbox/otp-textbox.component.mjs +3 -3
- package/esm2022/lib/pay-get-card/pay-get-card.component.mjs +3 -3
- package/esm2022/lib/radio/radio.component.mjs +3 -3
- package/esm2022/lib/search-multi-select/search-multi-select.component.mjs +3 -3
- package/esm2022/lib/select/select.component.mjs +3 -3
- package/esm2022/lib/select-textbox/select-textbox.component.mjs +3 -3
- package/esm2022/lib/subscript-textbox/subscript-textbox.component.mjs +3 -3
- package/esm2022/lib/suffix-textbox/suffix-textbox.component.mjs +3 -3
- package/esm2022/lib/tag-mob-number/tag-mob-number.component.mjs +3 -3
- package/esm2022/lib/textbox/textbox.component.mjs +3 -3
- package/esm2022/lib/textbox-with-image/textbox-with-image.component.mjs +3 -3
- package/esm2022/lib/textbox-with-text/textbox-with-text.component.mjs +3 -3
- package/esm2022/lib/textbox-with-underscore/textbox-with-underscore.component.mjs +3 -3
- package/esm2022/lib/toggle-button/toggle-button.component.mjs +2 -2
- package/esm2022/lib/underscore-mob-number/underscore-mob-number.component.mjs +3 -3
- package/esm2022/lib/upload/upload.component.mjs +3 -3
- package/fesm2022/master-control.mjs +83 -76
- package/fesm2022/master-control.mjs.map +1 -1
- package/lib/info-textbox/info-textbox.component.d.ts +7 -2
- package/master-control-0.2.69.tgz +0 -0
- package/package.json +2 -2
- package/master-control-0.2.68.tgz +0 -0
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, input, EventEmitter, Component, Output, ViewChild,
|
|
2
|
+
import { Injectable, input, EventEmitter, Component, Output, ViewChild, Input, HostListener } from '@angular/core';
|
|
3
3
|
import * as i1 from '@angular/material/input';
|
|
4
4
|
import { MatInputModule } from '@angular/material/input';
|
|
5
5
|
import * as i2 from '@angular/material/form-field';
|
|
@@ -350,7 +350,7 @@ class TextboxComponent {
|
|
|
350
350
|
useExisting: TextboxComponent,
|
|
351
351
|
multi: true
|
|
352
352
|
}
|
|
353
|
-
], 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()?.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 <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
|
|
353
|
+
], 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()?.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 <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-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:.625rem;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}\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.MatHint, selector: "mat-hint", inputs: ["align", "id"] }, { kind: "directive", type: i2.MatError, selector: "mat-error, [matError]", inputs: ["id"] }, { 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"] }] });
|
|
354
354
|
}
|
|
355
355
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxComponent, decorators: [{
|
|
356
356
|
type: Component,
|
|
@@ -365,7 +365,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
365
365
|
useExisting: TextboxComponent,
|
|
366
366
|
multi: true
|
|
367
367
|
}
|
|
368
|
-
], 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()?.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 <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
|
|
368
|
+
], 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()?.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 <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-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:.625rem;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}\n"] }]
|
|
369
369
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { blur: [{
|
|
370
370
|
type: Output
|
|
371
371
|
}] } });
|
|
@@ -449,7 +449,7 @@ class SelectComponent {
|
|
|
449
449
|
useExisting: SelectComponent,
|
|
450
450
|
multi: true
|
|
451
451
|
}
|
|
452
|
-
], ngImport: i0, template: "<label\r\n class=\"field-lable info-label\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >\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 </label>\r\n \r\n<mat-form-field\r\n appearance=\"outline\" \r\n class=\"input-full-width full-width w-100\"\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 [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\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\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n >\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}.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}*{font-family:mulish!important}.info-label{display:flex;justify-content:space-between}\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"] }] });
|
|
452
|
+
], ngImport: i0, template: "<label\r\n class=\"field-lable info-label\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >\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 </label>\r\n \r\n<mat-form-field\r\n appearance=\"outline\" \r\n class=\"input-full-width full-width w-100\"\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 [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\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\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n >\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:.625rem;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}*{font-family:mulish!important}.info-label{display:flex;justify-content:space-between}\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"] }] });
|
|
453
453
|
}
|
|
454
454
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectComponent, decorators: [{
|
|
455
455
|
type: Component,
|
|
@@ -468,7 +468,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
468
468
|
useExisting: SelectComponent,
|
|
469
469
|
multi: true
|
|
470
470
|
}
|
|
471
|
-
], template: "<label\r\n class=\"field-lable info-label\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >\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 </label>\r\n \r\n<mat-form-field\r\n appearance=\"outline\" \r\n class=\"input-full-width full-width w-100\"\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 [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\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\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n >\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}.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}*{font-family:mulish!important}.info-label{display:flex;justify-content:space-between}\n"] }]
|
|
471
|
+
], template: "<label\r\n class=\"field-lable info-label\"\r\n *ngIf=\"field() && field()?.isVisible && field().isShowLabel\"\r\n >\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 </label>\r\n \r\n<mat-form-field\r\n appearance=\"outline\" \r\n class=\"input-full-width full-width w-100\"\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 [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\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\r\n [id]=\"field()?.fieldName\"\r\n [attr.name]=\"field()?.fieldName\"\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 (selectionChange)=\"selectionChanged($event)\"\r\n >\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:.625rem;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}*{font-family:mulish!important}.info-label{display:flex;justify-content:space-between}\n"] }]
|
|
472
472
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { selectionChange: [{
|
|
473
473
|
type: Output
|
|
474
474
|
}] } });
|
|
@@ -516,7 +516,7 @@ class RadioComponent {
|
|
|
516
516
|
useExisting: RadioComponent,
|
|
517
517
|
multi: true
|
|
518
518
|
}
|
|
519
|
-
], 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}\"\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 [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
|
|
519
|
+
], ngImport: i0, template: "<label class=\"field-lable info-label\" *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}\"\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 [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:.625rem;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}.radio-btn-group{display:flex;align-items:flex-start;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;border:1px solid var(--Colors-Greys-Border-Grey, rgba(221, 221, 221, 1));pointer-events:none;cursor:none}\n"], dependencies: [{ kind: "ngmodule", type: MatRadioModule }, { kind: "directive", type: i2$1.MatRadioGroup, selector: "mat-radio-group", inputs: ["color", "name", "labelPosition", "value", "selected", "disabled", "required", "disabledInteractive"], outputs: ["change"], exportAs: ["matRadioGroup"] }, { kind: "component", type: i2$1.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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.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 }] });
|
|
520
520
|
}
|
|
521
521
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioComponent, decorators: [{
|
|
522
522
|
type: Component,
|
|
@@ -531,7 +531,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
531
531
|
useExisting: RadioComponent,
|
|
532
532
|
multi: true
|
|
533
533
|
}
|
|
534
|
-
], 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}\"\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 [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
|
|
534
|
+
], template: "<label class=\"field-lable info-label\" *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}\"\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 [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:.625rem;font-weight:700!important;color:#444!important;margin-bottom:0!important}.error-message{color:red}.radio-btn-group{display:flex;align-items:flex-start;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;border:1px solid var(--Colors-Greys-Border-Grey, rgba(221, 221, 221, 1));pointer-events:none;cursor:none}\n"] }]
|
|
535
535
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { change: [{
|
|
536
536
|
type: Output
|
|
537
537
|
}] } });
|
|
@@ -660,7 +660,7 @@ class UploadComponent {
|
|
|
660
660
|
useExisting: UploadComponent,
|
|
661
661
|
multi: true
|
|
662
662
|
}
|
|
663
|
-
], 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\r\n src=\"https://cdn.godigit.com/retail-life/Upload_documents.svg\"\r\n alt=\"\"\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()?.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\">\r\n <span class=\"mt-2 right-icon\">\r\n <span><img [src]=\"field()?.imageUrl || 'https://cdn.godigit.com/retail-life/Upload_documents.svg'\" 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><img src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\" alt=\"\"/></span>\r\n <span (click)=\"removeFile(i)\" 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
|
|
663
|
+
], 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\r\n src=\"https://cdn.godigit.com/retail-life/Upload_documents.svg\"\r\n alt=\"\"\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()?.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\">\r\n <span class=\"mt-2 right-icon\">\r\n <span><img [src]=\"field()?.imageUrl || 'https://cdn.godigit.com/retail-life/Upload_documents.svg'\" 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><img src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\" alt=\"\"/></span>\r\n <span (click)=\"removeFile(i)\" 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:.625rem;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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: 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"] }] });
|
|
664
664
|
}
|
|
665
665
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UploadComponent, decorators: [{
|
|
666
666
|
type: Component,
|
|
@@ -674,7 +674,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
674
674
|
useExisting: UploadComponent,
|
|
675
675
|
multi: true
|
|
676
676
|
}
|
|
677
|
-
], 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\r\n src=\"https://cdn.godigit.com/retail-life/Upload_documents.svg\"\r\n alt=\"\"\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()?.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\">\r\n <span class=\"mt-2 right-icon\">\r\n <span><img [src]=\"field()?.imageUrl || 'https://cdn.godigit.com/retail-life/Upload_documents.svg'\" 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><img src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\" alt=\"\"/></span>\r\n <span (click)=\"removeFile(i)\" 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
|
|
677
|
+
], 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\r\n src=\"https://cdn.godigit.com/retail-life/Upload_documents.svg\"\r\n alt=\"\"\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()?.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\">\r\n <span class=\"mt-2 right-icon\">\r\n <span><img [src]=\"field()?.imageUrl || 'https://cdn.godigit.com/retail-life/Upload_documents.svg'\" 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><img src=\"https://cdn.godigit.com/retail-life/visibility-oui.svg\" alt=\"\"/></span>\r\n <span (click)=\"removeFile(i)\" 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:.625rem;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"] }]
|
|
678
678
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { fileInput: [{
|
|
679
679
|
type: ViewChild,
|
|
680
680
|
args: ['fileInput']
|
|
@@ -687,19 +687,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
687
687
|
const MY_DATE_FORMAT = {
|
|
688
688
|
parse: {
|
|
689
689
|
dateInput: [
|
|
690
|
-
'DD
|
|
690
|
+
'DD/MM/YYYY',
|
|
691
691
|
'MM/DD/YYYY',
|
|
692
692
|
'YYYY/MM/DD',
|
|
693
|
-
'DD/MM/YYYY',
|
|
694
693
|
'DD MMM YYYY',
|
|
695
|
-
'DD MMMM YYYY'
|
|
696
|
-
'DD-MMM-YYYY'
|
|
694
|
+
'DD MMMM YYYY'
|
|
697
695
|
]
|
|
698
696
|
},
|
|
699
697
|
display: {
|
|
700
|
-
dateInput: 'DD
|
|
698
|
+
dateInput: 'DD/MM/YYYY',
|
|
701
699
|
monthYearLabel: 'MMM YYYY',
|
|
702
|
-
dateA11yLabel: 'DD
|
|
700
|
+
dateA11yLabel: 'DD/MM/YYYY',
|
|
703
701
|
monthYearA11yLabel: 'MMMM YYYY'
|
|
704
702
|
}
|
|
705
703
|
};
|
|
@@ -833,7 +831,7 @@ class MobNumberComponent {
|
|
|
833
831
|
useExisting: MobNumberComponent,
|
|
834
832
|
multi: true
|
|
835
833
|
}
|
|
836
|
-
], 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=\"false\"\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 [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
|
|
834
|
+
], 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=\"false\"\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 [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:.625rem;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 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}.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: 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"] }] });
|
|
837
835
|
}
|
|
838
836
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MobNumberComponent, decorators: [{
|
|
839
837
|
type: Component,
|
|
@@ -843,7 +841,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
843
841
|
useExisting: MobNumberComponent,
|
|
844
842
|
multi: true
|
|
845
843
|
}
|
|
846
|
-
], 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=\"false\"\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 [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
|
|
844
|
+
], 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=\"false\"\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 [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:.625rem;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 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}.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"] }]
|
|
847
845
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { blur: [{
|
|
848
846
|
type: Output
|
|
849
847
|
}] } });
|
|
@@ -855,11 +853,11 @@ class InfoComponent {
|
|
|
855
853
|
}
|
|
856
854
|
field = input.required();
|
|
857
855
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
858
|
-
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>\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:25px;margin-right:5px}.info-nudge-text{font-size:var(--custom-info-font-size,
|
|
856
|
+
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>\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:25px;margin-right:5px}.info-nudge-text{font-size:var(--custom-info-font-size, 1rem);font-family:var(--custom-info-font-family, \"Mulish\");font-weight:var(--custom-info-font-weight, 600);color:var(--custom-info-font-color, #444)}\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"] }] });
|
|
859
857
|
}
|
|
860
858
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoComponent, decorators: [{
|
|
861
859
|
type: Component,
|
|
862
|
-
args: [{ selector: 'lib-info', standalone: true, imports: [CommonModule], 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>\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:25px;margin-right:5px}.info-nudge-text{font-size:var(--custom-info-font-size,
|
|
860
|
+
args: [{ selector: 'lib-info', standalone: true, imports: [CommonModule], 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>\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:25px;margin-right:5px}.info-nudge-text{font-size:var(--custom-info-font-size, 1rem);font-family:var(--custom-info-font-family, \"Mulish\");font-weight:var(--custom-info-font-weight, 600);color:var(--custom-info-font-color, #444)}\n"] }]
|
|
863
861
|
}], ctorParameters: () => [{ type: MasterControlService }] });
|
|
864
862
|
|
|
865
863
|
class CheckboxComponent {
|
|
@@ -1221,7 +1219,7 @@ class MultipleSelectComponent {
|
|
|
1221
1219
|
useExisting: MultipleSelectComponent,
|
|
1222
1220
|
multi: true
|
|
1223
1221
|
}
|
|
1224
|
-
], 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-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-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\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.value\">\r\n {{ option.label }}\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 }}\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:10px!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}::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}\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"] }] });
|
|
1222
|
+
], 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-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-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\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.value\">\r\n {{ option.label }}\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 }}\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:.625rem;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}::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}\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"] }] });
|
|
1225
1223
|
}
|
|
1226
1224
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MultipleSelectComponent, decorators: [{
|
|
1227
1225
|
type: Component,
|
|
@@ -1238,7 +1236,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1238
1236
|
useExisting: MultipleSelectComponent,
|
|
1239
1237
|
multi: true
|
|
1240
1238
|
}
|
|
1241
|
-
], 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-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-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\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.value\">\r\n {{ option.label }}\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 }}\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:10px!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}::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}\n"] }]
|
|
1239
|
+
], 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-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-chip-grid>\r\n @for (option of inputValue; track option) {\r\n <mat-chip-row [removable]=\"true\" (removed)=\"removeItem(option)\">\r\n {{ option }}\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.value\">\r\n {{ option.label }}\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 }}\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:.625rem;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}::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}\n"] }]
|
|
1242
1240
|
}], ctorParameters: () => [{ type: MasterControlService }] });
|
|
1243
1241
|
|
|
1244
1242
|
class SelectTextboxComponent {
|
|
@@ -1316,7 +1314,7 @@ class SelectTextboxComponent {
|
|
|
1316
1314
|
useExisting: SelectTextboxComponent,
|
|
1317
1315
|
multi: true
|
|
1318
1316
|
}
|
|
1319
|
-
], 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 [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 [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 (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:10px!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;min-width:4.5em;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}\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"] }] });
|
|
1317
|
+
], 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 [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 [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 (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:.625rem;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;min-width:4.5em;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}\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"] }] });
|
|
1320
1318
|
}
|
|
1321
1319
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SelectTextboxComponent, decorators: [{
|
|
1322
1320
|
type: Component,
|
|
@@ -1326,7 +1324,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1326
1324
|
useExisting: SelectTextboxComponent,
|
|
1327
1325
|
multi: true
|
|
1328
1326
|
}
|
|
1329
|
-
], 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 [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 [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 (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:10px!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;min-width:4.5em;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}\n"] }]
|
|
1327
|
+
], 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 [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 [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 (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:.625rem;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;min-width:4.5em;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}\n"] }]
|
|
1330
1328
|
}] });
|
|
1331
1329
|
|
|
1332
1330
|
class OtpTextboxComponent {
|
|
@@ -1364,7 +1362,7 @@ class OtpTextboxComponent {
|
|
|
1364
1362
|
useExisting: OtpTextboxComponent,
|
|
1365
1363
|
multi: true
|
|
1366
1364
|
}
|
|
1367
|
-
], 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:10px!important;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"] }] });
|
|
1365
|
+
], 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"] }] });
|
|
1368
1366
|
}
|
|
1369
1367
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtpTextboxComponent, decorators: [{
|
|
1370
1368
|
type: Component,
|
|
@@ -1381,7 +1379,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1381
1379
|
useExisting: OtpTextboxComponent,
|
|
1382
1380
|
multi: true
|
|
1383
1381
|
}
|
|
1384
|
-
], 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
|
|
1382
|
+
], 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"] }]
|
|
1385
1383
|
}], ctorParameters: () => [] });
|
|
1386
1384
|
|
|
1387
1385
|
class AmountTextboxComponent {
|
|
@@ -1574,7 +1572,7 @@ class AmountTextboxComponent {
|
|
|
1574
1572
|
useExisting: AmountTextboxComponent,
|
|
1575
1573
|
multi: true
|
|
1576
1574
|
}
|
|
1577
|
-
], 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
|
|
1575
|
+
], 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:.625rem;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$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: 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"] }] });
|
|
1578
1576
|
}
|
|
1579
1577
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AmountTextboxComponent, decorators: [{
|
|
1580
1578
|
type: Component,
|
|
@@ -1589,7 +1587,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1589
1587
|
useExisting: AmountTextboxComponent,
|
|
1590
1588
|
multi: true
|
|
1591
1589
|
}
|
|
1592
|
-
], 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
|
|
1590
|
+
], 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:.625rem;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"] }]
|
|
1593
1591
|
}], ctorParameters: () => [{ type: MasterControlService }], propDecorators: { blur: [{
|
|
1594
1592
|
type: Output
|
|
1595
1593
|
}] } });
|
|
@@ -1628,7 +1626,7 @@ class SuffixTextboxComponent {
|
|
|
1628
1626
|
useExisting: SuffixTextboxComponent,
|
|
1629
1627
|
multi: true
|
|
1630
1628
|
}
|
|
1631
|
-
], 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 >\r\n <img class=\"ms-1\" [src]=\"field().configData?.labelIconUrl\" [title]=\"field().configData?.tooltipMessage\" />\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\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}} </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>\r\n", styles: [".field-lable{font-size:10px!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}.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}::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: "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"] }] });
|
|
1629
|
+
], 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 >\r\n <img class=\"ms-1\" [src]=\"field().configData?.labelIconUrl\" [title]=\"field().configData?.tooltipMessage\" />\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\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}} </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>\r\n", styles: [".field-lable{font-size:.625rem;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}.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}::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}.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"] }] });
|
|
1632
1630
|
}
|
|
1633
1631
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SuffixTextboxComponent, decorators: [{
|
|
1634
1632
|
type: Component,
|
|
@@ -1644,7 +1642,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1644
1642
|
useExisting: SuffixTextboxComponent,
|
|
1645
1643
|
multi: true
|
|
1646
1644
|
}
|
|
1647
|
-
], 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 >\r\n <img class=\"ms-1\" [src]=\"field().configData?.labelIconUrl\" [title]=\"field().configData?.tooltipMessage\" />\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\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}} </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>\r\n", styles: [".field-lable{font-size
|
|
1645
|
+
], 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 >\r\n <img class=\"ms-1\" [src]=\"field().configData?.labelIconUrl\" [title]=\"field().configData?.tooltipMessage\" />\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\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}} </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>\r\n", styles: [".field-lable{font-size:.625rem;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}.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}::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}.ms-1{width:12px!important;height:12px!important}\n"] }]
|
|
1648
1646
|
}] });
|
|
1649
1647
|
|
|
1650
1648
|
class OtpMobNumberComponent {
|
|
@@ -1682,7 +1680,7 @@ class OtpMobNumberComponent {
|
|
|
1682
1680
|
useExisting: OtpMobNumberComponent,
|
|
1683
1681
|
multi: true
|
|
1684
1682
|
}
|
|
1685
|
-
], 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:10px!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"] }] });
|
|
1683
|
+
], 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:.625rem;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"] }] });
|
|
1686
1684
|
}
|
|
1687
1685
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtpMobNumberComponent, decorators: [{
|
|
1688
1686
|
type: Component,
|
|
@@ -1697,7 +1695,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1697
1695
|
useExisting: OtpMobNumberComponent,
|
|
1698
1696
|
multi: true
|
|
1699
1697
|
}
|
|
1700
|
-
], 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
|
|
1698
|
+
], 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:.625rem;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"] }]
|
|
1701
1699
|
}] });
|
|
1702
1700
|
|
|
1703
1701
|
class TagMobNumberComponent {
|
|
@@ -1735,7 +1733,7 @@ class TagMobNumberComponent {
|
|
|
1735
1733
|
useExisting: TagMobNumberComponent,
|
|
1736
1734
|
multi: true
|
|
1737
1735
|
}
|
|
1738
|
-
], 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:10px!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"] }] });
|
|
1736
|
+
], 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:.625rem;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"] }] });
|
|
1739
1737
|
}
|
|
1740
1738
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TagMobNumberComponent, decorators: [{
|
|
1741
1739
|
type: Component,
|
|
@@ -1751,7 +1749,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1751
1749
|
useExisting: TagMobNumberComponent,
|
|
1752
1750
|
multi: true
|
|
1753
1751
|
}
|
|
1754
|
-
], 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
|
|
1752
|
+
], 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:.625rem;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"] }]
|
|
1755
1753
|
}] });
|
|
1756
1754
|
|
|
1757
1755
|
class AgeDateComponent {
|
|
@@ -1832,7 +1830,7 @@ class AgeDateComponent {
|
|
|
1832
1830
|
useExisting: AgeDateComponent,
|
|
1833
1831
|
multi: true
|
|
1834
1832
|
},
|
|
1835
|
-
], 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
|
|
1833
|
+
], 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:.625rem;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: 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"] }] });
|
|
1836
1834
|
}
|
|
1837
1835
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AgeDateComponent, decorators: [{
|
|
1838
1836
|
type: Component,
|
|
@@ -1868,7 +1866,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1868
1866
|
useExisting: AgeDateComponent,
|
|
1869
1867
|
multi: true
|
|
1870
1868
|
},
|
|
1871
|
-
], 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
|
|
1869
|
+
], 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:.625rem;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"] }]
|
|
1872
1870
|
}], ctorParameters: () => [{ type: MasterControlService }] });
|
|
1873
1871
|
|
|
1874
1872
|
class AdditionButtonComponent {
|
|
@@ -1885,6 +1883,8 @@ class InfoTextboxComponent {
|
|
|
1885
1883
|
field = input.required();
|
|
1886
1884
|
inputValue = null;
|
|
1887
1885
|
reactiveFormControlobject = input();
|
|
1886
|
+
fields;
|
|
1887
|
+
infoClick = new EventEmitter();
|
|
1888
1888
|
_onChange = (inputValue) => { };
|
|
1889
1889
|
_unTouched = () => { };
|
|
1890
1890
|
writeValue(obj) {
|
|
@@ -1908,14 +1908,17 @@ class InfoTextboxComponent {
|
|
|
1908
1908
|
onInputBlur() {
|
|
1909
1909
|
this._unTouched();
|
|
1910
1910
|
}
|
|
1911
|
+
handleWhereToFindClick() {
|
|
1912
|
+
this.infoClick.emit({ field: this.field });
|
|
1913
|
+
}
|
|
1911
1914
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoTextboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1912
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: InfoTextboxComponent, isStandalone: true, selector: "lib-info-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: [
|
|
1915
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: InfoTextboxComponent, isStandalone: true, selector: "lib-info-textbox", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, reactiveFormControlobject: { classPropertyName: "reactiveFormControlobject", publicName: "reactiveFormControlobject", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { infoClick: "infoClick" }, providers: [
|
|
1913
1916
|
{
|
|
1914
1917
|
provide: NG_VALUE_ACCESSOR,
|
|
1915
1918
|
useExisting: InfoTextboxComponent,
|
|
1916
1919
|
multi: true
|
|
1917
1920
|
}
|
|
1918
|
-
], 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>{{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
|
|
1921
|
+
], 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:.625rem;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$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: 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"] }] });
|
|
1919
1922
|
}
|
|
1920
1923
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: InfoTextboxComponent, decorators: [{
|
|
1921
1924
|
type: Component,
|
|
@@ -1930,8 +1933,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1930
1933
|
useExisting: InfoTextboxComponent,
|
|
1931
1934
|
multi: true
|
|
1932
1935
|
}
|
|
1933
|
-
], 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>{{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
|
|
1934
|
-
}]
|
|
1936
|
+
], 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:.625rem;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"] }]
|
|
1937
|
+
}], propDecorators: { fields: [{
|
|
1938
|
+
type: Input
|
|
1939
|
+
}], infoClick: [{
|
|
1940
|
+
type: Output
|
|
1941
|
+
}] } });
|
|
1935
1942
|
|
|
1936
1943
|
class TextboxWithImageComponent {
|
|
1937
1944
|
field = input.required();
|
|
@@ -1971,7 +1978,7 @@ class TextboxWithImageComponent {
|
|
|
1971
1978
|
useExisting: TextboxWithImageComponent,
|
|
1972
1979
|
multi: true
|
|
1973
1980
|
}
|
|
1974
|
-
], 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
|
|
1981
|
+
], 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:.625rem;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: 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: 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"] }] });
|
|
1975
1982
|
}
|
|
1976
1983
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxWithImageComponent, decorators: [{
|
|
1977
1984
|
type: Component,
|
|
@@ -1981,7 +1988,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1981
1988
|
useExisting: TextboxWithImageComponent,
|
|
1982
1989
|
multi: true
|
|
1983
1990
|
}
|
|
1984
|
-
], 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
|
|
1991
|
+
], 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:.625rem;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"] }]
|
|
1985
1992
|
}], propDecorators: { blur: [{
|
|
1986
1993
|
type: Output
|
|
1987
1994
|
}] } });
|
|
@@ -2023,7 +2030,7 @@ class EmailWithDomainComponent {
|
|
|
2023
2030
|
useExisting: EmailWithDomainComponent,
|
|
2024
2031
|
multi: true
|
|
2025
2032
|
}
|
|
2026
|
-
], 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
|
|
2033
|
+
], 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:.625rem;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$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: "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"] }] });
|
|
2027
2034
|
}
|
|
2028
2035
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: EmailWithDomainComponent, decorators: [{
|
|
2029
2036
|
type: Component,
|
|
@@ -2033,46 +2040,46 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2033
2040
|
useExisting: EmailWithDomainComponent,
|
|
2034
2041
|
multi: true
|
|
2035
2042
|
}
|
|
2036
|
-
], 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
|
|
2043
|
+
], 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:.625rem;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"] }]
|
|
2037
2044
|
}] });
|
|
2038
2045
|
|
|
2039
2046
|
class ImageUploadComponent {
|
|
2040
2047
|
field = input.required();
|
|
2041
2048
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageUploadComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2042
|
-
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
|
|
2049
|
+
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:.625rem;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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: FormsModule }] });
|
|
2043
2050
|
}
|
|
2044
2051
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ImageUploadComponent, decorators: [{
|
|
2045
2052
|
type: Component,
|
|
2046
2053
|
args: [{ selector: 'lib-image-upload', standalone: true, imports: [
|
|
2047
2054
|
CommonModule,
|
|
2048
2055
|
FormsModule
|
|
2049
|
-
], 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
|
|
2056
|
+
], 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:.625rem;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"] }]
|
|
2050
2057
|
}] });
|
|
2051
2058
|
|
|
2052
2059
|
class DownloadDocumentComponent {
|
|
2053
2060
|
field = input.required();
|
|
2054
2061
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DownloadDocumentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2055
|
-
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
|
|
2062
|
+
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:.625rem;font-weight:700!important;color:#444!important;margin-bottom:0!important}\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: FormsModule }] });
|
|
2056
2063
|
}
|
|
2057
2064
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DownloadDocumentComponent, decorators: [{
|
|
2058
2065
|
type: Component,
|
|
2059
2066
|
args: [{ selector: 'lib-download-document', standalone: true, imports: [
|
|
2060
2067
|
CommonModule,
|
|
2061
2068
|
FormsModule
|
|
2062
|
-
], 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
|
|
2069
|
+
], 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:.625rem;font-weight:700!important;color:#444!important;margin-bottom:0!important}\n"] }]
|
|
2063
2070
|
}] });
|
|
2064
2071
|
|
|
2065
2072
|
class AddDocumentComponent {
|
|
2066
2073
|
field = input.required();
|
|
2067
2074
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddDocumentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2068
|
-
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:10px!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
|
|
2075
|
+
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:10px!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$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }] });
|
|
2069
2076
|
}
|
|
2070
2077
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AddDocumentComponent, decorators: [{
|
|
2071
2078
|
type: Component,
|
|
2072
2079
|
args: [{ selector: 'lib-add-document', standalone: true, imports: [
|
|
2073
2080
|
CommonModule,
|
|
2074
2081
|
FormsModule
|
|
2075
|
-
], 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:10px!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
|
|
2082
|
+
], 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:10px!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"] }]
|
|
2076
2083
|
}] });
|
|
2077
2084
|
|
|
2078
2085
|
class HyperlinkComponent {
|
|
@@ -2133,7 +2140,7 @@ class TextboxWithUnderscoreComponent {
|
|
|
2133
2140
|
useExisting: TextboxWithUnderscoreComponent,
|
|
2134
2141
|
multi: true
|
|
2135
2142
|
}
|
|
2136
|
-
], 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
|
|
2143
|
+
], 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:.625rem;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$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: "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"] }] });
|
|
2137
2144
|
}
|
|
2138
2145
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxWithUnderscoreComponent, decorators: [{
|
|
2139
2146
|
type: Component,
|
|
@@ -2143,7 +2150,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2143
2150
|
useExisting: TextboxWithUnderscoreComponent,
|
|
2144
2151
|
multi: true
|
|
2145
2152
|
}
|
|
2146
|
-
], 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
|
|
2153
|
+
], 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:.625rem;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"] }]
|
|
2147
2154
|
}] });
|
|
2148
2155
|
|
|
2149
2156
|
class UnderscoreMobNumberComponent {
|
|
@@ -2195,7 +2202,7 @@ class UnderscoreMobNumberComponent {
|
|
|
2195
2202
|
useExisting: UnderscoreMobNumberComponent,
|
|
2196
2203
|
multi: true
|
|
2197
2204
|
}
|
|
2198
|
-
], 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
|
|
2205
|
+
], 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:.625rem;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$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"] }] });
|
|
2199
2206
|
}
|
|
2200
2207
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UnderscoreMobNumberComponent, decorators: [{
|
|
2201
2208
|
type: Component,
|
|
@@ -2205,7 +2212,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2205
2212
|
useExisting: UnderscoreMobNumberComponent,
|
|
2206
2213
|
multi: true
|
|
2207
2214
|
}
|
|
2208
|
-
], 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
|
|
2215
|
+
], 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:.625rem;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"] }]
|
|
2209
2216
|
}] });
|
|
2210
2217
|
|
|
2211
2218
|
class IconButtonComponent {
|
|
@@ -2249,11 +2256,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2249
2256
|
class CardComponent {
|
|
2250
2257
|
field = input.required();
|
|
2251
2258
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2252
|
-
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 } }, ngImport: i0, template: " <div class=\"d-flex gap-5\" *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}\">\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 ,\r\n}\">Label</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\">Glow Plus Pure Term</p>\r\n <span class=\"below-card-text\">L1234694934</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 , 1px);border-style:var(--card-border-style , solid);border-radius:var(--card-border-radius ,
|
|
2259
|
+
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 } }, ngImport: i0, template: " <div class=\"d-flex gap-5\" *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}\">\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 ,\r\n}\">Label</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\">Glow Plus Pure Term</p>\r\n <span class=\"below-card-text\">L1234694934</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 , 1px);border-style:var(--card-border-style , solid);border-radius:var(--card-border-radius , .5rem);padding:12px;max-width:220px}.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}\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"] }] });
|
|
2253
2260
|
}
|
|
2254
2261
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CardComponent, decorators: [{
|
|
2255
2262
|
type: Component,
|
|
2256
|
-
args: [{ selector: 'lib-card', standalone: true, imports: [CommonModule], template: " <div class=\"d-flex gap-5\" *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}\">\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 ,\r\n}\">Label</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\">Glow Plus Pure Term</p>\r\n <span class=\"below-card-text\">L1234694934</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 , 1px);border-style:var(--card-border-style , solid);border-radius:var(--card-border-radius ,
|
|
2263
|
+
args: [{ selector: 'lib-card', standalone: true, imports: [CommonModule], template: " <div class=\"d-flex gap-5\" *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}\">\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 ,\r\n}\">Label</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\">Glow Plus Pure Term</p>\r\n <span class=\"below-card-text\">L1234694934</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 , 1px);border-style:var(--card-border-style , solid);border-radius:var(--card-border-radius , .5rem);padding:12px;max-width:220px}.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}\n"] }]
|
|
2257
2264
|
}] });
|
|
2258
2265
|
|
|
2259
2266
|
class HrLineComponent {
|
|
@@ -2354,7 +2361,7 @@ class SearchMultiSelectComponent {
|
|
|
2354
2361
|
useExisting: SearchMultiSelectComponent,
|
|
2355
2362
|
multi: true
|
|
2356
2363
|
}
|
|
2357
|
-
], 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:10px!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}\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"] }] });
|
|
2364
|
+
], 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:.625rem;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}\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"] }] });
|
|
2358
2365
|
}
|
|
2359
2366
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SearchMultiSelectComponent, decorators: [{
|
|
2360
2367
|
type: Component,
|
|
@@ -2373,7 +2380,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2373
2380
|
useExisting: SearchMultiSelectComponent,
|
|
2374
2381
|
multi: true
|
|
2375
2382
|
}
|
|
2376
|
-
], 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:10px!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}\n"] }]
|
|
2383
|
+
], 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:.625rem;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}\n"] }]
|
|
2377
2384
|
}] });
|
|
2378
2385
|
|
|
2379
2386
|
class SubscriptTextboxComponent {
|
|
@@ -2410,7 +2417,7 @@ class SubscriptTextboxComponent {
|
|
|
2410
2417
|
useExisting: SubscriptTextboxComponent,
|
|
2411
2418
|
multi: true
|
|
2412
2419
|
}
|
|
2413
|
-
], 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
|
|
2420
|
+
], 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:.625rem;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: 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: "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"] }] });
|
|
2414
2421
|
}
|
|
2415
2422
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SubscriptTextboxComponent, decorators: [{
|
|
2416
2423
|
type: Component,
|
|
@@ -2425,7 +2432,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2425
2432
|
useExisting: SubscriptTextboxComponent,
|
|
2426
2433
|
multi: true
|
|
2427
2434
|
}
|
|
2428
|
-
], 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
|
|
2435
|
+
], 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:.625rem;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"] }]
|
|
2429
2436
|
}] });
|
|
2430
2437
|
|
|
2431
2438
|
class LabelComponent {
|
|
@@ -2590,7 +2597,7 @@ class TextboxWithTextComponent {
|
|
|
2590
2597
|
useExisting: TextboxWithTextComponent,
|
|
2591
2598
|
multi: true,
|
|
2592
2599
|
},
|
|
2593
|
-
], 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 [formControl]=\"reactiveFormControlobject()\"\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
|
|
2600
|
+
], 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 [formControl]=\"reactiveFormControlobject()\"\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:.625rem;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: 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: "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"] }] });
|
|
2594
2601
|
}
|
|
2595
2602
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextboxWithTextComponent, decorators: [{
|
|
2596
2603
|
type: Component,
|
|
@@ -2605,27 +2612,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2605
2612
|
useExisting: TextboxWithTextComponent,
|
|
2606
2613
|
multi: true,
|
|
2607
2614
|
},
|
|
2608
|
-
], 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 [formControl]=\"reactiveFormControlobject()\"\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
|
|
2615
|
+
], 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 [formControl]=\"reactiveFormControlobject()\"\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:.625rem;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"] }]
|
|
2609
2616
|
}] });
|
|
2610
2617
|
|
|
2611
2618
|
class DiscountComponent {
|
|
2612
2619
|
field = input.required();
|
|
2613
2620
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2614
|
-
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
|
|
2621
|
+
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$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2615
2622
|
}
|
|
2616
2623
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountComponent, decorators: [{
|
|
2617
2624
|
type: Component,
|
|
2618
|
-
args: [{ selector: 'lib-discount', standalone: true, imports: [CommonModule], 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
|
|
2625
|
+
args: [{ selector: 'lib-discount', standalone: true, imports: [CommonModule], 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"] }]
|
|
2619
2626
|
}] });
|
|
2620
2627
|
|
|
2621
2628
|
class BenefitCardComponent {
|
|
2622
2629
|
field = input.required();
|
|
2623
2630
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BenefitCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2624
|
-
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
|
|
2631
|
+
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$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2625
2632
|
}
|
|
2626
2633
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BenefitCardComponent, decorators: [{
|
|
2627
2634
|
type: Component,
|
|
2628
|
-
args: [{ selector: 'lib-benefit-card', standalone: true, imports: [CommonModule], 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
|
|
2635
|
+
args: [{ selector: 'lib-benefit-card', standalone: true, imports: [CommonModule], 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"] }]
|
|
2629
2636
|
}] });
|
|
2630
2637
|
|
|
2631
2638
|
class LoaderComponent {
|
|
@@ -2705,11 +2712,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2705
2712
|
class GreyLabelComponent {
|
|
2706
2713
|
field = input.required();
|
|
2707
2714
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GreyLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2708
|
-
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
|
|
2715
|
+
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$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2709
2716
|
}
|
|
2710
2717
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GreyLabelComponent, decorators: [{
|
|
2711
2718
|
type: Component,
|
|
2712
|
-
args: [{ selector: 'lib-grey-label', standalone: true, imports: [CommonModule], 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
|
|
2719
|
+
args: [{ selector: 'lib-grey-label', standalone: true, imports: [CommonModule], 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"] }]
|
|
2713
2720
|
}] });
|
|
2714
2721
|
|
|
2715
2722
|
class IframeComponent {
|
|
@@ -2777,7 +2784,7 @@ class ToggleButtonComponent {
|
|
|
2777
2784
|
useExisting: ToggleButtonComponent,
|
|
2778
2785
|
multi: true,
|
|
2779
2786
|
},
|
|
2780
|
-
], ngImport: i0, template: "<div style=\"position: relative\" [ngClass]=\"field()?.cssClass\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-button-toggle-group\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [value]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [(ngModel)]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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>\r\n", 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(-
|
|
2787
|
+
], ngImport: i0, template: "<div style=\"position: relative\" [ngClass]=\"field()?.cssClass\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-button-toggle-group\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [value]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [(ngModel)]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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>\r\n", 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$3.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$3.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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.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"] }] });
|
|
2781
2788
|
}
|
|
2782
2789
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ToggleButtonComponent, decorators: [{
|
|
2783
2790
|
type: Component,
|
|
@@ -2787,7 +2794,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2787
2794
|
useExisting: ToggleButtonComponent,
|
|
2788
2795
|
multi: true,
|
|
2789
2796
|
},
|
|
2790
|
-
], template: "<div style=\"position: relative\" [ngClass]=\"field()?.cssClass\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-button-toggle-group\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [value]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [(ngModel)]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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>\r\n", 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(-
|
|
2797
|
+
], template: "<div style=\"position: relative\" [ngClass]=\"field()?.cssClass\">\r\n @if(reactiveFormControlobject()) {\r\n <mat-button-toggle-group\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [value]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n [formControl]=\"reactiveFormControlobject()\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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\r\n [ngStyle]=\"{\r\n '--toggle-button-width': field()?.controlStyle?.width ,\r\n }\"\r\n name=\"fontStyle\"\r\n class=\"custom-mat-toggle\"\r\n aria-label=\"Font Style\"\r\n *ngIf=\"field() && field()?.isVisible && field()?.configData?.options\"\r\n [(ngModel)]=\"selectedValue\"\r\n (change)=\"onSelectionChange($event.value)\"\r\n >\r\n @for (data of field()?.configData?.options; track $index) {\r\n <mat-button-toggle [value]=\"data.value\"\r\n >{{ data.label }}\r\n <img\r\n *ngIf=\"data.imgUrl\"\r\n [src]=\"data.imgUrl\"\r\n alt=\"\"\r\n class=\"toggle-img mx-1\"\r\n />\r\n </mat-button-toggle>\r\n <div class=\"top-green-card\" *ngIf=\"data.toggleTopText\">\r\n <span class=\"second-box\">\r\n <img\r\n class=\"green-card-img\"\r\n *ngIf=\"data.topImage\"\r\n [src]=\"data.topImage\"\r\n alt=\"\"\r\n />\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>\r\n", 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"] }]
|
|
2791
2798
|
}], propDecorators: { selectionChanged: [{
|
|
2792
2799
|
type: Output
|
|
2793
2800
|
}], change: [{
|
|
@@ -2802,11 +2809,11 @@ class PayGetCardComponent {
|
|
|
2802
2809
|
years = '2030';
|
|
2803
2810
|
frequency = 'month';
|
|
2804
2811
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PayGetCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2805
|
-
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>\r\n <div class=\"text-center mx-2\">\r\n <span class=\"bold-label\">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
|
|
2812
|
+
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>\r\n <div class=\"text-center mx-2\">\r\n <span class=\"bold-label\">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$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2806
2813
|
}
|
|
2807
2814
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PayGetCardComponent, decorators: [{
|
|
2808
2815
|
type: Component,
|
|
2809
|
-
args: [{ selector: 'lib-pay-get-card', standalone: true, imports: [CommonModule], 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>\r\n <div class=\"text-center mx-2\">\r\n <span class=\"bold-label\">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
|
|
2816
|
+
args: [{ selector: 'lib-pay-get-card', standalone: true, imports: [CommonModule], 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>\r\n <div class=\"text-center mx-2\">\r\n <span class=\"bold-label\">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"] }]
|
|
2810
2817
|
}], propDecorators: { payAmount: [{
|
|
2811
2818
|
type: Input
|
|
2812
2819
|
}], premiumAmount: [{
|
|
@@ -2838,11 +2845,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2838
2845
|
class OtherBenefitsComponent {
|
|
2839
2846
|
field = input.required();
|
|
2840
2847
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtherBenefitsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2841
|
-
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>\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
|
|
2848
|
+
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>\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$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2842
2849
|
}
|
|
2843
2850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OtherBenefitsComponent, decorators: [{
|
|
2844
2851
|
type: Component,
|
|
2845
|
-
args: [{ selector: 'lib-other-benefits', standalone: true, imports: [CommonModule], 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>\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
|
|
2852
|
+
args: [{ selector: 'lib-other-benefits', standalone: true, imports: [CommonModule], 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>\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"] }]
|
|
2846
2853
|
}] });
|
|
2847
2854
|
|
|
2848
2855
|
class AnnuityRateLogoComponent {
|
|
@@ -2861,11 +2868,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
2861
2868
|
class DiscountV2Component {
|
|
2862
2869
|
field = input.required();
|
|
2863
2870
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2864
|
-
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 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>\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 ,
|
|
2871
|
+
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 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>\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}.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$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
2865
2872
|
}
|
|
2866
2873
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: DiscountV2Component, decorators: [{
|
|
2867
2874
|
type: Component,
|
|
2868
|
-
args: [{ selector: 'lib-discount-v2', standalone: true, imports: [MatIconModule, CommonModule], 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 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>\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 ,
|
|
2875
|
+
args: [{ selector: 'lib-discount-v2', standalone: true, imports: [MatIconModule, CommonModule], 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 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>\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}.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"] }]
|
|
2869
2876
|
}] });
|
|
2870
2877
|
|
|
2871
2878
|
class LabelValueCardComponent {
|
|
@@ -4493,7 +4500,7 @@ class MasterControlComponent {
|
|
|
4493
4500
|
formGroup = new FormGroup({});
|
|
4494
4501
|
constructor() { }
|
|
4495
4502
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterControlComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4496
|
-
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('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}\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"] }, { 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: ["field", "reactiveFormControlobject"], outputs: ["filesChanged", "fileRemoved"] }, { kind: "component", type: DobComponent, selector: "lib-dob", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { 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"] }, { kind: "component", type: MultipleSelectComponent, selector: "lib-multiple-select", inputs: ["field", "reactiveFormControlobject"] }, { 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"] }, { 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"] }, { 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"] }, { 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", "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"] }] });
|
|
4503
|
+
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('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}\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"] }, { 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: ["field", "reactiveFormControlobject"], outputs: ["filesChanged", "fileRemoved"] }, { kind: "component", type: DobComponent, selector: "lib-dob", inputs: ["field", "reactiveFormControlobject"], outputs: ["blur"] }, { 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"] }, { kind: "component", type: MultipleSelectComponent, selector: "lib-multiple-select", inputs: ["field", "reactiveFormControlobject"] }, { 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"] }, { 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"] }, { 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", "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"] }] });
|
|
4497
4504
|
}
|
|
4498
4505
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: MasterControlComponent, decorators: [{
|
|
4499
4506
|
type: Component,
|