master-control 0.2.34 → 0.2.35
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/amount-textbox/amount-textbox.component.mjs +31 -3
- package/esm2022/lib/upload/upload.component.mjs +73 -4
- package/fesm2022/master-control.mjs +101 -4
- package/fesm2022/master-control.mjs.map +1 -1
- package/lib/amount-textbox/amount-textbox.component.d.ts +2 -0
- package/lib/upload/upload.component.d.ts +14 -1
- package/master-control-0.2.35.tgz +0 -0
- package/package.json +1 -1
- package/master-control-0.2.34.tgz +0 -0
|
@@ -498,8 +498,71 @@ class UploadComponent {
|
|
|
498
498
|
this.masterService = masterService;
|
|
499
499
|
}
|
|
500
500
|
field = input.required();
|
|
501
|
+
// ControlValueAccessor properties
|
|
502
|
+
uploadedFiles = [];
|
|
503
|
+
value = null;
|
|
504
|
+
_onChange = (value) => { };
|
|
505
|
+
_onTouched = () => { };
|
|
506
|
+
disabled = false;
|
|
507
|
+
// ControlValueAccessor implementation
|
|
508
|
+
writeValue(obj) {
|
|
509
|
+
this.value = obj;
|
|
510
|
+
if (obj && Array.isArray(obj)) {
|
|
511
|
+
this.uploadedFiles = obj;
|
|
512
|
+
}
|
|
513
|
+
else if (obj) {
|
|
514
|
+
this.uploadedFiles = [obj];
|
|
515
|
+
}
|
|
516
|
+
else {
|
|
517
|
+
this.uploadedFiles = [];
|
|
518
|
+
}
|
|
519
|
+
}
|
|
520
|
+
registerOnChange(fn) {
|
|
521
|
+
this._onChange = fn;
|
|
522
|
+
}
|
|
523
|
+
registerOnTouched(fn) {
|
|
524
|
+
this._onTouched = fn;
|
|
525
|
+
}
|
|
526
|
+
setDisabledState(isDisabled) {
|
|
527
|
+
this.disabled = isDisabled;
|
|
528
|
+
}
|
|
529
|
+
// File upload handling
|
|
530
|
+
onFileSelected(event) {
|
|
531
|
+
const files = event.target.files;
|
|
532
|
+
if (files && files.length > 0) {
|
|
533
|
+
if (this.field()?.multiple) {
|
|
534
|
+
this.uploadedFiles = Array.from(files);
|
|
535
|
+
this.value = this.uploadedFiles;
|
|
536
|
+
}
|
|
537
|
+
else {
|
|
538
|
+
this.uploadedFiles = [files[0]];
|
|
539
|
+
this.value = files[0];
|
|
540
|
+
}
|
|
541
|
+
this._onChange(this.value);
|
|
542
|
+
this._onTouched();
|
|
543
|
+
}
|
|
544
|
+
}
|
|
545
|
+
removeFile(index) {
|
|
546
|
+
this.uploadedFiles.splice(index, 1);
|
|
547
|
+
if (this.field()?.multiple) {
|
|
548
|
+
this.value = [...this.uploadedFiles];
|
|
549
|
+
}
|
|
550
|
+
else {
|
|
551
|
+
this.value = this.uploadedFiles.length > 0 ? this.uploadedFiles[0] : null;
|
|
552
|
+
}
|
|
553
|
+
this._onChange(this.value);
|
|
554
|
+
}
|
|
555
|
+
hasFiles() {
|
|
556
|
+
return this.uploadedFiles.length > 0;
|
|
557
|
+
}
|
|
501
558
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UploadComponent, deps: [{ token: MasterControlService }], target: i0.ɵɵFactoryTarget.Component });
|
|
502
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: UploadComponent, isStandalone: true, selector: "lib-upload", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } },
|
|
559
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: UploadComponent, isStandalone: true, selector: "lib-upload", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null } }, providers: [
|
|
560
|
+
{
|
|
561
|
+
provide: NG_VALUE_ACCESSOR,
|
|
562
|
+
useExisting: UploadComponent,
|
|
563
|
+
multi: true
|
|
564
|
+
}
|
|
565
|
+
], 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 [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 <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 [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\">\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:10px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.upload-label{opacity:1}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:8px}.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: "ngmodule", type: ReactiveFormsModule }] });
|
|
503
566
|
}
|
|
504
567
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UploadComponent, decorators: [{
|
|
505
568
|
type: Component,
|
|
@@ -507,7 +570,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
507
570
|
CommonModule,
|
|
508
571
|
FormsModule,
|
|
509
572
|
ReactiveFormsModule
|
|
510
|
-
],
|
|
573
|
+
], providers: [
|
|
574
|
+
{
|
|
575
|
+
provide: NG_VALUE_ACCESSOR,
|
|
576
|
+
useExisting: UploadComponent,
|
|
577
|
+
multi: true
|
|
578
|
+
}
|
|
579
|
+
], 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 [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 <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 [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\">\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:10px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}.upload-label{opacity:1}.upload-btn{width:100%!important;height:48px!important;padding:10px;border-radius:8px}.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"] }]
|
|
511
580
|
}], ctorParameters: () => [{ type: MasterControlService }] });
|
|
512
581
|
|
|
513
582
|
const MY_DATE_FORMAT = {
|
|
@@ -1150,6 +1219,34 @@ class AmountTextboxComponent {
|
|
|
1150
1219
|
this._unTouched();
|
|
1151
1220
|
this.blur.emit(event);
|
|
1152
1221
|
}
|
|
1222
|
+
// Format amount to Indian currency format
|
|
1223
|
+
formatIndianCurrency(amount) {
|
|
1224
|
+
if (!amount || amount === '')
|
|
1225
|
+
return '';
|
|
1226
|
+
const numAmount = typeof amount === 'string' ? parseFloat(amount) : amount;
|
|
1227
|
+
if (isNaN(numAmount) || numAmount === 0)
|
|
1228
|
+
return '';
|
|
1229
|
+
// Convert to crores, lakhs, thousands format
|
|
1230
|
+
if (numAmount >= 10000000) { // 1 crore and above
|
|
1231
|
+
const crores = (numAmount / 10000000).toFixed(2);
|
|
1232
|
+
return `₹ ${crores} Cr`;
|
|
1233
|
+
}
|
|
1234
|
+
else if (numAmount >= 100000) { // 1 lakh and above
|
|
1235
|
+
const lakhs = (numAmount / 100000).toFixed(2);
|
|
1236
|
+
return `₹ ${lakhs} L`;
|
|
1237
|
+
}
|
|
1238
|
+
else if (numAmount >= 1000) { // 1 thousand and above
|
|
1239
|
+
const thousands = (numAmount / 1000).toFixed(2);
|
|
1240
|
+
return `₹ ${thousands} K`;
|
|
1241
|
+
}
|
|
1242
|
+
else {
|
|
1243
|
+
return `₹ ${numAmount.toFixed(2)}`;
|
|
1244
|
+
}
|
|
1245
|
+
}
|
|
1246
|
+
// Get formatted display value
|
|
1247
|
+
getFormattedAmount() {
|
|
1248
|
+
return this.formatIndianCurrency(this.inputValue);
|
|
1249
|
+
}
|
|
1153
1250
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AmountTextboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1154
1251
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AmountTextboxComponent, isStandalone: true, selector: "lib-amount-textbox", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, reactiveFormControlobject: { classPropertyName: "reactiveFormControlobject", publicName: "reactiveFormControlobject", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { blur: "blur" }, providers: [
|
|
1155
1252
|
{
|
|
@@ -1157,7 +1254,7 @@ class AmountTextboxComponent {
|
|
|
1157
1254
|
useExisting: AmountTextboxComponent,
|
|
1158
1255
|
multi: true
|
|
1159
1256
|
}
|
|
1160
|
-
], 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
|
|
1257
|
+
], 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 (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\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 (blur)=\"onInputBlur($event)\"\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 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:10px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}*{font-family:mulish!important}.right-amount-text{font-weight:600;font-size:10px;color:#444;background:#f5f5f5;border-radius:2px;padding:5.5px 6px 4px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 7px)!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 , 7px) !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"] }] });
|
|
1161
1258
|
}
|
|
1162
1259
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AmountTextboxComponent, decorators: [{
|
|
1163
1260
|
type: Component,
|
|
@@ -1172,7 +1269,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
1172
1269
|
useExisting: AmountTextboxComponent,
|
|
1173
1270
|
multi: true
|
|
1174
1271
|
}
|
|
1175
|
-
], 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
|
|
1272
|
+
], 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 (blur)=\"onInputBlur($event)\"\r\n [value]=\"inputValue\"\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 (blur)=\"onInputBlur($event)\"\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 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:10px!important;font-weight:700!important;color:#444!important;margin-bottom:0!important}*{font-family:mulish!important}.right-amount-text{font-weight:600;font-size:10px;color:#444;background:#f5f5f5;border-radius:2px;padding:5.5px 6px 4px}.error-message{color:red}::ng-deep .mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mat-mdc-notch-piece{border-color:var(--custom-border-color-focus, #ffbb00)!important;border-width:var(--custom-border-width-focus, 1.5px)!important}::ng-deep .mat-mdc-form-field{background-color:var(--custom-bg-color, #ffffff)!important;border-radius:var(--custom-border-radius , 7px)!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 , 7px) !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"] }]
|
|
1176
1273
|
}], ctorParameters: () => [], propDecorators: { blur: [{
|
|
1177
1274
|
type: Output
|
|
1178
1275
|
}] } });
|